/* Global mobile/tablet interaction and smoothness fixes */

html,
body {
    -webkit-tap-highlight-color: transparent;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

a,
button,
input,
textarea,
select,
summary,
[role="button"],
[tabindex] {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

/* Smooth touch interactions on mobile/tablet without heavy effects */
@media (hover: none) and (pointer: coarse) {
    a,
    button,
    [role="button"],
    .btn-action,
    .btn-send,
    .btn-discard,
    .menu-toggle,
    .profile-toggle,
    .nav-item {
        transition: transform 0.16s ease, opacity 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
        backface-visibility: hidden;
        transform: translateZ(0);
    }

    a:active,
    button:active,
    [role="button"]:active,
    .btn-action:active,
    .btn-send:active,
    .btn-discard:active,
    .menu-toggle:active,
    .profile-toggle:active,
    .nav-item:active {
        transform: scale(0.98) translateZ(0);
    }
}

/* Keep profile dropdown size/style consistent with dashboard across every page */
.profile-dropdown {
    min-width: 250px !important;
    max-width: min(78vw, 250px) !important;
    padding: 10px !important;
    border-radius: 10px !important;
    background: rgba(15, 15, 15, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45) !important;
}

/* Performance and visibility fixes for mobile/tablet */
@media (max-width: 1024px) {
    .dashboard-intro {
        display: none !important;
    }

    .sidebar,
    .header,
    .profile-dropdown,
    .logout-modal,
    .logout-modal-card,
    .modal-overlay,
    .modal-content,
    .verification-popover,
    .sidebar-overlay {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

@media (max-width: 768px) {
    body {
        overflow-x: hidden !important;
    }

    .main-panel {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    .content-area {
        padding: 14px !important;
        overflow-x: hidden !important;
    }

    .page-header,
    .toolbar-subrow,
    .header-actions {
        width: 100% !important;
        max-width: 100% !important;
    }

    .resource-grid,
    #notesGrid {
        grid-template-columns: 1fr !important;
        width: 100% !important;
    }

    .resource-card,
    .note-card,
    .email-card,
    .table-container,
    .settings-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .log-table {
        min-width: 0 !important;
        width: 100% !important;
        table-layout: fixed !important;
    }

    .log-table th,
    .log-table td {
        word-break: break-word !important;
    }

    .sidebar-tab,
    .tab-btn,
    .folder-tab,
    .pages-tab,
    [data-sidebar-tab] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}