/* Mobile Footer for Action Buttons */
@media (max-width: 768px) {

    /* Move header-actions to bottom as fixed footer */
    .header-actions {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        background: var(--bg-color) !important;
        border-top: 1px solid var(--border-color) !important;
        padding: 4px 8px !important;
        /* Minimal vertical padding */
        z-index: 1000 !important;
        box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1) !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-around !important;
        align-items: center !important;
        gap: 16px;
        /* Increased from 8px for better spacing */
        transform: none !important;
    }

    /* Make action groups horizontal and evenly distributed */
    .action-group {
        flex-direction: row !important;
        gap: 22px !important;
        /* Increased from 4px for better spacing within groups */
        margin-bottom: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        align-items: center !important;
        border: none !important;
    }

    /* Hide sticker input in mobile footer */
    .sticker-input-group {
        display: none !important;
    }

    /* Adjust icon sizes for mobile */
    .action-btn {
        font-size: 1.1rem !important;
        padding: 6px !important;
    }

    /* Add bottom padding to content to prevent footer overlap */
    .task-lists-container {
        padding-bottom: 55px !important;
    }

    .app-container {
        padding-bottom: 55px !important;
    }
}