/* AUTO-GENERATED – ne szerkeszd kézzel. Forrás: css/main.combined.css via auvi_css_build_combined() */
/* Létrehozva: 2026-08-05T10:11:11+00:00 */

/* ========== main.css ========== */

/* =============================================================================
   AUVI-Tech Kft. - Modern Design System
   Desktop CSS - Teljes újratervezés magyar karakterekkel
   ============================================================================= */

/* Google Fonts: Inter, Poppins – index.php link tag-ben, párhuzamos betöltés */

/* Material Symbols Outlined - Lokális font fájl */
@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 100 700;
    font-display: swap;
    src: url('../fonts/MaterialSymbolsOutlined.woff2') format('woff2'),
         url('../fonts/MaterialSymbolsOutlined.ttf') format('truetype');
}

.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    /* Ligature icons: ensure cross-browser */
    font-variant-ligatures: contextual common-ligatures;
    font-feature-settings: 'liga';
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    /* font-display csak @font-face-ben érvényes – itt a böngésző figyelmen kívül hagyja */
}

.material-symbols-outlined.spin {
    animation: auvi-material-spin 0.85s linear infinite;
}

@keyframes auvi-material-spin {
    to {
        transform: rotate(360deg);
    }
}

/* CSS Reset és alapok */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
    height: 100%;
}

/*
 * Egy folytonos induló (web.dev / MDN): manifest background_color = első webes festés.
 * PWA-ban NINCS bg.png – különben a kép betöltése „második splash”-nek látszik.
 * NINCS header/main fade – az opacity animáció külön fázisnak hat = második képernyő érzet.
 */
@media (display-mode: standalone), (display-mode: fullscreen) {
    html {
        background-color: #f8fafc;
    }
    body {
        background-color: #f8fafc;
        background-image: none;
        background-attachment: scroll;
    }
    .dashboard-page {
        background: transparent;
        border-color: transparent;
        box-shadow: none;
        border-radius: 0;
        margin-top: 0;
        margin-bottom: 0;
        min-height: auto;
    }
}

html.pwa-standalone body:not(.operation-log-print-page) {
    background-color: #f8fafc;
    background-image: none;
    background-attachment: scroll;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    line-height: 1.6;
    color: #1a202c;
    background-color: #f8fafc;
    background-image: url('../images/bg.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100vh;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
}

/* =============================================================================
   SZÍNPALETTA ÉS VÁLTOZÓK
   ============================================================================= */
:root {
    /* Színek - Piros téma (user-menu-toggle / profil gomb színével azonos) */
    --primary-50: #fef2f2;
    --primary-100: #fee2e2;
    --primary-200: #fecaca;
    --primary-300: #fca5a5;
    --primary-400: #f87171;
    --primary-500: #ef4444;
    --primary-600: #dc2626;
    --primary-700: #b91c1c;
    --primary-800: #991b1b;
    --primary-900: #7f1d1d;
    
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --gray-800: #1f2937;
    --gray-900: #111827;
    
    --success-50: #ecfdf5;
    --success-500: #10b981;
    --success-600: #059669;
    --success-700: #047857;
    
    --warning-50: #fffbeb;
    --warning-500: #f59e0b;
    --warning-600: #d97706;
    --warning-700: #b45309;
    
    --error-50: #fef2f2;
    --error-500: #ef4444;
    --error-600: #dc2626;
    --error-700: #b91c1c;

    /* Főmenü színei – csak a header navigáció */
    --menu-primary: #DC2626;
    --menu-primary-hover: #b91c1c;
    --menu-primary-bg: #fef2f2;
    
    /* Árnyékok */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    
    /* Átmenetek */
    --transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    
    /* Méret egységek */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    
    /* Border radius */
    --radius-sm: 0.125rem;
    --radius: 0.25rem;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --radius-3xl: 1.5rem;
    --radius-full: 9999px;

    /* Fejléc magasság – egy forrásból a fix header + tartalom igazításhoz.
       Desktop: sticky header (fit-content), a változó az apps/tartalom számításhoz kell.
       Mobil felülírás lent a @media (max-width: 768px) blokkban. */
    --header-height: 64px;
    /* Mobil alsó tab bar magassága (safe-area nélkül) */
    --tabbar-height: 58px;

    /* Fejléc – liquid glass (átlátszó + blur) */
    --header-glass-bg: linear-gradient(
        125deg,
        rgba(255, 255, 255, 0.58) 0%,
        rgba(248, 250, 252, 0.42) 42%,
        rgba(255, 255, 255, 0.52) 100%
    );
    --header-glass-blur: 18px;
    --header-glass-border: rgba(255, 255, 255, 0.55);
    --header-glass-edge: rgba(148, 163, 184, 0.22);
}

/* =============================================================================
   HEADER - LIQUID GLASS (enyhén átlátszó, mögötte elmosott tartalom)
   ============================================================================= */
header {
    background: var(--header-glass-bg);
    border-bottom: 1px solid var(--header-glass-edge);
    box-shadow:
        0 1px 0 0 var(--header-glass-border) inset,
        0 8px 32px rgba(15, 23, 42, 0.07),
        0 2px 8px rgba(15, 23, 42, 0.04);
    position: sticky;
    top: 0;
    z-index: 10000;
    /* Erősebb „frosted” hatás: a scroll alatti tartalom látszólag elmosódik */
    backdrop-filter: saturate(1.35) blur(var(--header-glass-blur));
    -webkit-backdrop-filter: saturate(1.35) blur(var(--header-glass-blur));
    overflow: visible;
    min-height: fit-content;
    /* Finom fény a „folyékony üveg” érzethez */
    isolation: isolate;
}

/* Ha a böngésző nem támogatja a backdrop-filtert: maradjon olvasható tömör háttér */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    header {
        background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
        border-bottom: 1px solid var(--gray-200);
        box-shadow: var(--shadow-lg);
    }

    .page-header {
        background: #fff;
        border: 1px solid #e5e7eb;
        box-shadow: 0 2px 4px -1px rgb(0 0 0 / 0.1);
    }
}

/* Csökkentett átlátszóság igény: tömör háttér, nincs blur */
@media (prefers-reduced-transparency: reduce) {
    header {
        background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
        border-bottom: 1px solid var(--gray-200);
        box-shadow: var(--shadow-lg);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .page-header {
        background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
        border: 1px solid var(--gray-200);
        box-shadow: 0 2px 4px -1px rgb(0 0 0 / 0.1);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .tasks-calendar-view .page-header {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .mobile-nav {
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-top: 1px solid var(--gray-200);
        box-shadow: none;
    }

    .notification-panel {
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: 1px solid #e2e8f0;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.08);
    }

    .notification-panel-header {
        background: linear-gradient(to bottom, #f8fafc, #fff);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-bottom: 1px solid #e2e8f0;
    }

    .user-menu-dropdown {
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border: 1px solid #e5e7eb;
        box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -1px rgb(0 0 0 / 0.06);
    }

    .locations-list-page .client-card.location-card {
        border: 1px solid #e2e8f0;
        background: linear-gradient(165deg, #ffffff 0%, #f8fafc 55%, #ffffff 100%);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow:
            0 1px 2px rgba(15, 23, 42, 0.04),
            0 4px 16px rgba(15, 23, 42, 0.07),
            0 0 0 1px rgba(255, 255, 255, 0.6) inset;
    }

    .locations-list-page .client-card.location-card:hover {
        border-color: #cbd5e1;
        box-shadow:
            0 8px 28px -6px rgba(15, 23, 42, 0.14),
            0 4px 12px rgba(15, 23, 42, 0.06);
    }

    .locations-list-page .location-card__header {
        border-bottom: 1px solid #e2e8f0;
    }

    .locations-list-page .location-card__body .client-detail-row {
        border-bottom: 1px solid #f1f5f9;
    }

    .locations-list-page .location-card__footer {
        border-top: 1px solid #e2e8f0;
    }

    .locations-list-page .location-card__body .client-info-icon {
        background: #f1f5f9;
        border: none;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .locations-list-page .location-card__row--company .client-info-icon {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    }

    .task-modal-content {
        background: #fff;
        border: 1px solid #e5e7eb;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    }

    .task-modal-overlay {
        background-color: rgba(0, 0, 0, 0.5);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .task-modal-header {
        background: #fff;
        border-bottom: 1px solid #e5e7eb;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .task-modal-body {
        background: #fff;
    }

    .task-modal-footer {
        background: #fff;
        border-top: 1px solid #e5e7eb;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    #maintenance-details-modal.maintenance-modal-done .task-modal-header {
        background: #7c3aed;
    }
}

header .container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 8px 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    position: relative;
    overflow: visible;
    min-width: 0;
    min-height: fit-content;
}

/* Logo Section */
.logo {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    text-decoration: none;
    color: var(--gray-900);
    margin: 0;
    padding: 0;
    flex-shrink: 0;
}

.logo a,
.logo .logo-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    margin: 0;
    padding: 0;
    gap: 0.65rem;
    min-width: 0;
}

/* Cégnév a logó mellett – animált gradiens szöveg + akcentusvonal */
.logo-brand {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding-left: 0.7rem;
    font-weight: 700;
    font-size: clamp(0.95rem, 2.2vw, 1.2rem);
    letter-spacing: -0.03em;
    line-height: 1;
    white-space: nowrap;
    max-width: min(220px, 46vw);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    align-self: center;
    /* Gradiens kitölti a betűket (ugyanaz a színpaletta, mint a vonalnál) */
    color: transparent;
    -webkit-text-fill-color: transparent;
    background-image: linear-gradient(
        100deg,
        #dc2626 0%,
        #ea580c 14%,
        var(--primary-500, #d9471e) 28%,
        #f97316 40%,
        #2563eb 54%,
        #1d4ed8 68%,
        #475569 82%,
        #dc2626 94%,
        #ea580c 100%
    );
    background-size: 240% 100%;
    background-position: 0% 50%;
    background-repeat: no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    animation: logo-brand-text-flow 5.5s ease-in-out infinite alternate;
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
    .logo-brand {
        color: #0f172a;
        -webkit-text-fill-color: currentColor;
        background-image: none;
        animation: none;
    }
}

@keyframes logo-brand-text-flow {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}
.logo-brand::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.12em;
    bottom: 0.12em;
    width: 3px;
    border-radius: 2px;
    /* Piros (tűz) → brand narancs → kék (téma / logo) – folyamatos áramlás */
    background: linear-gradient(
        180deg,
        #dc2626 0%,
        #ea580c 18%,
        var(--primary-500, #d9471e) 34%,
        #f97316 42%,
        #2563eb 58%,
        #1d4ed8 72%,
        #475569 88%,
        #dc2626 100%
    );
    background-size: 100% 280%;
    background-position: 0 0;
    box-shadow: 0 0 0 1px rgb(255 255 255 / 0.35) inset;
    animation: logo-brand-accent-flow 5.5s ease-in-out infinite alternate;
}

@keyframes logo-brand-accent-flow {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 0 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .logo-brand {
        animation: none;
        background-size: 100% 100%;
        background-image: linear-gradient(180deg, #dc2626 0%, var(--primary-500, #d9471e) 45%, #1d4ed8 100%);
    }
    .logo-brand::before {
        animation: none;
        background-size: 100% 100%;
        background: linear-gradient(180deg, #dc2626 0%, var(--primary-500, #d9471e) 45%, #1d4ed8 100%);
    }
}

.logo-image {
    height: 3rem;
    width: auto;
    margin: 0;
    padding: 0;
    display: block;
    flex-shrink: 0;
    vertical-align: middle;
}





/* Desktop Navigation - alapértelmezetten rejtett */
.desktop-nav {
    display: none;
    align-items: center;
    gap: var(--space-8);
    overflow: visible;
    position: relative;
}

/* =============================================================================
   RESPONSIVE NAVIGATION
   ============================================================================= */

/* Desktop nézetben (769px és felette): desktop navigáció látható */
@media (min-width: 769px) {
    .desktop-nav {
        display: flex;
    }
    
    .mobile-nav {
        display: none;
    }
    
    .hamburger-menu {
        display: none;
        visibility: hidden;
    }
}

/* Mobile nézetben (768px és alatta): hamburger menü és mobile navigáció látható */
@media (max-width: 768px) {
    /* Mobil fix header valós magassága – innen számol a body padding és a drawer is */
    :root {
        --header-height: 80px;
    }

    header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: auto; /* ne a dokumentum-szélesség legyen 100% – túlcsordulásnál ne vágja le a hamburgert */
        max-width: 100%;
        padding-top: env(safe-area-inset-top, 0px);
        box-sizing: border-box;
        /* overflow: visible – az értesítés panel a header alá nyílik, ne vágja le */
        overflow: visible;
        /* Mobilon tömör, blur nélküli fejléc – tisztább, gyorsabb, jobban olvasható */
        background: #ffffff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-bottom: 1px solid var(--gray-200);
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
    }

    body {
        padding-top: calc(var(--header-height) + env(safe-area-inset-top, 0px));
    }

    .desktop-nav {
        display: none;
    }
    
    .mobile-nav {
        display: block;
    }
    
    /* Header jobb oldal: értesítés + hamburger fixen egymás mellett */
    .header-actions-mobile {
        display: flex;
        align-items: center;
        gap: 0.25rem;
        margin-left: auto;
        flex-shrink: 0;
    }
    .notification-bell-mobile {
        display: flex;
        align-items: center;
        flex-shrink: 0;
    }
    .notification-bell-mobile .notification-bell-btn {
        width: 44px;
        min-width: 44px;
        height: 44px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: var(--radius-lg);
        transition: var(--transition);
    }
    .notification-bell-mobile .notification-bell-btn:hover {
        background: var(--gray-100);
    }
    .notification-bell-mobile .notification-bell-btn .material-symbols-outlined {
        font-size: 1.75rem; /* hamburger 3 vonalához igazítva – vizuálisan egyforma magas */
        font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;
        color: var(--gray-700);
    }
    .header-actions-mobile .hamburger-menu {
        margin-left: 0;
    }

    body.auvi-mobile-apps-nav #mobile-menu {
        display: none !important;
    }

    .apps-launcher-nav-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        min-width: 44px;
        height: 44px;
        padding: 0;
        text-decoration: none;
        background: none;
        border: none;
        border-radius: var(--radius-lg);
        transition: var(--transition);
        position: relative;
        z-index: 1000;
        flex-shrink: 0;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .apps-launcher-nav-btn .material-symbols-outlined {
        font-size: 2rem;
        line-height: 1;
        font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;
        color: var(--gray-700);
    }

    .apps-launcher-nav-btn:hover,
    .apps-launcher-nav-btn.is-active {
        background: var(--gray-100);
    }

    .apps-launcher-nav-btn.is-active .material-symbols-outlined,
    .apps-launcher-nav-btn:hover .material-symbols-outlined {
        color: var(--gray-700);
    }
    /* Értesítés panel mobilon – fixed, hogy a header overflow ne vágja le */
    header .container .notification-panel {
        position: fixed;
        top: calc(var(--header-height) + env(safe-area-inset-top, 0px));
        left: 0.75rem;
        right: 0.75rem;
        min-width: unset;
        width: auto;
        max-width: none;
        max-height: min(70vh, calc(100dvh - var(--header-height) - env(safe-area-inset-top, 0px) - 1rem));
        z-index: 10050;
        border-radius: 12px;
    }
    .hamburger-menu {
        display: flex;
        visibility: visible;
        background: none;
        border: none;
        cursor: pointer;
        padding: var(--space-2);
        border-radius: var(--radius-lg);
        transition: var(--transition);
        position: relative;
        z-index: 1000;
        width: 40px;
        min-width: 40px;
        height: 40px;
        margin-right: 0;
        flex-shrink: 0;
        opacity: 1;
        justify-content: center;
        align-items: center;
    }
    
    .hamburger-menu:hover {
        background: var(--gray-100);
    }
    
    .hamburger-menu > span:not(.material-symbols-outlined) {
        display: block;
        width: 1.5rem;
        height: 2px;
        background: var(--gray-700);
        border-radius: var(--radius-lg);
        transition: all 0.3s ease;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        margin: 0;
    }
    
    /* Hamburger ikon kezdeti pozíciói - egyenletes távolságokkal */
    .hamburger-menu > span:not(.material-symbols-outlined):nth-child(1) {
        top: calc(50% - 8px);
        transform: translateX(-50%) translateY(-50%);
    }
    
    .hamburger-menu > span:not(.material-symbols-outlined):nth-child(2) {
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
    }
    
    .hamburger-menu > span:not(.material-symbols-outlined):nth-child(3) {
        top: calc(50% + 8px);
        transform: translateX(-50%) translateY(-50%);
    }
    
    /* Hamburger ikon X-re alakítása amikor active */
    .hamburger-menu.active span:nth-child(1) {
        transform: translateX(-50%) translateY(-50%) rotate(45deg);
        top: 50%;
    }
    
    .hamburger-menu.active span:nth-child(2) {
        opacity: 0;
        transform: translateX(-50%) translateY(-50%);
    }
    
    .hamburger-menu.active span:nth-child(3) {
        transform: translateX(-50%) translateY(-50%) rotate(-45deg);
        top: 50%;
    }
}

.desktop-nav ul {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    flex-wrap: nowrap;
}

.desktop-nav li {
    position: relative;
    overflow: visible;
}

.desktop-nav a {
    color: var(--gray-600);
    text-decoration: none;
    font-weight: 500;
    font-size: 0.875rem;
    padding: var(--space-3);
    border-radius: var(--radius-lg);
    transition: var(--transition);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    min-width: 44px;
}

.desktop-nav a .material-symbols-outlined {
    font-size: 24px;
}

.desktop-nav a .menu-text {
    display: none;
}


.desktop-nav a:hover {
    color: var(--menu-primary);
    background: var(--menu-primary-bg);
    transform: translateY(-1px);
}

.desktop-nav a:hover::before {
    width: 80%;
}

.desktop-nav a.active {
    color: var(--menu-primary);
    background: var(--menu-primary-bg);
    font-weight: 600;
    box-shadow: var(--shadow-sm);
}

.desktop-nav a.active::before {
    width: 80%;
}

.desktop-nav a.menu-custom-color,
.desktop-nav a.menu-custom-color .material-symbols-outlined {
    color: var(--menu-item-color);
}

.desktop-nav a.menu-custom-color:hover,
.desktop-nav a.menu-custom-color.active {
    color: var(--menu-item-color);
    background: color-mix(in srgb, var(--menu-item-color) 14%, #fff);
    box-shadow: 0 1px 3px color-mix(in srgb, var(--menu-item-color) 35%, transparent);
}

.mobile-nav a.menu-custom-color,
.mobile-nav a.menu-custom-color .material-symbols-outlined {
    color: var(--menu-item-color);
}

.mobile-nav a.menu-custom-color:hover,
.mobile-nav a.menu-custom-color.active {
    color: var(--menu-item-color);
    background: color-mix(in srgb, var(--menu-item-color) 12%, #fff);
}

/* Dropdown menu styles */
.dropdown-menu {
    position: relative;
}

.dropdown-trigger {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.dropdown-arrow {
    font-size: 0.75rem;
    transition: transform 0.3s ease;
}

.dropdown-content {
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-2xl);
    border: 1px solid var(--gray-200);
    min-width: 200px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 1000;
}

.dropdown-content.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-content li {
    list-style: none;
}

.dropdown-content a {
    display: block;
    padding: var(--space-3) var(--space-4);
    color: var(--gray-700);
    text-decoration: none;
    font-size: 0.875rem;
    transition: var(--transition);
    border-radius: var(--radius-lg);
}

.dropdown-content a:hover {
    background: #fef5f2;
    color: #d9471e;
    transform: none;
}

.dropdown-content li:first-child a,
.dropdown-content li:last-child a {
    border-radius: var(--radius-lg);
}

/* Mobile dropdown styles */
@media (max-width: 768px) {
    .dropdown-content {
        position: static;
        box-shadow: none;
        border: none;
        border-radius: var(--radius-lg);
        background: transparent;
        opacity: 1;
        visibility: visible;
        transform: none;
        min-width: auto;
        margin-left: var(--space-4);
        margin-top: var(--space-2);
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
    }
    
    .dropdown-content.show {
        max-height: 250px;
    }
    
    .dropdown-content a {
        padding: var(--space-2) var(--space-4);
        background: var(--gray-50);
        margin-bottom: 2px;
        border-radius: var(--radius-lg);
        font-size: 0.8rem;
    }
    
    .dropdown-content a:hover {
        background: #fee8e0;
        color: #d9471e;
    }
    
    .dropdown-arrow {
        margin-left: auto;
    }
}

/* Header Action Buttons */
.header-actions {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

/* User Menu Dropdown - Tiszta újraépítés */
.user-menu-container {
    position: relative;
    margin-left: auto;
    overflow: visible;
    width: auto;
    min-width: 0;
    flex-shrink: 0;
}

.user-menu {
    position: relative;
    display: inline-block;
    overflow: visible;
    width: auto;
    min-width: 0;
}

.user-menu-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: var(--menu-primary);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    cursor: pointer;
    font-weight: 600;
    font-size: 0.875rem;
    transition: background-color 0.2s ease;
    box-shadow: var(--shadow-md);
    white-space: nowrap;
    flex-shrink: 0;
}

.user-menu-toggle:hover {
    background: var(--menu-primary-hover);
}

.user-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.2);
    font-weight: 600;
    font-size: 0.875rem;
    flex-shrink: 0;
}

.chevron-icon {
    font-size: 20px;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.user-menu:has(.user-menu-dropdown.active) .chevron-icon {
    transform: rotate(180deg);
}

/* Asztali profil lenyíló: tömör háttér, nincs üveg/blur.
   position:fixed + JS pozíció (toggleUserMenu): sticky header / backdrop-filter
   és a chat ablak ne takarja el (isolation stacking). */
.user-menu-dropdown {
    position: fixed;
    top: 0;
    right: 0;
    left: auto;
    background: #ffffff;
    border-radius: var(--radius-lg);
    box-shadow:
        0 12px 40px rgba(15, 23, 42, 0.12),
        0 4px 12px rgba(15, 23, 42, 0.08);
    min-width: 180px;
    width: 180px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
    z-index: 10050;
    border: 1px solid var(--gray-200);
    overflow: hidden;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none;
}

.user-menu-dropdown.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}


.user-menu-item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 0.875rem;
    color: #374151;
    text-decoration: none;
    transition: background-color 0.15s ease;
    border-bottom: 1px solid #f3f4f6;
    white-space: nowrap;
    min-width: 0;
    font-size: 0.875rem;
}

.user-menu-item:first-child {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}

.user-menu-item:last-child {
    border-bottom: none;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

.user-menu-item:hover {
    background-color: #f9fafb;
}

.user-menu-item.active {
    background-color: #eff6ff;
    color: #2563eb;
}

.user-menu-item.user-menu-logout {
    color: #dc2626;
}

.user-menu-item.user-menu-logout:hover {
    background-color: #fef2f2;
}

.menu-icon {
    font-size: 20px;
    width: auto;
    height: auto;
    flex-shrink: 0;
}

.btn-dashboard,
.btn-profile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-5);
    border-radius: var(--radius-lg);
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    transition: var(--transition);
    border: none;
    cursor: pointer;
    height: 2.75rem;
    position: relative;
    overflow: hidden;
}

.btn-dashboard {
    background: linear-gradient(135deg, var(--primary-600), var(--primary-700));
    color: white;
    box-shadow: var(--shadow-md);
}

.btn-dashboard::before,
.btn-profile::before,
.btn-logout::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: left 0.5s ease;
}

.btn-dashboard:hover {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
}

.btn-profile {
    background: linear-gradient(135deg, var(--success-600), var(--success-700));
    color: white;
    box-shadow: var(--shadow-md);
}

.btn-profile:hover {
    background: linear-gradient(135deg, #059669, #047857);
}

.btn-logout {
    background: linear-gradient(135deg, var(--error-600), var(--error-700));
    color: white;
    box-shadow: var(--shadow-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-5);
    border-radius: var(--radius-lg);
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    transition: var(--transition);
    border: none;
    cursor: pointer;
    height: 2.75rem;
    position: relative;
    overflow: hidden;
}

.btn-logout:hover {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
}

.btn-dashboard:hover::before,
.btn-profile:hover::before,
.btn-logout:hover::before {
    left: 100%;
}

/* Mobile Navigation - alapértelmezetten rejtett */
/* Mobilon tömör háttér – olvasható menü, nem átlátszó „üveg” */
.mobile-nav {
    display: none;
    position: fixed;
    top: calc(var(--header-height) + env(safe-area-inset-top, 0px));
    left: 0;
    width: 100%;
    height: calc(100dvh - var(--header-height) - env(safe-area-inset-top, 0px));
    background: #ffffff;
    z-index: 9999;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-top: 1px solid var(--gray-200);
    box-shadow: 0 4px 24px rgba(15, 23, 42, 0.08);
}

/* Mobile navigáció megjelenítése amikor active osztály van */
.mobile-nav.active {
    display: block;
    transform: translateX(0);
}

/* Mobile navigáció header - elrejtve */
.mobile-nav-header {
    display: none;
}

/* Mobile nav header logo - pontosan ugyanúgy, mint a sima header-ben */
.mobile-nav-header .logo,
header .container .logo {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    text-decoration: none;
    color: var(--gray-900);
    margin: 0;
    padding: 0;
    flex-shrink: 0;
}

.mobile-nav-header .logo a,
.mobile-nav-header .logo .logo-link,
header .container .logo a,
header .container .logo .logo-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    margin: 0;
    padding: 0;
    gap: 0.65rem;
    min-width: 0;
}

.mobile-nav-header .logo-image,
header .container .logo-image {
    height: 3rem;
    width: auto;
    max-height: 64px;
    margin: 0;
    padding: 0;
    display: block;
    flex-shrink: 0;
    vertical-align: middle;
    object-fit: contain;
}

/* Close menu gomb - már nincs rá szükség */
.close-menu {
    display: none;
}

/* Mobile navigáció lista */
.mobile-nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-top: 0;
}

.mobile-nav li {
    border-bottom: 1px solid var(--gray-100);
}

.mobile-nav a,
.mobile-nav button {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    color: var(--gray-700);
    text-decoration: none;
    font-size: 3rem;
    transition: var(--transition);
    text-align: left;
    background: none;
}

.mobile-nav a .material-symbols-outlined {
    font-size: 24px;
    flex-shrink: 0;
    border: none;
    cursor: pointer;
}

.mobile-nav a .menu-text {
    display: inline-block;
    font-size: 1rem;
    font-weight: 500;
}

/* =============================================================================
   MOBIL ALSÓ TAB BAR – fő funkciók egy érintésre (csak mobil)
   ============================================================================= */
.mobile-tabbar {
    display: none;
}

@media (max-width: 768px) {
    .mobile-tabbar {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9990;
        align-items: stretch;
        justify-content: space-around;
        height: calc(var(--tabbar-height) + env(safe-area-inset-bottom, 0px));
        padding-bottom: env(safe-area-inset-bottom, 0px);
        background: #ffffff;
        border-top: 1px solid var(--gray-200);
        box-shadow: 0 -2px 10px rgba(15, 23, 42, 0.06);
    }

    .mobile-tabbar-item {
        flex: 1 1 0;
        min-width: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 6px 4px;
        border: none;
        background: none;
        color: var(--gray-500);
        text-decoration: none;
        font-family: inherit;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition: color 0.15s ease, transform 0.1s ease;
    }

    .mobile-tabbar-item .material-symbols-outlined {
        font-size: 24px;
        line-height: 1;
    }

    .mobile-tabbar-label {
        font-size: 0.68rem;
        font-weight: 500;
        line-height: 1.1;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-tabbar-item.is-active {
        color: var(--tabbar-item-color, var(--menu-primary));
    }

    .mobile-tabbar-item:active {
        transform: scale(0.94);
    }

    /* iOS Safari: billentyűzetnél a fixed tabbar felcsúszik – elrejtjük */
    body.auvi-has-tabbar.auvi-keyboard-open .mobile-tabbar {
        display: none;
        pointer-events: none;
    }

    body.auvi-has-tabbar.auvi-keyboard-open {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }

    /* Tartalom ne kerüljön a tab bar alá */
    body.auvi-has-tabbar {
        padding-bottom: calc(var(--tabbar-height) + env(safe-area-inset-bottom, 0px));
    }

    /* A drawer hagyjon helyet a tab barnak */
    body.auvi-has-tabbar .mobile-nav {
        height: calc(100dvh - var(--header-height) - env(safe-area-inset-top, 0px) - var(--tabbar-height) - env(safe-area-inset-bottom, 0px));
    }
}

.mobile-menu-separator {
    border-bottom: 1px solid var(--gray-100);
    margin: 0;
    padding: 0;
    height: 0;
}

.mobile-nav a:hover,
.mobile-nav button:hover {
    background: var(--menu-primary-bg);
    color: var(--menu-primary);
}

.mobile-nav a.active {
    background: var(--menu-primary-bg);
    color: var(--menu-primary);
    font-weight: 600;
}

/* Hamburger menü - desktop-on rejtett (min-width media query), mobilon látható */
.hamburger-menu {
    position: relative;
    z-index: 1000;
}

/* =============================================================================
   MAIN CONTENT AREA
   ============================================================================= */
    main {
        flex: 1;
        width: 100%;
        max-width: 1400px;
        margin: 0 auto;
        box-sizing: border-box;
        overflow-x: hidden;
        min-height: calc(100vh - 100px);
    }

/* =============================================================================
   FOOTER - MODERN DESIGN
   ============================================================================= */
footer {
    background: linear-gradient(135deg, var(--gray-900) 0%, var(--gray-800) 100%);
    color: white;
    margin-top: auto;
    position: relative;
    overflow: hidden;
}

footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--primary-500), transparent);
}

footer .container {
    max-width: 1400px;
    margin: 0 auto;
    padding: var(--space-12) var(--space-6) var(--space-8);
    box-sizing: border-box;
    width: 100%;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-8);
    margin-bottom: var(--space-8);
}

.footer-section h4 {
    font-family: 'Poppins', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: white;
    margin-bottom: var(--space-4);
    position: relative;
}

.footer-section h4::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 3rem;
    height: 2px;
    background: linear-gradient(90deg, var(--primary-500), var(--primary-600));
    border-radius: var(--radius-lg);
}

.footer-section ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-section li {
    margin-bottom: var(--space-2);
    color: var(--gray-300);
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    transition: var(--transition);
}

.footer-section li:hover {
    color: var(--primary-300);
    transform: translateX(4px);
}

.footer-section li::before {
    content: '→';
    color: var(--primary-500);
    font-weight: bold;
}

.footer-section a {
    color: var(--gray-300);
    text-decoration: none;
    transition: var(--transition);
}

.footer-section a:hover {
    color: var(--primary-300);
}

/* Footer Bottom */
.footer-bottom {
    border-top: 1px solid var(--gray-700);
    padding-top: var(--space-6);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-4);
}

.footer-bottom p {
    margin: 0;
    color: var(--gray-400);
    font-size: 0.875rem;
}

.footer-links {
    display: flex;
    gap: var(--space-6);
}

.footer-links a {
    color: var(--gray-400);
    text-decoration: none;
    font-size: 0.875rem;
    transition: var(--transition);
}

.footer-links a:hover {
    color: var(--primary-300);
}

/* =============================================================================
   ÁLTALÁNOS CONTAINER
   ============================================================================= */
.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 var(--space-6);
    box-sizing: border-box;
    width: 100%;
}

/* =============================================================================
   KOMPONENSEK
   ============================================================================= */

/* =============================================================================
   GLOBÁLIS GOMB RENDSZER - EGYSÉGES MINDEN OLDALON
   ============================================================================= */

/* Alapvető gomb struktúra */
.btn,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-warning,
.btn-error,
.btn-danger,
.btn-info,
.btn-light,
.btn-dark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-radius: var(--radius-lg);
    font-family: inherit;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.25;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    min-height: 2.5rem;
    box-sizing: border-box;
}

/* Rejtett gombok – .btn { display:inline-flex } ne írja felül a [hidden] attribútumot */
.btn[hidden],
.btn-primary[hidden],
.btn-secondary[hidden],
.btn-success[hidden],
.btn-warning[hidden],
.btn-error[hidden],
.btn-danger[hidden],
.btn-info[hidden],
.btn-light[hidden],
.btn-dark[hidden],
.task-modal-btn[hidden],
a.btn[hidden],
button.btn[hidden],
button.btn-primary[hidden],
button.btn-secondary[hidden] {
    display: none;
}

/* Ikon méretezés minden gombban */
.btn svg,
.btn-primary svg,
.btn-secondary svg,
.btn-success svg,
.btn-warning svg,
.btn-error svg,
.btn-danger svg,
.btn-info svg,
.btn-light svg,
.btn-dark svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* Material icons vertikális igazítása gombokban */
.btn-primary .material-symbols-outlined,
.btn-secondary .material-symbols-outlined,
.btn-success .material-symbols-outlined,
.btn-warning .material-symbols-outlined,
.btn-error .material-symbols-outlined,
.btn-danger .material-symbols-outlined,
.btn-info .material-symbols-outlined,
.btn-light .material-symbols-outlined,
.btn-dark .material-symbols-outlined,
.btn .material-symbols-outlined {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-size: 1.25em;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    height: 1em;
}

/* Színvariációk */
.btn-primary {
    background: var(--menu-primary);
    color: white;
    box-shadow: 0 4px 6px -1px rgb(220 38 38 / 0.25);
}

.btn-primary:hover {
    background: var(--menu-primary-hover);
}

.btn-secondary {
    background: #f8f9fa;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

.btn-secondary:hover {
    background: #e5e7eb;
    color: #374151;
}

.btn-success {
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    box-shadow: 0 4px 6px -1px rgb(16 185 129 / 0.25);
}

.btn-success:hover {
    background: linear-gradient(135deg, #059669, #047857);
}

.btn-warning {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: white;
    box-shadow: 0 4px 6px -1px rgb(245 158 11 / 0.25);
}

.btn-warning:hover {
    background: linear-gradient(135deg, #d97706, #b45309);
}

.btn-error,
.btn-danger {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: white;
    box-shadow: 0 4px 6px -1px rgb(239 68 68 / 0.25);
}

.btn-error:hover,
.btn-danger:hover {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
}

.btn-info {
    background: linear-gradient(135deg, #06b6d4, #0891b2);
    color: white;
    box-shadow: 0 4px 6px -1px rgb(6 182 212 / 0.25);
}

.btn-info:hover {
    background: linear-gradient(135deg, #0891b2, #0e7490);
}

.btn-light {
    background: #ffffff;
    color: #374151;
    border: 1px solid #d1d5db;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}

.btn-light:hover {
    background: #f9fafb;
    color: #111827;
}

.btn-dark {
    background: linear-gradient(135deg, #374151, #1f2937);
    color: white;
    box-shadow: 0 4px 6px -1px rgb(55 65 81 / 0.25);
}

.btn-dark:hover {
    background: linear-gradient(135deg, #1f2937, #111827);
}

/* Gomb méretek */
.btn-sm,
.btn-small {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    min-height: 2rem;
}

.btn-sm svg,
.btn-small svg {
    width: 14px;
    height: 14px;
}

.btn-lg,
.btn-large {
    padding: 1rem 2rem;
    font-size: 1rem;
    min-height: 3rem;
}

.btn-lg svg,
.btn-large svg {
    width: 18px;
    height: 18px;
}

/* Speciális gombok */
/* Egységes „Vissza” gomb: asztalin nyíl+szöveg, mobilon kerek ikongomb */
.auvi-back-btn,
a.auvi-back-btn,
button.auvi-back-btn,
.btn-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 2.5rem;
    padding: 0.55rem 1.05rem;
    box-sizing: border-box;
    border-radius: var(--radius-lg, 0.5rem);
    border: 1px solid #fecaca;
    background: var(--menu-primary-bg, #fef2f2);
    color: var(--menu-primary, #DC2626);
    font-family: inherit;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 1.25;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.auvi-back-btn:hover,
a.auvi-back-btn:hover,
button.auvi-back-btn:hover,
.btn-back:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: var(--menu-primary-hover, #b91c1c);
    text-decoration: none;
}

.auvi-back-btn:focus-visible,
.btn-back:focus-visible {
    outline: 2px solid var(--menu-primary, #DC2626);
    outline-offset: 2px;
}

.auvi-back-btn .material-symbols-outlined,
.auvi-back-btn .las,
.auvi-back-btn .fas,
.btn-back .material-symbols-outlined,
.btn-back svg,
.btn-back .las,
.btn-back .fas {
    font-size: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    line-height: 1;
    flex-shrink: 0;
}

.auvi-back-btn__label {
    display: inline;
}

@media (max-width: 768px) {
    .auvi-back-btn,
    a.auvi-back-btn,
    button.auvi-back-btn,
    .btn-back {
        width: 2.75rem;
        height: 2.75rem;
        min-width: 2.75rem;
        min-height: 2.75rem;
        padding: 0;
        border-radius: 999px;
        gap: 0;
    }

    .auvi-back-btn__label,
    .auvi-back-btn > span:not(.material-symbols-outlined):not(.las):not(.fas),
    .btn-back > span:not(.material-symbols-outlined):not(.las):not(.fas) {
        /* Szöveg elrejtése mobilon; a material ikon marad */
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .auvi-back-btn,
    .btn-back {
        position: relative;
    }
}

/* Lapozó gombok */
.pagination-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 0.75rem;
    margin: 0 0.125rem;
    background: white;
    color: #374151;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.2s ease;
    cursor: pointer;
    min-width: 2.5rem;
    min-height: 2.5rem;
}

.pagination-btn:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
    transform: translateY(-1px);
}

.pagination-btn.current {
    background: #3b82f6;
    color: white;
    border-color: #3b82f6;
}

.pagination-btn.disabled {
    background: #f9fafb;
    color: #9ca3af;
    border-color: #e5e7eb;
    cursor: not-allowed;
}

.pagination-btn.disabled:hover,
.pagination-btn-disabled:hover {
    transform: none;
}

.pagination-btn-disabled {
    background: #f9fafb;
    color: #9ca3af;
    border-color: #e5e7eb;
    cursor: not-allowed;
    pointer-events: none;
}

/* Mobile arrow gombok */
.mobile-arrow {
    padding: 0.75rem;
    min-width: 3rem;
    min-height: 3rem;
}

.mobile-arrow svg {
    width: 20px;
    height: 20px;
}

/* =============================================================================
   FIX IKONOK ACTION GOMBOKHOZ - EGYSÉGES MINDEN OLDALON
   ============================================================================= */

/* Megtekint ikon - szem (Material Symbols) */
.btn-view::before,
.client-action-btn.client-btn-view::before,
.location-action-btn.location-btn-view::before,
.system-action-btn.system-btn-view::before {
    font-family: 'Material Symbols Outlined';
    content: "visibility";
    display: inline-block;
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1;
    color: white;
    flex-shrink: 0;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Szerkeszt ikon - ceruza (Material Symbols) */
.btn-edit::before,
.client-action-btn.client-btn-edit::before,
.location-action-btn.location-btn-edit::before,
.system-action-btn.system-btn-edit::before {
    font-family: 'Material Symbols Outlined';
    content: "edit";
    display: inline-block;
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1;
    color: white;
    flex-shrink: 0;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Töröl ikon - kuka (Material Symbols) */
.btn-delete::before,
.btn-danger::before,
.client-action-btn.client-btn-delete::before,
.location-action-btn.location-btn-delete::before,
.system-action-btn.system-btn-delete::before {
    font-family: 'Material Symbols Outlined';
    content: "delete";
    display: inline-block;
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1;
    color: white;
    flex-shrink: 0;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}


/* Elrejtjük az SVG ikonokat ha ::before pszeudo-elem van */
.btn-view svg,
.btn-edit svg,
.btn-delete svg,
.client-action-btn.client-btn-view svg,
.client-action-btn.client-btn-edit svg,
.client-action-btn.client-btn-delete svg,
.location-action-btn.location-btn-view svg,
.location-action-btn.location-btn-edit svg,
.location-action-btn.location-btn-delete svg,
.system-action-btn.system-btn-view svg,
.system-action-btn.system-btn-edit svg,
.system-action-btn.system-btn-delete svg {
    display: none;
}

/* Elrejtjük a Line Awesome ikonokat és Material Symbols ikonokat adunk hozzá */
.btn i.las,
.btn i.la-,
.btn-primary i.las,
.btn-primary i.la-,
.btn-secondary i.las,
.btn-secondary i.la-,
.btn-success i.las,
.btn-success i.la-,
.btn-warning i.las,
.btn-warning i.la-,
.btn-error i.las,
.btn-error i.la-,
.btn-danger i.las,
.btn-danger i.la- {
    display: none;
}

/* Material Symbols ikonok hozzáadása gombokhoz */
.btn:has(i.la-plus)::before,
.btn-primary:has(i.la-plus)::before {
    font-family: 'Material Symbols Outlined';
    content: "add";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-columns)::before {
    font-family: 'Material Symbols Outlined';
    content: "view_column";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-calendar)::before {
    font-family: 'Material Symbols Outlined';
    content: "calendar_month";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-list)::before {
    font-family: 'Material Symbols Outlined';
    content: "list";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-trash)::before,
.btn-danger:has(i.la-trash)::before {
    font-family: 'Material Symbols Outlined';
    content: "delete";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* További Material Symbols ikonok */
.btn:has(i.la-file-alt)::before,
.task-modal-btn:has(i.la-file-alt)::before,
.task-modal-btn:has(i.la-edit)::before,
.task-btn:has(i.la-edit)::before {
    font-family: 'Material Symbols Outlined';
    content: "edit";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-btn:has(i.la-file-alt)::before,
.task-modal-btn:has(i.la-file-alt)::before {
    font-family: 'Material Symbols Outlined';
    content: "description";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-btn:has(i.la-archive)::before,
.task-modal-btn:has(i.la-archive)::before {
    font-family: 'Material Symbols Outlined';
    content: "archive";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-clipboard-list)::before,
.task-modal-btn:has(i.la-clipboard-list)::before,
.task-btn:has(i.la-clipboard-list)::before {
    font-family: 'Material Symbols Outlined';
    content: "assignment";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn:has(i.la-trash)::before,
.task-btn:has(i.la-trash)::before {
    font-family: 'Material Symbols Outlined';
    content: "delete";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn:has(i.la-eye)::before {
    font-family: 'Material Symbols Outlined';
    content: "visibility";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn:has(i.la-print)::before {
    font-family: 'Material Symbols Outlined';
    content: "print";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn:has(i.la-play)::before {
    font-family: 'Material Symbols Outlined';
    content: "play_arrow";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn:has(i.la-undo)::before {
    font-family: 'Material Symbols Outlined';
    content: "undo";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.maintenance-completed-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #dcfce7;
    color: #166534;
    border-radius: 8px;
    font-size: 0.9rem;
}
.maintenance-completed-badge i {
    color: #22c55e;
}

.btn:has(i.la-calendar-week)::before {
    font-family: 'Material Symbols Outlined';
    content: "view_week";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-plus-circle)::before,
h3:has(i.la-plus-circle) i.la-plus-circle::before {
    font-family: 'Material Symbols Outlined';
    content: "add_circle";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-search)::before,
.search-btn:has(i.la-search)::before {
    font-family: 'Material Symbols Outlined';
    content: "search";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-times)::before,
.close-btn:has(i.la-times)::before,
.task-modal-close:has(i.la-times)::before {
    font-family: 'Material Symbols Outlined';
    content: "close";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-chevron-left)::before,
.pagination-link:has(i.la-chevron-left)::before {
    font-family: 'Material Symbols Outlined';
    content: "chevron_left";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-chevron-right)::before,
.pagination-link:has(i.la-chevron-right)::before {
    font-family: 'Material Symbols Outlined';
    content: "chevron_right";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-copy)::before {
    font-family: 'Material Symbols Outlined';
    content: "content_copy";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-save)::before {
    font-family: 'Material Symbols Outlined';
    content: "save";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-arrow-left)::before {
    font-family: 'Material Symbols Outlined';
    content: "arrow_back";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-file-pdf)::before {
    font-family: 'Material Symbols Outlined';
    content: "picture_as_pdf";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-print)::before {
    font-family: 'Material Symbols Outlined';
    content: "print";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.btn:has(i.la-eye-slash)::before {
    font-family: 'Material Symbols Outlined';
    content: "visibility_off";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Card icon, empty icon és profile icon Material Symbols */
.card-icon.las,
.card-icon.la-,
.empty-icon.las,
.empty-icon.la-,
.profile-icon.las,
.profile-icon.la- {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.card-icon.la-certificate::before,
.card-icon.las.la-certificate::before,
.empty-icon.la-certificate::before,
.empty-icon.las.la-certificate::before {
    content: "verified";
}

.empty-icon.la-clipboard-list::before,
.empty-icon.las.la-clipboard-list::before {
    content: "assignment";
}

/* Elrejtjük az összes Line Awesome ikont */
.btn i.la-file-alt,
.btn i.la-clipboard-list,
.btn i.la-calendar-week,
.btn i.la-plus-circle,
.btn i.la-search,
.btn i.la-times,
.btn i.la-chevron-left,
.btn i.la-chevron-right,
.btn i.la-copy,
.btn i.la-save,
.btn i.la-arrow-left,
.btn i.la-file-pdf,
.btn i.la-print,
.btn i.la-eye-slash,
.task-modal-btn i.la-file-alt,
.task-modal-btn i.la-clipboard-list,
.task-modal-btn i.la-edit,
.task-modal-btn i.la-eye,
.task-modal-btn i.la-play,
.task-modal-btn i.la-print,
.task-modal-btn i.la-trash,
.task-modal-btn i.la-archive,
.task-modal-btn i.la-undo,
.task-btn i.la-edit,
.task-btn i.la-file-alt,
.task-btn i.la-clipboard-list,
.task-btn i.la-archive,
.task-btn i.la-trash,
h3 i.la-plus-circle,
.card-icon.las,
.card-icon.la-,
.empty-icon.las,
.empty-icon.la-,
.profile-icon.las,
.profile-icon.la- {
    display: none;
}

/* =============================================================================
   EMPTY STATE STÍLUS - MINDEN OLDALHOZ
   ============================================================================= */

/* Üres állapot */
.empty-state {
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
    margin: 2rem 0;
}

/* Operation log status styles */
.operation-log-status {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.log-status-exists {
    color: #10b981;
    font-size: 0.875rem;
    margin: 0;
}

.log-status-missing {
    color: #f59e0b;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.btn-sm {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
    min-height: auto;
    line-height: 1.2;
}

/* Alert styles */
.alert {
    padding: 1rem 1.5rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    border: 1px solid;
}

.alert-success {
    background-color: #dcfce7;
    color: #166534;
    border-color: #bbf7d0;
}

.alert-success .material-symbols-outlined {
    font-size: 20px;
    color: inherit;
    vertical-align: middle;
    margin-right: 0.5rem;
}

.alert-error {
    background-color: #fecaca;
    color: #991b1b;
    border-color: #fca5a5;
}

.alert-info {
    background-color: #dbeafe;
    color: #1e40af;
    border-color: #93c5fd;
}

.empty-state i {
    margin: 0 auto 1rem;
    color: #9ca3af;
    display: block;
}

.empty-state h3 {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.5rem;
}

.empty-state p {
    color: #6b7280;
    margin-bottom: 1.5rem;
}

/* Action gombok egységes stílusa */
.client-action-btn,
.location-action-btn,
.system-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-lg);
    font-weight: 500;
    font-size: 0.875rem;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    min-height: 2.25rem;
    white-space: nowrap;
}

/* Action gomb színek */
.client-btn-view,
.location-btn-view,
.system-btn-view {
    background: linear-gradient(135deg, #06b6d4, #0891b2);
    color: white;
    box-shadow: 0 2px 4px -1px rgb(6 182 212 / 0.25);
}

.client-btn-view:hover,
.location-btn-view:hover,
.system-btn-view:hover {
    background: linear-gradient(135deg, #0891b2, #0e7490);
}

.client-btn-edit,
.location-btn-edit,
.system-btn-edit {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: white;
    box-shadow: 0 2px 4px -1px rgb(245 158 11 / 0.25);
}

.client-btn-edit:hover,
.location-btn-edit:hover,
.system-btn-edit:hover {
    background: linear-gradient(135deg, #d97706, #b45309);
}

.client-btn-delete,
.location-btn-delete,
.system-btn-delete {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: white;
    box-shadow: 0 2px 4px -1px rgb(239 68 68 / 0.25);
}

.client-btn-delete:hover,
.location-btn-delete:hover,
.system-btn-delete:hover {
    background: linear-gradient(135deg, #dc2626, #b91c1c);
}

/* Responsive viselkedés gombok */
@media (max-width: 768px) {
    .btn,
    .btn-primary,
    .btn-secondary,
    .btn-success,
    .btn-warning,
    .btn-error,
    .btn-danger,
    .btn-info,
    .btn-light,
    .btn-dark {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
        min-height: 2.75rem;
    }
    
    .btn-lg,
    .btn-large {
        padding: 0.875rem 1.5rem;
        font-size: 0.875rem;
        min-height: 3rem;
    }
    
    .client-action-btn,
    .location-action-btn,
    .system-action-btn {
        padding: 0.5rem 0.75rem;
        font-size: 0.75rem;
        min-height: 2rem;
    }
}

/* Kártyák */
.card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    border: 1px solid var(--gray-200);
    border-left: none;
    overflow: hidden;
    transition: var(--transition);
    position: relative;
}

.card:hover {
    box-shadow: var(--shadow-lg);
}

.card-header {
    padding: var(--space-6);
    border-bottom: 1px solid var(--gray-200);
    background: linear-gradient(135deg, var(--gray-50) 0%, white 100%);
}

.card-title {
    font-family: 'Poppins', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--gray-900);
    margin: 0 0 var(--space-2) 0;
}

.card-description {
    color: var(--gray-600);
    font-size: 0.875rem;
    margin: 0;
}

.card-content {
    padding: var(--space-6);
}

.card-footer {
    padding: var(--space-6);
    border-top: 1px solid var(--gray-200);
    background: linear-gradient(135deg, var(--gray-50) 0%, white 100%);
}

/* Űrlapok */
.form-group {
    margin-bottom: var(--space-6);
}

.form-label {
    display: block;
    font-weight: 600;
    color: var(--gray-700);
    margin-bottom: var(--space-2);
    font-size: 0.875rem;
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    border: 2px solid var(--gray-300);
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: var(--transition);
    background: var(--gray-50);
    font-family: inherit;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--primary-500);
    background: white;
    box-shadow: 0 0 0 3px rgb(59 130 246 / 0.1);
    transform: translateY(-1px);
}

.form-textarea {
    resize: vertical;
    min-height: 6rem;
}

/* iOS Safari fókusz-zoom megszüntetése: a szöveges mezők mobilon legalább 16px-esek.
   16px alatt az iOS automatikusan ránagyít fókuszkor – ez okozza az "ugrálást". */
@media (max-width: 768px) {
    .form-input,
    .form-select,
    .form-textarea,
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
    select,
    textarea {
        font-size: 16px;
    }
}

/* Alert üzenetek */
.alert {
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-6);
    font-size: 0.875rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.alert-success {
    background: var(--success-50);
    color: var(--success-800);
    border: 1px solid var(--success-200);
}

.alert-warning {
    background: var(--warning-50);
    color: var(--warning-800);
    border: 1px solid var(--warning-200);
}

.alert-error {
    background: var(--error-50);
    color: var(--error-800);
    border: 1px solid var(--error-200);
}

.alert-info {
    background: var(--primary-50);
    color: var(--primary-800);
    border: 1px solid var(--primary-200);
}

/* =============================================================================
   RESPONSIVE DESIGN
   ============================================================================= */
@media (max-width: 1024px) {
    .container,
    header .container,
    footer .container {
        padding-left: var(--space-4);
        padding-right: var(--space-4);
    }
    
    
    footer .container {
        padding: var(--space-8) var(--space-4) var(--space-6);
    }
}

/* ===== LOCATIONS ADD FORM STYLES ===== */
.profile-container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    padding: 1.5rem 2rem;
    min-height: calc(100vh - 4rem);
    box-sizing: border-box;
}

.profile-section {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

/* Felhasználó hozzáadás/szerkesztés: belső padding (nincs profile-card) */
.users-form-page .profile-container .profile-section {
    padding: 1.5rem 2rem 1.25rem;
    box-sizing: border-box;
}
.users-form-page .profile-form .form-sections {
    padding: 0;
}
.users-form-page .profile-form .form-section h3 {
    margin: 0 0 1.25rem 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #111827;
}
.users-form-page .profile-form .form-actions {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
}

.profile-header {
    background: linear-gradient(135deg, #dc3545, #c82333);
    color: white;
    padding: 2rem;
}

.profile-header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.profile-title {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.profile-icon {
    width: 3rem;
    height: 3rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.2);
    border-radius: var(--radius-lg);
    backdrop-filter: blur(10px);
}

.title-text h1 {
    font-size: 2rem;
    font-weight: 800;
    margin: 0 0 0.25rem 0;
    color: white;
}

.title-text p {
    font-size: 1rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.8);
}

.profile-actions {
    display: flex;
    gap: 0.75rem;
}

/* .btn-back már definiálva van a globális gomb rendszerben */

.btn-text {
    font-size: 0.875rem;
}

/* Profile Form Styles */

.form-sections {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.profile-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-left: none;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    transition: all 0.3s ease;
    margin-bottom: 2rem;
    padding: 0;
}

/* Helyszín / profil űrlap kártyák: a fejléc sarkai a kártya radiusát kövessék (asztalin is) */
.location-form-page .profile-card,
#location-extra-contacts-card.profile-card {
    padding: 0;
    overflow: hidden;
    border-radius: var(--radius-lg);
}

.location-form-page .profile-card .card-header,
#location-extra-contacts-card .card-header {
    border-top-left-radius: var(--radius-lg);
    border-top-right-radius: var(--radius-lg);
}

.location-form-page .profile-card:has(.card-content.collapsed) .card-header,
#location-extra-contacts-card.profile-card:has(.card-content.collapsed) .card-header {
    border-radius: var(--radius-lg);
    border-bottom: none;
}

.profile-card:hover {
    border-left-color: #d97706;
    box-shadow: 0 8px 12px -2px rgb(0 0 0 / 0.15);
}

/* Profil: digitális aláírás vászon (desktop + minden nézet; a tasks-system.css nem mindig töltődik) */
.profile-section .signature-canvas-container {
    border: 2px dashed #d1d5db;
    border-radius: var(--radius-lg);
    padding: 12px 16px;
    background: #ffffff;
    margin-bottom: 0.5rem;
    box-sizing: border-box;
}

.profile-section canvas.signature-canvas {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 600px;
    height: 200px;
    box-sizing: border-box;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    cursor: crosshair;
    touch-action: none;
    -webkit-touch-callout: none;
}

.profile-section .signature-controls {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 12px;
}

/* System kártyák */
.system-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.system-card:hover {
    box-shadow: 0 8px 12px -2px rgb(0 0 0 / 0.15);
}

/* Certificate kártyák */
.certificate-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.certificate-card:hover {
    box-shadow: 0 8px 12px -2px rgb(0 0 0 / 0.15);
}

/* Maintenance kártyák */
.maintenance-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.maintenance-card:hover {
    box-shadow: 0 8px 12px -2px rgb(0 0 0 / 0.15);
}

/* Karbantartás lista: ellenőrzési pont hibák száma */
.maintenance-inspection-fail-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
}
.maintenance-fail-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.2;
}
.maintenance-fail-badge--ok {
    background: #d1fae5;
    color: #047857;
    border: 1px solid #6ee7b7;
}
.maintenance-fail-badge--bad {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fca5a5;
}

/* Operation kártyák */
.operation-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.operation-card:hover {
    box-shadow: 0 8px 12px -2px rgb(0 0 0 / 0.15);
}

.card-header {
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    padding: 1.5rem;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e5e7eb;
    transition: all 0.3s ease;
}

/* .card-header:hover {
    background: linear-gradient(135deg, #e9ecef, #dee2e6);
} */

.card-header h3 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
}

.card-header svg {
    width: 1.25rem;
    height: 1.25rem;
}

.toggle-icon {
    font-size: 1.25rem;
    color: #6b7280;
    transition: transform 0.3s ease;
}

.card-content {
    padding: 1.5rem;
    display: block;
}

.card-content.collapsed {
    display: none;
}

/* Form Groups */
.form-group {
    margin-bottom: 1.5rem;
}

.form-group label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg);
    font-size: 1rem;
    transition: all 0.3s ease;
    background: white;
    box-sizing: border-box;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
    transform: translateY(-1px);
}

.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover {
    border-color: #d1d5db;
}

.form-group textarea {
    resize: vertical;
    min-height: 100px;
}

.form-divider {
    margin: 1.25rem 0 1rem;
    border: none;
    border-top: 1px solid #e5e7eb;
}

.form-subsection {
    font-size: 0.95rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 1rem;
}

/* ===== Invoice recipient (locations) choice cards ===== */
.invoice-recipient-choice {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 6px;
}
@media (max-width: 900px) {
    .invoice-recipient-choice {
        grid-template-columns: 1fr;
    }
}
.invoice-recipient-option {
    display: block;
    cursor: pointer;
    user-select: none;
    margin: 0;
    position: relative; /* abszolút radio ne a viewportba kerüljön */
}
.invoice-recipient-option input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 1px !important;
    height: 1px !important;
    max-width: 1px !important;
    margin: 0;
    padding: 0;
    pointer-events: none;
    left: 0;
    top: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
}
.invoice-recipient-card {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
    min-height: 64px;
}
.invoice-recipient-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}
.invoice-recipient-option input[type="radio"]:focus-visible + .invoice-recipient-card {
    outline: 2px solid rgba(59, 130, 246, 0.45);
    outline-offset: 2px;
}
.invoice-recipient-option input[type="radio"]:checked + .invoice-recipient-card {
    border-color: #3b82f6;
    box-shadow: 0 10px 22px rgba(59, 130, 246, 0.18);
    background: linear-gradient(180deg, rgba(59,130,246,0.08), rgba(255,255,255,1) 70%);
}
.invoice-recipient-icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    color: #374151;
}
.invoice-recipient-icon .material-symbols-outlined {
    font-size: 22px;
    line-height: 1;
    display: block;
}
.invoice-recipient-option input[type="radio"]:checked + .invoice-recipient-card .invoice-recipient-icon {
    background: rgba(59,130,246,0.12);
    color: #1d4ed8;
}
.invoice-recipient-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.invoice-recipient-title {
    font-weight: 700;
    color: #111827;
    line-height: 1.25;
}
.invoice-recipient-desc {
    font-size: 0.875rem;
    color: #6b7280;
    line-height: 1.35;
}

/* Form Actions */
/* form-actions: task-form, profile-form, maintenance-form, client-form - közös alap */
.form-actions {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    align-items: center;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 1.5rem 2rem 0;
    border-top: 1px solid #e5e7eb;
}

/* Required field indicator - red asterisks */
.form-group label .required-asterisk {
    color: #dc3545;
    font-weight: bold;
}

.form-group label[for="Country"]:after,
.form-group label[for="County"]:after,
.form-group label[for="Zip"]:after,
.form-group label[for="City"]:after,
.form-group label[for="AddressStreet"]:after,
.form-group label[for="HouseNr"]:after,
.form-group label[for="Building"]:after,
.form-group label[for="FloorDoor"]:after,
.form-group label[for="LocCentralEmail"]:after,
.form-group label[for="LocCentralPhone"]:after,
.form-group label[for="LocCentralMobile"]:after,
.form-group label[for="Latitude"]:after,
.form-group label[for="Longitude"]:after,
.form-group label[for="AdditionalInfo"]:after,

/* GPS koordináta gomb - csak mobilon */
.mobile-only {
    display: none;
}
@media (max-width: 768px) {
    .mobile-only {
        display: block;
    }
}
.gps-coord-btn-wrapper {
    margin: 1rem 0;
}
.gps-coord-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-weight: 600;
    font-size: 0.9375rem;
    cursor: pointer;
    transition: all 0.2s ease;
}
.gps-coord-btn:hover {
    background: linear-gradient(135deg, #2563eb, #1e40af);
}
.gps-coord-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.gps-coord-btn .material-symbols-outlined {
    font-size: 20px;
}
.gps-loading-icon {
    animation: gps-spin 1s linear infinite;
}
@keyframes gps-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/* Clients page optional fields - no asterisk */
.form-group label[for="MainEmail"]:after,
.form-group label[for="InvoiceEmail"]:after,
.form-group label[for="MainPhone"]:after,
.form-group label[for="Website"]:after,
.form-group label[for="HQCountry"]:after,
.form-group label[for="TaxNr"]:after,
.form-group label[for="RegistrationNr"]:after,
.form-group label[for="Holding"]:after,
.form-group label[for="Payment"]:after,
.form-group label[for="BankTransferDelay"]:after,
.form-group label[for="Descriptions"]:after,
.form-group label[for="IsBusiness"]:after,
.form-group label[for="BusinessForm"]:after,
.form-group label[for="MainBusiness"]:after {
    content: "";
}

/* ===== ALERT STYLES ===== */
.alert {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-weight: 500;
}

.alert::before {
    content: "";
    display: none;
}

.alert-success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.alert-error {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.alert-error::before {
    content: "⚠";
}

.alert-warning {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.alert-warning::before {
    content: "⚠";
}

.alert-info {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.alert-info::before {
    content: "ℹ";
}

/* ===== CLIENTS LIST PAGE STYLES ===== */
.clients-section {
    min-height: calc(100vh - 100px);
    padding: 2rem 0;
}

/* Karbantartó cégek / távfelügyeleti szervezetek: ugyanaz a felső térköz, mint a clients-section (locations stb.) */
.maintenance-companies-container {
    min-height: calc(100vh - 100px);
    padding: 2rem 0;
}

/* Page header - közös stílus clients, tasks, locations, maintenance stb. (liquid glass, mint a fő fejléc) */
.page-header {
    background: var(--header-glass-bg);
    border-radius: var(--radius-lg);
    box-shadow:
        0 1px 0 0 var(--header-glass-border) inset,
        0 8px 28px rgba(15, 23, 42, 0.08),
        0 2px 8px rgba(15, 23, 42, 0.05);
    border: 1px solid var(--header-glass-edge);
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    backdrop-filter: saturate(1.35) blur(var(--header-glass-blur));
    -webkit-backdrop-filter: saturate(1.35) blur(var(--header-glass-blur));
    isolation: isolate;
}

.page-title h1 {
    font-size: 1.7rem;
    font-weight: 800;
    color: #111827;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.page-title h1 svg,
.page-title h1 i {
    color: #f59e0b;
    stroke: #f59e0b;
}

.app-stage-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.12rem 0.45rem;
    border-radius: 999px;
    font-size: 0.55em;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    vertical-align: middle;
    line-height: 1.2;
}

.app-stage-alfa {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}

.app-stage-beta {
    background: #dbeafe;
    color: #1e40af;
    border: 1px solid #93c5fd;
}

/* Naptár nézetben: fix header scroll közben – csak asztali nézetben (mögötte a naptár elmosódik) */
.tasks-calendar-view .page-header {
    position: fixed;
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1400px;
    z-index: 99;
    box-sizing: border-box;
    /* Erősebb „üveg” a fix sávon, hogy jól látszódjon a scroll mögött */
    backdrop-filter: saturate(1.45) blur(calc(var(--header-glass-blur) + 4px));
    -webkit-backdrop-filter: saturate(1.45) blur(calc(var(--header-glass-blur) + 4px));
}
.tasks-calendar-view .page-header + * {
    padding-top: 4rem;
}

/* Mobilon: header ne kövesse a scrollt, görgessen a tartalommal */
@media (max-width: 768px) {
    .tasks-calendar-view .page-header {
        position: static;
        transform: none;
        left: auto;
    }
    .tasks-calendar-view .page-header + * {
        padding-top: 0;
    }
}

/* Dashboard / modál megnyitás esetén: olyan fejléct adjunk, mint a sima oldalak */
.tasks-calendar-modal .page-header {
    position: static;
    transform: none;
    left: auto;
    width: auto;
    max-width: none;
    z-index: auto;
    box-sizing: border-box;
}
.tasks-calendar-modal .page-header + * {
    padding-top: 0;
}

.page-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
    margin-left: auto;
    justify-content: flex-end;
    flex: 0 0 auto;
}

/* Cím balra, minden fejléc-akció (Vissza / Új …) jobbra */
.page-header > .page-title {
    flex: 1 1 0;
    min-width: 0;
}

.page-header > .page-actions,
.page-header > .email-client-header-actions,
.page-header > a.btn,
.page-header > a.btn-primary,
.page-header > a.btn-secondary,
.page-header > button.btn,
.page-header > button.btn-primary,
.page-header > button.btn-secondary,
.page-header > .auvi-back-btn {
    margin-left: auto;
    flex: 0 0 auto;
}

/* Vissza gomb a gombcsoport jobb szélén (hüvelykujj-zóna) */
.page-header .page-actions .auvi-back-btn,
.page-header > .auvi-back-btn,
.work-sheet-header-actions .auvi-back-btn,
.client-view-actions .auvi-back-btn,
.client-view-actions-grid .auvi-back-btn,
.document-actions-top .auvi-back-btn,
.operation-log-actions .auvi-back-btn {
    order: 100;
    margin-left: 0.15rem;
}

.work-sheet-header-actions {
    margin-left: auto;
    justify-content: flex-end;
}

.client-view-actions,
.client-view-actions-grid {
    margin-left: auto;
}

.document-actions-top .auvi-back-btn {
    margin-left: auto;
}

/* Tasks oldal: fejléc eszköztár – teljes szélesség, logikus csoportok */
.tasks-page-wrapper .page-header .page-actions.tasks-toolbar {
    margin-left: 0;
    width: 100%;
    justify-content: flex-start;
    gap: 0.75rem;
}

.tasks-filters-panel-inner {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.625rem 0.875rem;
    flex: 1;
    min-width: 0;
}

.tasks-toolbar-spacer {
    flex: 1 1 0.5rem;
    min-width: 0.25rem;
}

.tasks-toolbar-group {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    flex-shrink: 0;
}

.tasks-toolbar-group--scope {
    padding-right: 0.875rem;
    margin-right: 0.125rem;
    border-right: 1px solid rgba(15, 23, 42, 0.1);
}

.tasks-toolbar-group--views .view-toggle {
    background: rgba(241, 245, 249, 0.88);
    border: 1px solid rgba(203, 213, 225, 0.75);
    border-radius: 14px;
    padding: 4px;
    gap: 4px;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.tasks-toolbar-group--filters .tasks-assigned-to-me-btn.active {
    background: #fff;
    color: #1d4ed8;
    border-color: rgba(203, 213, 225, 0.65);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.tasks-toolbar-group--actions {
    gap: 0.5rem;
}

@media (max-width: 768px) {
    .tasks-filters-panel-inner {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    .tasks-toolbar-spacer {
        display: none;
    }

    .tasks-toolbar-group {
        width: 100%;
        justify-content: stretch;
    }

    .tasks-toolbar-group--scope {
        padding-right: 0;
        margin-right: 0;
        border-right: none;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    }

    .tasks-toolbar-group--views .view-toggle {
        width: 100%;
    }

    .tasks-toolbar-group--filters,
    .tasks-toolbar-group--actions {
        flex-direction: column;
    }
}

/* Feladatok: mobil szűrő blokk összecsukása a keresősávig */
.tasks-filters-panel-toggle {
    display: none;
}

.tasks-filters-panel--collapsed .tasks-filters-panel-inner {
    display: none;
}

@media (max-width: 768px) {
    .tasks-filters-panel {
        align-items: stretch;
    }

    .tasks-filters-panel-toggle {
        display: inline-flex;
        width: 100%;
        justify-content: flex-start;
        align-items: center;
        gap: 8px;
        margin: 0;
    }

    .tasks-filters-panel-chevron {
        margin-left: auto;
        transition: transform 0.18s ease;
    }

    .tasks-filters-panel-toggle[aria-expanded="true"] .tasks-filters-panel-chevron {
        transform: rotate(180deg);
    }
}

/* Feladatok: „Hozzám rendelt” – Material ikon mérete illeszkedjen a LAS gombokhoz */
.page-actions .tasks-assigned-to-me-btn .tasks-assigned-toggle-icon {
    font-size: 1.15rem;
    line-height: 1;
    vertical-align: middle;
}

/* Feladatok: Céges ↔ Saját – panel wrapper (desktopon láthatatlan, mobilon kártya + összecsukás) */
.tasks-scope-panel {
    display: contents;
}

.tasks-scope-panel-mobile-header {
    display: none;
}

.tasks-scope-panel-summary {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.3;
    flex: 1;
    min-width: 0;
}

.tasks-scope-panel-summary-label {
    font-weight: 600;
    color: #6b7280;
    margin-right: 0.25rem;
}

.tasks-scope-panel-summary-value {
    color: #111827;
}

.tasks-scope-panel-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg, 0.75rem);
    background: #fff;
    color: #374151;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: background 0.15s ease, border-color 0.15s ease;
    touch-action: manipulation;
}

.tasks-scope-panel-toggle:hover {
    background: #f9fafb;
    border-color: #9ca3af;
}

.tasks-scope-panel-toggle:focus-visible {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

.tasks-scope-panel-toggle .las {
    font-size: 1.35rem;
    line-height: 1;
}

/* Feladatok: Céges ↔ Saját + opcionális „céges mutatása” egy sorban */
.tasks-scope-bar {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

/* Feladatok: saját nézetben „céges is” – ugyanaz a pill mint a scope, smaragd kiemelés */
.tasks-show-company-switch-wrap {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    flex-shrink: 0;
}

.tasks-show-company-switch-wrap .tasks-show-company-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    user-select: none;
    line-height: 1.2;
}

.tasks-show-company-switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 26px;
    flex-shrink: 0;
    margin: 0;
    cursor: pointer;
}

.tasks-show-company-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
    margin: 0;
}

.tasks-show-company-slider {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background: #e5e7eb;
    border-radius: 26px;
    transition: background 0.2s ease;
}

.tasks-show-company-slider::before {
    content: '';
    position: absolute;
    height: 20px;
    width: 20px;
    left: 3px;
    top: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.tasks-show-company-switch input:checked + .tasks-show-company-slider {
    background: #059669;
}

.tasks-show-company-switch input:checked + .tasks-show-company-slider::before {
    transform: translateX(22px);
}

.tasks-show-company-switch input:focus-visible + .tasks-show-company-slider {
    outline: 2px solid #059669;
    outline-offset: 2px;
}

/* Feladatok: Céges ↔ Saját – kapcsoló (pill) */
.tasks-scope-switch-wrap {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    flex-shrink: 0;
}

.tasks-scope-switch-wrap .tasks-scope-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    user-select: none;
    line-height: 1.2;
}

.tasks-scope-switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 26px;
    flex-shrink: 0;
    margin: 0;
    cursor: pointer;
}

.tasks-scope-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
    margin: 0;
}

.tasks-scope-slider {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background: #e5e7eb;
    border-radius: 26px;
    transition: background 0.2s ease;
}

.tasks-scope-slider::before {
    content: '';
    position: absolute;
    height: 20px;
    width: 20px;
    left: 3px;
    top: 3px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.tasks-scope-switch input:checked + .tasks-scope-slider {
    background: #3b82f6;
}

.tasks-scope-switch input:checked + .tasks-scope-slider::before {
    transform: translateX(22px);
}

.tasks-scope-switch input:focus-visible + .tasks-scope-slider {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

/* Feladatok scope sáv – mobil: teljes szélesség, nagyobb érintési cél, olvasható sorok */
@media (max-width: 768px) {
    .page-header .tasks-scope-panel {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        flex-shrink: 1;
        box-sizing: border-box;
        gap: 0;
        padding: 0.75rem 0.875rem;
        background: linear-gradient(180deg, #f9fafb 0%, #f3f4f6 100%);
        border: 1px solid #e5e7eb;
        border-radius: var(--radius-lg, 0.75rem);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    }

    .page-header .tasks-scope-panel-mobile-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        margin: 0 0 0.5rem 0;
        padding: 0;
    }

    .page-header .tasks-scope-panel--collapsed .tasks-scope-panel-mobile-header {
        margin-bottom: 0;
    }

    .page-header .tasks-scope-panel--collapsed .tasks-scope-bar {
        display: none;
    }

    .page-header .tasks-scope-bar {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        flex-shrink: 1;
        box-sizing: border-box;
        gap: 0.5rem;
        padding: 0;
        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

    .page-header .tasks-show-company-switch-wrap {
        border-top: 1px solid #e5e7eb;
        padding-top: 0.5rem;
        margin-top: 0.125rem;
    }

    .page-header .tasks-scope-switch-wrap,
    .page-header .tasks-show-company-switch-wrap {
        display: flex;
        width: 100%;
        min-height: 44px;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        padding: 0.125rem 0;
        box-sizing: border-box;
        touch-action: manipulation;
    }

    .page-header .tasks-scope-switch-wrap .tasks-scope-label,
    .page-header .tasks-show-company-switch-wrap .tasks-show-company-label {
        flex: 1 1 0;
        min-width: 0;
        font-size: 0.8125rem;
        line-height: 1.25;
    }

    .page-header .tasks-scope-switch-wrap .tasks-scope-label:first-of-type,
    .page-header .tasks-show-company-switch-wrap .tasks-show-company-label:first-of-type {
        text-align: left;
    }

    .page-header .tasks-scope-switch-wrap .tasks-scope-label:last-of-type,
    .page-header .tasks-show-company-switch-wrap .tasks-show-company-label:last-of-type {
        text-align: right;
    }

    /* Nagyobb kapcsoló – könnyebb célzás ujjal */
    .page-header .tasks-scope-switch,
    .page-header .tasks-show-company-switch {
        width: 52px;
        height: 28px;
        flex-shrink: 0;
    }

    .page-header .tasks-scope-slider,
    .page-header .tasks-show-company-slider {
        border-radius: 999px;
    }

    .page-header .tasks-scope-slider::before,
    .page-header .tasks-show-company-slider::before {
        height: 22px;
        width: 22px;
        left: 3px;
        top: 3px;
    }

    .page-header .tasks-scope-switch input:checked + .tasks-scope-slider::before,
    .page-header .tasks-show-company-switch input:checked + .tasks-show-company-slider::before {
        transform: translateX(24px);
    }
}

/* Search section */
.search-section {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin-bottom: 2rem;
}

.search-form {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.search-group {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex: 1;
    min-width: 300px;
    max-width: 100%;
    flex-wrap: wrap;
}

.search-group .btn-primary,
.search-group .btn-secondary {
    flex-shrink: 0;
    min-width: auto;
    white-space: nowrap;
}

/* Szűrők – karbantartás, munkalapok – desktop: sorban */
.page-filters-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}
.page-filters-label {
    font-weight: 600;
    color: #374151;
}
.page-filters-select {
    width: auto;
    min-width: 100px;
}
.page-filters-search {
    flex: 1;
    min-width: 200px;
}

.search-input {
    flex: 1;
    min-width: 0;
    padding: 0.75rem 1rem;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: all 0.2s ease;
    background: #f9fafb;
    box-sizing: border-box;
}


.search-input:focus {
    outline: none;
    border-color: #f59e0b;
    background: white;
    box-shadow: 0 0 0 3px rgb(245 158 11 / 0.1);
}

.search-select {
    padding: 0.75rem 1rem;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: all 0.2s ease;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
    min-width: 150px;
}

.search-select:focus {
    outline: none;
    border-color: #f59e0b;
    background: white;
    box-shadow: 0 0 0 3px rgb(245 158 11 / 0.1);
}

.search-select:hover {
    border-color: #d1d5db;
    background: white;
}

/* Table styles */
.table-container {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.table-responsive {
    overflow-x: auto;
    background: white;
    border-radius: var(--radius-lg);
    padding: 1rem;
    margin-top: 1rem;
}

.desktop-table-view {
    background: white;
    border-radius: var(--radius-lg);
    padding: 1rem;
}

.clients-table {
    width: 100%;
    border-collapse: collapse;
}

.clients-table th {
    background: #f9fafb;
    padding: 1rem 1.5rem;
    text-align: left;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.clients-table td {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f3f4f6;
    color: #374151;
    vertical-align: middle;
}

.clients-table tr:hover {
    background: #f9fafb;
}

.clients-table tr:last-child td {
    border-bottom: none;
}

/* Action buttons */
.action-buttons {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}


/* Actions dropdown container */
.actions-dropdown {
    position: relative;
    display: inline-block;
}

/* Client actions wrapper to maintain button position */
.client-actions {
    position: relative;
}

/* Műveletek toggle button - hidden */
.actions-toggle {
    display: none; /* Elrejtjük a Műveletek gombot */
}

/* Toggle button styles removed - button is hidden */

/* Actions menu always visible */
.actions-menu {
    /* background: #f8fafc; */
    border-top: 1px solid #e5e7eb;
    padding: 1rem;
    margin: 1rem -1.5rem -1.5rem -1.5rem;
    border-radius: var(--radius-lg);
    display: block;
    opacity: 1;
    width: 110%;
}

/* .actions-menu.show rules removed - always visible now */

.client-actions-grid {
    display: flex;
    flex-direction: row;
    gap: 0.75rem;
    justify-content: center;
    align-items: center;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
}


/* Client cards for mobile */
.clients-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

/* Törés a kártyák és az alsó lapozó között (clients és locations) */
.clients-grid ~ .pagination-container {
    margin-top: 2rem;
}

/* Maintenance lapozó: szép elrendezés, középre igazítás */
.maintenance-pagination,
.clients-section .pagination-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 1.25rem 0;
}
.maintenance-pagination .pagination,
.clients-section .pagination-container .pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}
.pagination-current {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0 0.5rem;
}

/* Lapozó mobilon: középre rendezés, törés a footer előtt */
@media (max-width: 768px) {
    .pagination-container {
        display: flex;
        justify-content: center;
        margin-bottom: 2rem;
    }
    .pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 0.5rem;
    }

    /* iOS: ne zoomoljon be input fókusznál */
    .form-input,
    .form-select,
    .form-textarea,
    .search-input,
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="date"],
    input[type="search"],
    input[type="password"],
    select,
    textarea {
        font-size: max(16px, 1rem);
    }
}

.client-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    padding-bottom: 1rem;
    transition: all 0.2s ease;
    overflow: hidden; /* Kártya határai érvényesülnek */
    position: relative; /* Pozicionálási referencia */
    display: flex;
    flex-direction: column;
}

.client-card:hover {
    box-shadow: 0 8px 12px -2px rgb(0 0 0 / 0.15);
}

.client-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f3f4f6;
}

.client-header h3 {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    flex: 1;
}

.client-type {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.75rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

.client-type .client-type-icon {
    font-size: 16px;
    color: inherit;
}

.client-type-business {
    background: #eff6ff;
    color: #1d4ed8;
}

.client-type-person {
    background: #f0fdf4;
    color: #15803d;
}

/* Helyszín cím típusok (locations) */
.client-type-address-1 {
    background: #f1f5f9;
    color: #475569;
}

.client-type-address-2 {
    background: #eff6ff;
    color: #1d4ed8;
}

/* =============================================================================
   Helyszínek lista – kártyák (árnyék, tipográfia, mobil + asztal)
   ============================================================================= */
.locations-list-page .locations-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
    gap: 1.5rem;
    margin-top: 1.75rem;
}

.locations-list-page .client-card.location-card {
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.52);
    background: linear-gradient(
        168deg,
        rgba(255, 255, 255, 0.52) 0%,
        rgba(248, 250, 252, 0.36) 48%,
        rgba(255, 255, 255, 0.5) 100%
    );
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.68) inset,
        0 4px 22px rgba(15, 23, 42, 0.06),
        0 2px 10px rgba(15, 23, 42, 0.035);
    padding: 1.25rem 1.35rem 1rem;
    transition: transform 0.22s ease, box-shadow 0.25s ease, border-color 0.2s ease, background 0.25s ease;
    backdrop-filter: saturate(1.2) blur(14px);
    -webkit-backdrop-filter: saturate(1.2) blur(14px);
    isolation: isolate;
}

.locations-list-page .client-card.location-card:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 255, 255, 0.78);
    background: linear-gradient(
        168deg,
        rgba(255, 255, 255, 0.64) 0%,
        rgba(248, 250, 252, 0.48) 48%,
        rgba(255, 255, 255, 0.6) 100%
    );
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.82) inset,
        0 14px 40px rgba(15, 23, 42, 0.09),
        0 4px 16px rgba(15, 23, 42, 0.045);
}

.locations-list-page .location-card__header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 0.875rem;
    padding-bottom: 0.875rem;
    border-bottom: 1px solid rgba(226, 232, 240, 0.55);
    gap: 0.75rem;
}

.locations-list-page .location-card__title-row,
.locations-list-page .location-card__badges-row {
    width: 100%;
}

.locations-list-page .location-card__header h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
    letter-spacing: -0.02em;
    word-break: break-word;
}

.locations-list-page .location-card__header .client-type {
    align-self: flex-start;
    flex-shrink: 0;
    border-radius: 999px;
    padding: 0.35rem 0.75rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.locations-list-page .location-card__body {
    flex: 1;
    margin-bottom: 1rem;
    min-height: 0;
}

.locations-list-page .location-card__body .client-detail-row {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin: 0;
    padding: 0.55rem 0;
    border-bottom: 1px solid rgba(241, 245, 249, 0.65);
    font-size: 0.875rem;
    line-height: 1.5;
    color: #475569;
}

.locations-list-page .location-card__body .client-detail-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.locations-list-page .location-card__text {
    flex: 1;
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.locations-list-page .location-card__row--company {
    font-weight: 600;
    color: #334155;
}

.locations-list-page .location-card__body .client-info-icon {
    margin-right: 0;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(241, 245, 249, 0.55);
    color: #64748b;
    font-size: 18px !important;
    flex-shrink: 0;
    border: 1px solid rgba(255, 255, 255, 0.45);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.locations-list-page .location-card__row--company .client-info-icon {
    background: linear-gradient(135deg, rgba(239, 246, 255, 0.72) 0%, rgba(219, 234, 254, 0.52) 100%);
    color: #2563eb;
}

.locations-list-page .location-card__body a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.locations-list-page .location-card__body a:hover {
    text-decoration: underline;
}

.locations-list-page .location-card__footer {
    margin-top: auto;
    padding-top: 0.875rem;
    border-top: 1px solid rgba(226, 232, 240, 0.55);
    background: transparent;
}

/* Helyszín kártyák: böngészők backdrop-filter nélkül – eredeti tömör megjelenés */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .locations-list-page .client-card.location-card {
        border: 1px solid #e2e8f0;
        background: linear-gradient(165deg, #ffffff 0%, #f8fafc 55%, #ffffff 100%);
        box-shadow:
            0 1px 2px rgba(15, 23, 42, 0.04),
            0 4px 16px rgba(15, 23, 42, 0.07),
            0 0 0 1px rgba(255, 255, 255, 0.6) inset;
    }

    .locations-list-page .client-card.location-card:hover {
        border-color: #cbd5e1;
        box-shadow:
            0 8px 28px -6px rgba(15, 23, 42, 0.14),
            0 4px 12px rgba(15, 23, 42, 0.06);
    }

    .locations-list-page .location-card__body .client-info-icon {
        background: #f1f5f9;
        border: none;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .locations-list-page .location-card__row--company .client-info-icon {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    }
}

@media (max-width: 768px) {
    .locations-list-page .locations-cards-grid {
        grid-template-columns: 1fr;
        gap: 1.125rem;
        margin-top: 1.25rem;
    }

    .locations-list-page .client-card.location-card {
        padding: 1rem 1rem 0.875rem;
        border-radius: 14px;
    }

    .locations-list-page .location-card__header {
        flex-direction: column;
        align-items: stretch;
    }

    .locations-list-page .location-card__header .client-type {
        align-self: flex-start;
    }

    .locations-list-page .location-card__header h3 {
        font-size: 1.0625rem;
    }
}

/* =============================================================================
   Ügyfelek lista – kártyák (ugyanaz a megjelenés, mint a helyszíneknél)
   ============================================================================= */
.clients-list-page .clients-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
    gap: 1.5rem;
    margin-top: 1.75rem;
}

.clients-list-page .client-card.client-list-card {
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: linear-gradient(165deg, #ffffff 0%, #f8fafc 55%, #ffffff 100%);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 4px 16px rgba(15, 23, 42, 0.07),
        0 0 0 1px rgba(255, 255, 255, 0.6) inset;
    padding: 1.25rem 1.35rem 1rem;
    transition: transform 0.22s ease, box-shadow 0.25s ease, border-color 0.2s ease;
}

.clients-list-page .client-card.client-list-card:hover {
    transform: translateY(-3px);
    border-color: #cbd5e1;
    box-shadow:
        0 8px 28px -6px rgba(15, 23, 42, 0.14),
        0 4px 12px rgba(15, 23, 42, 0.06);
}

.clients-list-page .client-list-card__header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 0.875rem;
    padding-bottom: 0.875rem;
    border-bottom: 1px solid #e2e8f0;
    gap: 0.75rem;
}

.clients-list-page .client-list-card__title-row,
.clients-list-page .client-list-card__badges-row {
    width: 100%;
}

.clients-list-page .client-list-card__header h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
    letter-spacing: -0.02em;
    word-break: break-word;
}

.clients-list-page .client-list-card__header .client-type {
    align-self: flex-start;
    flex-shrink: 0;
    border-radius: 999px;
    padding: 0.35rem 0.75rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.clients-list-page .client-list-card__body {
    flex: 1;
    margin-bottom: 1rem;
    min-height: 0;
}

.clients-list-page .client-list-card__body .client-detail-row {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin: 0;
    padding: 0.55rem 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #475569;
}

.clients-list-page .client-list-card__body .client-detail-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.clients-list-page .client-list-card__text {
    flex: 1;
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.clients-list-page .client-list-card__row--primary {
    font-weight: 600;
    color: #334155;
}

.clients-list-page .client-list-card__body .client-info-icon {
    margin-right: 0;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 18px !important;
    flex-shrink: 0;
}

.clients-list-page .client-list-card__row--primary .client-info-icon {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    color: #2563eb;
}

.clients-list-page .client-location-count .client-info-icon {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    color: #16a34a;
}

.clients-list-page .client-list-card__body a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.clients-list-page .client-list-card__body a:hover {
    text-decoration: underline;
}

.clients-list-page .client-list-card__footer {
    margin-top: auto;
    padding-top: 0.875rem;
    border-top: 1px solid #e2e8f0;
    background: transparent;
}

@media (max-width: 768px) {
    .clients-list-page .clients-cards-grid {
        grid-template-columns: 1fr;
        gap: 1.125rem;
        margin-top: 1.25rem;
    }

    .clients-list-page .client-card.client-list-card {
        padding: 1rem 1rem 0.875rem;
        border-radius: 14px;
    }

    .clients-list-page .client-list-card__header {
        flex-direction: column;
        align-items: stretch;
    }

    .clients-list-page .client-list-card__header .client-type {
        align-self: flex-start;
    }

    .clients-list-page .client-list-card__header h3 {
        font-size: 1.0625rem;
    }
}

/* =============================================================================
   Tanúsítványok lista – kártyák (helyszínek / ügyfelek listával megegyező megjelenés)
   ============================================================================= */
.certificates-list-page .certificates-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
    gap: 1.5rem;
    margin-top: 1.75rem;
}

.certificates-list-page .client-card.certificate-list-card {
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: linear-gradient(165deg, #ffffff 0%, #f8fafc 55%, #ffffff 100%);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 4px 16px rgba(15, 23, 42, 0.07),
        0 0 0 1px rgba(255, 255, 255, 0.6) inset;
    padding: 1.25rem 1.35rem 1rem;
    transition: transform 0.22s ease, box-shadow 0.25s ease, border-color 0.2s ease;
    border-left: 4px solid var(--cert-accent, #94a3b8);
}

.certificates-list-page .client-card.certificate-list-card:hover {
    transform: translateY(-3px);
    border-color: #cbd5e1;
    box-shadow:
        0 8px 28px -6px rgba(15, 23, 42, 0.14),
        0 4px 12px rgba(15, 23, 42, 0.06);
}

.certificates-list-page .certificate-list-card__header {
    margin-bottom: 0.875rem;
    padding-bottom: 0.875rem;
    border-bottom: 1px solid #e2e8f0;
    gap: 0.75rem;
    align-items: flex-start;
}

.certificates-list-page .certificate-list-card__header h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
    letter-spacing: -0.02em;
    word-break: break-word;
}

.certificates-list-page .certificate-list-card__header .certificate-list-card__type {
    flex-shrink: 0;
    border-radius: 999px;
    padding: 0.35rem 0.75rem;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--cert-accent, #64748b);
    background: #f1f5f9;
    background: color-mix(in srgb, var(--cert-accent, #64748b) 14%, white);
}

.certificates-list-page .certificate-list-card__body {
    flex: 1;
    margin-bottom: 1rem;
    min-height: 0;
}

.certificates-list-page .certificate-list-card__body .client-detail-row {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin: 0;
    padding: 0.55rem 0;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #475569;
}

.certificates-list-page .certificate-list-card__body .client-detail-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.certificates-list-page .certificate-list-card__text {
    flex: 1;
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.certificates-list-page .certificate-list-card__row--primary {
    font-weight: 600;
    color: #334155;
}

.certificates-list-page .certificate-list-card__body .client-info-icon {
    margin-right: 0;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 18px !important;
    flex-shrink: 0;
}

.certificates-list-page .certificate-list-card__row--primary .client-info-icon {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    color: #2563eb;
}

.certificates-list-page .certificate-list-card__body a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.certificates-list-page .certificate-list-card__body a:hover {
    text-decoration: underline;
}

.certificates-list-page .certificate-list-card__footer {
    margin-top: auto;
    padding-top: 0.875rem;
    border-top: 1px solid #e2e8f0;
    background: transparent;
}

.certificates-list-page .certificate-list-card__footer .actions-menu {
    margin: 0;
    padding: 0;
    border: none;
    width: 100%;
}

.certificates-list-page .certificate-list-card__footer .client-actions-grid {
    margin-top: 0;
    padding-top: 0;
    justify-content: flex-start;
}

.certificates-list-page .certificate-list-card__body .certificate-status-badge {
    margin-left: 0.35rem;
    vertical-align: middle;
}

@media (max-width: 768px) {
    .certificates-list-page .certificates-cards-grid {
        grid-template-columns: 1fr;
        gap: 1.125rem;
        margin-top: 1.25rem;
    }

    .certificates-list-page .client-card.certificate-list-card {
        padding: 1rem 1rem 0.875rem;
        border-radius: 14px;
    }

    .certificates-list-page .certificate-list-card__header {
        flex-direction: column;
        align-items: stretch;
    }

    .certificates-list-page .certificate-list-card__header .certificate-list-card__type {
        align-self: flex-start;
    }

    .certificates-list-page .certificate-list-card__header h3 {
        font-size: 1.0625rem;
    }
}

/* Tanúsítványok: keresés + szűrő sor */
.certificates-list-page .certificates-filters-form .certificates-filter-row {
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.certificates-list-page .certificates-filter-select {
    min-width: 11rem;
    max-width: 100%;
    padding: 0.55rem 0.75rem;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    font-size: 0.875rem;
}

.certificates-list-page .certificates-filter-select:focus {
    outline: none;
    border-color: #93c5fd;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

@media (max-width: 768px) {
    .certificates-list-page .certificates-filters-form .search-input {
        width: 100%;
        min-width: 0;
    }

    .certificates-list-page .certificates-filter-select {
        flex: 1 1 calc(50% - 0.5rem);
        min-width: 0;
    }
}

.client-details {
    margin-bottom: 1.5rem;
}

.client-details p {
    margin: 0.5rem 0;
    color: #6b7280;
    font-size: 0.875rem;
}

.client-details strong {
    color: #374151;
    font-weight: 600;
}

.client-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
    border-top: 1px solid #f3f4f6;
    margin-top: auto;
}

/* User Menu Mobile Styles */
@media (max-width: 768px) {
    .user-menu-toggle {
        padding: 0.375rem 0.5rem;
        gap: 0.375rem;
    }
    
    .user-avatar {
        width: 1.75rem;
        height: 1.75rem;
        font-size: 0.75rem;
    }
    
    .chevron-icon {
        font-size: 18px;
    }
    
    .user-menu-dropdown {
        right: 0;
        left: auto;
        min-width: 160px;
        max-width: min(200px, calc(100vw - 1rem));
    }
    
    .user-menu-item {
        padding: 0.625rem 0.875rem;
        gap: 0.625rem;
        font-size: 0.875rem;
    }
    
    .menu-icon {
        font-size: 20px;
    }
}

/* Clients responsive styles */
@media (max-width: 768px) {
    /* Clients section – oldalsó tér mobilon */
    .clients-section {
        padding: 0 0.75rem;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .maintenance-companies-container {
        padding: 0;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
    }
    
    .clients-section .page-header,
    .page-header {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        justify-content: flex-start;
        gap: 0.75rem;
        padding: 0.75rem max(0.5rem, env(safe-area-inset-left, 0px)) 0.75rem max(0.5rem, env(safe-area-inset-right, 0px));
        padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }

    .page-header .page-title {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
    }

    .page-header .page-title h1 {
        font-size: 1.25rem;
        gap: 0.4rem;
        overflow: visible;
        text-overflow: unset;
        white-space: normal;
        max-width: 100%;
    }

    .page-header .page-actions,
    .page-header > a.btn,
    .page-header > a.btn-primary,
    .page-header > a.btn-secondary,
    .page-header > button.btn-primary,
    .page-header > button.btn-secondary {
        margin-left: 0;
        width: 100%;
        flex: 0 0 auto;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 0.5rem;
        justify-content: flex-start;
    }

    .page-header .page-actions .btn,
    .page-header .page-actions .btn-primary,
    .page-header .page-actions .btn-secondary,
    .page-header .page-actions a.btn:not(.auvi-back-btn),
    .page-header > a.btn,
    .page-header > a.btn-primary,
    .page-header > a.btn-secondary,
    .page-header > button.btn-primary,
    .page-header > button.btn-secondary {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }

    /* Csak vissza gomb: cím + vissza egy sorban, jobb szélen */
    .page-header:has(> .page-actions .auvi-back-btn:only-child),
    .page-header:has(> .auvi-back-btn:only-child) {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 0.65rem;
    }

    .page-header:has(> .page-actions .auvi-back-btn:only-child) .page-title,
    .page-header:has(> .auvi-back-btn:only-child) .page-title {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
    }

    .page-header:has(> .page-actions .auvi-back-btn:only-child) .page-title h1,
    .page-header:has(> .auvi-back-btn:only-child) .page-title h1 {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .page-header:has(> .page-actions .auvi-back-btn:only-child) .page-actions {
        width: auto;
        margin-left: auto;
        flex-direction: row;
        align-items: center;
    }

    .page-header .page-actions .auvi-back-btn,
    .page-header > .auvi-back-btn {
        width: 2.75rem;
        flex-shrink: 0;
        align-self: flex-end;
    }

    /* Vissza + más gombok: a vissza maradjon a sor jobb szélén a gombok alatt */
    .page-header .page-actions:has(.auvi-back-btn):not(:has(.auvi-back-btn:only-child)) {
        flex-direction: column;
    }

    .page-header .page-actions:has(.btn, .btn-primary, .btn-secondary, a.btn):has(.auvi-back-btn) .auvi-back-btn {
        align-self: flex-end;
        margin-left: auto;
    }
    
    /* Search section - full width, compensates main padding */
    .search-section {
        background: transparent;
        border: none;
        box-shadow: none;
        padding: 0;
        margin-bottom: 1rem;
        margin-left: calc(-1 * var(--space-3));
        margin-right: calc(-1 * var(--space-3));
        width: calc(100% + 2 * var(--space-3));
        max-width: calc(100% + 2 * var(--space-3));
        box-sizing: border-box;
        overflow-x: hidden;
    }
    
    /* Search form - full width inside search section */
    .search-form {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        margin-left: 0;
        margin-right: 0;
        overflow-x: hidden;
    }
    
    /* Search group - full width, single column */
    .search-group {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
        min-width: auto;
        width: 100%;
        max-width: 100%;
        flex-wrap: nowrap;
        flex: none;
        box-sizing: border-box;
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
    }
    
    /* Search input - full width */
    .search-input {
        width: 100%;
        max-width: 100%;
        flex: none;
        box-sizing: border-box;
        min-width: 0;
    }
    
    /* Search select - full width */
    .search-select {
        width: 100%;
        max-width: 100%;
        flex: none;
        min-width: auto;
        box-sizing: border-box;
    }
    
    /* Search buttons - full width */
    .search-group .btn-primary,
    .search-group .btn-secondary {
        width: 100%;
        max-width: 100%;
        justify-content: center;
        min-width: auto;
        flex: none;
        white-space: nowrap;
        box-sizing: border-box;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* Szűrők mobilon – minden elem új sorban, teljes szélesség */
    .page-filters-section .page-filters-group {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }
    .page-filters-section .page-filters-group > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: none !important;
    }
    .page-filters-section .page-filters-select,
    .page-filters-section .page-filters-search {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }
    
    /* Clients grid - single column, proper padding */
    .clients-grid {
        grid-template-columns: 1fr;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }

    /* Equipment list: keep tiny side gutters on mobile */
    #equipment-list.clients-grid {
        padding-left: 0.45rem !important;
        padding-right: 0.45rem !important;
        padding-bottom: 1.5rem !important;
    }
    #equipment-list.clients-grid .client-card.equipment-card-grouped {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    #equipment-system-overview {
        padding-left: 0.45rem !important;
        padding-right: 0.45rem !important;
        box-sizing: border-box;
    }
    #equipment-system-overview .equipment-system-cards {
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box;
    }
    #equipment-system-overview .equipment-system-card {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Operation page - egyezzen a clients/locations oldalakkal */
    .operation-locations-section {
        margin-top: 1.5rem;
        padding: 10px;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    .operation-locations-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
        width: 100%;
        max-width: 100%;
    }
    .operation-location-card {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    
    /* Client header */
    .client-header {
        flex-direction: column;
        gap: 0.5rem;
        padding-left: 0;
        padding-right: 0;
    }
    
    /* Client card - full width, flex column, proper padding */
    .client-card {
        padding: 1rem 0.75rem;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
        overflow-x: hidden;
    }
    
    /* Client details - proper padding, no text cut off */
    .client-details {
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 1rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }
    
    /* Client details paragraphs - proper spacing */
    .client-details p {
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        box-sizing: border-box;
    }
    
    /* Client actions - bottom spacing, gombok jobbra igazítva mobilnál */
    .client-actions {
        justify-content: flex-end;
        padding-top: 1rem;
        padding-bottom: 0.75rem;
        margin-top: auto;
        border-top: 1px solid #f3f4f6;
    }
    
    /* Client actions grid - gombok jobbra igazítva mobilnál (clients + locations) */
    .client-actions-grid,
    .client-view-actions-grid {
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 0;
        gap: 0.5rem;
        justify-content: flex-end;
    }
    
    .action-buttons {
        flex-direction: column;
        gap: 0.25rem;
    }
}

/* Mobile responsive styles for profile forms */
@media (max-width: 768px) {
    /* Profile container - full width on mobile, no padding/margin */
    .profile-container,
    main .profile-container {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
        box-sizing: border-box;
    }
    
    
    .profile-header {
        padding: 1.5rem;
    }
    
    .profile-header-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .title-text h1 {
        font-size: 1.5rem;
    }
    
    /* Profile section full width on mobile */
    .profile-section,
    main .profile-container .profile-section {
        margin: 0;
        border-radius: var(--radius-lg);
        padding: 1rem 1rem 1.5rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .users-form-page .profile-container .profile-section,
    main .users-form-page .profile-container .profile-section {
        padding: 1rem 1rem 1.25rem;
    }
    
    .card-content {
        padding: 1rem 0.75rem;
    }
    
    /* Ensure form groups use full width on mobile */
    .profile-form .form-group {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 1.25rem;
        box-sizing: border-box;
    }
    
    .profile-form .form-group input,
    .profile-form .form-group select,
    .profile-form .form-group textarea {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        font-size: 16px; /* Prevents zoom on iOS */
    }
    
    /* Ensure cards don't have extra margins - full width */
    .profile-card {
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 1.5rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding-left: 0;
        padding-right: 0;
    }
    
    /* Card header full width */
    .profile-card .card-header {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        width: 100%;
        box-sizing: border-box;
    }
    
    /* Card content full width with minimal padding */
    .profile-card .card-content {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        margin-left: 0;
        margin-right: 0;
    }
    
    /* Form groups inside cards - full width, no padding */
    .profile-card .card-content .form-group,
    .card-content .form-group,
    .profile-form .form-group {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
        box-sizing: border-box;
    }
    
    /* Form inputs inside cards - full width */
    .profile-card .card-content .form-group input,
    .profile-card .card-content .form-group select,
    .profile-card .card-content .form-group textarea,
    .card-content .form-group input,
    .card-content .form-group select,
    .card-content .form-group textarea {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }
    
    .form-actions {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: 0.75rem;
        padding: 1rem 0;
    }
    
    .btn-primary,
    .btn-secondary {
        justify-content: center;
        width: 100%;
    }
    
    .card-header {
        padding: 1rem;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    
    .card-header h3 {
        font-size: 1.1rem;
    }
    
    .card-subtitle {
        margin-top: 0.5rem;
        width: 100%;
    }
    
    .card-content {
        padding: 1rem;
    }
    
    header .container {
        min-height: var(--header-height);
        height: auto;
        padding: 8px max(0.75rem, env(safe-area-inset-left, 0px)) 8px max(0.75rem, env(safe-area-inset-right, 0px));
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
        align-items: center;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
        /* Ne clippelje az értesítés panelt; a logo saját overflow:hidden-nel zsugorodik */
        overflow: visible;
    }
    
    header .container .logo-image {
        height: 2.5rem;
        max-height: 64px;
    }

    /* Mobilon: eredeti cégnév méret; a hamburger védelmét a .logo max-width adja */
    header .container .logo-brand {
        display: inline-flex;
        align-items: center;
        font-size: clamp(1.05rem, 3.4vw, 1.3rem);
        padding-left: 0.85rem;
        max-width: min(280px, 62vw);
        letter-spacing: -0.025em;
        line-height: 1;
        align-self: center;
    }
    header .container .logo-brand::before {
        width: 4px;
        border-radius: 3px;
        top: 0.12em;
        bottom: 0.12em;
    }
    
    .header-actions {
        gap: var(--space-2);
    }
    
    .btn-dashboard,
    .btn-profile {
        padding: var(--space-2) var(--space-3);
        font-size: 0.75rem;
        height: 2.25rem;
    }
    
    main {
        overflow-x: hidden;
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    
    /* Ensure body and html don't cause overflow on mobile */
    body,
    html {
        overflow-x: hidden;
        width: 100%;
        max-width: 100%;
    }
    
    
    /* Apply same mobile styles to all forms - full width containers */
    .maintenance-form,
    .task-form,
    .login-form,
    .maintenance-form-card,
    .client-form,
    form:not(.search-form):not(.profile-notif-toggle-form):not(.profile-inline-form):not(.auvi-chat-composer):not(.tol-inline-delete-form):not(.client-assign-form):not(.client-delete-form):not(.travel-order-nav-fuel__refresh-form) {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        margin-left: 0;
        margin-right: 0;
    }
    
    /* Form containers extend beyond main padding - teljes szélesség mobilon */
    main .maintenance-form-container,
    main .task-form-container,
    main .clients-section:not(.location-form-page):not(.auvi-chat-page) .profile-container,
    main form:not(.profile-form):not(.search-form):not(.travel-order-form):not(.travel-order-nav-fuel__refresh-form):not(.tol-inline-delete-form):not(.client-assign-form):not(.client-delete-form):not(.auvi-chat-composer):not(.profile-notif-toggle-form):not(.profile-inline-form) {
        margin-left: calc(-1 * var(--space-3));
        margin-right: calc(-1 * var(--space-3));
        width: calc(100% + 2 * var(--space-3));
        max-width: calc(100% + 2 * var(--space-3));
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        box-sizing: border-box;
    }

    /* Helyszín add/edit/view: teljes szélesség, ne szorítsa össze a tartalmat / ne tolja ki a header hamburgert */
    .location-form-page.clients-section {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        overflow-x: clip;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
    }

    .location-form-page .profile-container,
    main .location-form-page .profile-container {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        min-height: 0;
        box-sizing: border-box;
        overflow-x: clip;
    }

    .location-form-page .profile-section,
    main .location-form-page .profile-container .profile-section {
        background: transparent;
        border: none;
        box-shadow: none;
        border-radius: 0;
        padding: 0 !important;
        margin: 0;
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
    }

    .location-form-page .profile-form,
    .location-form-page .form-sections {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        gap: 0.75rem;
        box-sizing: border-box;
        overflow-x: clip;
    }

    .location-form-page .profile-card {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 0.75rem;
        padding: 0;
        box-sizing: border-box;
        min-width: 0;
        overflow: hidden;
    }

    .location-form-page .profile-card .card-header {
        padding: 0.75rem 0.85rem;
    }

    .location-form-page .profile-card .card-content {
        padding: 0.75rem 0.85rem 1rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-x: clip;
    }

    .location-form-page .page-header {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }

    .location-form-page .searchable-select-wrap,
    .location-form-page .form-group,
    .location-form-page .form-group input,
    .location-form-page .form-group select,
    .location-form-page .form-group textarea,
    .location-form-page .searchable-select-trigger {
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .location-form-page .searchable-select-wrap {
        overflow: hidden;
    }

    .location-form-page .searchable-select-dropdown {
        max-width: 100%;
        box-sizing: border-box;
        overflow: hidden;
    }

    .location-form-page .searchable-select-option {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        box-sizing: border-box;
    }

    .location-form-page .profile-form .form-actions,
    .location-form-page.clients-section .profile-form .form-actions {
        padding: 1rem 0 !important;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .location-form-page .invoice-recipient-choice {
        grid-template-columns: 1fr;
        max-width: 100%;
    }
    
    /* All form groups use full width on mobile */
    .form-group,
    .maintenance-form .form-group,
    .task-form .form-group,
    .maintenance-form-card .form-group,
    .client-form .form-group {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 1.25rem;
        box-sizing: border-box;
        padding-left: 0;
        padding-right: 0;
    }
    
    
    /* All form inputs use full width on mobile */
    .form-group input,
    .form-group select,
    .form-group textarea,
    .form-input,
    .form-select,
    .form-textarea,
    .maintenance-form .form-group input,
    .maintenance-form .form-group select,
    .maintenance-form .form-group textarea,
    .task-form .form-group input,
    .task-form .form-group select,
    .task-form .form-group textarea,
    .maintenance-form-card .form-input,
    .maintenance-form-card .form-select,
    .client-form .form-group input,
    .client-form .form-group select,
    .client-form .form-group textarea,
    .client-card .form-group input,
    .client-card .form-group select,
    .client-card .form-group textarea,
    form .form-group input,
    form .form-group select,
    form .form-group textarea,
    .custom-select-search input,
    input.searchable-select-search,
    .searchable-select-search {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        font-size: 16px; /* Prevents zoom on iOS */
    }
    
    /* Form rows become single column on mobile */
    main .form-row,
    main .task-form .form-row,
    main .profile-form .form-row,
    main .maintenance-form-card .form-row,
    main .maintenance-form .form-row,
    main .client-form .form-row,
    main .client-card .form-row,
    main form .form-row,
    main .task-form.profile-form .form-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    /* Time input group - vertical stacking on mobile */
    main .time-input-group {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }
    
    main .time-input-group .form-input {
        width: 100%;
        max-width: 100%;
    }
    
    main .time-input-group .btn {
        width: 100%;
    }
    
    /* Form grids become single column on mobile */
    .form-grid,
    .form-grid-2,
    .form-grid-1 {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    
    /* Ensure any parent sections don't constrain width */
    .locations-section,
    .tasks-section,
    .maintenance-section,
    .certificates-section {
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
    }
    
    
    /* Card content full width */
    .card-content,
    .profile-card .card-content,
    .profile-card {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    
    /* Profile card specific - ensure full width */
    .profile-card {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
    }
    
    /* Card content inside profile cards */
    .profile-card .card-content {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
        width: 100%;
        max-width: 100%;
    }
    
    /* Form groups inside profile card content */
    .profile-card .card-content .form-group {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
    }
    
    /* Inputs inside profile card form groups */
    .profile-card .card-content .form-group input,
    .profile-card .card-content .form-group select,
    .profile-card .card-content .form-group textarea {
        width: 100%;
        max-width: 100%;
    }
    
    /* Ensure form groups extend to edges */
    main .profile-form .form-group,
    main .task-form .form-group,
    main .form-group {
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    
    /* Form inputs extend to edges */
    main .profile-form .form-group input,
    main .profile-form .form-group select,
    main .profile-form .form-group textarea,
    main .task-form .form-group input,
    main .task-form .form-group select,
    main .task-form .form-group textarea,
    main .form-group input,
    main .form-group select,
    main .form-group textarea {
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        box-sizing: border-box;
    }
    
    /* Signature canvas container mobile responsive */
    main .signature-canvas-container {
        padding: 10px;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        background: #ffffff;
    }
    
    main .signature-canvas {
        width: 100%;
        max-width: 100%;
        height: 280px;
        min-height: 280px;
        background: #ffffff;
    }
    
    /* Form actions stack vertically on mobile */
    .form-actions,
    .maintenance-form .form-actions,
    .task-form .form-actions,
    .maintenance-form-card .form-actions,
    .client-form .form-actions,
    .client-card .form-actions,
    form .form-actions {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: 0.75rem;
        padding: 1rem 0;
    }
    
    /* Users add/edit: form-actions jobb oldali térköz a kerethez */
    .clients-section .profile-form .form-actions {
        padding: 1rem 2rem;
    }
    
    /* Buttons full width on mobile */
    .form-actions .btn,
    .form-actions .btn-primary,
    .form-actions .btn-secondary,
    .maintenance-form .form-actions .btn,
    .task-form .form-actions .btn,
    .maintenance-form-card .form-actions .btn,
    .client-form .form-actions .btn,
    .client-card .form-actions .btn,
    form .form-actions .btn {
        width: 100%;
        justify-content: center;
    }
    
    /* Form containers full width */
    .maintenance-form-container,
    .task-form-container,
    .form-container {
        padding: 0.5rem;
        max-width: 100%;
        margin: 0;
        width: 100%;
        box-sizing: border-box;
    }
    
    /* Cards in all forms */
    .maintenance-form-card,
    .task-card,
    .form-card,
    .client-form-card {
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 1.5rem;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    /* Client card already handled in clients responsive section above - do not duplicate */
    
    /* Card content in all forms */
    .maintenance-form-card .card-content,
    .task-card .card-content,
    .form-card .card-content,
    .client-form-card .card-content {
        padding: 1rem 0.75rem;
        width: 100%;
    }
    
    /* Cards in forms */
    .maintenance-form-card,
    .task-card,
    .form-card {
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 1.5rem;
        width: 100%;
        box-sizing: border-box;
        padding: 0.5rem;
    }
    
    .container,
    footer .container {
        padding-left: var(--space-3);
        padding-right: var(--space-3);
    }

    /* Header: ne írjuk felül a safe-area paddinget, és a hamburger mindig férjen el */
    header .container {
        overflow: visible;
        min-width: 0;
        flex-wrap: nowrap;
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    }
    
    header .container .logo {
        flex: 1 1 auto;
        flex-shrink: 1;
        min-width: 0;
        /* Értesítés (44) + hamburger (40) + gap ≈ 96px */
        max-width: calc(100% - 100px);
        overflow: hidden;
    }

    header .container .header-actions-mobile {
        flex: 0 0 auto;
        flex-shrink: 0;
        margin-left: auto;
    }
    
    header .container .logo-image {
        max-width: 100%;
        height: auto;
        max-height: 64px;
        object-fit: contain;
    }
    
    header .container .hamburger-menu {
        display: flex;
        visibility: visible;
        flex-shrink: 0;
        margin-left: 0;
        margin-right: 0;
        opacity: 1;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }
    
    .footer-content {
        display: none;
    }
    
    .footer-bottom {
        flex-direction: column;
        text-align: center;
        border-top: none;
        padding-top: var(--space-4);
    }
    
    .footer-links {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .logo-image {
        height: 2rem;
        max-height: 40px;
    }
    header .container .logo-brand {
        display: inline-flex;
        align-items: center;
        font-size: clamp(1rem, 4.5vw, 1.2rem);
        padding-left: 0.9rem;
        max-width: min(260px, 70vw);
        line-height: 1;
        align-self: center;
    }
    header .container .logo-brand::before {
        width: 4px;
        border-radius: 3px;
        top: 0.12em;
        bottom: 0.12em;
    }
    
    header .container {
        min-height: 60px;
        height: auto;
        padding: 6px max(0.75rem, env(safe-area-inset-left, 0px)) 6px max(0.75rem, env(safe-area-inset-right, 0px));
        padding-left: max(0.75rem, env(safe-area-inset-left, 0px));
        padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    }
    
    .btn-dashboard,
    .btn-profile,
    .btn-logout {
        padding: var(--space-2);
        min-width: 2.25rem;
    }
    
    .btn-dashboard span,
    .btn-profile span,
    .btn-logout span {
        display: none;
    }
    
    footer .container {
        padding: var(--space-6) var(--space-3) var(--space-4);
    }
}

/* =============================================================================
   OLDAL SPECIFIKUS STÍLUSOK
   ============================================================================= */

/* Helyszínek oldal */
.locations-page,
.clients-page,
.maintenance-page,
.users-page {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}

.locations-page .container,
.clients-page .container,
.maintenance-page .container,
.users-page .container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 var(--space-6);
    box-sizing: border-box;
}

/* Táblázatok responsive kezelése */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-responsive table {
    min-width: 100%;
    width: 100%;
    table-layout: auto;
}

/* Form elemek */
.form-container {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* .form-row removed - using grid version below */

.form-col {
    flex: 1;
    min-width: 0;
    padding: 0 0.5rem;
    box-sizing: border-box;
}

/* =============================================================================
   FORM GRID – több oszlop: a címke magassága eltérhet, a mezők alul igazodnak
   ============================================================================= */
.form-row.form-row-2,
.form-grid-align-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
    align-items: stretch;
}

@media (max-width: 640px) {
    .form-row.form-row-2,
    .form-grid-align-columns {
        grid-template-columns: 1fr;
    }
}

.form-row.form-row-2 > .form-group,
.form-grid-align-columns > .form-group,
.operator-monthly-check-item {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-bottom: 0;
}

.form-row.form-row-2 > .form-group > label,
.form-grid-align-columns > .form-group > label,
.operator-monthly-check-item label {
    flex: 1 1 auto;
    margin-bottom: 0.35rem;
}

.form-row.form-row-2 > .form-group > .form-select,
.form-row.form-row-2 > .form-group > .form-input,
.form-row.form-row-2 > .form-group > .form-select-wrap,
.form-row.form-row-2 > .form-group > .searchable-select-wrap,
.form-grid-align-columns > .form-group > .form-select,
.form-grid-align-columns > .form-group > .form-input,
.operator-monthly-check-item .form-select,
.operator-monthly-check-item .form-input {
    margin-top: auto;
    flex-shrink: 0;
}

/* =============================================================================
   UTILITY CLASSES
   ============================================================================= */
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.font-bold { font-weight: 700; }
.font-semibold { font-weight: 600; }
.font-medium { font-weight: 500; }

.text-sm { font-size: 0.875rem; }
.text-base { font-size: 1rem; }
.text-lg { font-size: 1.125rem; }
.text-xl { font-size: 1.25rem; }
.text-2xl { font-size: 1.5rem; }

.mb-4 { margin-bottom: var(--space-4); }
.mb-6 { margin-bottom: var(--space-6); }
.mb-8 { margin-bottom: var(--space-8); }

.mt-4 { margin-top: var(--space-4); }
.mt-6 { margin-top: var(--space-6); }
.mt-8 { margin-top: var(--space-8); }

.hidden { display: none; }

/* HTML [hidden] – a display:flex/grid utility osztályok ne írják felül */
[hidden] {
    display: none !important;
}

.block { display: block; }
.flex { display: flex; }
.grid { display: grid; }

.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }

.w-full { width: 100%; }
.h-full { height: 100%; }

.rounded { border-radius: var(--radius); }
.rounded-lg { border-radius: var(--radius-lg); }
.rounded-xl { border-radius: var(--radius-xl); }

.shadow { box-shadow: var(--shadow); }
.shadow-lg { box-shadow: var(--shadow-lg); }

.transition { transition: var(--transition); }

/* =============================================================================
   ANIMÁCIÓK
   ============================================================================= */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
    from { opacity: 0; transform: translateX(-20px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-out;
}

.animate-slide-in {
    animation: slideIn 0.3s ease-out;
}

.animate-pulse {
    animation: pulse 2s infinite;
}

/* =============================================================================
   PRINT STÍLUSOK
   ============================================================================= */
@media print {
    * {
        box-shadow: none;
        text-shadow: none;
    }
    
    body {
        background: white;
        color: black;
    }
    
    header,
    footer,
    .no-print {
        display: none;
    }
    
    main {
        padding: 0;
        max-width: none;
    }
    
    /* Munkalap megtekintő – nyomtatásban ~20% nagyobb (fejléc és aláírás változatlan) */
    html body .work-sheet-view-container .print-container { font-size: 12px !important; }
    html body .work-sheet-view-container .document-info { font-size: 12px !important; }
    html body .work-sheet-view-container .document-info .info-section h3 { font-size: 12px !important; }
    html body .work-sheet-view-container .document-info .info-row,
    html body .work-sheet-view-container .document-info .info-label,
    html body .work-sheet-view-container .document-info .info-value { font-size: 11px !important; }
    html body .work-sheet-view-container .content-section h3 { font-size: 14px !important; }
    html body .work-sheet-view-container .content-section .content-text { font-size: 11px !important; }
    html body .work-sheet-view-container .footer { font-size: 11px !important; }
}

/* =============================================================================
   MODAL ABLAK STÍLUSOK - Törlés megerősítő
   ============================================================================= */

/* Modal háttér overlay */
.delete-modal {
    display: none;
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    animation: fadeIn 0.3s ease-out;
}

.delete-modal.show {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Modal tartalom */
.delete-modal-content {
    background-color: white;
    margin: auto;
    padding: 0;
    border: none;
    border-radius: var(--radius-lg);
    width: 90%;
    max-width: 400px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    animation: slideIn 0.3s ease-out;
    transform: translateY(0);
}

/* Modal fejléc */
.delete-modal-header {
    padding: 1.5rem 1.5rem 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    text-align: center;
}

.delete-modal-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #dc2626;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.delete-modal-header h3::before {
    content: "⚠️";
    font-size: 1.5rem;
}

/* Modal tartalom */
.delete-modal-body {
    padding: 1rem 1.5rem;
    text-align: center;
}

.delete-modal-body p {
    margin: 0.5rem 0;
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.5;
}

.client-name-highlight {
    background: #fef2f2;
    padding: 0.75rem;
    border-radius: var(--radius-lg);
    border-left: 4px solid #dc2626;
    margin: 1rem 0;
}

.client-name-highlight strong {
    color: #dc2626;
    font-weight: 600;
}

/* Modal lábléc */
.delete-modal-footer {
    padding: 1rem 1.5rem 1.5rem 1.5rem;
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    border-top: 1px solid #f1f5f9;
}

/* Modal gombok */
.delete-modal-btn {
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: var(--radius-lg);
    font-weight: 500;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-width: 100px;
}

.delete-btn-yes {
    background: #dc2626;
    color: white;
}

.delete-btn-yes:hover {
    background: #b91c1c;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
}

.delete-btn-no {
    background: #f8fafc;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

.delete-btn-no:hover {
    background: #f1f5f9;
    color: #475569;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Modal animációk */
@keyframes modalFadeIn {
    from {
        opacity: 0;
        backdrop-filter: blur(0px);
    }
    to {
        opacity: 1;
        backdrop-filter: blur(4px);
    }
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-50px) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.delete-modal {
    animation: modalFadeIn 0.3s ease-out;
}

.delete-modal-content {
    animation: modalSlideIn 0.3s ease-out;
}

/* Mobil reszponzív */
@media (max-width: 768px) {
    .delete-modal-content {
        width: 95%;
        margin: 1rem;
    }
    
    .delete-modal-footer {
        flex-direction: column;
    }
    
    .delete-modal-btn {
        width: 100%;
    }
}

/* Karbantartas jegyzokonyv PDF (mPDF): a MAINTENANCE_MPDF_EXTRACT_* kozotti reszt a pages/maintenance_pdf.php kinyeri; kommentben van, hogy a bongeszo ne alkalmazza a globalis html/body szabalyokat. */
/* MAINTENANCE_MPDF_EXTRACT_START
@page { margin: 8mm; }
html, body {
    margin: 0;
    padding: 0;
    font-family: dejavusans, sans-serif;
    font-size: 9pt;
    line-height: 1.25;
    color: #000;
    background: #fff;
}
.maintenance-document, .main-content {
    display: block !important;
    max-width: none !important;
    width: 100%;
    margin: 0;
    padding: 4px 0;
    background: #fff;
    box-shadow: none !important;
}
.maintenance-doc-fire { font-size: 9pt; padding: 0; max-width: none !important; }

.maintenance-doc-fire .document-header { margin-bottom: 3px; padding-bottom: 2px; }
.maintenance-doc-fire .company-brand { margin-bottom: 2px; }
.maintenance-doc-fire .company-logo { height: 34px; max-width: 90px; margin: 0; padding: 0; }
.maintenance-doc-fire .company-brand-name { font-size: 16pt; line-height: 1.1; padding-left: 6px; }
.maintenance-doc-fire .company-info p { font-size: 7pt; }
.maintenance-doc-fire .document-info, .maintenance-doc-fire .document-info p { font-size: 7pt; }
.maintenance-doc-fire .document-title { margin: 3px 0; }
.maintenance-doc-fire .document-title--regulation-below h2 { font-size: 10pt; margin: 0 0 3px 0; }
.maintenance-doc-fire .document-title--regulation-below .regulation-ref { font-size: 7pt; margin: 0; }
.maintenance-doc-fire .maintenance-info-container .section { margin-bottom: 4px; }
.maintenance-doc-fire .maintenance-info-container .section h3 {
    font-size: 9pt;
    margin: 4px 0 2px 0;
    padding-bottom: 1px;
}
.maintenance-doc-fire .maintenance-info-container .maintenance-info-table { font-size: 7pt; margin: 2px 0; }
.maintenance-doc-fire .maintenance-info-container .maintenance-info-table th,
.maintenance-doc-fire .maintenance-info-container .maintenance-info-table td {
    padding: 2px 4px;
    font-size: 7pt;
}
.maintenance-doc-fire .maintenance-fire-otsz-checklists > h3,
.maintenance-doc-fire .section.checklist-table-section > h3 {
    font-size: 9pt;
    margin: 4px 0 2px 0;
    padding-bottom: 1px;
}
.maintenance-doc-fire .maintenance-checklist-part-title { font-size: 8pt; margin: 2px 0; }
.maintenance-doc-fire .checklist-table-print-split,
.maintenance-doc-fire .checklist-table-print-split th,
.maintenance-doc-fire .checklist-table-print-split td {
    font-size: 6.8pt;
    line-height: 1.12;
    padding: 1px 3px;
}
.document-header {
    display: block !important;
    margin-bottom: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #000;
}
.company-brand {
    display: table;
    width: auto;
    border-collapse: collapse;
    margin: 0 0 4px 0;
}
.company-logo {
    display: table-cell;
    vertical-align: middle;
    height: 44px;
    width: auto;
    max-width: 110px;
    margin: 0;
    padding: 0;
}
.company-brand-name {
    display: table-cell;
    vertical-align: middle;
    font-size: 20pt;
    font-weight: 700;
    color: #c2410c;
    line-height: 1.1;
    padding-left: 8px;
}
.company-info p { font-size: 8pt; margin: 0; color: #444; }
.document-info { font-size: 8pt; text-align: left; }
.document-info p { margin: 1px 0; }
.document-title { text-align: center; margin: 6px 0; }
.document-title h2 { color: #b91c1c; font-size: 11pt; margin: 0 0 4px 0; line-height: 1.2; }
.document-title--regulation-below h2 { margin-bottom: 4px; }
.document-title--regulation-below .regulation-ref { margin-top: 0; margin-bottom: 0; }
.regulation-ref { font-size: 8pt; color: #333; margin: 0; }

.section { margin-bottom: 8px; page-break-inside: avoid; }

/* Tűzgátló ajtó PDF: magas blokk + page-break-inside: avoid gyakran üres záró oldalt eredményez; a checklist természetesen törhet */
.maintenance-document .section.fire-door-item-section {
    page-break-inside: auto !important;
    break-inside: auto !important;
}
.maintenance-document .section.fire-door-item-section .checklist-table {
    page-break-inside: auto !important;
}
.maintenance-document .section.fire-door-item-section.fire-door-item-section--last {
    margin-bottom: 4px;
}
.signature-spacer {
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0;
    overflow: hidden;
}
/* Ajtónkénti M+T: ugyanaz a HTML mint a tűzjelző; a belső section törhet, ne generáljon üres oldalt */
.maintenance-document .section.fire-door-item-section .section.tapasztalatok-megjegyzesek-section {
    page-break-inside: auto !important;
    break-inside: auto !important;
    margin-bottom: 0;
}

.maintenance-document .section.checklist-table-section,
.maintenance-document .maintenance-fire-otsz-checklists {
    page-break-inside: auto !important;
}
.maintenance-document .maintenance-fire-otsz-checklists .checklist-table-part-wrap,
.maintenance-document .section.checklist-table-section .checklist-table-print-split,
.maintenance-document .section.checklist-table-section .checklist-table,
.maintenance-document .maintenance-fire-otsz-checklists .checklist-table {
    page-break-inside: auto !important;
}
.section h3 {
    color: #b91c1c;
    font-size: 10pt;
    border-bottom: 1px solid #b91c1c;
    padding-bottom: 2px;
    margin: 8px 0 4px 0;
}
.section h4 { font-size: 9pt; margin: 6px 0 4px 0; }
.maintenance-info-container, .maintenance-info-section {
    display: block !important;
    width: 100%;
    margin-bottom: 6px;
}
.maintenance-info-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8pt;
    margin: 4px 0;
}
.maintenance-info-table th, .maintenance-info-table td {
    border: 1px solid #333;
    padding: 3px 6px;
    text-align: left;
    vertical-align: top;
}
.maintenance-info-th { font-weight: bold; background: #f0f0f0; width: 34%; }
.info-grid, .info-grid-compact { display: block !important; width: 100%; margin: 4px 0; }
.info-grid-compact .info-item, .info-item {
    display: block !important;
    margin-bottom: 4px;
    font-size: 8pt;
    line-height: 1.3;
}
.info-grid-compact .info-item label, .info-item label {
    font-weight: bold;
    display: inline;
    margin-right: 6px;
    color: #333;
}
.info-grid-compact .info-item span, .info-item span { display: inline; }
.three-column-section { display: block !important; width: 100%; }
.checklist-table, table.checklist-table {
    width: 100%;
    border-collapse: collapse;
    margin: 6px 0;
    font-size: 7.5pt;
}
.checklist-table th, .checklist-table td {
    border: 1px solid #333;
    padding: 2px 4px;
    vertical-align: top;
}
.checklist-table th { background: #f0f0f0; font-weight: bold; }
.maintenance-document .checklist-table-print-split {
    width: 100%;
    border-collapse: collapse;
    margin: 4px 0;
    font-size: 7.5pt;
}
.maintenance-document .checklist-table-print-split th,
.maintenance-document .checklist-table-print-split td {
    border: 1px solid #333;
    padding: 2px 4px;
    line-height: 1.2;
}
.maintenance-document .checklist-table-print-split th { background: #f0f0f0; font-weight: bold; }
.checklist-table .status-ok { background: #d1fae5; color: #047857; font-weight: bold; text-align: center; }
.checklist-table .status-error { background: #fecaca; color: #991b1b; font-weight: bold; text-align: center; }
.checklist-table .status-na { background: #f3f4f6; color: #4b5563; font-weight: bold; text-align: center; }
.checklist-table .status-unknown { background: #fef3c7; color: #b45309; text-align: center; }
.checklist-table tr.checklist-table-row-data td,
.checklist-table td.checklist-table-td-data {
    background: #fff !important;
    color: #000 !important;
    font-weight: normal;
}
.checklist-megjegyzes-cell, .checklist-table td.checklist-megjegyzes-cell {
    padding-left: 12px;
    font-size: 8pt;
    color: #374151;
}
.result-megfelelo { color: #047857; font-weight: bold; }
.result-nem_megfelelo, .result-nem_felelt_meg { color: #991b1b; font-weight: bold; }
.result-nem_relevans { color: #6b7280; font-weight: bold; }
.signature-table, .signature-section {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0 8px 0;
}
.signature-table td {
    border: none;
    padding: 4px 8px;
    vertical-align: top;
    text-align: center;
    font-size: 8pt;
}
.signature-image { max-width: 200px; max-height: 72px; width: auto; height: auto; }
.signature-line {
    border-bottom: 1px solid #333;
    width: 180px;
    height: 50px;
    margin: 0 auto 6px;
}
.notes-section { margin: 6px 0; }
.notes-title { font-weight: bold; font-size: 8pt; margin-bottom: 3px; }
.notes-box {
    border: 1px solid #999;
    padding: 5px 8px;
    font-size: 8pt;
    line-height: 1.35;
    white-space: pre-wrap;
}
.document-footer {
    text-align: center;
    margin-top: 12px;
    padding-top: 8px;
    border-top: 1px solid #ccc;
    font-size: 7pt;
    color: #555;
}
.document-footer p { margin: 2px 0; }
.extinguisher-table table, .participants-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8pt;
    margin: 6px 0;
}
.extinguisher-table th, .extinguisher-table td,
.participants-table th, .participants-table td {
    border: 1px solid #333;
    padding: 3px 5px;
}
.maintenance-checklist { display: block !important; margin-bottom: 8px; }
.checklist-item {
    display: block !important;
    padding: 4px 0;
    border-bottom: 1px solid #e5e7eb;
    font-size: 8pt;
}
.equipment-item {
    display: block !important;
    padding: 4px 0 4px 8px;
    margin-bottom: 4px;
    border-left: 3px solid #b91c1c;
    background: #f9fafb;
}
.text-center { text-align: center; }
.document-actions-top { display: none !important; }
img { max-width: 100%; height: auto; }
table { border-collapse: collapse; }

.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table {
    table-layout: fixed;
    width: 100%;
}
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table col:first-child {
    width: calc(100% - 120px);
}
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table col:nth-child(2) {
    width: 120px;
}
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table th:nth-child(2),
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table td:nth-child(2),
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table td.checklist-table-td-data {
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    padding-left: 2px;
    padding-right: 2px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

body.maintenance-view-app-page .maintenance-document .checklist-table-section,
body.operation-log-print-page .log-page-maintenance-attach .checklist-table-section {
    overflow: visible;
    max-width: none;
}

@media print {
    html,
    body,
    body.maintenance-view-app-page,
    body.operation-log-print-page,
    body.maintenance-view-app-page main,
    body.operation-log-print-page main,
    #operation-log-print-root,
    #operation-log-print-root .operation-log-content,
    #operation-log-print-root .log-page,
    #operation-log-print-root .log-page-maintenance-attach,
    #operation-log-print-root .log-page-maintenance-attach .maintenance-document,
    body.maintenance-view-app-page .maintenance-document,
    body.maintenance-view-app-page .maintenance-document .main-content,
    body.maintenance-view-app-page .maintenance-document .section,
    body.maintenance-view-app-page .maintenance-document .checklist-table-section,
    body.operation-log-print-page .log-page-maintenance-attach .section,
    body.operation-log-print-page .log-page-maintenance-attach .checklist-table-section {
        overflow: visible !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
        max-height: none !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }

    body.maintenance-view-app-page *::-webkit-scrollbar,
    body.operation-log-print-page *::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
    }
}
/* MAINTENANCE_MPDF_EXTRACT_END */

/* Natív Android app – frissítés figyelmeztető sáv */
.auvi-app-update-banner {
    position: fixed;
    top: calc(var(--header-height, 64px) + env(safe-area-inset-top, 0px));
    left: 0;
    right: 0;
    z-index: 9995;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem 1rem;
    padding: 0.65rem 1rem;
    background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
    border-bottom: 1px solid #fdba74;
    box-shadow: 0 4px 14px rgba(234, 88, 12, 0.12);
}

.auvi-app-update-banner__text {
    flex: 1 1 12rem;
    min-width: 0;
    font-size: 0.875rem;
    line-height: 1.4;
    color: #9a3412;
    font-weight: 600;
}

.auvi-app-update-banner__notes {
    margin: 0.25rem 0 0;
    font-size: 0.8125rem;
    font-weight: 400;
    color: #c2410c;
}

.auvi-app-update-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    flex-shrink: 0;
}

.auvi-app-update-banner__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.4rem 0.85rem;
    border-radius: 0.65rem;
    border: 1px solid #fdba74;
    background: #fff;
    color: #9a3412;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
}

.auvi-app-update-banner__btn--primary {
    background: linear-gradient(135deg, #f97316, #ea580c);
    border-color: #ea580c;
    color: #fff;
}

body.auvi-has-app-update-banner {
    padding-top: calc(var(--header-height, 64px) + 3.35rem + env(safe-area-inset-top, 0px));
}

body.auvi-has-app-update-banner.auvi-has-tabbar {
    padding-bottom: calc(var(--tabbar-height, 58px) + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 768px) {
    .auvi-app-update-banner {
        padding-left: max(1rem, env(safe-area-inset-left, 0px));
        padding-right: max(1rem, env(safe-area-inset-right, 0px));
    }

    body.auvi-has-app-update-banner {
        padding-top: calc(var(--header-height, 80px) + 4.1rem + env(safe-area-inset-top, 0px));
    }
}



/* ========== task-modal.css ========== */

/* Task modal stílusok (main.css-ből kiemelve) */

/* Task Modal Styles */
.task-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task-modal-hidden {
    display: none;
}

/* Megerősítő dialógusok (törlés) a feladat részletek modál fölött */
#taskDeleteModal.task-modal {
    z-index: 11000;
}

#taskDeleteModal.task-modal .task-modal-content {
    z-index: 11001;
}

/* Feladatok naptár: zoom + fade modál (feladat, cluster, karbantartás, tanúsítvány) */
.task-modal.task-modal-zoom {
    display: flex;
}

.task-modal.task-modal-zoom.task-modal-hidden {
    display: none;
}

.task-modal.task-modal-zoom:not(.task-modal-hidden) .task-modal-overlay,
.task-modal.task-modal-zoom:not(.task-modal-hidden) .task-modal-content {
    transition:
        opacity 0.54s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.54s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
}

.task-modal.task-modal-zoom:not(.task-modal-hidden):not(.task-modal-zoom-open) .task-modal-overlay {
    opacity: 0;
}

.task-modal.task-modal-zoom.task-modal-zoom-open .task-modal-overlay {
    opacity: 1;
}

.task-modal.task-modal-zoom:not(.task-modal-hidden):not(.task-modal-zoom-open) .task-modal-content {
    opacity: 0;
    transform: scale(0.88) translateY(14px);
    transform-origin: center center;
}

.task-modal.task-modal-zoom.task-modal-zoom-open .task-modal-content {
    opacity: 1;
    transform: scale(1) translateY(0);
}

html.email-modal-open,
body.email-modal-open {
    overflow: hidden;
}

/* position:fixed + top (JS) – a háttér ne görgessen a nyitott email-modál alatt */
body.email-modal-open {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
}

@media (max-width: 768px) {
    .task-modal.task-modal-zoom:not(.task-modal-hidden) {
        align-items: flex-end;
        justify-content: flex-end;
    }
}

@media (prefers-reduced-motion: reduce) {
    .task-modal.task-modal-zoom:not(.task-modal-hidden) .task-modal-overlay,
    .task-modal.task-modal-zoom:not(.task-modal-hidden) .task-modal-content {
        transition-duration: 0.01ms;
        transition-timing-function: linear;
    }

    .task-modal.task-modal-zoom:not(.task-modal-hidden):not(.task-modal-zoom-open) .task-modal-content {
        transform: none;
    }
}

.task-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Karbantartás modal – befejezett: lila fejléc (tömör, hogy kontrasztos maradjon) */
#maintenance-details-modal.maintenance-modal-done .task-modal-header {
    background: #7c3aed;
    color: white;
    border-bottom-color: #6d28d9;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
#maintenance-details-modal.maintenance-modal-done .task-modal-header h3 {
    color: white;
}
#maintenance-details-modal.maintenance-modal-done .task-modal-close {
    color: rgba(255,255,255,0.9);
}
#maintenance-details-modal.maintenance-modal-done .task-modal-close:hover {
    color: white;
}

.task-modal-content {
    position: relative;
    max-height: min(85vh, 100dvh);
    /* Liquid glass + lekerekítés minden saroknál; overflow: hidden a lábléc négyzetes sarkainak elrejtéséhez */
    background: linear-gradient(
        168deg,
        rgba(255, 255, 255, 0.78) 0%,
        rgba(248, 250, 252, 0.62) 45%,
        rgba(255, 255, 255, 0.74) 100%
    );
    border-radius: 16px;
    overflow: hidden;
    max-width: 600px;
    width: 90%;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.7) inset,
        0 24px 64px rgba(15, 23, 42, 0.2),
        0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 10001;
    border: 1px solid rgba(255, 255, 255, 0.55);
    backdrop-filter: saturate(1.2) blur(18px);
    -webkit-backdrop-filter: saturate(1.2) blur(18px);
    isolation: isolate;
}

/* Kompakt megerősítő dialógusok (pl. karbantartás megkezdése) */
.task-modal-compact .task-modal-content--compact {
    width: min(400px, 92vw);
    max-width: min(400px, 92vw);
}

.task-modal-compact .task-modal-header {
    padding: 16px 20px 12px;
}

.task-modal-compact .task-modal-body {
    padding: 0 20px 4px;
}

.task-modal-compact .task-modal-footer {
    padding: 12px 20px 16px;
}

.task-modal-content > form {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.task-modal-header {
    padding: 20px 24px;
    border-bottom: 1px solid rgba(226, 232, 240, 0.5);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    /* Átlátszó: egy üveg a teljes modál – a blur a .task-modal-content-en van */
    background: transparent;
}

.task-modal-header h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: #111827;
}

.task-modal-close {
    background: none;
    border: none;
    font-size: 24px;
    color: #6b7280;
    cursor: pointer;
    padding: 4px;
    line-height: 1;
    transition: color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.task-modal-close:hover {
    color: #111827;
}

.task-modal-close i {
    display: none;
    line-height: 1;
    color: inherit;
}

.task-modal-close:has(i.la-times)::before {
    margin-right: 0;
}

/* Közvetlen Material Symbols a modálokban (nem csak rejtett LA + ::before) */
.task-modal-header h3 .material-symbols-outlined {
    vertical-align: -0.12em;
    margin-right: 0.35rem;
    font-size: 1.15em;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-close .material-symbols-outlined {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    line-height: 1;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-close:has(> .material-symbols-outlined)::before {
    content: none;
    display: none;
}

.task-modal-btn .material-symbols-outlined {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn:has(> .material-symbols-outlined)::before {
    content: none;
    display: none;
}

.task-modal .password-toggle .material-symbols-outlined {
    display: inline-flex;
    font-size: 20px;
    line-height: 1;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    background: transparent;
}

.task-modal-footer {
    padding: 16px 24px;
    border-top: 1px solid rgba(226, 232, 240, 0.5);
    flex-shrink: 0;
    background: transparent;
}

/* Felugró modálok: böngésző backdrop-filter nélkül tömör fehér (olvashatóság) */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .task-modal-content {
        background: #fff;
        border: 1px solid #e5e7eb;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    }

    .task-modal-header {
        background: #fff;
        border-bottom: 1px solid #e5e7eb;
    }

    .task-modal-body {
        background: #fff;
    }

    .task-modal-footer {
        background: #fff;
        border-top: 1px solid #e5e7eb;
    }

    .task-modal-overlay {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

.task-modal-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}

.task-modal-details {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.task-detail-row,
.task-modal-detail-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.task-modal-detail-row label {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
}

.task-modal-detail-row span {
    font-size: 14px;
    color: #111827;
}

.task-detail-label {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.task-detail-value {
    font-size: 14px;
    color: #111827;
    word-wrap: break-word;
}

.task-detail-value strong {
    font-weight: 600;
}

/* Ügyfél és Helyszín – egymás alatti sorok, ikonok */
.task-detail-lines {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.task-detail-line {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    line-height: 1.4;
}
.task-detail-line i,
.task-detail-line .material-symbols-outlined {
    flex-shrink: 0;
    width: 18px;
    text-align: center;
    color: #6b7280;
    font-size: 18px;
}
.task-detail-line .material-symbols-outlined {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.task-detail-line a {
    color: #2563eb;
    text-decoration: none;
}
.task-detail-line a:hover {
    text-decoration: underline;
}

/* Navigáció gombok – ikon + szöveg, kellő hely */
.task-nav-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}
.task-nav-buttons .btn-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 14px;
    min-width: 44px;
    font-size: 13px;
    background: #eff6ff;
    color: #2563eb;
    border-radius: 8px;
    text-decoration: none;
    border: 1px solid #dbeafe;
    transition: background 0.2s, color 0.2s;
}
.task-nav-buttons .btn-nav:hover {
    background: #dbeafe;
    color: #1d4ed8;
}
.task-nav-buttons .btn-nav .material-symbols-outlined,
.task-nav-buttons .btn-nav i {
    font-size: 18px;
    flex-shrink: 0;
}
.task-nav-buttons .btn-nav span {
    white-space: nowrap;
}

.task-modal-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: var(--radius-lg);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
    border: 1px solid transparent;
}

.task-modal-btn-edit {
    background: #eff6ff;
    color: #2563eb;
    border-color: #dbeafe;
}

.task-modal-btn-edit:hover {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #1d4ed8;
}

.task-modal-btn-view {
    background: #f0fdf4;
    color: #16a34a;
    border-color: #bbf7d0;
}

.task-modal-btn-view:hover {
    background: #dcfce7;
    border-color: #86efac;
    color: #15803d;
}

.task-modal-btn-worksheet {
    background: #f0fdf4;
    color: #16a34a;
    border-color: #bbf7d0;
}

.task-modal-btn-worksheet:hover {
    background: #dcfce7;
    border-color: #86efac;
    color: #15803d;
}

.task-modal-btn-maintenance {
    background: #fef3c7;
    color: #d97706;
    border-color: #fde68a;
}

.task-modal-btn-maintenance:hover {
    background: #fde68a;
    border-color: #fcd34d;
    color: #b45309;
}

.task-modal-btn-delete {
    background: #fef2f2;
    color: #dc2626;
    border-color: #fecaca;
}

.task-modal-btn-delete:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #b91c1c;
}

/* Ügyfél törlés megerősítő modál – figyelmeztető szöveg */
.client-delete-modal-warning {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #b91c1c;
    line-height: 1.45;
}

.location-delete-modal-warning {
    margin: 0.5rem 0 0 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #b91c1c;
    line-height: 1.45;
}

.task-modal-btn-unarchive {
    background: #f3f4f6;
    color: #374151;
    border-color: #d1d5db;
}

.task-modal-btn-unarchive:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
    color: #1f2937;
}

/* Naptár nézet: csak ikon gombok (szöveg elrejtve) */
.tasks-calendar-view .task-modal-btn span:not(.material-symbols-outlined) {
    display: none;
}
.tasks-calendar-view .task-modal-btn {
    padding: 10px 12px;
    gap: 0;
}

/* Task Modal Buttons - Mobile Responsive */
@media (max-width: 768px) {
    .task-modal-header {
        padding: 16px;
    }
    
    .task-modal-header h3 {
        font-size: 18px;
    }
    
    .task-modal-close {
        min-width: 44px;
        min-height: 44px;
        padding: 8px;
        font-size: 28px;
        color: #111827;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        background: #f3f4f6;
        border: 1px solid #e5e7eb;
    }
    
    .task-modal-close:hover {
        background: #e5e7eb;
        color: #000000;
    }
    
    .task-modal-close::before {
        font-size: 28px;
        margin-right: 0;
    }
    
    .task-modal-close i {
        display: none;
    }
    
    .task-modal-body {
        padding: 16px;
    }
    
    .task-modal-actions {
        gap: 8px;
        justify-content: center;
    }
    
    .task-modal-btn {
        padding: 10px 12px;
        gap: 0;
        min-width: 44px;
        justify-content: center;
    }
    
    .task-modal-btn span:not(.material-symbols-outlined) {
        display: none;
    }
    
    .task-modal-btn i {
        margin: 0;
        font-size: 18px;
    }
    
    .task-modal .task-modal-btn::before {
        margin-right: 0;
    }
    
    .task-modal-footer {
        padding: 12px 16px;
    }
}

/* Karbantartás modal – mobilon a gombok láthatóak, szöveggel */
@media (max-width: 768px) {
    #maintenance-details-modal .task-modal-footer {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 16px;
        flex-shrink: 0;
    }
    
    #maintenance-details-modal .task-modal-btn {
        width: 100%;
        justify-content: center;
        padding: 14px 20px;
        min-height: 48px;
        font-size: 16px;
        gap: 10px;
    }
    
    #maintenance-details-modal .task-modal-btn span:not(.material-symbols-outlined) {
        display: inline;
    }
}



/* ========== dashboard.css ========== */

/* Dashboard stílusok (main.css-ből kiemelve) */

/* =============================================================================
   DASHBOARD STÍLUSOK - Áthelyezve a dashboard.php-ból
   ============================================================================= */

/* Dashboard Page Layout */
.dashboard-page {
    min-height: calc(100vh - 4rem);
    background: #fff;
    padding: 2rem 0;
    /* Kis lélegző hely a sticky fejléc és a lábléc felé (háttér árnyalata látszik) */
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid #CCC;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.dashboard-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2rem;
}

/* Welcome Section */
.welcome-section {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 2rem;
    margin-bottom: 3rem;
}

.welcome-content {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.welcome-text h1 {
    font-size: 2rem;
    font-weight: 800;
    color: #111827;
    margin: 0 0 0.5rem 0;
}

.welcome-text p {
    color: #6b7280;
    font-size: 1rem;
    margin: 0;
}

.welcome-subtitle {
    font-size: 1.125rem;
    color: #4b5563;
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.last-login {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0;
}

.role-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.65rem;
    border-radius: var(--radius-lg);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-left: 0.5rem;
    vertical-align: middle;
}

.role-admin {
    background: #DC2626;
    color: white;
    border: 1px solid #b91c1c;
}

.role-manager {
    background: #1e40af;
    color: white;
    border: 1px solid #1e3a8a;
}

.role-employee {
    background: #059669;
    color: white;
    border: 1px solid #047857;
}

.role-unset {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #f59e0b;
}

.role-karbantarto {
    background: #0d9488;
    color: white;
    border: 1px solid #0f766e;
}

.role-uzemelteto {
    background: #7c3aed;
    color: white;
    border: 1px solid #6d28d9;
}

.role-client {
    background: #2563eb;
    color: white;
    border: 1px solid #1d4ed8;
}

.role-ugyfeluzemelteto {
    background: #db2777;
    color: white;
    border: 1px solid #be185d;
}

.role-other {
    background: #6b7280;
    color: white;
    border: 1px solid #4b5563;
}

.users-role-code {
    color: #6b7280;
    font-size: 0.85em;
    font-weight: 500;
}

.welcome-icon {
    flex-shrink: 0;
}

.icon-circle {
    width: 4rem;
    height: 4rem;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

/* Dashboard Alert */
.dashboard-alert {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 2rem;
}

.dashboard-alert.alert-success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

/* Dashboard Section Titles */
.dashboard-section-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1.5rem 0;
}

/* Dashboard Stats Section */
.dashboard-stats-section {
    /* Apró rés az üdvözlő kártya és a fő tartalom (statisztikák) között – nem olvad össze a margin collapse-szel */
    padding-top: 5px;
    margin-bottom: 3rem;
}

.dashboard-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

.dashboard-stat-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
}

.dashboard-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
}

.dashboard-stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #3b82f6, #1d4ed8);
}

.dashboard-locations-card::before { background: linear-gradient(90deg, #10b981, #059669); }
.dashboard-clients-card::before { background: linear-gradient(90deg, #f59e0b, #d97706); }
.dashboard-maintenance-card::before { background: linear-gradient(90deg, #ef4444, #dc2626); }
.dashboard-users-card::before { background: linear-gradient(90deg, #8b5cf6, #7c3aed); }

.dashboard-stat-icon {
    width: 3rem;
    height: 3rem;
    background: #f3f4f6;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    color: #4b5563;
}

.dashboard-stat-icon .material-symbols-outlined {
    font-size: 24px;
    color: inherit;
}

.dashboard-stat-content {
    margin-bottom: 1rem;
}

.dashboard-stat-number {
    font-size: 2rem;
    font-weight: 800;
    color: #111827;
    line-height: 1;
}

.dashboard-stat-label {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 500;
}

.dashboard-stat-link {
    color: #3b82f6;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    transition: color 0.2s ease;
}

.dashboard-stat-link:hover {
    color: #1d4ed8;
}

/* Szabadságok gyors menü – összecsukható (dashboard) */
.dashboard-szabadsag-section {
    margin-bottom: 3rem;
}

.dashboard-szabadsag-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 0.5rem 0;
    transition: opacity 0.2s ease;
}

.dashboard-szabadsag-header:hover {
    opacity: 0.85;
}

.dashboard-szabadsag-section .dashboard-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.dashboard-szabadsag-arrow {
    color: #6b7280;
    font-size: 24px !important;
    transition: transform 0.25s ease;
}

.dashboard-szabadsag-section:not(.collapsed) .dashboard-szabadsag-arrow {
    transform: rotate(180deg);
}

.dashboard-szabadsag-section.collapsed .dashboard-szabadsag-card {
    display: none;
}

.dashboard-szabadsag-section .dashboard-section-title .material-symbols-outlined {
    color: #22c55e;
}

.dashboard-szabadsag-card {
    margin-top: 0.5rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.dashboard-szabadsag-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
}

.dashboard-szabadsag-table th,
.dashboard-szabadsag-table td {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
}

.dashboard-szabadsag-table th {
    font-weight: 600;
    color: #6b7280;
    font-size: 0.875rem;
}

.dashboard-szabadsag-table td {
    color: #111827;
}

.dashboard-szabadsag-table .szabadsag-napok {
    font-weight: 600;
    color: #22c55e;
}

.dashboard-szabadsag-add-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-md);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.875rem;
    transition: opacity 0.2s ease;
}

.dashboard-szabadsag-add-btn:hover {
    opacity: 0.9;
}

/* Dashboard Actions Section */
.dashboard-actions-section {
    margin-bottom: 3rem;
}

.dashboard-actions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

.dashboard-action-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
    transition: all 0.2s ease;
}

.dashboard-action-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
}

.dashboard-action-icon {
    width: 3rem;
    height: 3rem;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
    color: white;
}

.dashboard-action-icon .material-symbols-outlined {
    font-size: 24px;
    color: inherit;
}

.dashboard-action-icon.fire-safety { background: linear-gradient(135deg, #ef4444, #dc2626); }
.dashboard-action-icon.maintenance { background: linear-gradient(135deg, #3b82f6, #1d4ed8); }
.dashboard-action-icon.locations { background: linear-gradient(135deg, #10b981, #059669); }
.dashboard-action-icon.maintenance-companies { background: linear-gradient(135deg, #f59e0b, #d97706); }
.dashboard-action-icon.admin { background: linear-gradient(135deg, #8b5cf6, #7c3aed); }
.dashboard-action-icon.certificates { background: linear-gradient(135deg, #f59e0b, #d97706); }

.dashboard-action-content h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.5rem 0;
}

.dashboard-action-content p {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0 0 1rem 0;
    line-height: 1.5;
}

.dashboard-action-btn {
    display: inline-block;
    padding: 0.5rem 1rem;
    background: #3b82f6;
    color: white;
    text-decoration: none;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    font-weight: 600;
    transition: background 0.2s ease;
}

.dashboard-action-btn:hover {
    background: #1d4ed8;
}

/* Dashboard PWA Install Section - Csak dashboardon */
/* Dashboard Engedélyek szekció */
.dashboard-permissions-section {
    margin-bottom: 2rem;
}
.dashboard-permissions-section .dashboard-section-title .material-symbols-outlined {
    vertical-align: middle;
    margin-right: 0.5rem;
}
.dashboard-permissions-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-lg);
    padding: 1.25rem 1.5rem;
}
.dashboard-permissions-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.dashboard-permissions-list .perm-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem 1rem;
    padding: 0.75rem 1rem;
    background: #fff;
    border-radius: var(--radius-md);
    border: 1px solid #e2e8f0;
}
.dashboard-permissions-list .perm-icon {
    font-size: 24px;
    color: #64748b;
    flex-shrink: 0;
}
.dashboard-permissions-list .perm-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.dashboard-permissions-list .perm-info strong {
    font-size: 0.9375rem;
    color: #1e293b;
}
.dashboard-permissions-list .perm-status {
    font-size: 0.8125rem;
    color: #64748b;
}
.dashboard-permissions-list .perm-status.perm-ok {
    color: #059669;
}
.dashboard-permissions-list .perm-status.perm-deny {
    color: #dc2626;
}
.dashboard-permissions-list .perm-request-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    background: #3b82f6;
    color: white;
    border: none;
    border-radius: var(--radius-md);
    cursor: pointer;
    flex-shrink: 0;
    white-space: nowrap;
    justify-self: end;
}
.perm-request-btn:hover:not(:disabled) {
    background: #2563eb;
}
.perm-request-btn:disabled {
    opacity: 0.7;
    cursor: wait;
}

/* Dashboard Push értesítések szekció */
.dashboard-push-section {
    margin-bottom: 2rem;
}
.dashboard-push-section .dashboard-section-title .material-symbols-outlined {
    vertical-align: middle;
    margin-right: 0.5rem;
}
.dashboard-push-card {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border: 1px solid #86efac;
    border-radius: var(--radius-lg);
    padding: 1.5rem 2rem;
}
.dashboard-push-icon {
    width: 3.5rem;
    height: 3.5rem;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.dashboard-push-icon .material-symbols-outlined {
    font-size: 28px;
    color: white;
}
.dashboard-push-content h3 {
    font-size: 1.125rem;
    font-weight: 600;
    color: #166534;
    margin: 0 0 0.5rem 0;
}
.dashboard-push-content p {
    color: #15803d;
    font-size: 0.9375rem;
    margin: 0 0 1rem 0;
}

.dashboard-push-summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
}

.dashboard-push-summary {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-weight: 500;
    color: #64748b;
}

.dashboard-push-summary .material-symbols-outlined {
    font-size: 20px;
}

.dashboard-push-summary--on {
    color: #059669;
}

.dashboard-push-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--radius-lg);
    border: 1px solid #86efac;
    background: rgba(255, 255, 255, 0.7);
    cursor: pointer;
}

.dashboard-push-toggle-btn:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.95);
}

.dashboard-push-toggle-btn .material-symbols-outlined {
    font-size: 22px;
    color: #059669;
    transition: transform 0.2s ease;
}

.dashboard-push-toggle-btn[aria-expanded="true"] .material-symbols-outlined {
    transform: rotate(180deg);
}

.dashboard-push-details {
    width: 100%;
    margin-top: 0.75rem;
}

#push-card-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.65rem;
}

.dashboard-push-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.25rem;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-weight: 500;
    cursor: pointer;
    font-size: 0.9375rem;
}
.dashboard-push-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, #16a34a, #15803d);
}
.dashboard-push-btn:disabled {
    opacity: 0.8;
    cursor: wait;
}
.dashboard-push-btn .material-symbols-outlined {
    font-size: 18px;
}
.dashboard-push-subscribed {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
}
.dashboard-push-subscribed .dashboard-push-ok {
    display: inline-flex;
}
.dashboard-push-resub-hint {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0 0 0.5rem 0;
    line-height: 1.4;
}
.dashboard-push-subscribed-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.dashboard-push-subscribed .dashboard-push-resub-btn {
    display: inline-flex;
}
.dashboard-push-test-hint {
    font-size: 0.8125rem;
    color: #64748b;
    margin: 0;
    line-height: 1.4;
}
.dashboard-push-help {
    font-size: 0.8125rem;
    color: #475569;
    margin: 0;
    width: 100%;
}
.dashboard-push-help summary {
    cursor: pointer;
    font-weight: 500;
    color: #0369a1;
    padding: 0.25rem 0;
}
.dashboard-push-help summary:hover {
    text-decoration: underline;
}
.dashboard-push-help ul {
    margin: 0.5rem 0 0 1.25rem;
    padding: 0;
    line-height: 1.6;
}
.dashboard-push-help li {
    margin-bottom: 0.35rem;
}
.dashboard-push-ok {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #059669;
    font-weight: 500;
    margin: 0;
}
.dashboard-push-ok .material-symbols-outlined {
    font-size: 20px;
}
.dashboard-push-test-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    background: #e0f2fe;
    color: #0369a1;
    border: 1px solid #7dd3fc;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
}
.dashboard-push-test-btn:hover:not(:disabled) {
    background: #bae6fd;
}
.dashboard-push-test-btn:disabled {
    opacity: 0.7;
    cursor: wait;
}
.dashboard-push-test-btn .material-symbols-outlined {
    font-size: 18px;
}
.dashboard-push-hint {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0;
}

/* Android natív APK (dashboard, Android böngésző) – összecsukható */
.dashboard-android-apk-section {
    margin-bottom: 2rem;
}

.dashboard-android-apk-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 0.5rem 0;
    transition: opacity 0.2s ease;
}

.dashboard-android-apk-header:hover {
    opacity: 0.85;
}

.dashboard-android-apk-section .dashboard-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.dashboard-android-apk-section .dashboard-section-title .material-symbols-outlined {
    color: #10b981;
}

.dashboard-android-apk-arrow {
    color: #6b7280;
    font-size: 24px !important;
    transition: transform 0.25s ease;
}

.dashboard-android-apk-section:not(.collapsed) .dashboard-android-apk-arrow {
    transform: rotate(180deg);
}

.dashboard-android-apk-section.collapsed .dashboard-android-apk-card {
    display: none;
}

.dashboard-android-apk-card {
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 1px solid #6ee7b7;
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}

.dashboard-android-apk-icon {
    width: 4rem;
    height: 4rem;
    background: linear-gradient(135deg, #10b981, #059669);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dashboard-android-apk-icon .material-symbols-outlined {
    font-size: 32px;
    color: white;
}

.dashboard-android-apk-content h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #065f46;
    margin: 0 0 0.5rem 0;
}

.dashboard-android-apk-content p {
    color: #047857;
    font-size: 0.9375rem;
    margin: 0 0 1rem 0;
}

.dashboard-android-apk-meta {
    display: inline-block;
    font-size: 0.8125rem;
    color: #059669;
    opacity: 0.9;
}

.dashboard-android-apk-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.dashboard-android-apk-btn:hover {
    background: linear-gradient(135deg, #059669, #047857);
    color: white;
    transform: translateY(-1px);
}

.dashboard-android-apk-btn .material-symbols-outlined {
    font-size: 20px;
}

.dashboard-android-apk-hint {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0.75rem 0 0;
    line-height: 1.5;
}

.dashboard-android-apk-hint strong {
    color: #475569;
}

.dashboard-pwa-section {
    margin-bottom: 3rem;
}

.dashboard-pwa-section .dashboard-section-title .material-symbols-outlined {
    vertical-align: middle;
    margin-right: 0.5rem;
}

.dashboard-pwa-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #93c5fd;
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}

.dashboard-pwa-icon {
    width: 4rem;
    height: 4rem;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dashboard-pwa-icon .material-symbols-outlined {
    font-size: 32px;
    color: white;
}

.dashboard-pwa-content h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1e40af;
    margin: 0 0 0.5rem 0;
}

.dashboard-pwa-content p {
    color: #1e3a8a;
    font-size: 0.9375rem;
    margin: 0 0 1rem 0;
}

.dashboard-pwa-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.dashboard-pwa-btn:hover {
    background: linear-gradient(135deg, #2563eb, #1e40af);
    transform: translateY(-1px);
}

.dashboard-pwa-btn .material-symbols-outlined {
    font-size: 20px;
}

.dashboard-pwa-hint {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0;
    line-height: 1.5;
}

.dashboard-pwa-hint strong {
    color: #475569;
}

.dashboard-pwa-installed {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #059669;
    font-weight: 500;
    margin: 0;
}

.dashboard-pwa-installed .material-symbols-outlined {
    font-size: 20px;
}

.dashboard-pwa-dismiss {
    position: absolute;
    top: 1rem;
    right: 1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.75rem;
    background: transparent;
    color: #64748b;
    border: none;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    cursor: pointer;
    transition: color 0.2s ease;
}

.dashboard-pwa-dismiss:hover {
    color: #1e293b;
}

/* Dashboard Activity Section */
.dashboard-activity-section {
    margin-bottom: 2rem;
}

.dashboard-activity-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 2rem;
}

.dashboard-activity-placeholder {
    text-align: center;
    color: #9ca3af;
}

.dashboard-activity-placeholder svg {
    margin-bottom: 1rem;
}

.dashboard-activity-placeholder p {
    margin: 0;
    font-size: 0.875rem;
}

.dashboard-activity-list {
    padding: 1rem;
}

.dashboard-activity-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem;
    border-bottom: 1px solid #e5e7eb;
    transition: background-color 0.2s;
}

.dashboard-activity-item:last-child {
    border-bottom: none;
}

.dashboard-activity-item:hover {
    background-color: #f9fafb;
}

.activity-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.activity-icon .material-symbols-outlined {
    font-size: 20px;
    color: white;
}

.activity-content {
    flex: 1;
    min-width: 0;
}

.activity-title {
    font-weight: 500;
    color: #1f2937;
    margin-bottom: 0.5rem;
    font-size: 0.9375rem;
}

.activity-meta {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    font-size: 0.875rem;
    color: #6b7280;
}

.activity-status {
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-lg);
    font-size: 0.75rem;
    font-weight: 500;
}

.activity-status.status-pending {
    background-color: #fef3c7;
    color: #d97706;
}

.activity-status.status-in_progress {
    background-color: #fee2e2;
    color: #dc2626;
}

.activity-status.status-waiting {
    background-color: #e0e7ff;
    color: #6366f1;
}

.activity-status.status-completed {
    background-color: #d1fae5;
    color: #059669;
}

.activity-status.status-cancelled {
    background-color: #f3f4f6;
    color: #6b7280;
}

.activity-assigned {
    color: #6b7280;
}

.activity-time {
    color: #9ca3af;
}

.activity-link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 1rem;
    color: #6b7280;
    text-decoration: none;
    transition: color 0.2s;
    z-index: 1;
}

.activity-link:hover {
    color: #ef4444;
}

.activity-link .material-symbols-outlined {
    font-size: 20px;
}

.dashboard-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.dashboard-section-title .material-symbols-outlined {
    font-size: 24px;
    color: #ef4444;
}

.dashboard-menu-customize-section {
    margin-bottom: 3rem;
}

.dashboard-menu-customize-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 0.5rem 0;
    transition: opacity 0.2s ease;
}

.dashboard-menu-customize-header:hover {
    opacity: 0.85;
}

.dashboard-menu-customize-section .dashboard-section-title {
    margin: 0;
}

.dashboard-menu-customize-arrow {
    color: #6b7280;
    font-size: 24px !important;
}

.dashboard-menu-customize-section.collapsed .dashboard-menu-prefs-card {
    display: none;
}

.dashboard-menu-prefs-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.08);
    padding: 1.25rem;
    margin-bottom: 1rem;
}

.dashboard-menu-prefs-card p {
    margin: 0 0 0.9rem 0;
    color: #6b7280;
    font-size: 0.92rem;
}

.dashboard-menu-prefs-list {
    display: grid;
    gap: 0.65rem;
}

.dashboard-menu-prefs-list.drop-at-end {
    box-shadow: inset 0 -3px 0 #2563eb;
    border-radius: 10px;
}

.dashboard-menu-pref-item {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    padding: 0.65rem 0.75rem;
    background: #fff;
}

.dashboard-menu-pref-item-apps {
    flex-wrap: wrap;
    align-items: flex-start;
}

.dashboard-menu-pref-item-disallowed {
    opacity: 0.72;
    background: #f8fafc;
}

.dashboard-menu-pref-item-disallowed .dashboard-menu-pref-text small:last-child {
    color: #b45309;
}

.dashboard-menu-launcher-nav-option {
    flex: 1 1 100%;
    margin: 0.35rem 0 0;
    padding: 0.65rem 0.75rem;
    border-radius: 8px;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
}

.dashboard-menu-launcher-nav-check {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    cursor: pointer;
    margin: 0;
}

.dashboard-menu-launcher-nav-check input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 0.15rem;
    flex-shrink: 0;
}

.dashboard-menu-launcher-nav-text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.dashboard-menu-launcher-nav-text strong {
    font-size: 0.875rem;
    color: #0c4a6e;
    font-weight: 600;
}

.dashboard-menu-launcher-nav-text small {
    font-size: 0.8rem;
    color: #0369a1;
    line-height: 1.35;
}

.dashboard-menu-tabbar-hint {
    margin: 0 0 1rem;
    padding: 0.65rem 0.85rem;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: var(--radius-lg);
    color: #166534;
    font-size: 0.875rem;
    line-height: 1.45;
}

.dashboard-menu-tabbar-option {
    flex: 1 1 100%;
    width: 100%;
    margin-top: 0.35rem;
    padding: 0.55rem 0.65rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-lg);
    box-sizing: border-box;
}

.dashboard-menu-tabbar-check {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    cursor: pointer;
}

.dashboard-menu-tabbar-check input[type="checkbox"] {
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.dashboard-menu-tabbar-text {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.dashboard-menu-tabbar-text strong {
    font-size: 0.875rem;
    color: #1e293b;
}

.dashboard-menu-tabbar-text small {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.35;
}

.dashboard-menu-restore-btn--tabbar {
    margin-top: 0.5rem;
}

.dashboard-menu-pref-item.dragging {
    opacity: 0.55;
    border-style: dashed;
}

.dashboard-menu-pref-item.drop-target-before {
    box-shadow: inset 0 3px 0 #2563eb;
}

.dashboard-menu-drag-handle {
    border: none;
    background: transparent;
    color: #6b7280;
    cursor: grab;
    padding: 0.1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.dashboard-menu-drag-handle:active {
    cursor: grabbing;
}

.dashboard-menu-pref-check {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    flex: 1 1 auto;
}

.dashboard-menu-pref-check input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

.dashboard-menu-pref-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dashboard-menu-pref-text small {
    color: #6b7280;
}

.dashboard-menu-move-buttons {
    display: none;
    align-items: center;
    gap: 0.3rem;
    margin-left: auto;
}

.dashboard-menu-move-btn {
    border: 1px solid #d1d5db;
    background: #fff;
    color: #374151;
    border-radius: 8px;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.dashboard-menu-save-btn {
    margin-top: 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border: none;
    border-radius: 8px;
    background: #1f2937;
    color: #fff;
    padding: 0.55rem 0.85rem;
    cursor: pointer;
}

.dashboard-menu-restore-form {
    margin-top: 0.65rem;
}

.dashboard-menu-restore-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    color: #374151;
    padding: 0.5rem 0.8rem;
    cursor: pointer;
    font-size: 0.9rem;
}

.dashboard-menu-restore-btn:hover {
    background: #f9fafb;
    border-color: #9ca3af;
}

.dashboard-menu-color-wrap {
    flex: 0 1 220px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.dashboard-menu-color-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dashboard-menu-color-controls {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.dashboard-menu-color-picker {
    width: 36px;
    height: 32px;
    padding: 0;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    cursor: pointer;
    background: #fff;
}

.dashboard-menu-color-hex {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 96px;
    padding: 0.35rem 0.45rem !important;
    font-size: 0.82rem !important;
    font-family: ui-monospace, monospace;
}

.dashboard-menu-color-clear {
    width: 28px;
    height: 28px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
    color: #6b7280;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}

.dashboard-menu-color-clear:hover {
    background: #f3f4f6;
    color: #111827;
}

.dashboard-menu-color-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.dashboard-menu-color-swatch {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px #d1d5db;
    cursor: pointer;
    padding: 0;
}

.dashboard-menu-color-swatch:hover {
    transform: scale(1.08);
}

.dashboard-menu-color-swatch-recent {
    box-shadow: 0 0 0 1px #9ca3af;
}

.dashboard-menu-pref-item {
    flex-wrap: wrap;
}

/* Dashboard Responsive */
@media (max-width: 768px) {
    .dashboard-page {
        padding: 1rem 0;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }
    
    .dashboard-container {
        padding: 0 1rem;
    }
    
    .welcome-content {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .welcome-text h1 {
        font-size: 1.5rem;
    }
    
    .dashboard-stats-grid,
    .dashboard-actions-grid {
        grid-template-columns: 1fr;
    }
    
    .dashboard-android-apk-card,
    .dashboard-pwa-card,
    .dashboard-push-card {
        flex-direction: column;
        text-align: center;
    }

    .dashboard-permissions-list .perm-item {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "icon info"
            "btn btn";
        align-items: start;
    }

    .dashboard-permissions-list .perm-icon {
        grid-area: icon;
    }

    .dashboard-permissions-list .perm-info {
        grid-area: info;
    }

    .dashboard-permissions-list .perm-request-btn {
        grid-area: btn;
        width: 100%;
        justify-self: stretch;
        margin-top: 0.15rem;
    }

    .dashboard-menu-pref-item {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto;
        align-items: start;
        gap: 0.55rem 0.5rem;
    }

    .dashboard-menu-drag-handle {
        display: none;
    }

    .dashboard-menu-pref-check {
        grid-column: 1;
        grid-row: 1;
        flex: none;
        width: 100%;
        min-width: 0;
    }

    .dashboard-menu-move-buttons {
        grid-column: 2;
        grid-row: 1;
        display: inline-flex;
        margin-left: 0;
        align-self: center;
    }

    .dashboard-menu-color-wrap {
        grid-column: 1 / -1;
        grid-row: 2;
        flex: none;
        width: 100%;
        max-width: 100%;
        align-items: flex-start;
        text-align: left;
    }

    .dashboard-menu-color-controls {
        width: 100%;
        justify-content: flex-start;
    }

    .dashboard-menu-color-hex {
        max-width: none;
        flex: 1 1 8rem;
    }

    .dashboard-menu-color-swatches {
        justify-content: flex-start;
        width: 100%;
    }

    .dashboard-menu-pref-item-apps .dashboard-menu-launcher-nav-option {
        grid-column: 1 / -1;
        grid-row: 3;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        margin-left: 0;
        margin-right: 0;
    }

    .dashboard-menu-pref-item-apps .dashboard-menu-launcher-nav-check {
        width: 100%;
    }

    .dashboard-menu-pref-item-fixed {
        grid-template-columns: 1fr;
    }

    .dashboard-menu-pref-item-fixed .dashboard-menu-move-buttons {
        display: none;
    }

    /* Activity list: less cramped on mobile */
    .dashboard-activity-card {
        padding: 0.75rem;
    }
    .dashboard-activity-list {
        padding: 0.25rem 0;
    }
    .dashboard-activity-item {
        gap: 0.75rem;
        padding: 0.85rem 0.5rem;
    }
    .activity-icon {
        width: 36px;
        height: 36px;
    }
    .activity-title {
        font-size: 1rem;
        line-height: 1.35;
        margin-bottom: 0.35rem;
    }
    .activity-meta {
        gap: 0.55rem;
        row-gap: 0.35rem;
    }
    .activity-link {
        position: static;
        padding-right: 0;
        margin-left: auto;
        align-self: center;
        flex-shrink: 0;
    }
}

/* Gyors elérés + Google Naptár */
.dashboard-section-title--compact {
    margin-bottom: 0.75rem;
    font-size: 1.1rem;
}
.dashboard-quick-access {
    margin-bottom: 1.75rem;
}
.dashboard-quick-access-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 12px;
}
.dashboard-quick-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.dashboard-quick-card:hover {
    border-color: #93c5fd;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.12);
}
.dashboard-quick-card-icon {
    font-size: 28px;
    color: #4285f4;
}
.dashboard-quick-card--module .dashboard-quick-card-icon {
    color: var(--dashboard-quick-accent, #2563eb);
}
.dashboard-quick-card--module:hover {
    border-color: color-mix(in srgb, var(--dashboard-quick-accent, #2563eb) 45%, #fff);
}
.dashboard-quick-card--ok .dashboard-quick-card-icon { color: #15803d; }
.dashboard-quick-card--warn .dashboard-quick-card-icon { color: #d97706; }
.dashboard-quick-card-title {
    font-weight: 700;
    font-size: 0.95rem;
    color: #1e293b;
}
.dashboard-quick-card-desc {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.35;
}
.dashboard-gcal-section {
    margin-bottom: 2rem;
}

.dashboard-gcal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    cursor: pointer;
    padding: 0.5rem 0;
    user-select: none;
}

.dashboard-gcal-header:hover {
    opacity: 0.85;
}

.dashboard-gcal-header-main {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.5rem 1rem;
    min-width: 0;
}

.dashboard-gcal-section .dashboard-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.dashboard-gcal-section .dashboard-section-title .material-symbols-outlined {
    color: #4285f4;
}

.dashboard-gcal-header-summary {
    font-size: 0.875rem;
    color: #64748b;
    font-weight: 400;
}

.dashboard-gcal-arrow {
    color: #6b7280;
    font-size: 24px !important;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}

.dashboard-gcal-section:not(.collapsed) .dashboard-gcal-arrow {
    transform: rotate(180deg);
}

.dashboard-gcal-section.collapsed .dashboard-gcal-card {
    display: none;
}

.dashboard-gcal-card {
    margin-top: 0.5rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.dashboard-gcal-hint {
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0 0 1rem;
}
.dashboard-gcal-hint--warn { color: #b45309; }
.dashboard-gcal-meta { color: #64748b; font-size: 0.85rem; margin: 0.25rem 0; }
.dashboard-gcal-meta--ok { color: #15803d; }
.dashboard-gcal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-top: 1rem;
}
.dashboard-gcal-inline-form { display: inline; }
.dashboard-gcal-inline-form--block {
    display: block;
    margin: 0 0 1rem 0;
}
.dashboard-gcal-hint--tight {
    margin-top: -0.35rem;
}
.dashboard-gcal-checkbox {
    gap: 8px;
}
.dashboard-gcal-details { margin-top: 1rem; font-size: 0.9rem; }
.dashboard-gcal-details summary { cursor: pointer; font-weight: 600; color: #475569; }
.dashboard-gcal-code {
    display: block;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 0.8rem;
    word-break: break-all;
    margin-top: 6px;
}
.dashboard-gcal-admin-block {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid #e2e8f0;
}
.dashboard-gcal-admin-block h3 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 0.75rem;
    font-size: 1rem;
}
.dashboard-gcal-oauth-form .form-group { margin-bottom: 1rem; }



/* ========== apps.css ========== */

/* Alkalmazások – iOS-szerű indító nézet */

main:has(.apps-page) {
    padding: 0;
    background: linear-gradient(160deg, #0f172a 0%, #1e293b 45%, #0f172a 100%);
}

.apps-page {
    min-height: calc(100dvh - var(--header-height, 56px));
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem 0.75rem 2rem;
    box-sizing: border-box;
}

.apps-phone-frame {
    width: 100%;
    max-width: 390px;
    margin: 0 auto;
}

.apps-phone-screen {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: min(780px, calc(100dvh - var(--header-height, 56px) - 2.5rem));
    border-radius: 2.25rem;
    overflow: hidden;
    background:
        radial-gradient(ellipse 120% 80% at 50% -10%, rgba(99, 102, 241, 0.35) 0%, transparent 55%),
        radial-gradient(ellipse 90% 60% at 80% 100%, rgba(236, 72, 153, 0.2) 0%, transparent 50%),
        linear-gradient(180deg, #1a1f3a 0%, #2d3561 40%, #1e2448 100%);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.08),
        0 24px 48px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    padding: env(safe-area-inset-top, 0) 0 env(safe-area-inset-bottom, 0);
}

.apps-phone-topbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.65rem 1rem 0.35rem;
    flex-shrink: 0;
}

.apps-topbar-btn {
    position: relative;
    z-index: 5;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: rgba(255, 255, 255, 0.9);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.apps-topbar-btn:hover,
.apps-topbar-btn.is-open,
.apps-topbar-btn.is-active {
    background: rgba(255, 255, 255, 0.24);
}

.apps-topbar-btn.is-active {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.45);
}

.apps-topbar-btn .material-symbols-outlined {
    font-size: 1.15rem;
}

.apps-settings-panel {
    position: absolute;
    top: 3.15rem;
    left: 0.75rem;
    right: 0.75rem;
    z-index: 6;
}

.apps-settings-panel-inner {
    background: rgba(15, 23, 42, 0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 1rem;
    padding: 0.85rem 1rem 1rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

.apps-settings-title {
    margin: 0 0 0.75rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.apps-settings-title .material-symbols-outlined {
    font-size: 1.1rem;
}

.apps-settings-hint {
    margin: -0.35rem 0 0.75rem;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.35;
}

.apps-settings-field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.8);
}

.apps-settings-field select {
    flex: 0 0 auto;
    min-width: 7rem;
    padding: 0.35rem 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-size: 0.82rem;
}

.apps-settings-reset {
    width: 100%;
    margin-top: 0.5rem;
    padding: 0.45rem 0.75rem;
    font-size: 0.82rem;
}

.apps-phone-home {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.5rem 1rem 1rem;
    -webkit-overflow-scrolling: touch;
}

.apps-grid {
    display: grid;
    grid-template-columns: repeat(var(--apps-cols, 4), minmax(0, 1fr));
    gap: var(--apps-gap, 1.1rem) var(--apps-gap-x, 0.65rem);
    align-content: start;
}

.apps-phone-screen[data-cols="3"] { --apps-cols: 3; }
.apps-phone-screen[data-cols="4"] { --apps-cols: 4; }
.apps-phone-screen[data-cols="5"] { --apps-cols: 5; }
.apps-phone-screen[data-cols="6"] { --apps-cols: 6; }

.apps-phone-screen[data-icon-size="sm"] { --apps-icon-size: 48px; --apps-icon-font: 1.35rem; }
.apps-phone-screen[data-icon-size="md"] { --apps-icon-size: 58px; --apps-icon-font: 1.6rem; }
.apps-phone-screen[data-icon-size="lg"] { --apps-icon-size: 68px; --apps-icon-font: 1.85rem; }

.apps-phone-screen[data-gap="sm"] { --apps-gap: 0.75rem; --apps-gap-x: 0.4rem; }
.apps-phone-screen[data-gap="md"] { --apps-gap: 1.1rem; --apps-gap-x: 0.65rem; }
.apps-phone-screen[data-gap="lg"] { --apps-gap: 1.45rem; --apps-gap-x: 0.85rem; }

.apps-grid-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    color: inherit;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    touch-action: pan-y;
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}

.apps-page {
    -webkit-touch-callout: none;
}

.apps-phone-screen.is-reorder-mode .apps-grid .apps-grid-item {
    animation: apps-icon-wiggle 0.28s ease-in-out infinite alternate;
    touch-action: none;
    cursor: grab;
}

.apps-phone-screen.is-reorder-mode .apps-grid-link {
    pointer-events: none;
}

.apps-phone-screen.is-reorder-mode .apps-reorder-banner {
    display: block;
}

.apps-reorder-banner {
    display: none;
    margin: 0 1rem 0.35rem;
    padding: 0.45rem 0.65rem;
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.75rem;
    text-align: center;
}

/* SortableJS – sima rács átrendezés */
.apps-sortable-ghost {
    opacity: 0.28 !important;
}

.apps-sortable-ghost .apps-grid-label {
    opacity: 0;
}

.apps-sortable-chosen {
    animation: none !important;
}

.apps-sortable-chosen .apps-grid-icon {
    transform: scale(1.06);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

.apps-sortable-drag {
    opacity: 0.98 !important;
    animation: none !important;
}

.apps-sortable-fallback {
    opacity: 0.98 !important;
    animation: none !important;
    z-index: 10000 !important;
    cursor: grabbing !important;
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.4) !important;
}

.apps-sortable-fallback .apps-grid-icon {
    transform: scale(1.08);
}

.apps-grid-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    text-decoration: none;
    color: inherit;
    width: 100%;
    transition: transform 0.12s ease;
}

.apps-grid-link:active {
    transform: scale(0.92);
}

@keyframes apps-icon-wiggle {
    from { transform: rotate(-1.5deg); }
    to { transform: rotate(1.5deg); }
}

.apps-grid-icon {
    --app-icon-bg: #3b82f6;
    width: var(--apps-icon-size, 58px);
    height: var(--apps-icon-size, 58px);
    border-radius: 22%;
    background: linear-gradient(145deg, color-mix(in srgb, var(--app-icon-bg) 88%, #fff) 0%, var(--app-icon-bg) 100%);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.apps-grid-icon .material-symbols-outlined {
    font-size: var(--apps-icon-font, 1.6rem);
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.apps-grid-label {
    font-size: 0.68rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.95);
    text-align: center;
    line-height: 1.2;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

.apps-grid-item.is-active .apps-grid-icon {
    box-shadow:
        0 0 0 2px rgba(255, 255, 255, 0.55),
        0 2px 8px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.apps-empty-msg {
    text-align: center;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.9rem;
    margin: 2rem 0;
}

.apps-phone-dock {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    margin: 0 0.85rem 1rem;
    padding: 0.65rem 1.25rem;
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.apps-dock-item {
    text-decoration: none;
    transition: transform 0.12s ease;
}

.apps-dock-item:active {
    transform: scale(0.9);
}

.apps-dock-item .apps-grid-icon {
    width: 50px;
    height: 50px;
}

.apps-dock-item .apps-grid-icon .material-symbols-outlined {
    font-size: 1.45rem;
}

.apps-dock-item.is-active .apps-grid-icon {
    box-shadow:
        0 0 0 2px rgba(255, 255, 255, 0.5),
        0 2px 8px rgba(0, 0, 0, 0.2);
}

@media (max-width: 480px) {
    .apps-page {
        padding: 0.5rem 0 1rem;
        align-items: stretch;
    }

    .apps-phone-frame {
        max-width: none;
    }

    .apps-phone-screen {
        min-height: calc(100dvh - var(--header-height, 56px) - 1rem);
        border-radius: 0;
        box-shadow: none;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    .apps-phone-frame::before {
        content: '';
        display: block;
        width: 110px;
        height: 5px;
        margin: 0 auto 0.5rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.2);
    }
}

/* Asztali nézet – teljes szélességű indító, nem telefon keret */
@media (min-width: 769px) {
    main:has(.apps-page) {
        padding: 1.5rem 0 2.5rem;
        background: #f1f5f9;
    }

    .apps-page {
        min-height: auto;
        align-items: stretch;
        justify-content: flex-start;
        max-width: 1180px;
        margin: 0 auto;
        padding: 0 1.5rem;
        width: 100%;
        box-sizing: border-box;
    }

    .apps-page .pwa-install-inline {
        display: none;
    }

    .apps-phone-frame {
        max-width: none;
        width: 100%;
    }

    .apps-phone-frame::before {
        display: none;
    }

    .apps-phone-screen {
        min-height: auto;
        border-radius: 0.85rem;
        overflow: visible;
        background: #fff;
        border: 1px solid #e2e8f0;
        box-shadow:
            0 1px 2px rgba(15, 23, 42, 0.05),
            0 8px 24px rgba(15, 23, 42, 0.06);
        padding: 0;
    }

    .apps-phone-topbar {
        justify-content: flex-end;
        gap: 0.65rem;
        padding: 1.15rem 1.5rem 0.85rem;
        border-bottom: 1px solid #f1f5f9;
    }

    .apps-phone-topbar::before {
        content: 'Alkalmazások';
        margin-right: auto;
        font-size: 1.35rem;
        font-weight: 600;
        color: #0f172a;
        letter-spacing: -0.02em;
    }

    .apps-phone-topbar::after {
        content: 'Modulok indító – rendezés, színezés, gyors elérés';
        position: absolute;
        left: 1.5rem;
        top: 2.65rem;
        font-size: 0.875rem;
        color: #64748b;
        pointer-events: none;
    }

    .apps-phone-topbar {
        position: relative;
        padding-bottom: 2.15rem;
    }

    .apps-topbar-btn {
        width: 40px;
        height: 40px;
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        color: #475569;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .apps-topbar-btn:hover,
    .apps-topbar-btn.is-open,
    .apps-topbar-btn.is-active {
        background: #f1f5f9;
        border-color: #cbd5e1;
        color: #1e293b;
        box-shadow: none;
    }

    .apps-topbar-btn.is-active {
        box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
    }

    .apps-settings-panel {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        padding: 0 1.5rem 1rem;
        margin-top: -0.35rem;
        border-bottom: 1px solid #f1f5f9;
    }

    .apps-settings-panel-inner {
        background: #f8fafc;
        border: 1px solid #e2e8f0;
        box-shadow: none;
        color: #334155;
    }

    .apps-settings-title {
        color: #0f172a;
    }

    .apps-settings-hint {
        color: #64748b;
    }

    .apps-settings-field {
        color: #475569;
    }

    .apps-settings-field select {
        background: #fff;
        color: #1e293b;
        border-color: #cbd5e1;
    }

    .apps-reorder-banner {
        margin: 0 1.5rem 0.65rem;
        background: #eff6ff;
        color: #1d4ed8;
        border: 1px solid #bfdbfe;
    }

    .apps-phone-home {
        padding: 1.35rem 1.5rem 2rem;
        overflow: visible;
    }

    .apps-grid {
        gap: var(--apps-gap, 1.35rem) var(--apps-gap-x, 1rem);
    }

    .apps-grid-label {
        color: #334155;
        font-size: 0.8rem;
        text-shadow: none;
    }

    .apps-empty-msg {
        color: #64748b;
    }

    .apps-phone-dock {
        display: none;
    }

    .apps-color-modal:not([hidden]) {
        align-items: center;
        padding: 1.5rem;
    }

    .apps-color-modal-sheet {
        border-radius: 1rem;
        max-width: 420px;
        animation: none;
    }
}

/* Jobb klikk / hosszú nyomás – saját menü */
.apps-context-menu {
    position: fixed;
    z-index: 13000;
    min-width: 220px;
    max-width: min(280px, calc(100vw - 16px));
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 0.85rem;
    padding: 0.35rem 0;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.22);
}

.apps-context-menu-title {
    padding: 0.55rem 0.9rem 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    border-bottom: 1px solid #f1f5f9;
    margin-bottom: 0.2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.apps-context-menu-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    border: none;
    background: transparent;
    text-align: left;
    padding: 0.6rem 0.9rem;
    font-size: 0.9rem;
    color: #1e293b;
    cursor: pointer;
}

.apps-context-menu-item .material-symbols-outlined {
    font-size: 1.15rem;
    color: #475569;
}

.apps-context-menu-item:hover,
.apps-context-menu-item:focus-visible {
    background: #f1f5f9;
    outline: none;
}

.apps-context-menu-sep {
    height: 1px;
    margin: 0.25rem 0;
    background: #e2e8f0;
}

/* Ikon szín modal */
body.apps-color-modal-open {
    overflow: hidden;
}

.apps-color-modal[hidden] {
    display: none !important;
}

.apps-color-modal:not([hidden]) {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 1rem;
}

.apps-context-menu[hidden] {
    display: none !important;
}

.apps-color-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.apps-color-modal-sheet {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 400px;
    background: #fff;
    border-radius: 1.25rem 1.25rem 1rem 1rem;
    padding: 1.25rem 1.25rem 1rem;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28);
    animation: apps-modal-slide-up 0.25s ease;
}

@keyframes apps-modal-slide-up {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.apps-color-modal-preview {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.apps-color-modal-preview .apps-grid-icon {
    width: 72px;
    height: 72px;
}

.apps-color-modal-preview .apps-grid-icon .material-symbols-outlined {
    font-size: 2rem;
}

.apps-color-modal-preview h3 {
    margin: 0;
    font-size: 1.1rem;
    color: #1e293b;
    text-align: center;
}

.apps-color-modal-controls {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.apps-color-modal-picker-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.9rem;
    color: #475569;
}

.apps-color-modal-picker-wrap input[type="color"] {
    width: 56px;
    height: 40px;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    padding: 0;
    background: transparent;
}

.apps-color-modal-hex {
    width: 100%;
    font-size: 0.9rem;
}

.apps-color-modal-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.apps-color-swatch {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.15);
    cursor: pointer;
    padding: 0;
}

.apps-color-modal-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.apps-color-modal-actions .btn {
    flex: 1 1 auto;
    min-width: 5.5rem;
}

.apps-color-modal-msg {
    margin: 0.65rem 0 0;
    font-size: 0.82rem;
    color: #64748b;
    text-align: center;
    min-height: 1.2em;
}


/* ========== list-pages.css ========== */

/* Egységes listázó oldalak stílusai (main.css-ből kiemelve) */

/* =============================================================================
   EGYSÉGES LISTÁZÓ OLDALAK STÍLUSAI
   ============================================================================= */

/* Page Header (egységes liquid glass – felül részletes szabályok) */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem; /* Csökkentve: 2rem → 1rem */
    padding: 0.75rem 1rem; /* Csökkentve: 1.5rem → 0.75rem 1rem */
    background: var(--header-glass-bg);
    border-radius: var(--radius-lg); /* Csökkentve: 1rem → 0.5rem */
    box-shadow:
        0 1px 0 0 var(--header-glass-border) inset,
        0 8px 28px rgba(15, 23, 42, 0.08),
        0 2px 8px rgba(15, 23, 42, 0.05);
    border: 1px solid var(--header-glass-edge);
    backdrop-filter: saturate(1.35) blur(var(--header-glass-blur));
    -webkit-backdrop-filter: saturate(1.35) blur(var(--header-glass-blur));
    isolation: isolate;
}

.page-title {
    display: flex;
    align-items: center;
    gap: 0.5rem; /* Csökkentve: 1rem → 0.5rem */
}

/* Card icon és empty icon Material Symbols */
.card-icon.las::before,
.card-icon.la-::before,
.empty-icon.las::before,
.empty-icon.la-::before {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    display: inline-block;
}

.card-icon.la-certificate::before,
.card-icon.las.la-certificate::before,
.empty-icon.la-certificate::before,
.empty-icon.las.la-certificate::before {
    content: "verified";
}

.empty-icon.la-clipboard-list::before,
.empty-icon.las.la-clipboard-list::before {
    content: "assignment";
}

/* Profile icon Material Symbols */
.profile-icon.las::before,
.profile-icon.la-::before {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    display: inline-block;
}

.profile-icon.la-map-marker-alt::before,
.profile-icon.las.la-map-marker-alt::before {
    content: "location_on";
}

/* További ikonok Material Symbols konverzió */
i.las.la-spinner::before,
i.la-spinner::before {
    font-family: 'Material Symbols Outlined';
    content: "refresh";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    animation: spin 1s linear infinite;
}

i.las.la-clock::before,
i.la-clock::before {
    font-family: 'Material Symbols Outlined';
    content: "schedule";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-check-circle::before,
i.la-check-circle::before {
    font-family: 'Material Symbols Outlined';
    content: "check_circle";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-check::before,
i.la-check::before {
    font-family: 'Material Symbols Outlined';
    content: "check";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-user::before,
i.la-user::before {
    font-family: 'Material Symbols Outlined';
    content: "person";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-building::before,
i.la-building::before {
    font-family: 'Material Symbols Outlined';
    content: "business";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-map-marker-alt::before,
i.la-map-marker-alt::before {
    font-family: 'Material Symbols Outlined';
    content: "location_on";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-exclamation-triangle::before,
i.la-exclamation-triangle::before {
    font-family: 'Material Symbols Outlined';
    content: "warning";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-question-circle::before,
i.la-question-circle::before {
    font-family: 'Material Symbols Outlined';
    content: "help";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-calendar-check::before,
i.la-calendar-check::before {
    font-family: 'Material Symbols Outlined';
    content: "event_available";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-calendar-times::before,
i.la-calendar-times::before {
    font-family: 'Material Symbols Outlined';
    content: "event_busy";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-phone::before,
i.la-phone::before {
    font-family: 'Material Symbols Outlined';
    content: "phone";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-map-pin::before,
i.la-map-pin::before {
    font-family: 'Material Symbols Outlined';
    content: "place";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-directions::before,
i.la-directions::before {
    font-family: 'Material Symbols Outlined';
    content: "directions";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-envelope::before,
i.la-envelope::before {
    font-family: 'Material Symbols Outlined';
    content: "email";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-fire::before,
i.la-fire::before {
    font-family: 'Material Symbols Outlined';
    content: "local_fire_department";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-fire-extinguisher::before,
i.la-fire-extinguisher::before {
    font-family: 'Material Symbols Outlined';
    content: "fire_extinguisher";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-spray-can::before,
i.la-spray-can::before {
    font-family: 'Material Symbols Outlined';
    content: "spray";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

i.las.la-graduation-cap::before,
i.la-graduation-cap::before {
    font-family: 'Material Symbols Outlined';
    content: "school";
    display: inline-block;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Elrejtjük az összes Line Awesome ikon szövegét */
i.las.la-spinner,
i.la-spinner,
i.las.la-clock,
i.la-clock,
i.las.la-check-circle,
i.la-check-circle,
i.las.la-check,
i.la-check,
i.las.la-user,
i.la-user,
i.las.la-building,
i.la-building,
i.las.la-map-marker-alt,
i.la-map-marker-alt,
i.las.la-exclamation-triangle,
i.la-exclamation-triangle,
i.las.la-question-circle,
i.la-question-circle,
i.las.la-calendar-check,
i.la-calendar-check,
i.las.la-calendar-times,
i.la-calendar-times,
i.las.la-envelope,
i.la-envelope,
i.las.la-fire,
i.la-fire,
i.las.la-fire-extinguisher,
i.la-fire-extinguisher,
i.las.la-spray-can,
i.la-spray-can,
i.las.la-graduation-cap,
i.la-graduation-cap,
i.las.la-phone,
i.la-phone,
i.las.la-map-pin,
i.la-map-pin,
i.las.la-directions,
i.la-directions {
    font-size: 0;
    width: 1em;
    height: 1em;
    overflow: hidden;
}

.page-title h1 {
    font-size: 1.25rem; /* Csökkentve: 1.875rem (30px) → 1.25rem (20px) */
    font-weight: 700;
    color: #111827;
    margin: 0;
}

.page-title h1 .material-symbols-outlined {
    vertical-align: middle;
    margin-right: 0.35rem;
    font-size: 1.35rem;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Search Container */
.search-container {
    margin-bottom: 2rem;
}

.search-form {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1.5rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
}

.search-input-group {
    flex: 1;
    display: flex;
    gap: 0.5rem;
}

.search-input {
    flex: 1;
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: border-color 0.2s;
}

.search-input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgb(59 130 246 / 0.1);
}

.search-btn {
    padding: 0.75rem 1.5rem;
    background: #3b82f6;
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.search-btn:hover {
    background: #1d4ed8;
}

/* Results Info */
.results-info {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 1rem 1.5rem;
    margin-bottom: 1.5rem;
    color: #6b7280;
    font-size: 0.875rem;
}

/* Form Card */
.form-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    margin-bottom: 2rem;
    overflow: hidden;
}

.form-card-header {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-card-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 700;
    font-size: 1.125rem;
    color: #1f2937;
}

.form-card-icon {
    color: #ef4444;
}

.form-card-content {
    padding: 1.5rem;
}

.form-grid {
    display: grid;
    gap: 1.5rem;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group.full-width {
    grid-column: 1 / -1;
}

.form-label {
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
}

.form-input, .form-select, .form-textarea {
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: border-color 0.2s;
}

.form-input:focus, .form-select:focus, .form-textarea:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgb(59 130 246 / 0.1);
}

/* Datetime-local input specifikus stílus */
input[type="datetime-local"] {
    min-height: 42px;
    cursor: pointer;
    color: #374151;
}

input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    padding: 4px;
    opacity: 0.7;
}

input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

.form-textarea {
    resize: vertical;
    min-height: 100px;
}

.required-asterisk {
    color: #ef4444;
    margin-left: 2px;
}

/* Items Grid */
.items-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
    margin-top: 2rem;
}

.item-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.item-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
}

/* Oldal-specifikus színek */
.maintenance-companies-container .item-card {
    border-left-color: #f59e0b;
}

.maintenance-companies-container .item-card:hover {
    border-left-color: #d97706;
}

.maintenance-companies-container .company-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}

.maintenance-companies-container .company-status-icon {
    font-size: 1.35rem;
    font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}

.maintenance-companies-container .company-status-icon--active {
    color: #16a34a;
}

.maintenance-companies-container .company-status-icon--inactive {
    color: #94a3b8;
}

.maintenance-companies-container .item-info-row i,
.maintenance-companies-container .item-info-row .item-info-icon {
    color: #f59e0b;
}

.maintenance-companies-container .item-info-row .material-symbols-outlined.item-info-icon {
    font-size: 18px;
    flex-shrink: 0;
}

.maintenance-companies-container .page-icon {
    color: #f59e0b;
}

.maintenance-companies-container .form-card-icon {
    color: #f59e0b;
}

.maintenance-companies-container .logo-preview-wrap {
    margin-bottom: 0.5rem;
}
.maintenance-companies-container .company-logo-preview {
    max-width: 120px;
    max-height: 80px;
    object-fit: contain;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-md);
    padding: 4px;
}

/* Karbantartó cég – Autók szekció */
.maintenance-vehicles-section .vehicles-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.maintenance-vehicles-section .vehicle-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.6rem;
    background: #f3f4f6;
    border-radius: var(--radius-md);
    font-size: 0.9rem;
    min-width: 180px;
}
.maintenance-vehicles-section .vehicle-item-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow: hidden;
}
.maintenance-vehicles-section .vehicle-plate {
    font-weight: 600;
    color: #1f2937;
}
.maintenance-vehicles-section .vehicle-type {
    color: #6b7280;
    font-size: 0.85rem;
}
.maintenance-vehicles-section .vehicle-notes {
    color: #9ca3af;
    font-size: 0.8rem;
}

/* Chip-stílusú rádiógombok (Havi/Eseti minta) – üzemanyag típus stb. */
.app-chip-radios {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.app-chip-radio {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin: 0;
    cursor: pointer;
    white-space: nowrap;
    font-size: 0.86rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.2;
}

.app-chip-radio input {
    margin: 0;
    flex-shrink: 0;
    accent-color: var(--menu-primary, #dc2626);
}

.app-chip-radio__lbl {
    line-height: 1.2;
}

/* form-group label { display:block } ne törje szét a chip rádiókat */
label.app-chip-radio,
.form-group label.app-chip-radio {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0;
    font-weight: 600;
    font-size: 0.86rem;
    color: #1e293b;
    cursor: pointer;
    white-space: nowrap;
}

label.app-chip-radio input[type="radio"],
.form-group label.app-chip-radio input[type="radio"] {
    width: auto;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}

@media (max-width: 768px) {
    .app-chip-radios {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
        width: 100%;
    }

    label.app-chip-radio,
    .form-group label.app-chip-radio {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        width: 100%;
        min-height: 2.75rem;
        padding: 0.55rem 0.65rem;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        background: #fff;
        box-sizing: border-box;
        white-space: nowrap;
    }

    label.app-chip-radio:has(input:checked),
    .form-group label.app-chip-radio:has(input:checked) {
        border-color: var(--menu-primary, #dc2626);
        background: #fef2f2;
        color: #991b1b;
        box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.15);
    }

    label.app-chip-radio input[type="radio"],
    .form-group label.app-chip-radio input[type="radio"] {
        width: 1.05rem;
        height: 1.05rem;
        margin: 0;
        flex-shrink: 0;
    }
}

.maintenance-vehicles-section .vehicle-add-form .app-chip-radios,
.maintenance-vehicles-section .vehicle-add-form .vehicle-fuel-type-select {
    flex: 0 0 auto;
    min-width: 8.5rem;
    max-width: 11rem;
}

.mc-maintenance-vehicle-modal .vehicle-fuel-type-select,
.mc-vehicle-edit-stack .vehicle-fuel-type-select {
    width: 100%;
    min-height: 2.5rem;
}

.maintenance-vehicles-section .btn-edit-vehicle,
.maintenance-vehicles-section .btn-delete-vehicle {
    flex-shrink: 0;
    box-sizing: border-box;
    width: 2.125rem;
    height: 2.125rem;
    min-width: 2.125rem;
    min-height: 2.125rem;
    padding: 0;
    color: #64748b;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
    transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.maintenance-vehicles-section .btn-edit-vehicle .material-symbols-outlined,
.maintenance-vehicles-section .btn-delete-vehicle .material-symbols-outlined {
    font-size: 1.25rem;
    width: 1.25rem;
    height: 1.25rem;
    font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;
}
.maintenance-vehicles-section .btn-edit-vehicle:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #334155;
}
.maintenance-vehicles-section .btn-delete-vehicle:hover {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}
.maintenance-vehicles-section .vehicle-add-form {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.maintenance-vehicles-section .vehicle-add-form .form-input {
    margin: 0;
}

.mc-maintenance-vehicle-modal {
    max-width: 32rem;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

.mc-maintenance-vehicle-modal .mc-vehicle-edit-stack {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.mc-maintenance-vehicle-modal .mc-norm-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.mc-maintenance-vehicle-modal .mc-norm-row .form-input {
    flex: 1;
    min-width: 0;
}

.mc-maintenance-vehicle-modal .mc-norm-fill-btn {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #475569;
    cursor: pointer;
    box-sizing: border-box;
}

.mc-maintenance-vehicle-modal .mc-norm-fill-btn:hover {
    background: #e2e8f0;
    border-color: #cbd5e1;
}

.mc-maintenance-vehicle-modal .mc-norm-fill-btn .material-symbols-outlined {
    font-size: 1.25rem;
    line-height: 1;
}

.profile-private-vehicle-modal .mc-vehicle-edit-stack {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.profile-private-vehicle-modal .mc-norm-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.profile-private-vehicle-modal .mc-norm-row .form-input {
    flex: 1;
    min-width: 0;
}

.profile-private-vehicle-modal .mc-norm-fill-btn {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #475569;
    cursor: pointer;
    box-sizing: border-box;
}

.profile-private-vehicle-modal .mc-norm-fill-btn:hover {
    background: #e2e8f0;
    border-color: #cbd5e1;
}

.profile-private-vehicle-modal .mc-norm-fill-btn .material-symbols-outlined {
    font-size: 1.25rem;
    line-height: 1;
}

.item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.item-header h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    line-height: 1.4;
}

.item-card-logo {
    width: 40px;
    height: 40px;
    object-fit: contain;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

.item-header .company-name {
    display: flex;
    align-items: center;
}

.item-info {
    display: grid;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.item-info-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #6b7280;
}

.item-info-row i,
.item-info-row .item-info-icon {
    color: #10b981;
    width: 16px;
}

.item-info-row .material-symbols-outlined.item-info-icon {
    font-size: 18px;
    flex-shrink: 0;
}

.item-actions-grid {
    display: flex;
    flex-direction: row;
    gap: 0.75rem;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #f3f4f6;
}

.maintenance-companies-container .item-card {
    margin-bottom: 1rem;
}

.maintenance-companies-container .items-grid {
    gap: 1.5rem;
}

/* Empty State */
.empty-state {
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
}

.empty-icon {
    font-size: 4rem;
    color: #9ca3af;
    margin-bottom: 1rem;
    margin-bottom: 1rem;
}

.empty-state h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
}

.empty-state p {
    color: #6b7280;
    font-size: 0.875rem;
    margin-bottom: 2rem;
}

/* =============================================================================
   LISTA NÉZET RÉSZLETEK (main.css-ből kiemelve)
   ============================================================================= */

/* Lista nézet action buttons - specifikus szabályok */
.list-view .action-buttons,
.task-row .action-buttons {
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: max-height 0.3s ease, opacity 0.3s ease, margin 0.3s ease, visibility 0.3s ease;
}

.list-view .action-buttons.collapsed,
.task-row .action-buttons.collapsed {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    margin: 0;
    padding: 0;
}

.list-view .action-buttons:not(.collapsed),
.task-row .action-buttons:not(.collapsed) {
    max-height: 200px;
    overflow: visible;
    opacity: 1;
    margin-top: 8px;
    visibility: visible;
    display: flex;
    flex-direction: column;
}

/* Általános action-buttons (más oldalakhoz) */
.action-buttons {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.task-row-details {
    transition: max-height 0.3s ease, opacity 0.3s ease, margin 0.3s ease, visibility 0.3s ease;
}

.task-row-details.collapsed {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    margin: 0;
    visibility: hidden;
    padding: 0;
}

.task-row-details:not(.collapsed) {
    max-height: 500px;
    overflow: visible;
    opacity: 1;
    margin-top: 8px;
    visibility: visible;
    display: block;
}

.task-row {
    cursor: pointer;
}

.task-row:hover {
    background: #f9fafb;
}

/* =============================================================================
   WORKSHEETS / LISTA NÉZET VÁLTÁS (main.css-ből kiemelve)
   ============================================================================= */

/* Work Sheets Desktop/Mobile View Toggle */
.desktop-table-view {
    display: block;
    background: white;
    border-radius: var(--radius-lg);
    padding: 1rem;
    margin-top: 1rem;
}

.mobile-card-view {
    display: none;
}

/* Lista nézet: desktop táblázat / mobile kártyák */
.list-mobile-view {
    display: none;
}

.list-mobile-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 2rem;
    color: #6b7280;
    font-size: 1rem;
}

.list-task-card .client-content {
    padding: 1rem 0;
}

.list-task-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
    margin-top: 0.5rem;
}

.list-task-card-actions .btn {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

@media (min-width: 769px) {
    .list-mobile-view.clients-grid,
    .list-mobile-view {
        display: none;
    }
}

@media (max-width: 768px) {
    /* Mobilon tömör, blur nélküli page-header – tisztább és gyorsabb */
    .page-header {
        background: #ffffff;
        border: 1px solid var(--gray-200);
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .desktop-table-view,
    .list-desktop-view {
        display: none;
    }

    .mobile-card-view,
    .list-mobile-view.clients-grid,
    .list-mobile-view {
        display: grid;
    }

    .client-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid #e5e7eb;
    }

    .client-header h3 {
        margin: 0;
        font-size: 1.125rem;
        font-weight: 600;
        color: #1f2937;
    }
}



/* ========== notifications.css ========== */

/* Egységes notification rendszer (main.css-ből kiemelve) */

/* =============================================================================
   EGYSÉGES NOTIFICATION RENDSZER
   ============================================================================= */

/* Notification Container */
.notification-container {
    position: fixed;
    top: 2rem;
    right: 2rem;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

/* Notification Base */
.notification {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    border: 1px solid #e5e7eb;
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 350px;
    max-width: 500px;
    pointer-events: auto;
    transform: translateX(100%);
    opacity: 0;
    transition: all 0.3s ease;
}

.notification.show {
    transform: translateX(0);
    opacity: 1;
}

.notification.hide {
    transform: translateX(100%);
    opacity: 0;
}

/* Success Notification */
.notification.success {
    border-left: 4px solid #10b981;
    background: linear-gradient(135deg, #f0fdf4, #ffffff);
}

.notification.success .notification-icon {
    color: #10b981;
    background: #d1fae5;
    border-radius: var(--radius-lg);
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}


.notification.success .notification-content {
    color: #065f46;
}

.notification.success .notification-title {
    color: #047857;
    font-weight: 600;
}

/* Error Notification */
.notification.error {
    border-left: 4px solid #ef4444;
    background: linear-gradient(135deg, #fef2f2, #ffffff);
}

.notification.error .notification-icon {
    color: #ef4444;
    background: #fee2e2;
    border-radius: var(--radius-lg);
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.notification.error .notification-icon .material-symbols-outlined {
    font-size: 1.5rem;
    line-height: 1;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.notification.error .notification-content {
    color: #991b1b;
}

.notification.error .notification-title {
    color: #dc2626;
    font-weight: 600;
}

/* Warning Notification */
.notification.warning {
    border-left: 4px solid #f59e0b;
    background: linear-gradient(135deg, #fffbeb, #ffffff);
}

.notification.warning .notification-icon {
    color: #f59e0b;
    background: #fef3c7;
    border-radius: var(--radius-lg);
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
}

.notification.warning .notification-content {
    color: #92400e;
}

.notification.warning .notification-title {
    color: #d97706;
    font-weight: 600;
}

/* Info Notification */
.notification.info {
    border-left: 4px solid #3b82f6;
    background: linear-gradient(135deg, #eff6ff, #ffffff);
}

.notification.info .notification-icon {
    color: #3b82f6;
    background: #dbeafe;
    border-radius: var(--radius-lg);
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.notification.info .notification-icon .material-symbols-outlined {
    font-size: 1.5rem;
    line-height: 1;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.notification.info .notification-content {
    color: #1e40af;
}

.notification.info .notification-title {
    color: #2563eb;
    font-weight: 600;
}

/* Notification Content */
.notification-content {
    flex: 1;
}

.notification-title {
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.notification-message {
    font-size: 0.875rem;
    line-height: 1.4;
    margin: 0;
}

/* Close Button */
.notification-close {
    background: none;
    border: none;
    color: #6b7280;
    cursor: pointer;
    padding: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
}

.notification-close .material-symbols-outlined {
    font-size: 1.25rem;
    line-height: 1;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    border-radius: var(--radius-lg);
    transition: color 0.2s;
    font-size: 1rem;
    line-height: 1;
}

.notification-close:hover {
    color: #374151;
}

/* Progress Bar */
.notification-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    background: rgba(0, 0, 0, 0.1);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

.notification-progress-bar {
    height: 100%;
    width: 100%;
    transform-origin: left;
    transition: transform linear;
}

.notification.success .notification-progress-bar {
    background: #10b981;
}

.notification.error .notification-progress-bar {
    background: #ef4444;
}

.notification.warning .notification-progress-bar {
    background: #f59e0b;
}

.notification.info .notification-progress-bar {
    background: #3b82f6;
}

/* Legacy Alert Support */
.alert {
    border-radius: var(--radius-lg);
    padding: 1rem 1.5rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.5;
}

.alert-success {
    background: linear-gradient(135deg, #f0fdf4, #ffffff);
    border: 1px solid #10b981;
    border-left: 4px solid #10b981;
    color: #065f46;
}

.alert-error {
    background: linear-gradient(135deg, #fef2f2, #ffffff);
    border: 1px solid #ef4444;
    border-left: 4px solid #ef4444;
    color: #991b1b;
}

.alert-warning {
    background: linear-gradient(135deg, #fffbeb, #ffffff);
    border: 1px solid #f59e0b;
    border-left: 4px solid #f59e0b;
    color: #92400e;
}

.alert-info {
    background: linear-gradient(135deg, #eff6ff, #ffffff);
    border: 1px solid #3b82f6;
    border-left: 4px solid #3b82f6;
    color: #1e40af;
}

/* Responsive */
@media (max-width: 768px) {
    .notification-container {
        top: 1rem;
        right: 1rem;
        left: 1rem;
    }
    
    .notification {
        min-width: auto;
        max-width: none;
    }
    
    .page-title h1 {
        font-size: 1rem; /* Kisebb mobilon */
    }
    
    /* Page icon CSS eltávolítva */
    
    .search-form {
        flex-direction: column;
        align-items: stretch;
    }
    
    .search-input-group {
        flex-direction: column;
    }
    
    .form-row {
        grid-template-columns: 1fr;
    }
    
    .form-actions {
        flex-direction: column;
    }
    
    .items-grid {
        grid-template-columns: 1fr;
    }
    
    .item-actions-grid {
        flex-direction: column;
    }
}



/* ========== maintenance-form.css ========== */

/* Maintenance form stílusok (main.css-ből kiemelve) */

/* =============================================================================
   MAINTENANCE FORM STÍLUSAI
   ============================================================================= */

/* Form validation messages */
#maintenance-form-page .form-error,
#maintenance-form-page .form-warning,
#maintenance-form-page .form-success {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-top: 5px;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    font-weight: 500;
}

#maintenance-form-page .form-error {
    background-color: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

#maintenance-form-page .form-error i {
    color: #dc2626;
    font-size: 1rem;
}

#maintenance-form-page .form-warning {
    background-color: #fffbeb;
    color: #d97706;
    border: 1px solid #fed7aa;
}

#maintenance-form-page .form-warning i {
    color: #d97706;
    font-size: 1rem;
}

#maintenance-form-page .form-success {
    background-color: #f0fdf4;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

#maintenance-form-page .form-success i {
    color: #16a34a;
    font-size: 1rem;
}

/* Maintenance Form Container */
.maintenance-form-container {
    position: relative;
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

/* Betöltés overlay – csak a karbantartási napló modulon */
.maintenance-form-loading {
    position: absolute;
    inset: 0;
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.maintenance-form-loading.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.maintenance-form-loading-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
}

.maintenance-form-loading-spinner {
    width: 44px;
    height: 44px;
    border: 3px solid #e5e7eb;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: maintenance-form-spin 0.7s linear infinite;
}

.maintenance-form-loading p {
    margin: 0;
    font-size: 0.9375rem;
    color: #4b5563;
    font-weight: 500;
}

@keyframes maintenance-form-spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 768px) {
    .maintenance-form-container {
        max-width: 100%;
        padding: 0;
        margin: 0;
    }
}

/* Task Form Container - asztali elrendezés, ugyanolyan széles mint a header */
.task-form-container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    padding: 1.5rem 2rem;
}

.task-form-section {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border: 1px solid #e5e7eb;
    padding: 1.5rem 2rem;
}

@media (max-width: 768px) {
    .task-form-container {
        max-width: 100%;
        padding: 0.5rem;
    }
    
    .task-form-section {
        padding: 1rem 0.75rem;
    }
}

#maintenance-form-page .form-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.75rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#maintenance-form-page .form-icon {
    font-size: 26px;
    color: #3b82f6;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: var(--radius-lg);
    flex-shrink: 0;
    background: rgba(59, 130, 246, 0.12);
}

#maintenance-form-page .form-icon .material-symbols-outlined {
    font-size: 26px;
    line-height: 1;
}

#maintenance-form-page .form-icon--fire {
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.12);
}

#maintenance-form-page .form-icon--door {
    color: #92400e;
    background: rgba(146, 64, 14, 0.12);
}

#maintenance-form-page .form-icon--light {
    color: #c2410c;
    background: rgba(234, 88, 12, 0.12);
}

#maintenance-form-page .form-icon--suppression {
    color: #166534;
    background: rgba(34, 139, 34, 0.15);
}

#maintenance-form-page .form-icon--rwa {
    color: #4b5563;
    background: rgba(107, 114, 128, 0.15);
}

/* Fejléc ikon: ugyanaz a stílus, mint a rendszer-típus kártyákon */
#maintenance-form-page .form-title .system-type-icon {
    width: 48px;
    height: 48px;
    font-size: 24px;
    flex-shrink: 0;
}

#maintenance-form-page .form-title-content h2 {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

#maintenance-form-page .form-title-content p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

#maintenance-form-page .maintenance-form {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

#maintenance-form-page .form-section {
    background: white;
    border-radius: var(--radius-lg);
    padding: 0.65rem 0.75rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

@media (max-width: 768px) {
    #maintenance-form-page .form-section {
        padding: 0.5rem;
    }
}

#maintenance-form-page .section-header {
    padding-bottom: 0.4rem;
    margin-bottom: 0.4rem;
}

#maintenance-form-page .section-header h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

#maintenance-form-page .section-header p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

/* Karbantartás űrlap: szekció fejléc ikon + szöveg (pl. oltórendszer + sprinkler) */
#maintenance-form-page .section-header--with-icon {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding-bottom: 0.4rem;
    margin-bottom: 0.4rem;
}

#maintenance-form-page .section-header-icon {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #fff;
}

#maintenance-form-page .section-header-icon .material-symbols-outlined {
    font-size: 28px;
    line-height: 1;
}

#maintenance-form-page .section-header-icon--suppression {
    background: linear-gradient(145deg, #2e9b4b 0%, #228B22 100%);
}

#maintenance-form-page .section-header-text {
    flex: 1;
    min-width: 0;
}

#maintenance-form-page .section-header-text h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

#maintenance-form-page .section-header-text p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

/* System Type Grid */
#maintenance-form-page .system-type-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 0.5rem;
}

#maintenance-form-page .system-type-card {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.75rem;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all 0.3s ease;
    background: white;
}

/* Hover-effekt csak valódi egérrel – érintőképernyőn a :hover „ragadna”, és az első koppintás csak a hovert hozná be (kétszer kell koppintani) */
@media (hover: hover) and (pointer: fine) {
    #maintenance-form-page .system-type-card:hover {
        border-color: #3b82f6;
        box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);
        transform: translateY(-2px);
    }
}

#maintenance-form-page .system-type-card.selected {
    border-color: #3b82f6;
    background: #eff6ff;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.25);
}

#maintenance-form-page .location-system-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

#maintenance-form-page .location-system-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    width: 100%;
    padding: 0.85rem 1rem;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg, 0.5rem);
    background: #fff;
    text-align: left;
    cursor: pointer;
    font: inherit;
    color: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
    #maintenance-form-page .location-system-card:hover {
        border-color: #3b82f6;
        box-shadow: 0 4px 12px rgba(59, 130, 246, 0.12);
    }
}

#maintenance-form-page .location-system-card.is-selected {
    border-color: #3b82f6;
    background: #eff6ff;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
}

#maintenance-form-page .location-system-card__title {
    font-weight: 600;
    font-size: 1rem;
    color: #111827;
}

#maintenance-form-page .location-system-card__detail {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e3a8a;
    line-height: 1.35;
    word-break: break-word;
}

#maintenance-form-page .location-system-card__meta {
    font-size: 0.8125rem;
    color: #6b7280;
}

#maintenance-form-page .maintenance-no-equipment {
    text-align: center;
    padding: 2.5rem 1.5rem;
    background: #f8f9fa;
    border-radius: 12px;
    border: 2px dashed #dee2e6;
    margin-top: 1.5rem;
}

#maintenance-form-page .maintenance-no-equipment__icon {
    font-size: 2.75rem;
    color: #9ca3af;
    margin-bottom: 0.75rem;
}

#maintenance-form-page .maintenance-no-equipment h3 {
    color: #495057;
    margin: 0 0 0.75rem;
    font-size: 1.35rem;
}

#maintenance-form-page .maintenance-no-equipment p {
    color: #6c757d;
    margin: 0 0 1rem;
    line-height: 1.55;
}

#maintenance-form-page .maintenance-no-equipment .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

@media (min-width: 640px) {
    #maintenance-form-page .location-system-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

#maintenance-form-page .system-type-icon {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    flex-shrink: 0;
}

#maintenance-form-page .system-type-content h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
    line-height: 1.3;
}

#maintenance-form-page .system-type-content p {
    color: #6b7280;
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.35;
}

/* Asztali: azonos méretű rendszer-típus kártyák (3×2 rács) */
@media (min-width: 769px) {
    #maintenance-form-page .system-type-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: stretch;
    }

    #maintenance-form-page .system-type-card {
        height: 100%;
        min-height: 6.25rem;
        align-items: center;
        box-sizing: border-box;
    }

    #maintenance-form-page .system-type-content {
        flex: 1;
        min-width: 0;
    }
}

/* Form Grid Layouts */
#maintenance-form-page .form-grid-1 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    overflow: visible !important;
}

#maintenance-form-page .form-grid-2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 0.5rem;
    overflow: visible !important;
}

#maintenance-form-page .form-grid-input-btn {
    align-items: flex-end;
}

#maintenance-form-page .form-group {
    position: relative;
    z-index: auto;
}

#maintenance-form-page .form-section {
    overflow: visible !important;
}

#maintenance-form-page .maintenance-form .form-group label {
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.25rem;
    font-size: 0.9rem;
}

#maintenance-form-page .maintenance-form .form-group input,
#maintenance-form-page .maintenance-form .form-group select,
#maintenance-form-page .maintenance-form .form-group textarea {
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.9rem;
    transition: border-color 0.2s;
}

#maintenance-form-page .maintenance-form .form-group input:focus,
#maintenance-form-page .maintenance-form .form-group select:focus,
#maintenance-form-page .maintenance-form .form-group textarea:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Maintenance Form Actions */
#maintenance-form-page .maintenance-form .form-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding: 0.65rem 0.75rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Radio Groups */
#maintenance-form-page .maintenance-form .radio-group {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

#maintenance-form-page .maintenance-form .radio-option {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    transition: all 0.2s;
}

#maintenance-form-page .maintenance-form .radio-option:hover {
    background-color: #f9fafb;
    border-color: #3b82f6;
}

#maintenance-form-page .maintenance-form .radio-option input[type="radio"] {
    margin: 0;
    width: 16px;
    height: 16px;
}

#maintenance-form-page .maintenance-form .radio-option input[type="radio"]:checked + span {
    font-weight: 600;
    color: #3b82f6;
}

#maintenance-form-page .maintenance-form .radio-option:has(input[type="radio"]:checked) {
    background-color: #eff6ff;
    border-color: #3b82f6;
}

/* Subsections */
#maintenance-form-page .maintenance-form .subsection {
    margin-bottom: 0.65rem;
    padding: 0.65rem 0.75rem;
    background: #f8f9fa;
    border-radius: var(--radius-lg);
    border-left: 4px solid #dc2626;
}

#maintenance-form-page .maintenance-form .subsection h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 0.4rem 0;
}

/* Maintenance Form Modal */
#maintenance-form-page .maintenance-form .modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

#maintenance-form-page .maintenance-form .modal-content {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    max-width: 800px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
}

#maintenance-form-page .maintenance-form .modal-header {
    background: #506980;
    color: white;
    padding: 20px;
    border-radius: var(--radius-lg);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#maintenance-form-page .maintenance-form .modal-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
}

#maintenance-form-page .maintenance-form .modal-close {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 5px;
    border-radius: var(--radius-lg);
    transition: background 0.2s;
}

#maintenance-form-page .maintenance-form .modal-close:hover {
    background: rgba(255, 255, 255, 0.1);
}

#maintenance-form-page .maintenance-form .modal-body {
    padding: 20px;
}

/* iOS Safari: 16px alatti fókuszálható mezőnél automatikus nagyítás */
@media (max-width: 768px), (hover: none) and (pointer: coarse) {
    #maintenance-form-page .maintenance-form .form-group input,
    #maintenance-form-page .maintenance-form .form-group select,
    #maintenance-form-page .maintenance-form .form-group textarea {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    #maintenance-form-page .maintenance-form .form-actions {
        flex-direction: column-reverse;
        align-items: stretch;
        gap: 0.5rem;
        padding: 0.65rem 0.75rem;
    }
}

/* =============================================================================
   KARBANTARTÁSI NAPLÓ – OLDALSPECIFIKUS KOMPONENSEK
   (korábban pages/maintenance_form.php inline <style> blokk)
   ============================================================================= */

/* Custom Searchable Select – helyszín választó */
#maintenance-form-page .custom-select-wrapper {
    position: relative;
    width: 100%;
    z-index: 1000;
}

#maintenance-form-page .custom-select-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    background: white;
    cursor: pointer;
    transition: all 0.2s ease;
    min-height: 42px;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

#maintenance-form-page .custom-select-trigger:hover {
    border-color: #9ca3af;
}

#maintenance-form-page .custom-select-wrapper.open .custom-select-trigger {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

#maintenance-form-page .custom-select-value {
    flex: 1;
    color: #374151;
    font-size: 0.875rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#maintenance-form-page .custom-select-value:empty::before {
    content: "Válasszon helyszínt...";
    color: #9ca3af;
}

#maintenance-form-page .custom-select-arrow {
    width: 20px;
    height: 20px;
    color: #6b7280;
    transition: transform 0.2s ease;
    flex-shrink: 0;
    margin-left: 0.5rem;
}

#maintenance-form-page .custom-select-wrapper.open .custom-select-arrow {
    transform: rotate(180deg);
}

#maintenance-form-page .custom-select-dropdown,
.custom-select-dropdown.is-portaled {
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    flex-direction: column;
    min-height: 0;
}

#maintenance-form-page .custom-select-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: 4px;
    z-index: 1000;
    display: none;
    max-height: 400px;
}

.custom-select-dropdown.is-portaled {
    position: fixed;
    margin-top: 0;
    z-index: 10060;
    display: flex;
}

#maintenance-form-page .custom-select-wrapper.open .custom-select-dropdown:not(.is-portaled) {
    display: flex;
}

#maintenance-form-page .custom-select-search,
.custom-select-dropdown.is-portaled .custom-select-search {
    position: relative;
    padding: 0.75rem;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

#maintenance-form-page .custom-select-search input,
.custom-select-dropdown.is-portaled .custom-select-search input {
    width: 100%;
    padding: 0.5rem 2rem 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 16px; /* iOS Safari – fókusznál nem nagyít */
    outline: none;
    transition: border-color 0.2s ease;
    box-sizing: border-box;
    -webkit-user-select: text;
    user-select: text;
    pointer-events: auto;
    touch-action: manipulation;
    -webkit-appearance: none;
    appearance: none;
}

#maintenance-form-page .custom-select-search input:focus,
.custom-select-dropdown.is-portaled .custom-select-search input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

#maintenance-form-page .search-icon,
.custom-select-dropdown.is-portaled .search-icon {
    position: absolute;
    right: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    pointer-events: none;
}

#maintenance-form-page .custom-select-options,
.custom-select-dropdown.is-portaled .custom-select-options {
    max-height: 300px;
    overflow-y: auto;
    padding: 0.25rem;
    flex: 1;
    min-height: 0;
}

#maintenance-form-page .custom-select-option,
.custom-select-dropdown.is-portaled .custom-select-option {
    display: flex;
    align-items: center;
    padding: 0.75rem;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: background-color 0.15s ease;
    font-size: 0.875rem;
    color: #374151;
}

#maintenance-form-page .custom-select-option:hover,
.custom-select-dropdown.is-portaled .custom-select-option:hover {
    background-color: #f3f4f6;
}

#maintenance-form-page .custom-select-option.selected,
.custom-select-dropdown.is-portaled .custom-select-option.selected {
    background-color: #eff6ff;
    color: #2563eb;
    font-weight: 500;
}

#maintenance-form-page .custom-select-no-results,
.custom-select-dropdown.is-portaled .custom-select-no-results {
    padding: 0.75rem;
    text-align: center;
    color: #6b7280;
    font-size: 0.875rem;
}

#maintenance-form-page .option-city,
.custom-select-dropdown.is-portaled .option-city {
    color: #6b7280;
    margin-left: 0.25rem;
}

#maintenance-form-page .custom-select-options::-webkit-scrollbar,
.custom-select-dropdown.is-portaled .custom-select-options::-webkit-scrollbar {
    width: 8px;
}

#maintenance-form-page .custom-select-options::-webkit-scrollbar-track,
.custom-select-dropdown.is-portaled .custom-select-options::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

#maintenance-form-page .custom-select-options::-webkit-scrollbar-thumb,
.custom-select-dropdown.is-portaled .custom-select-options::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

#maintenance-form-page .custom-select-options::-webkit-scrollbar-thumb:hover,
.custom-select-dropdown.is-portaled .custom-select-options::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Oltórendszer – elműködés megerősítés overlay */
.maintenance-inhibition-start-overlay {
    position: absolute;
    inset: 0;
    z-index: 50;
    background: rgba(255, 255, 255, 0.92);
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    text-align: center;
    border-radius: 12px;
}

.maintenance-inhibition-start-overlay p {
    margin: 0;
    max-width: 28rem;
    color: #475569;
    line-height: 1.5;
}

#system-specific-content.maintenance-inhibition-blocked {
    position: relative;
}

/* Rendszer típus szekció – összecsukható fejléc */
#maintenance-form-page .system-type-section-header {
    cursor: pointer;
    padding: 0.4rem 0;
    border-bottom: 2px solid #f3f4f6;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#maintenance-form-page .system-type-section-header:hover {
    background: #f9fafb;
}

#maintenance-form-page .system-type-header-content {
    flex: 1;
    min-width: 0;
}

#maintenance-form-page .system-type-header-content h3 {
    margin: 0 0 0.25rem 0;
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    overflow-wrap: break-word;
}

#maintenance-form-page .system-type-header-content .section-subtitle {
    margin: 0;
    font-size: 0.9rem;
    color: #6b7280;
    overflow-wrap: break-word;
}

#system-type-section .section-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    color: #6b7280;
}

#system-type-section .section-toggle:hover {
    color: #1f2937;
}

#system-type-section .section-toggle .toggle-icon {
    font-size: 24px;
}

/* max-height: ne legyen túl alacsony – 5 kártya mobilon egymás alatt >800px */
#system-type-content {
    overflow: hidden;
    transition: max-height 0.35s ease, opacity 0.3s ease;
    max-height: 4200px;
    opacity: 1;
    padding-top: 0.5rem;
}

#system-type-content.collapsed {
    max-height: 0 !important;
    height: 0;
    min-height: 0;
    opacity: 0;
    padding: 0;
    margin: 0;
    overflow: hidden;
    pointer-events: none !important;
    visibility: hidden;
}

#system-type-section.collapsed #system-type-content {
    display: none !important;
}

/* GPS helyszín szűrő */
#maintenance-form-page .facility-location-gps-wrap {
    display: none;
    margin-top: 0.75rem;
}

#maintenance-form-page .facility-location-gps-btn {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    cursor: pointer;
    min-height: 44px;
    border: 1px solid #bfdbfe;
    border-radius: 0.5rem;
    background: linear-gradient(180deg, #f8fafc 0%, #eff6ff 100%);
    color: #1d4ed8;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

#maintenance-form-page .facility-location-gps-btn * {
    pointer-events: none;
}

#maintenance-form-page .facility-location-gps-btn .material-symbols-outlined {
    font-size: 1.25rem;
}

#maintenance-form-page .facility-location-gps-btn:active {
    background: #dbeafe;
    border-color: #93c5fd;
}

#maintenance-form-page .facility-location-gps-btn.is-active {
    background: #eff6ff;
    border-color: #2563eb;
    color: #1e40af;
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.15);
}

#maintenance-form-page .facility-location-gps-btn:disabled {
    opacity: 0.65;
    cursor: wait;
}

#maintenance-form-page .facility-location-gps-hint {
    margin: 0.5rem 0 0;
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: #2563eb;
    background: #f0f9ff;
    border-radius: 0.375rem;
    border: 1px solid #bae6fd;
}

#maintenance-form-page .facility-location-gps-hint.is-warning {
    color: #92400e;
    background: #fffbeb;
    border-color: #fde68a;
}

#maintenance-form-page .facility-location-gps-hint.is-error {
    color: #b91c1c;
    background: #fef2f2;
    border-color: #fecaca;
}

@media (max-width: 768px), (hover: none) and (pointer: coarse) {
    #maintenance-form-page .facility-location-gps-wrap {
        display: block;
    }

    #maintenance-form-page .facility-location-gps-btn {
        display: flex;
    }
}

/* Összecsukható Üzemeltető / Karbantartó szervezet szekciók */
#maintenance-form-page .collapsible-subsection {
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    overflow: hidden;
}

#maintenance-form-page .collapsible-subsection-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: #f9fafb;
    cursor: pointer;
    border-bottom: 1px solid #e5e7eb;
}

#maintenance-form-page .collapsible-subsection-header:hover {
    background: #f3f4f6;
}

#maintenance-form-page .collapsible-subsection.collapsed .collapsible-subsection-header {
    border-bottom: none;
}

#maintenance-form-page .collapsible-subsection-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    flex: 1;
    min-width: 0;
}

#maintenance-form-page .collapsible-subsection-title h4 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
}

#maintenance-form-page .collapsible-subsection-company-name {
    color: #6b7280;
    font-weight: 500;
    font-size: 0.9rem;
    word-break: break-word;
}

#maintenance-form-page .collapsible-subsection .section-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    color: #6b7280;
}

#maintenance-form-page .collapsible-subsection .section-toggle:hover {
    color: #1f2937;
}

#maintenance-form-page .collapsible-subsection-content {
    padding: 1rem;
    overflow: hidden;
    transition: max-height 0.3s ease;
    max-height: 2000px;
}

#maintenance-form-page .collapsible-subsection.collapsed .collapsible-subsection-content {
    max-height: 0;
    padding: 0 1rem;
    overflow: hidden;
}

/* Üzemeltető – csak megjelenítés (nem szerkeszthető input) */
#maintenance-form-page .info-label-readonly {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin-bottom: 0.35rem;
}

#maintenance-form-page .info-value-readonly {
    color: #1f2937;
    padding: 0.5rem 0.75rem;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    min-height: 2.5rem;
    line-height: 1.5;
    word-break: break-word;
}

#maintenance-form-page .operator-info-display-grid {
    gap: 1rem 1.25rem;
}

/* Létesítmény adatai – összecsukva alapból */
#maintenance-form-page .collapsible-facility {
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    overflow: hidden;
}

#maintenance-form-page .collapsible-facility.collapsed .collapsible-facility-content {
    max-height: 0;
    padding: 0 0.5rem;
    overflow: hidden;
}

#maintenance-form-page .collapsible-facility-content {
    padding: 0.5rem;
    overflow: hidden;
    transition: max-height 0.3s ease;
    max-height: 2000px;
}

#maintenance-form-page .collapsible-facility-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.65rem;
    background: #f9fafb;
    cursor: pointer;
    border-bottom: 1px solid #e5e7eb;
}

#maintenance-form-page .collapsible-facility.collapsed .collapsible-facility-header {
    border-bottom: none;
}

#maintenance-form-page .collapsible-facility-header:hover {
    background: #f3f4f6;
}

#maintenance-form-page .collapsible-facility-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    flex: 1;
    min-width: 0;
}

#maintenance-form-page .collapsible-facility-title h3 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1f2937;
}

#maintenance-form-page .collapsible-facility-summary {
    color: #6b7280;
    font-size: 0.9rem;
    font-weight: 500;
    word-break: break-word;
}

#maintenance-form-page .collapsible-facility .section-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    color: #6b7280;
}

#maintenance-form-page .collapsible-facility .section-toggle:hover {
    color: #1f2937;
}

/* Utolsó karbantartás másolása */
#maintenance-form-page .copy-last-maintenance-wrap {
    margin-top: 0.5rem;
    margin-bottom: 0;
    padding: 0.6rem 0.65rem;
    background: linear-gradient(135deg, #eff6ff 0%, #f0fdf4 100%);
    border: 1px solid #bfdbfe;
    border-radius: var(--radius-lg, 0.5rem);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

#maintenance-form-page .copy-last-maintenance-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    justify-content: space-between;
}

#maintenance-form-page .copy-last-maintenance-text {
    font-size: 0.9375rem;
    color: #1e40af;
    font-weight: 500;
    flex: 1;
    min-width: 200px;
}

#maintenance-form-page .copy-last-maintenance-icon {
    font-size: 1.1rem;
    vertical-align: middle;
    margin-right: 0.35rem;
}


/* ========== kiszervezve: pages/maintenance_edit.php ========== */
/* Tűzjelző Form - Új Modern Stílusok */
.fire-detection-form {
    max-width: 1000px;
    margin: 0 auto;
}

.fire-detection-form .form-title {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-detection-form .form-icon {
    font-size: 32px;
    color: #3b82f6;
}

.fire-detection-form .form-title-content h2 {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

.fire-detection-form .form-title-content p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

.fire-detection-form .maintenance-form {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.fire-detection-form .form-section {
    background: white;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-detection-form .section-header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f3f4f6;
}

.fire-detection-form .section-header h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

.fire-detection-form .section-header p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

.fire-detection-form .form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.fire-detection-form .form-group {
    display: flex;
    flex-direction: column;
}

.fire-detection-form .form-group.full-width {
    grid-column: 1 / -1;
}

.fire-detection-form .form-group label {
    font-weight: 500;
    color: #374151;
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.fire-detection-form .form-group input,
.fire-detection-form .form-group select,
.fire-detection-form .form-group textarea {
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.9rem;
    transition: border-color 0.2s;
}

.fire-detection-form .form-group input:focus,
.fire-detection-form .form-group select:focus,
.fire-detection-form .form-group textarea:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.fire-detection-form .subsection {
    margin-top: 25px;
    margin-bottom: 24px;
}

.fire-detection-form .subsection h4 {
    color: #dc2626;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 2px solid #dc2626;
    font-size: 1.1rem;
    font-weight: 600;
}

.fire-detection-form .checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
}

.fire-detection-form .checkbox-item {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 8px;
    border-radius: 6px;
    transition: background-color 0.2s;
}

.fire-detection-form .checkbox-item:hover {
    background: #f9fafb;
}

.fire-detection-form .checkbox-item input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
}

/* State toggle – maintenance_edit (state-ok/error/na + legacy failed/not-relevant) */
.fire-detection-form .state-toggle-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 0.5rem;
    margin-top: 12px;
    margin-bottom: 0.5rem;
}

.fire-detection-form .state-toggle-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
}

.fire-detection-form .state-toggle-item:hover {
    background-color: #f8f9fa;
    border-color: #3b82f6;
}

.fire-detection-form .toggle-label {
    flex: 1;
    font-size: 0.9rem;
    color: #374151;
    font-weight: 500;
    margin-right: 12px;
}

.fire-detection-form .state-button {
    width: 40px;
    height: 40px;
    border: 2px solid #059669;
    border-radius: 50%;
    background: #059669;
    color: white;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 12px;
    flex-shrink: 0;
}

.fire-detection-form .state-button:hover {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(5, 150, 105, 0.3);
}

.fire-detection-form .state-button.state-ok {
    background: #059669;
    border-color: #059669;
}

.fire-detection-form .state-button.state-error,
.fire-detection-form .state-button.failed {
    background: #dc2626;
    border-color: #dc2626;
}

.fire-detection-form .state-button.state-na,
.fire-detection-form .state-button.not-relevant {
    background: #6b7280;
    border-color: #6b7280;
}

.fire-detection-form .document-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
}

.fire-detection-form .doc-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 20px;
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.9rem;
    font-weight: 500;
}

.fire-detection-form .doc-btn:hover {
    background: #f1f5f9;
    border-color: #3b82f6;
    transform: translateY(-1px);
}

.fire-detection-form .doc-btn-icon {
    font-size: 24px;
}

.fire-detection-form .regulation-info {
    display: flex;
    gap: 12px;
    padding: 15px;
    background: #dbeafe;
    border-radius: 8px;
    border-left: 4px solid #3b82f6;
}

.fire-detection-form .regulation-icon {
    font-size: 20px;
    color: #3b82f6;
}

.fire-detection-form .regulation-content {
    flex: 1;
}

.fire-detection-form .regulation-content p {
    margin: 0 0 8px 0;
    font-size: 0.9rem;
    color: #1e40af;
}

.fire-detection-form .regulation-content p:last-child {
    margin-bottom: 0;
}

.fire-detection-form .regulation-cycle {
    font-weight: 500;
}

.fire-detection-form .form-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-detection-form .btn-secondary,
.fire-detection-form .btn-primary {
    padding: 12px 24px;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
    font-size: 0.9rem;
}

.fire-detection-form .btn-secondary {
    background: #f3f4f6;
    color: #374151;
}

.fire-detection-form .btn-secondary:hover {
    background: #e5e7eb;
}

.fire-detection-form .btn-primary {
    background: var(--menu-primary);
    color: white;
}

.fire-detection-form .btn-primary:hover {
    background: var(--menu-primary-hover);
}

/* Responsive */
@media (max-width: 768px) {
    .fire-detection-form .form-grid {
        grid-template-columns: 1fr;
    }
    
    .fire-detection-form .checkbox-grid {
        grid-template-columns: 1fr;
    }
    
    .fire-detection-form .document-buttons {
        grid-template-columns: 1fr;
    }
    
    .fire-detection-form .form-actions {
        flex-direction: column;
    }
}

/* Módosított mezők vizuális megjelenítése */
.fire-detection-form .field-modified {
    border-left: 4px solid #f59e0b !important;
    background-color: #fffbeb !important;
}

.fire-detection-form .field-modified:focus {
    border-color: #f59e0b !important;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.1) !important;
}

/* Alert stílusok */
.fire-detection-form .alert {
    padding: 0.6rem 0.65rem;
    margin-bottom: 0.5rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
}

.fire-detection-form .alert-info {
    background-color: #dbeafe;
    border-color: #93c5fd;
    color: #1e40af;
}

.fire-detection-form .alert-warning {
    background-color: #fef3c7;
    border-color: #fcd34d;
    color: #92400e;
}

/* Single column grid */
#maintenance-form-page .form-grid-1 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.fire-detection-form .form-grid-1 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

/* Form grid adjustments */
#maintenance-form-page .form-grid-2 {
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.fire-detection-form .form-grid-2 {
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

/* Form group spacing */
#maintenance-form-page .form-group {
    margin-bottom: 0.5rem;
}

/* Form actions override - gombok jobbra igazítva, de elrejthetők */
#maintenance-form-page .form-actions {
    justify-content: flex-end !important;
    gap: 0.5rem !important;
    padding: 0.65rem 0.75rem !important;
    background: white !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    margin-top: 0 !important;
}

#maintenance-form-page .form-actions:not([style*="display: none"]) {
    display: flex !important;
}

/* Custom Popup Styles */
/* Custom popup – maintenance_edit (#custom-popup a body gyökerébe kerül) */
#custom-popup.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
    animation: fadeIn 0.3s ease-out;
}

#custom-popup .popup-container {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    max-width: 400px;
    width: 90%;
    animation: slideIn 0.3s ease-out;
}

#custom-popup .popup-header {
    padding: 20px 24px 0 24px;
    text-align: center;
}

#custom-popup .popup-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1f2937;
}

#custom-popup .popup-content {
    padding: 16px 24px;
    text-align: center;
}

#custom-popup .popup-content p {
    margin: 0;
    color: #6b7280;
    line-height: 1.5;
}

#custom-popup .popup-footer {
    padding: 16px 24px 24px 24px;
    text-align: center;
}

#custom-popup .popup-btn {
    padding: 10px 24px;
    border: none;
    border-radius: 8px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.9rem;
}

#custom-popup .popup-btn-primary {
    background: #3b82f6;
    color: white;
}

#custom-popup .popup-btn-primary:hover {
    background: #2563eb;
    transform: translateY(-1px);
}

#custom-popup .popup-btn-primary:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3);
}

/* Success popup */
#custom-popup .popup-container.popup-success .popup-header h3 {
    color: #059669;
}

#custom-popup .popup-container.popup-success {
    border-left: 4px solid #10b981;
}

/* Error popup */
#custom-popup .popup-container.popup-error .popup-header h3 {
    color: #dc2626;
}

#custom-popup .popup-container.popup-error {
    border-left: 4px solid #ef4444;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideIn {
    from { 
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    to { 
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Kompakt térköz – karbantartási napló űrlap */
#maintenance-form-page .form-header {
    margin-bottom: 0;
}

@media (min-width: 769px) {
    #maintenance-form-page .form-title {
        margin-bottom: 10px;
    }
}

#maintenance-form-page .maintenance-form {
    gap: 0.25rem;
}

#maintenance-form-page .form-section {
    padding: 0.5rem 0.65rem;
    margin-bottom: 0;
    border: none;
}

#maintenance-form-page .section-header {
    margin-bottom: 0.4rem;
    padding-bottom: 0.4rem;
}

#maintenance-form-page .form-group {
    margin-bottom: 0.4rem;
}

#maintenance-form-page .operator-info-display-grid {
    gap: 0.5rem 0.65rem;
}

@media (max-width: 768px) {
    main #maintenance-form-page.maintenance-form-container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
        overflow-x: hidden;
    }

    #maintenance-form-page .maintenance-form {
        gap: 0;
        min-width: 0;
    }

    #maintenance-form-page .form-section {
        padding: 0.5rem 0.65rem;
        min-width: 0;
        overflow: hidden;
    }

    #maintenance-form-page .system-type-section-header {
        padding: 0.4rem 0.1rem;
        gap: 0.35rem;
    }

    #maintenance-form-page #system-type-section .section-toggle {
        flex-shrink: 0;
        padding: 0.35rem;
    }

    #maintenance-form-page #system-type-section.collapsed {
        padding-bottom: 0.35rem;
    }

    #maintenance-form-page .form-group,
    #maintenance-form-page .maintenance-form .form-group {
        margin-bottom: 0.4rem !important;
    }

    #maintenance-form-page .form-grid,
    #maintenance-form-page .form-grid-2,
    #maintenance-form-page .form-grid-1 {
        gap: 0.5rem;
        margin-bottom: 0.25rem;
    }
}

/* Karbantartási űrlap – alsó műveletgombok 95% szélesség, középre */
#maintenance-form-page #form-actions.form-actions {
    flex-direction: column-reverse !important;
    align-items: center !important;
    justify-content: center !important;
}

#maintenance-form-page #form-actions > .btn-secondary,
#maintenance-form-page #form-actions-default,
#maintenance-form-page #form-actions-fire-door,
#maintenance-form-page #form-actions-emergency-lighting {
    width: 95% !important;
    max-width: 95%;
    box-sizing: border-box;
}

#maintenance-form-page #form-actions-default .btn-primary,
#maintenance-form-page #form-actions-fire-door .btn-primary,
#maintenance-form-page #form-actions-emergency-lighting .btn-primary {
    width: 100% !important;
    max-width: 100%;
    justify-content: center;
}

#maintenance-form-page #form-actions > .btn-secondary {
    justify-content: center;
}

#maintenance-form-page #form-actions-fire-door,
#maintenance-form-page #form-actions-emergency-lighting {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
}


/* ========== equipment-modal.css ========== */

/* Eszközkezelés modal stílusok (main.css-ből kiemelve) */

/* =============================================================================
   ESZKÖZKEZELÉS MODAL STÍLUSOK
   ============================================================================= */
.equipment-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.equipment-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(2px);
}

.equipment-modal-content {
    position: relative;
    background: white;
    border-radius: var(--radius-lg);
    max-width: 800px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    z-index: 10001;
}

.equipment-modal-header {
    background: #506980;
    color: white;
    padding: 20px 24px;
    border-radius: var(--radius-lg);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.equipment-modal-header h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.equipment-modal-close {
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 5px;
    border-radius: var(--radius-lg);
    transition: background 0.2s;
    line-height: 1;
}

.equipment-modal-close:hover {
    background: rgba(255, 255, 255, 0.1);
}

.equipment-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

/* Eszköz lista grid */
.equipment-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.5rem;
}

.equipment-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
}

.equipment-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.equipment-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.equipment-card-header h4 {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
}

.equipment-badge {
    padding: 0.25rem 0.75rem;
    border-radius: var(--radius-lg);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.equipment-badge.fire_alarm {
    background: #fef2f2;
    color: #dc2626;
}

.equipment-badge.fire_smoke_barrier {
    background: #fff7ed;
    color: #ea580c;
}

.equipment-badge.emergency_lighting {
    background: #fefce8;
    color: #ca8a04;
}

.equipment-badge.gas_detection {
    background: #f0f9ff;
    color: #0284c7;
}

.equipment-badge.smoke_heat_exhaust {
    background: #f5f3ff;
    color: #7c3aed;
}

.equipment-badge.system-index {
    background: #e5e7eb;
    color: #374151;
}

.equipment-count-badge {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    background: #059669;
    color: white;
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: var(--radius-lg);
    margin-right: 0.25rem;
}
.equipment-group-sample {
    font-size: 0.8rem;
    color: #6b7280;
}

/* Eszköz kártya – fejléc: cím + badge-ek, gyártó csak a részletekben */
.equipment-card-head {
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: flex-start;
}

.equipment-card-title-block {
    flex: 1;
    min-width: 12rem;
}

.equipment-card-title-block h3 {
    margin: 0;
    line-height: 1.3;
}

.equipment-card-badges {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
    justify-content: flex-start;
}

/* Eszköz felvitel fejléc: cím balra, vissza jobbra */
.equipment-add-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    cursor: default;
    background: transparent;
    border-bottom: 1px solid var(--gray-200, #e5e7eb);
}

.equipment-add-card-header h3 {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}

.equipment-add-card-header .auvi-back-btn {
    margin-left: auto;
    flex-shrink: 0;
}

/* Kompakt eszközkártya – hasonló a rendszerkártyához */
#equipment-list .client-card.equipment-card-grouped,
.equipment-add-existing-list .client-card.equipment-card-grouped {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 1rem;
    border: 1px solid #dbe4f0;
    border-left: 1px solid #dbe4f0;
    border-radius: 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
    overflow: visible;
}

#equipment-list .client-card.equipment-card-grouped:hover,
.equipment-add-existing-list .client-card.equipment-card-grouped:hover {
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.1);
    border-color: #93c5fd;
}

.equipment-add-existing-list .client-card.equipment-card-grouped {
    cursor: pointer;
}

.equipment-add-existing-list .client-card.equipment-card-grouped.is-selected {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.28), 0 14px 34px rgba(15, 23, 42, 0.1);
    background: linear-gradient(180deg, #eff6ff 0%, #f8fafc 100%);
}

.equipment-card-compact-headrow {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
}

.equipment-card-compact-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin: 0.15rem 0 0;
    cursor: pointer;
}

.equipment-card-compact-check input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0;
    cursor: pointer;
}

.equipment-card-compact-title {
    flex: 1;
    min-width: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
}

.equipment-card-compact-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    flex-shrink: 0;
}

.equipment-card-compact-actions .task-action-btn {
    width: 1.75rem;
    height: 1.75rem;
    min-width: 1.75rem;
    min-height: 1.75rem;
    padding: 0;
}

.equipment-card-compact-actions .task-action-btn .material-symbols-outlined {
    font-size: 1rem;
}

.equipment-card-compact-subtitle {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2563eb;
}

.equipment-card-compact-meta {
    font-size: 0.875rem;
    color: #475569;
    line-height: 1.35;
    word-break: break-word;
}

.equipment-card-compact-sample {
    font-size: 0.8rem;
    color: #64748b;
}

.equipment-card-compact-types {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.equipment-card-compact-system {
    width: 100%;
    margin-top: 0.15rem;
}

.equipment-card-compact-system .system-index-select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0.4rem 0.65rem;
    font-size: 0.875rem;
    border-radius: 0.5rem;
    border: 1px solid #d1d5db;
    background: #fff;
}

.equipment-card-content-block {
    padding-top: 0.25rem;
}

.equipment-detail-grid {
    display: grid;
    grid-template-columns: minmax(5rem, auto) 1fr;
    gap: 0.5rem 1rem;
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
    line-height: 1.45;
}

.equipment-detail-grid dt {
    margin: 0;
    color: #6b7280;
    font-weight: 600;
}

.equipment-detail-grid dd {
    margin: 0;
    color: #111827;
    word-break: break-word;
}

.equipment-detail-system-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.25rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f3f4f6;
}

.equipment-detail-system-row label {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #6b7280;
}

/* Kereshető helyszín dropdown - ugyanolyan kinézet mint a többi select */
.equipment-search-group {
    align-items: stretch;
}

.equipment-search-group > select.search-input,
.equipment-search-group .searchable-select-wrap .searchable-select-trigger.search-input {
    height: 2.75rem;
    min-height: 2.75rem;
    box-sizing: border-box;
}

.search-group .searchable-select-wrap {
    position: relative;
    flex: 1;
    min-width: 0;
}

.equipment-search-group .searchable-select-wrap {
    display: flex;
}

.equipment-search-group .searchable-select-wrap .searchable-select-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex: 1;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}

.searchable-select-value {
    flex: 1;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.searchable-select-value.searchable-select-placeholder {
    color: #9ca3af;
}

/* Közös lefelé mutató nyíl mindhárom szűrőmezőhöz */
.equipment-search-group select.search-input {
    appearance: none;
    -webkit-appearance: none;
    background-color: #f9fafb;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-size: 1.25rem;
    padding-right: 2rem;
}

.equipment-search-group select.search-input:focus {
    background-color: white;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
}


.searchable-select-arrow {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    margin-left: 0.25rem;
    margin-right: -0.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.searchable-select-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 2px;
    background: white;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    z-index: 10000;
    max-height: 280px;
    overflow: hidden;
}

.searchable-select-dropdown.open {
    display: block;
}

/* Mobilon fixed pozíció – ne vágja le a search-form overflow */
@media (max-width: 768px) {
    .searchable-select-wrap {
        width: 100%;
        min-width: 0;
    }
    .equipment-search-group .searchable-select-dropdown.open,
    .task-form-client-select .searchable-select-dropdown.open,
    .form-group .searchable-select-dropdown.open {
        position: fixed;
        z-index: 10000;
    }
}

/* Form-group kereshető dropdown (equipment_add Helyszín) */
.form-group .searchable-select-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.form-group .searchable-select-trigger.form-select {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    cursor: pointer;
    text-align: left;
    appearance: none;
    box-sizing: border-box;
}
.form-group .searchable-select-trigger.form-select .searchable-select-value {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#equipment-location-select-wrap {
    overflow: hidden;
}
.form-grid-2 > .form-group,
.form-grid-1 > .form-group {
    min-width: 0;
}

/* Task form – kereshető ügyfél dropdown: form-select kinézet */
.task-form-client-select {
    position: relative;
}
.task-form-client-select .searchable-select-trigger.form-select {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
    text-align: left;
    appearance: none;
}

.searchable-select-search {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: none;
    border-bottom: 1px solid #e5e7eb;
    font-size: 16px; /* iOS Safari – ne zoomoljon fókuszkor */
    box-sizing: border-box;
    -webkit-user-select: text;
    user-select: text;
    pointer-events: auto;
    touch-action: manipulation;
    -webkit-appearance: none;
    appearance: none;
}

.searchable-select-wrap .searchable-select-search:focus,
.form-group .searchable-select-wrap .searchable-select-search:focus,
.task-form-client-select .searchable-select-wrap .searchable-select-search:focus {
    outline: none;
    border-color: #e5e7eb;
    box-shadow: none;
    transform: none;
}

.searchable-select-options {
    max-height: 220px;
    overflow-y: auto;
}

.searchable-select-option {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
}

.searchable-select-option:hover {
    background: #eff6ff;
}

.searchable-select-option[data-value=""] {
    color: #9ca3af;
}

/* Helyszín választó – jelölés ahol van eszköz */
.searchable-select-option .location-option-indicator {
    display: inline-block;
    width: 1em;
    margin-right: 0.35rem;
    font-size: 0.75em;
    vertical-align: middle;
}
.searchable-select-option.has-equipment .location-option-indicator {
    color: #059669;
}
.searchable-select-option:not(.has-equipment) .location-option-indicator {
    color: transparent;
}
.searchable-select-option .location-equipment-count {
    margin-left: 0.25rem;
    color: #6b7280;
    font-size: 0.85em;
}

.searchable-select-no-results {
    padding: 1rem 0.75rem;
    color: #6b7280;
    font-size: 0.875rem;
    text-align: center;
}

.equipment-bulk-bar {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: var(--radius-lg).5rem;
}

.equipment-section-block + .equipment-section-block {
    margin-top: 1.5rem;
}

.equipment-section-title {
    margin: 0 0 0.75rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.equipment-system-overview {
    margin-bottom: 0;
}

.equipment-system-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.875rem;
}

.equipment-system-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
    padding: 1rem;
    border: 1px solid #dbe4f0;
    border-radius: 1rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
    font-family: inherit;
    color: inherit;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.equipment-system-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.1);
    border-color: #93c5fd;
}

.equipment-system-card.is-active {
    border-color: #2563eb;
    box-shadow: 0 16px 38px rgba(37, 99, 235, 0.18);
    background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
}

.equipment-system-card.is-empty {
    opacity: 0.75;
}

.equipment-system-card-headrow {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
}

.equipment-system-card-title-wrap {
    display: flex;
    align-items: flex-start;
    gap: 0.35rem;
    min-width: 0;
    flex: 1;
}

.equipment-system-card-headrow .equipment-system-card-title {
    flex: 1;
    min-width: 0;
}

.equipment-system-card-rename {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    margin-top: 0.1rem;
    padding: 0;
    border-radius: 0.4rem;
    color: #64748b;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid #e2e8f0;
    flex-shrink: 0;
    cursor: pointer;
    font-family: inherit;
}

.equipment-system-card-rename:hover {
    color: #2563eb;
    border-color: #93c5fd;
    background: #eff6ff;
}

.equipment-system-card-rename .material-symbols-outlined {
    font-size: 0.95rem;
    line-height: 1;
}

.equipment-system-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
}

.equipment-system-card-subtitle {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2563eb;
}

.equipment-system-card-count,
.equipment-system-card-groups {
    font-size: 0.875rem;
    color: #475569;
}

.equipment-system-card-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    margin-top: auto;
}

.equipment-system-card-types {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    min-width: 0;
}

.equipment-system-card-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
    margin-left: auto;
}

.equipment-system-card-actions .task-action-btn {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    min-height: 2.75rem;
}

.equipment-system-card-actions .task-action-btn.task-action-edit::before {
    font-size: 1.5rem;
}

.equipment-system-card-actions .task-action-btn.equipment-system-card-add::before {
    content: "add";
    font-size: 1.5rem;
}

/* Desktop: sorok "láthatatlanok", minden egy sorban */
.equipment-bulk-bar .bulk-bar-row {
    display: contents;
}

.equipment-bulk-bar .bulk-bar-buttons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.equipment-bulk-bar .btn-sm {
    padding: 0.35rem 0.75rem;
    font-size: 0.875rem;
}

/* Mobil: tömeges művelet sáv - egymás alatti sorok */
@media (max-width: 768px) {
    .equipment-system-cards {
        grid-template-columns: 1fr;
    }

    .equipment-system-card {
        padding: 0.875rem;
    }

    .equipment-bulk-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        padding: 1rem;
    }
    
    .equipment-bulk-bar .bulk-bar-row {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }
    
    .equipment-bulk-bar .bulk-bar-info {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    
    .equipment-bulk-bar .bulk-bar-actions {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .equipment-bulk-bar .system-index-select {
        width: 100%;
        max-width: 100%;
        padding: 0.5rem 0.75rem;
        font-size: 16px;
    }
    
    .equipment-bulk-bar .bulk-bar-buttons {
        flex-direction: row;
        gap: 0.5rem;
    }
    
    .equipment-bulk-bar .bulk-bar-buttons .btn-sm {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0.5rem 0.75rem;
    }
}

.equipment-card-selectable {
    position: relative;
    padding-left: 2.5rem;
}

.equipment-card-checkbox {
    position: absolute;
    left: 0.75rem;
    top: 0.75rem;
}

.equipment-card-checkbox-spacer {
    display: block;
    height: 1.5rem;
}

.equipment-card-checkbox input[type="checkbox"] {
    width: 1.25rem;
    height: 1.25rem;
    cursor: pointer;
}

.bulk-select-all {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 500;
}

.system-assign-row {
    margin-top: 0.5rem;
}

.system-assign-row label {
    margin-right: 0.5rem;
}

.system-index-select {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 6px;
}

.equipment-card-body {
    margin-bottom: 1rem;
}

.equipment-card-body p {
    margin: 0.5rem 0;
    font-size: 0.875rem;
    color: #6b7280;
}

.equipment-card-body strong {
    color: #374151;
    font-weight: 600;
}

.equipment-card-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-end;
}



/* ========== task-action-buttons.css ========== */

/* Task action buttons stílusok (main.css-ből kiemelve) */

/* =============================================================================
   TASK ACTION BUTTONS - Equipment oldalhoz is használható
   ============================================================================= */

/* Task Actions - Modern, egységes gombok */
.task-actions-list {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
}

.task-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    /* 36×36 mellett a 20px padding miatt a belső méret 0/negatív lett → a ::before ikon nem látszott */
    padding: 0;
    flex-shrink: 0;
    border-radius: var(--radius-lg);
    text-decoration: none;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 16px;
    box-sizing: border-box;
}

.client-actions-grid,
.client-view-actions-grid {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0;
}

.client-form-hidden,
.client-view-delete-form.client-form-hidden,
.client-delete-form.client-form-hidden {
    display: none;
    margin: 0;
    padding: 0;
}

.task-action-btn i {
    line-height: 1;
}

.task-action-btn .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.task-action-copy {
    background: #f0f9ff;
    color: #0284c7;
    border-color: #bae6fd;
}

.task-action-copy:hover {
    background: #e0f2fe;
    border-color: #7dd3fc;
    color: #0369a1;
}

/* Calendar Drag & Drop Styles */
#new-task-btn[draggable="true"] {
    cursor: grab;
    position: relative;
}

#new-task-btn[draggable="true"]:hover {
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
    transform: translateY(-2px);
    transition: all 0.2s;
}

#new-task-btn[draggable="true"]:active {
    cursor: grabbing;
}

#new-task-btn[draggable="true"]::after {
    content: '⋮⋮';
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    opacity: 0.5;
    letter-spacing: -2px;
}

/* Mobilon nincs drag & drop – rejtjük el a jelzőt */
@media (max-width: 768px) {
    #new-task-btn[draggable="true"]::after {
        display: none;
    }
}

.calendar-day.drag-over,
.hour-cell.drag-over,
.week-next-week-drop.drag-over {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 2px dashed #3b82f6;
    box-shadow: inset 0 0 0 2px #3b82f6, 0 4px 12px rgba(59, 130, 246, 0.3);
    transform: scale(1.02);
    transition: all 0.15s;
    position: relative;
    z-index: 10;
}

.time-task.dragging,
.calendar-task.dragging {
    opacity: 0.5;
    transform: rotate(2deg);
}

.no-data {
    grid-column: 1 / -1;
    text-align: center;
    padding: 3rem;
    color: #6b7280;
    font-size: 1rem;
}

/* Maintenance Form Responsive */
@media (max-width: 768px) {
    .system-type-grid {
        grid-template-columns: 1fr;
    }
    
    .form-grid-2,
    .form-grid,
    .form-grid-1 {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .maintenance-form .form-actions {
        flex-direction: column;
    }
    
    .system-type-card {
        flex-direction: column;
        text-align: center;
    }
    
    .system-type-card .system-type-icon {
        width: 80px;
        height: 80px;
        font-size: 32px;
    }
    
    .maintenance-form .radio-group {
        flex-direction: column;
        gap: 10px;
    }
}

/* Locations Form */
.location-form-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    margin-bottom: 2rem;
    overflow: hidden;
}

.location-form {
    display: grid;
    gap: 1.5rem;
}



/* ========== task-actions.css ========== */

/* Task action gombok stílusai (main.css-ből kiemelve) */

.task-action-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.task-action-btn:active {
    transform: translateY(0);
    box-shadow: none;
}

.task-action-edit {
    color: #3b82f6;
    background: #eff6ff;
    border-color: #dbeafe;
}

.task-action-edit:hover {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #2563eb;
}

/* Megtekintés (szem ikon) – ne legyen task-action-edit, mert az felülírja a visibility ikont */
.task-action-view {
    color: #3b82f6;
    background: #eff6ff;
    border-color: #dbeafe;
}

.task-action-view:hover {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #2563eb;
}

.task-action-back {
    color: var(--menu-primary, #DC2626);
    background: var(--menu-primary-bg, #fef2f2);
    border-color: #fecaca;
}

.task-action-back:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: var(--menu-primary-hover, #b91c1c);
}

.task-action-unarchive {
    color: #059669;
    background: #ecfdf5;
    border-color: #a7f3d0;
}

.task-action-unarchive:hover {
    background: #d1fae5;
    border-color: #6ee7b7;
    color: #047857;
}

.task-action-email {
    color: #dc2626;
    background: #fef2f2;
    border-color: #fecaca;
}

.task-action-email:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #b91c1c;
}

.task-action-email-sent {
    color: #d97706;
    background: #fffbeb;
    border-color: #fde68a;
}

.task-action-email-sent:hover {
    background: #fef3c7;
    border-color: #fcd34d;
    color: #b45309;
}

.task-action-email-signed {
    color: #059669;
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.task-action-email-signed:hover {
    background: #dcfce7;
    border-color: #86efac;
    color: #047857;
}

.task-action-sign {
    color: #059669;
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.task-action-sign:hover {
    background: #dcfce7;
    border-color: #86efac;
    color: #047857;
}

/* Inaktív gombok (már aláírva) */
.task-action-disabled,
.task-action-disabled:hover,
.task-action-disabled:focus {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Email újraküldés gomb */
.task-action-resend {
    color: #2563eb;
    background: #eff6ff;
    border-color: #dbeafe;
}

.task-action-resend:hover {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #1d4ed8;
}

.task-action-delete {
    color: #ef4444;
    background: #fef2f2;
    border-color: #fecaca;
}

.task-action-delete:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
}

/* Számlasztoró: csak Line Awesome la-ban (tiltás), nincs Material ::before */
.task-action-void {
    color: #ef4444;
    background: #fef2f2;
    border-color: #fecaca;
}

.task-action-void:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
}

.task-action-btn.task-action-void::before {
    display: none !important;
    content: none !important;
}

.task-action-btn.task-action-void i.la-ban {
    display: inline-block;
    font-size: 1.25rem;
}

/* Deaktiválás gomb - narancs, toggle_off ikon (nem kuka!) */
.task-action-toggle {
    color: #d97706;
    background: #fffbeb;
    border-color: #fde68a;
}

.task-action-toggle:hover {
    background: #fef3c7;
    border-color: #fcd34d;
    color: #b45309;
}

/* Aktiválás gomb - zöld, toggle_on ikon */
.task-action-toggle-on {
    color: #059669;
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.task-action-toggle-on:hover {
    background: #dcfce7;
    border-color: #86efac;
    color: #047857;
}

.task-action-btn i {
    line-height: 1;
}

/* Task action gombok Material Symbols ikonok */
.task-action-btn:has(i.la-eye)::before,
.task-action-btn[title="Megtekintés"]::before {
    font-family: 'Material Symbols Outlined';
    content: "visibility";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn.task-action-back::before,
.task-action-btn:has(i.la-arrow-left)::before {
    font-family: 'Material Symbols Outlined';
    content: "arrow_back";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn.task-action-edit::before,
.task-action-btn:has(i.la-edit)::before {
    font-family: 'Material Symbols Outlined';
    content: "edit";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn.task-action-view::before,
.task-action-btn:has(i.la-eye):not(.task-action-edit)::before {
    font-family: 'Material Symbols Outlined';
    content: "visibility";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Levél/Email ikon - Material Symbols */
.task-action-btn.task-action-email::before,
.task-action-btn:has(i.la-envelope)::before {
    font-family: 'Material Symbols Outlined';
    content: "mail";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Email elküldve ikon - Material Symbols */
.task-action-btn.task-action-email-sent::before,
.task-action-btn:has(i.la-envelope-open)::before {
    font-family: 'Material Symbols Outlined';
    content: "mark_email_read";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Email aláírva ikon - Material Symbols */
.task-action-btn.task-action-email-signed::before,
.task-action-btn:has(i.la-check-circle)::before {
    font-family: 'Material Symbols Outlined';
    content: "verified";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Email újraküldés ikon - Material Symbols */
.task-action-btn.task-action-resend::before,
.task-action-btn:has(i.la-paper-plane)::before {
    font-family: 'Material Symbols Outlined';
    content: "send";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Aláírás ikon - Material Symbols */
.task-action-btn.task-action-sign::before,
.task-action-btn:has(i.la-signature)::before {
    font-family: 'Material Symbols Outlined';
    content: "draw";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Másolás ikon - Material Symbols */
.task-action-btn.task-action-copy::before {
    font-family: 'Material Symbols Outlined';
    content: "content_copy";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Deaktiválás - toggle_off ikon */
.task-action-btn.task-action-toggle::before {
    font-family: 'Material Symbols Outlined';
    content: "toggle_off";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Aktiválás - toggle_on ikon */
.task-action-btn.task-action-toggle-on::before {
    font-family: 'Material Symbols Outlined';
    content: "toggle_on";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn.task-action-unarchive::before,
.task-action-btn:has(i.la-undo)::before {
    font-family: 'Material Symbols Outlined';
    content: "undo";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn.task-action-delete::before,
.task-action-btn:has(i.la-trash)::before {
    font-family: 'Material Symbols Outlined';
    content: "delete";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn:has(i.la-print)::before,
.task-action-btn[title="Nyomtatható verzió"]::before {
    font-family: 'Material Symbols Outlined';
    content: "print";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-action-btn:has(i.la-file-pdf)::before {
    font-family: 'Material Symbols Outlined';
    content: "picture_as_pdf";
    display: inline-block;
    font-size: 20px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.task-modal-btn-delete::before,
.task-btn-delete::before,
.task-btn.task-btn-delete::before {
    font-family: 'Material Symbols Outlined';
    content: "delete";
    display: inline-block;
    font-size: 16px;
    line-height: 1;
    font-weight: normal;
    font-style: normal;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Elrejtjük a Line Awesome ikonokat (Material Symbols ::before a gombokon – main.pre-rebuild.backup.css) */
.task-action-btn i.la-eye,
.task-action-btn i.la-edit,
.task-action-btn i.la-undo,
.task-action-btn i.la-envelope,
.task-action-btn i.la-envelope-open,
.task-action-btn i.la-check-circle,
.task-action-btn i.la-signature,
.task-action-btn i.la-paper-plane,
.task-action-btn i.la-print,
.task-action-btn i.la-file-pdf,
.task-action-btn i.la-ban,
.task-action-btn i.la-trash,
.task-modal-btn-delete i.la-trash,
.task-btn-delete i.la-trash {
    display: none;
}

/* Material Symbols ikonok elrejtése task-action-btn-ekben, mert ::before pseudo-element használjuk */
.task-action-btn .material-symbols-outlined {
    display: none;
}



/* ========== certificates.css ========== */

/* Certificates oldal stílusok (main.css-ből kiemelve) */

/* =============================================================================
   CERTIFICATES OLDAL STÍLUSAI
   ============================================================================= */

/* Certificates Status Badges */
.certificates-container .status-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: var(--radius-lg);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.certificates-container .status-valid {
    background: #d1fae5;
    color: #065f46;
}

.certificates-container .status-info {
    background: #dbeafe;
    color: #1e40af;
}

.certificates-container .status-warning {
    background: #fef3c7;
    color: #92400e;
}

.certificates-container .status-expired {
    background: #fef2f2;
    color: #991b1b;
}

.certificates-container .cert-number {
    background: #f3f4f6;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-lg);
    font-family: monospace;
    font-size: 0.875rem;
}



/* ========== systems.css ========== */

/* Systems oldal stílusok (main.css-ből kiemelve) */

/* =============================================================================
   SYSTEMS OLDAL STÍLUSAI
   ============================================================================= */

/* Systems Section */
.systems-section {
    padding: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

.systems-header {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 2rem;
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.systems-title h1 {
    font-size: 2rem;
    font-weight: 800;
    color: #111827;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.systems-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

/* Systems Filters */
.systems-filters {
    background: white;
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
}

.systems-container .filter-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr auto;
    gap: 1rem;
    align-items: end;
}

.systems-container .filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.systems-container .filter-group label {
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
}

.systems-container .filter-input {
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: border-color 0.2s;
}

.systems-container .filter-input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgb(59 130 246 / 0.1);
}

/* Systems Form */
.system-form-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    margin-bottom: 2rem;
    overflow: hidden;
}

.systems-container .system-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
}

/* Systems Autocomplete */
.systems-container .autocomplete-container {
    position: relative;
}

.systems-container .autocomplete-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #d1d5db;
    border-top: none;
    border-radius: var(--radius-lg);
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
    display: none;
}

.systems-container .autocomplete-item {
    padding: 0.75rem;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
    transition: background-color 0.2s;
}

.systems-container .autocomplete-item:hover,
.systems-container .autocomplete-item.selected {
    background-color: #f3f4f6;
}

.systems-container .autocomplete-item:last-child {
    border-bottom: none;
}

/* Systems Grid */
.systems-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 1.5rem;
}

.system-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    border-left: none;
    padding: 1.5rem;
    transition: all 0.2s ease;
    overflow: hidden;
    position: relative;
}

.system-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
}

.system-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.system-header h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    line-height: 1.4;
}

.system-type-badge {
    background: #fef2f2;
    color: #991b1b;
    padding: 0.25rem 0.75rem;
    border-radius: var(--radius-lg);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.system-info {
    display: grid;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.system-info-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #6b7280;
}

.system-info-row i {
    color: #ef4444;
    width: 16px;
}

.system-actions {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #f3f4f6;
}

/* Systems Responsive */
@media (max-width: 768px) {
    .systems-container .filter-row {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .systems-grid {
        grid-template-columns: 1fr;
    }
    
    .system-actions {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .systems-container .system-form {
        grid-template-columns: 1fr;
    }
}

/* ===== MAINTENANCE.PHP STÍLUSOK ===== */
/* Maintenance section stílusok */

/* Equipment section stílusok - hasonló a maintenance-hez */

/* Form stílusok */
.maintenance-form-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    margin-bottom: 2rem;
    overflow: hidden;
}

.maintenance-form-card .card-header {
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    padding: 1.5rem;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.maintenance-form-card .card-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 700;
    font-size: 1.125rem;
    color: #1f2937;
}

.maintenance-form-card .card-content {
    padding: 2rem;
}

.maintenance-form-card .maintenance-form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.maintenance-form-card .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.maintenance-form-card .form-group.full-width {
    grid-column: 1 / -1;
}

.maintenance-form-card .form-label {
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
}

.maintenance-form-card .form-input, 
.maintenance-form-card .form-select {
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: all 0.2s;
}

.maintenance-form-card .form-input:focus, 
.maintenance-form-card .form-select:focus {
    outline: none;
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.maintenance-form-card .form-actions {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

/* Kártyák grid */
/* Responsive maintenance */
@media (max-width: 768px) {
    .maintenance-form-card .form-row {
        grid-template-columns: 1fr;
    }
    
    .maintenance-form-card .form-actions {
        justify-content: stretch;
        flex-direction: column-reverse;
        align-items: stretch;
    }
    
    .maintenance-form-card .form-group {
        width: 100%;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .maintenance-form-card .form-input,
    .maintenance-form-card .form-select {
        width: 100%;
        max-width: 100%;
    }
}

/* ===== LOGIN.PHP STÍLUSOK ===== */
/* PWA biometrikus ellenőrzés overlay (login -> biometric_login átirányítás előtt) */
.login-biometric-check {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}
.login-biometric-check-inner {
    text-align: center;
}
.login-biometric-check-inner .material-symbols-outlined {
    font-size: 48px;
    color: #2563eb;
    display: block;
    margin-bottom: 1rem;
}
.login-biometric-check-inner p {
    color: #64748b;
    font-size: 0.9375rem;
}

/* Login - Egyszerű Design */
.login-section {
    min-height: calc(100vh - 100px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.login-container {
    max-width: 450px;
    width: 100%;
}

/* Login Card */
.login-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    border: 1px solid #e5e7eb;
    padding: 2rem;
}

.login-header {
    text-align: center;
    margin-bottom: 2rem;
}

.login-header h1 {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.login-header p {
    color: #6b7280;
    margin: 0;
    font-size: 0.875rem;
}

/* Login Form */
.login-form {
    margin-bottom: 2rem;
}

.login-form .form-group {
    margin-bottom: 1.5rem;
}

.login-form .form-group input[type="checkbox"] {
    display: none;
    visibility: hidden;
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
}

.login-form .form-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}

.login-form .form-input {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    transition: all 0.2s ease;
    background: white;
}

.login-form .form-input:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgb(37 99 235 / 0.1);
}

.password-input-container {
    position: relative;
}

.password-toggle {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #6b7280;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: var(--radius-lg);
    transition: color 0.2s ease;
}

.password-toggle:hover {
    color: #374151;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
}

/* Pipa a szöveg előtt (sorban), ne fölötte - form-group label display:block felülírása */
.form-group .checkbox-label,
.form-group .checkbox-label-inline,
.checkbox-label-inline {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin-bottom: 0;
}

.checkbox-label-inline .checkbox-custom {
    flex-shrink: 0;
}

/* Checkbox input elrejtése (custom jelölőnégyzetnél) – ID specifikusság felülírja a form-group input stílusokat */
#suppression-fire-alarm-checkbox-wrap .checkbox-label input[type="checkbox"],
.checkbox-label input[type="checkbox"] {
    display: none;
    visibility: hidden;
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    outline: none;
}

.checkbox-custom {
    width: 1.25rem;
    height: 1.25rem;
    min-width: 1.25rem;
    border: 2px solid #d1d5db;
    border-radius: var(--radius-lg);
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.checkbox-label input[type="checkbox"]:checked + .checkbox-custom {
    background: #3b82f6;
    border-color: #3b82f6;
}

.checkbox-label input[type="checkbox"]:checked + .checkbox-custom::after {
    content: "✓";
    color: white;
    font-size: 0.875rem;
    font-weight: bold;
}

/* Oltórendszer: tűzjelzőre kötött checkbox – custom box látható (ID specifikusság, pipa működik) */
#suppression-fire-alarm-checkbox-wrap .checkbox-custom,
.maintenance-form .form-section .checkbox-label-inline .checkbox-custom {
    display: flex;
    visibility: visible;
    opacity: 1;
    width: 1.25rem;
    height: 1.25rem;
    min-width: 1.25rem;
    flex-shrink: 0;
}

/* Suppression checkbox: fókusz keret eltávolítása (ID specifikusság) */
#suppression_fire_alarm_connected:focus,
#suppression_fire_alarm_connected:focus-visible {
    outline: none;
    box-shadow: none;
}

/* Natív checkbox (ha checkbox-visible-native osztály használatban) */
.checkbox-visible-native input[type="checkbox"],
.maintenance-form .checkbox-visible-native input[type="checkbox"] {
    display: inline-block;
    visibility: visible;
    opacity: 1;
    position: static;
    width: 1.25rem;
    height: 1.25rem;
    min-width: 1.25rem;
    margin: 0 0.5rem 0 0;
    flex-shrink: 0;
    padding: 0;
    border: 1px solid #9ca3af;
    outline: none;
    accent-color: #3b82f6;
}
.checkbox-visible-native input[type="checkbox"]:focus,
.checkbox-visible-native input[type="checkbox"]:focus-visible {
    outline: none;
    box-shadow: none;
}
.checkbox-visible-native .checkbox-custom {
    display: none;
}

.login-btn {
    width: 100%;
    padding: 0.75rem 1.5rem;
    background: #2563eb;
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.login-btn:hover {
    background: #1d4ed8;
    transform: translateY(-1px);
}

.biometric-login-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
}
.biometric-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}
.biometric-btn .material-symbols-outlined {
    font-size: 1.25rem;
}
.biometric-btn-primary {
    background: #059669;
}
.biometric-btn-primary:hover {
    background: #047857;
}
.biometric-divider {
    font-size: 0.8rem;
    color: #6b7280;
}
@media (max-width: 768px) {
    .biometric-btn-primary {
        padding: 1rem 1.5rem;
        font-size: 1rem;
    }
}

/* Login Footer */
.login-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    text-align: center;
    padding-top: 1.5rem;
    border-top: 1px solid #e5e7eb;
}

.login-help-link {
    color: #6b7280;
    font-size: 0.875rem;
    text-decoration: none;
}

.login-help-link:hover {
    color: #2563eb;
    text-decoration: underline;
}

.login-demo-btn,
.login-footer a.login-demo-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, #06b6d4, #0891b2);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    border-radius: 10px;
    font-size: 0.9rem;
    transition: all 0.2s ease;
}

.login-demo-btn:hover,
.login-footer a.login-demo-btn:hover {
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(6, 182, 212, 0.35);
}

.login-demo-btn .material-symbols-outlined,
.login-footer a.login-demo-btn .material-symbols-outlined {
    font-size: 1.1rem;
    color: #fff;
}

.login-footer p {
    margin: 0 0 1rem 0;
    color: #6b7280;
    font-size: 0.875rem;
}

.login-footer a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.login-footer a:hover {
    text-decoration: underline;
}

.login-help {
    margin-top: 0.5rem;
}

.login-help a {
    color: #6b7280;
    font-size: 0.875rem;
}

/* Responsive login */
@media (max-width: 768px) {
    .login-section {
        padding: 1rem;
    }
    
    .login-card {
        padding: 1.5rem;
    }
    
    .login-header h1 {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .login-card {
        padding: 1rem;
    }
    
    .login-header h1 {
        font-size: 1.25rem;
    }
}

/* ===== HÁROMÁLLAPOTÚ GOMBOK ===== */
.three-state-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 2px solid #d1d5db;
    border-radius: var(--radius-lg);
    background: #f9fafb;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 18px;
    position: relative;
}

.three-state-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Megfelelt - Zöld */
.three-state-button.state-pass {
    background: #10b981;
    border-color: #059669;
    color: white;
}

.three-state-button.state-pass:hover {
    background: #059669;
}

/* Nem felelt meg - Piros */
.three-state-button.state-fail {
    background: #ef4444;
    border-color: #dc2626;
    color: white;
}

.three-state-button.state-fail:hover {
    background: #dc2626;
}

/* Nem releváns - Szürke */
.three-state-button.state-na {
    background: #9ca3af;
    border-color: #6b7280;
    color: white;
    position: relative;
}

.three-state-button.state-na::before {
    content: "−";
    position: absolute;
    font-size: 24px;
    font-weight: bold;
    opacity: 0.8;
    line-height: 1;
}

.three-state-button.state-na:hover {
    background: #6b7280;
}

/* Alapértelmezett állapot */
.three-state-button.state-none {
    background: #f9fafb;
    border-color: #d1d5db;
    color: #9ca3af;
}

/* Ellenőrzési sorok */
.check-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    margin-bottom: 0.5rem;
    background: white;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-width: 0;
}

.check-row:hover {
    background: #f9fafb;
}

.check-label {
    flex: 1 1 0%;
    min-width: 0;
    font-weight: 500;
    color: #374151;
    margin-right: 1rem;
}

.check-buttons {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.check-input {
    display: flex;
    align-items: center;
}

.check-row-with-note {
    flex-wrap: wrap;
    align-items: flex-start;
}
.check-row-with-note > .check-label {
    flex: 1;
    min-width: 0;
}
.check-row-with-note > .check-buttons {
    flex: 0 0 auto;
}
.check-note {
    flex: 1 1 100%;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px dotted #e5e7eb;
}
.check-note label {
    display: block;
    font-size: 0.85rem;
    color: #6b7280;
    margin-bottom: 0.25rem;
}
.check-note input {
    width: 100%;
    padding: 0.35rem 0.5rem;
    border: none;
    border-bottom: 1px dotted #333;
    font-size: 0.9rem;
}



/* ========== kiszervezve: pages/fire_extinguisher_form.php ========== */
/* Tűzoltó Készülékek Form - Modern Stílusok */
.fire-extinguisher-form {
    max-width: 1000px;
    margin: 0 auto;
}

.fire-extinguisher-form .form-title {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-extinguisher-form .form-icon {
    font-size: 32px;
    color: #3b82f6;
}

.fire-extinguisher-form .form-title-content h2 {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

.fire-extinguisher-form .form-title-content p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

.fire-extinguisher-form .maintenance-form {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.fire-extinguisher-form .form-section {
    background: white;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-extinguisher-form .section-header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f3f4f6;
}

.fire-extinguisher-form .section-header h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

.fire-extinguisher-form .section-header p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

.fire-extinguisher-form .form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.fire-extinguisher-form .form-group {
    display: flex;
    flex-direction: column;
}

.form-group.full-width {
    grid-column: 1 / -1;
}

.fire-extinguisher-form .form-group label {
    font-weight: 500;
    color: #374151;
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.fire-extinguisher-form .form-group input,
.fire-extinguisher-form .form-group select,
.fire-extinguisher-form .form-group textarea {
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.9rem;
    transition: border-color 0.2s;
}

.fire-extinguisher-form .form-group input:focus,
.fire-extinguisher-form .form-group select:focus,
.fire-extinguisher-form .form-group textarea:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.fire-extinguisher-form .subsection {
    margin-top: 25px;
}

.fire-extinguisher-form .subsection h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    margin: 0 0 15px 0;
}

.fire-extinguisher-form .document-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
}

.fire-extinguisher-form .doc-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 20px;
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.9rem;
    font-weight: 500;
}

.fire-extinguisher-form .doc-btn:hover {
    background: #f1f5f9;
    border-color: #3b82f6;
    transform: translateY(-1px);
}

.fire-extinguisher-form .doc-btn-icon {
    font-size: 24px;
}

.fire-extinguisher-form .form-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.btn-secondary,
.fire-extinguisher-form .btn-primary {
    padding: 12px 24px;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
    font-size: 0.9rem;
}

.fire-extinguisher-form .btn-secondary {
    background: #f3f4f6;
    color: #374151;
}

.fire-extinguisher-form .btn-secondary:hover {
    background: #e5e7eb;
}

.fire-extinguisher-form .btn-primary {
    background: var(--menu-primary);
    color: white;
}

.fire-extinguisher-form .btn-primary:hover {
    background: var(--menu-primary-hover);
}

/* Fire Extinguisher Specific Styles */
.fire-extinguisher-form .section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
}

.btn-add-extinguisher {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #10b981;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    font-size: 0.9rem;
    transition: background-color 0.2s;
    white-space: nowrap;
}

.btn-add-extinguisher:hover {
    background: #059669;
}

.add-icon {
    font-size: 16px;
    font-weight: bold;
}

.extinguisher-item {
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    background: #fafafa;
}

.extinguisher-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.extinguisher-header h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
}

.btn-remove-extinguisher {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #ef4444;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    transition: background-color 0.2s;
}

.btn-remove-extinguisher:hover {
    background: #dc2626;
}

.remove-icon {
    font-size: 14px;
}

.extinguisher-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.extinguisher-location {
    grid-column: 1 / -1;
}

.regulation-red {
    background: #fef2f2;
    border-left-color: #ef4444;
}

.regulation-red .regulation-content p {
    color: #991b1b;
}

.regulation-red .regulation-icon {
    color: #ef4444;
}

/* Responsive */
@media (max-width: 768px) {
    .fire-extinguisher-form .section-title-row {
        flex-direction: column;
        align-items: stretch;
    }
    
    .btn-add-extinguisher {
        justify-content: center;
    }
    
    .extinguisher-form-grid {
        grid-template-columns: 1fr;
    }
    
    .extinguisher-header {
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }
}

/* Responsive */
@media (max-width: 768px) {
    .fire-extinguisher-form .form-grid {
        grid-template-columns: 1fr;
    }
    
    .fire-extinguisher-form .document-buttons {
        grid-template-columns: 1fr;
    }
    
    .fire-extinguisher-form .form-actions {
        flex-direction: column;
    }
    
    .fire-extinguisher-form .section-title-row {
        flex-direction: column;
        align-items: stretch;
    }
}


/* ========== kiszervezve: pages/fire_suppression_form.php ========== */
/* Automata Tűzoltó Berendezés Form - Modern Stílusok */
.fire-suppression-form {
    max-width: 1000px;
    margin: 0 auto;
}

.fire-suppression-form .form-title {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-suppression-form .form-icon {
    font-size: 32px;
    color: #8b5cf6;
}

.fire-suppression-form .form-title-content h2 {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

.fire-suppression-form .form-title-content p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

.fire-suppression-form .maintenance-form {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.fire-suppression-form .form-section {
    background: white;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.fire-suppression-form .section-header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f3f4f6;
}

.fire-suppression-form .section-header h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #1f2937;
    margin: 0 0 5px 0;
}

.fire-suppression-form .section-header p {
    color: #6b7280;
    margin: 0;
    font-size: 0.9rem;
}

.fire-suppression-form .form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.fire-suppression-form .form-group {
    display: flex;
    flex-direction: column;
}

.form-group.full-width {
    grid-column: 1 / -1;
}

.fire-suppression-form .form-group label {
    font-weight: 500;
    color: #374151;
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.fire-suppression-form .form-group input,
.fire-suppression-form .form-group select,
.fire-suppression-form .form-group textarea {
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 0.9rem;
    transition: border-color 0.2s;
}

.fire-suppression-form .form-group input:focus,
.fire-suppression-form .form-group select:focus,
.fire-suppression-form .form-group textarea:focus {
    outline: none;
    border-color: #8b5cf6;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
}

.fire-suppression-form .subsection {
    margin-top: 25px;
}

.fire-suppression-form .subsection h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    margin: 0 0 15px 0;
}

/* State Toggle Styles */
.fire-suppression-form .state-toggle-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.fire-suppression-form .state-toggle-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background-color: #fff;
    transition: all 0.2s ease;
}

.fire-suppression-form .state-toggle-item:hover {
    background-color: #f8f9fa;
    border-color: #8b5cf6;
}

.fire-suppression-form .toggle-label {
    flex: 1;
    font-weight: 500;
    color: #333;
    margin-right: 12px;
}

.fire-suppression-form .state-button {
    padding: 8px;
    border: none;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    min-width: 40px;
    width: 40px;
    height: 40px;
    background-color: #28a745;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fire-suppression-form .state-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.state-button.failed {
    background-color: #dc3545;
}

.state-button.not-relevant {
    background-color: #6c757d;
}

.fire-suppression-form .document-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
}

.fire-suppression-form .doc-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 20px;
    background: #f8fafc;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.9rem;
    font-weight: 500;
}

.fire-suppression-form .doc-btn:hover {
    background: #f1f5f9;
    border-color: #8b5cf6;
    transform: translateY(-1px);
}

.fire-suppression-form .doc-btn-icon {
    font-size: 24px;
}

.fire-suppression-form .regulation-info {
    display: flex;
    gap: 12px;
    padding: 15px;
    background: #f3e8ff;
    border-radius: 8px;
    border-left: 4px solid #8b5cf6;
}

.fire-suppression-form .regulation-icon {
    font-size: 20px;
    color: #8b5cf6;
}

.fire-suppression-form .regulation-content {
    flex: 1;
}

.fire-suppression-form .regulation-content p {
    margin: 0 0 8px 0;
    font-size: 0.9rem;
    color: #6b46c1;
}

.fire-suppression-form .regulation-content p:last-child {
    margin-bottom: 0;
}

.fire-suppression-form .regulation-cycle {
    font-weight: 500;
}

.fire-suppression-form .form-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    padding: 20px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.btn-secondary,
.fire-suppression-form .btn-primary {
    padding: 12px 24px;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
    font-size: 0.9rem;
}

.fire-suppression-form .btn-secondary {
    background: #f3f4f6;
    color: #374151;
}

.fire-suppression-form .btn-secondary:hover {
    background: #e5e7eb;
}

.fire-suppression-form .btn-primary {
    background: var(--menu-primary);
    color: white;
}

.fire-suppression-form .btn-primary:hover {
    background: var(--menu-primary-hover);
}

/* Equipment Specific Styles */
.section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
}

.btn-add-equipment {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: #8b5cf6;
    color: white;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 500;
    font-size: 0.9rem;
    transition: background-color 0.2s;
    white-space: nowrap;
}

.btn-add-equipment:hover {
    background: #7c3aed;
}

.equipment-item {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    background: #fafafa;
}

.equipment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}

.equipment-header h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
}

.btn-remove-equipment {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    background: #ef4444;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.8rem;
    transition: background-color 0.2s;
}

.btn-remove-equipment:hover {
    background: #dc2626;
}

/* Responsive */
@media (max-width: 768px) {
    .fire-suppression-form .form-grid {
        grid-template-columns: 1fr;
    }
    
    .fire-suppression-form .document-buttons {
        grid-template-columns: 1fr;
    }
    
    .fire-suppression-form .form-actions {
        flex-direction: column;
    }
    
    .fire-suppression-form .section-title-row {
        flex-direction: column;
        align-items: stretch;
    }
}


/* ========== profile.css ========== */

/* Profile oldal stílusok (main.css-ből kiemelve) */

/* =============================================================================
   PROFILE STÍLUSOK
   ============================================================================= */

/* profile-container és profile-section: LOCATIONS ADD FORM STYLES (2374) - ne duplikáljuk */

.profile-content {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

/* section-header: form-section, profile-section, maintenance-form - közös */
.profile-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.readonly-field {
    background-color: #f9fafb;
    color: #6b7280;
    cursor: not-allowed;
}

.required {
    color: #dc2626;
    font-weight: bold;
}

/* Profile responsive */
@media (max-width: 768px) {
    .profile-container {
        padding: 0.5rem;
    }

    .location-form-page .profile-container {
        padding: 0;
    }

    .profile-section {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .users-form-page .profile-container .profile-section {
        padding: 1rem 1rem 1.25rem;
    }

    .location-form-page .profile-section {
        padding-left: 0;
        padding-right: 0;
    }

    .form-grid-2,
    .form-grid,
    .form-grid-1 {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

.check-section {
    margin-bottom: 2rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.check-section h4 {
    margin-bottom: 1rem;
    color: #1f2937;
    font-weight: 600;
}

.check-subsection {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #f9fafb;
    border-left: 4px solid #dc2626;
    border-radius: var(--radius-lg);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    /* A belső padding ne hagyjon "ures" savot: a feher sor kitolti a teljes szelesseget */
    overflow-x: hidden;
}

/* Ellenorzesi sorok edge-to-edge a szurke blokkban (padding kompenzalasa) */
.check-subsection > .check-row,
.check-subsection > .check-row-with-note {
    width: calc(100% + 2rem);
    max-width: none;
    margin-left: -1rem;
    margin-right: -1rem;
    border-radius: 0;
}

.check-subsection h5 + .check-row,
.check-subsection h5 + .check-row-with-note {
    border-top-left-radius: var(--radius-lg);
    border-top-right-radius: var(--radius-lg);
}

.check-subsection > .check-row:last-child,
.check-subsection > .check-row-with-note:last-child {
    border-bottom-left-radius: var(--radius-lg);
    border-bottom-right-radius: var(--radius-lg);
}

.check-subsection h5 {
    margin-bottom: 0.75rem;
    color: #1f2937;
    font-weight: 600;
    font-size: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}


/* ========== kiszervezve: pages/profile.php ========== */
.profile-page { max-width: 720px; margin: 0 auto; }
.profile-page .page-subtitle { margin: 0.35rem 0 0; color: #64748b; font-size: 0.95rem; }

.profile-page-header__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.55rem;
}

.profile-page-header__name {
    font-weight: 600;
    color: #334155;
}

.profile-page-header__email {
    color: #64748b;
}

.profile-page-header__meta .role-badge {
    margin: 0;
}

.profile-page .profile-page-header .page-title {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
}
.profile-page .profile-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.profile-page .profile-card h2 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 1rem;
    font-size: 1.15rem;
}
.profile-page .profile-form .form-group { margin-bottom: 1rem; }
.profile-page .profile-form label { display: block; font-weight: 600; margin-bottom: 0.35rem; font-size: 0.9rem; }
.profile-hint { color: #64748b; font-size: 0.9rem; line-height: 1.5; margin: 0 0 1rem; }
.profile-hint--warn { color: #b45309; }
.profile-meta { color: #64748b; font-size: 0.85rem; margin: 0.25rem 0; }
.profile-meta--ok { color: #15803d; }
.profile-checkbox { display: flex; align-items: center; gap: 10px; cursor: pointer; font-weight: 500; }
.profile-actions-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 1rem; }
.profile-inline-form { display: inline; }
.profile-details { margin-top: 1rem; font-size: 0.9rem; }
.profile-details summary { cursor: pointer; color: #475569; font-weight: 600; }
.profile-code {
    display: block;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    font-size: 0.8rem;
    word-break: break-all;
    margin: 0.5rem 0;
}
.profile-gcal-connect-btn { margin-top: 0.5rem; }
.profile-signature-preview-wrap { margin-bottom: 1rem; }
.profile-signature-preview-img {
    display: block;
    max-width: 320px;
    max-height: 120px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    padding: 8px;
}
.profile-signature-canvas-wrap { margin-bottom: 0.75rem; }
.profile-signature-canvas {
    display: block;
    width: 100%;
    max-width: 480px;
    height: 180px;
    border: 2px solid #d1d5db;
    border-radius: 8px;
    background: #fff;
    cursor: crosshair;
    touch-action: none;
}
.profile-stage-module-list {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
    color: #475569;
    font-size: 0.92rem;
}
.profile-stage-module-list li {
    margin-bottom: 0.35rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.profile-notif-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
}
.profile-notif-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
}
.profile-notif-item:last-child { border-bottom: none; }
.profile-notif-item__text {
    flex: 1 1 auto;
    min-width: 0;
}
.profile-notif-item__title {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    font-weight: 600;
    color: #0f172a;
    font-size: 0.95rem;
    line-height: 1.35;
}
.profile-notif-item__title .material-symbols-outlined {
    font-size: 1.15rem;
    color: #475569;
    flex-shrink: 0;
    margin-top: 0.1rem;
}
.profile-notif-item__hint {
    display: block;
    margin-top: 0.25rem;
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.profile-notif-toggle-form {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    margin: 0.1rem 0 0;
    padding: 0;
    box-sizing: border-box;
}
.profile-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}
.profile-toggle input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.profile-toggle__track {
    display: block;
    width: 44px;
    height: 26px;
    border-radius: 999px;
    background: #cbd5e1;
    transition: background 0.2s ease;
    position: relative;
}
.profile-toggle__thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);
    transition: transform 0.2s ease;
}
.profile-toggle input:checked + .profile-toggle__track { background: #2563eb; }
.profile-toggle input:checked + .profile-toggle__track .profile-toggle__thumb { transform: translateX(18px); }
.profile-toggle input:focus-visible + .profile-toggle__track { outline: 2px solid #2563eb; outline-offset: 2px; }
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.profile-signature-delete-form { margin-top: 0.75rem; }
.profile-push-devices, .profile-push-log {
    list-style: none;
    margin: 0 0 1rem;
    padding: 0;
    display: grid;
    gap: 0.5rem;
}
.profile-push-devices li, .profile-push-log li {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.65rem 0.75rem;
    background: #f8fafc;
    font-size: 0.88rem;
}
.profile-push-device__row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem;
}
.profile-push-device__name { font-weight: 600; color: #0f172a; }
.profile-push-device__meta { color: #64748b; font-size: 0.8rem; margin-top: 0.15rem; }
.profile-push-status {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.profile-push-status--active { background: #dcfce7; color: #166534; }
.profile-push-status--expired { background: #fee2e2; color: #b91c1c; }
.profile-push-status--blocked { background: #fecaca; color: #991b1b; }
.profile-push-status--needs_resubscribe { background: #fef3c7; color: #92400e; }
.profile-push-loading { color: #64748b; border-style: dashed; }
.profile-push-perm { font-size: 0.88rem; margin: 0 0 0.75rem; color: #475569; }
.profile-push-perm--warn { color: #b45309; }
.profile-push-perm--ok { color: #15803d; }
.profile-push-msg {
    margin: 0.75rem 0 0;
    padding: 0.55rem 0.7rem;
    border-radius: 8px;
    font-size: 0.88rem;
    background: #f1f5f9;
}
.profile-push-msg--success { background: #f0fdf4; color: #166534; }
.profile-push-msg--error { background: #fef2f2; color: #b91c1c; }
.profile-push-log__ok { color: #15803d; }
.profile-push-log__fail { color: #b91c1c; }
.profile-push-log-details { margin-top: 0.5rem; }

/* Kiküldetés profil – személyes adatok és magán járművek */
.profile-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.profile-card__head-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}
.profile-card__head-row h2 {
    margin: 0;
    flex: 1 1 auto;
}
.profile-hint--compact {
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
}

.profile-private-vehicles-section {
    margin-top: 0.5rem;
}

.profile-private-vehicles-section .vehicles-list {
    margin: 0;
}

.profile-card .app-chip-radios {
    margin-top: 0.15rem;
}

@media (max-width: 768px) {
    .profile-form-grid {
        grid-template-columns: 1fr;
        gap: 0.85rem;
    }

    .profile-page .profile-page-header {
        padding: 0.85rem 0.9rem;
    }

    .profile-page .profile-page-header .page-title {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.55rem;
        width: 100%;
    }

    .profile-page .profile-page-header .page-title h1 {
        font-size: 1.35rem;
        gap: 0.45rem;
    }

    .profile-page .profile-page-header__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.3rem;
        width: 100%;
        margin: 0;
        font-size: 0.88rem;
        line-height: 1.35;
    }

    .profile-page .profile-page-header__name,
    .profile-page .profile-page-header__email {
        display: block;
        max-width: 100%;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .profile-page .profile-form .form-group {
        margin-bottom: 0;
    }

    .profile-page .profile-form > .btn {
        width: 100%;
        justify-content: center;
    }

    .profile-notif-item {
        flex-wrap: nowrap;
        align-items: center;
        gap: 0.75rem;
        padding: 0.85rem 0.85rem;
    }

    .profile-notif-item__text {
        flex: 1 1 0;
        min-width: 0;
    }

    .profile-notif-item__title {
        flex-wrap: wrap;
    }

    .profile-notif-toggle-form {
        flex: 0 0 auto;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
    }

    .profile-notif-toggle-form .profile-toggle {
        display: inline-flex;
    }

    .profile-private-vehicles-section .vehicles-list {
        display: flex;
        flex-direction: column;
        gap: 0.65rem;
    }

    .profile-private-vehicles-section .vehicle-item {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 0.45rem 0.5rem;
        width: 100%;
        min-width: 0;
        padding: 0.8rem 0.9rem;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
    }

    .profile-private-vehicles-section .vehicle-item-text {
        flex: 1 1 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2rem;
        overflow: visible;
    }

    .profile-private-vehicles-section .vehicle-plate {
        font-size: 1.02rem;
        line-height: 1.25;
    }

    .profile-private-vehicles-section .vehicle-type {
        font-size: 0.88rem;
        color: #475569;
    }

    .profile-private-vehicles-section .vehicle-notes {
        font-size: 0.8rem;
        color: #64748b;
        line-height: 1.35;
    }

    .profile-private-vehicles-section .vehicle-item .btn-edit-vehicle {
        margin-left: auto;
    }

    .profile-private-vehicles-section .vehicle-item .btn-icon {
        width: 2.5rem;
        height: 2.5rem;
        min-width: 2.5rem;
        min-height: 2.5rem;
        border-radius: 10px;
    }

    .profile-fuel-type-field .vehicle-fuel-type-select,
    .profile-fuel-type-field .profile-fuel-type-select {
        display: block;
        width: 100%;
        min-height: 2.75rem;
    }
}


/* ========== tasks-system.css ========== */

/* Feladatok rendszer stílusai (main.css-ből kiemelve) */

/* View Toggle */
.view-toggle {
    display: flex;
    gap: 4px;
    padding: 3px;
    border-radius: var(--radius-lg);
    flex-wrap: wrap;
}

.view-toggle .btn {
    border: none;
    background: transparent;
    color: #6b7280;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
}

.view-toggle .btn .material-symbols-outlined {
    font-size: 1.125rem;
    line-height: 1;
    vertical-align: middle;
}

/* Aktív nézet: fehér lap, kék szöveg – egységes szegmens stílus */
.view-toggle .btn.active {
    background: #fff;
    color: #1d4ed8;
    border: 1px solid rgba(203, 213, 225, 0.65);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

/* Tasks / Page header responsive - title és actions */
@media (max-width: 768px) {
    .page-title h1 {
        font-size: 1.25rem;
    }

    .page-title h1 i,
    .page-title h1 svg {
        font-size: 24px;
    }

    /* Többgombos feladateszköztár: teljes szélességű sorok */
    .tasks-page-wrapper .page-header .page-actions.tasks-toolbar {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .tasks-page-wrapper .page-header .page-actions.tasks-toolbar .btn,
    .tasks-page-wrapper .page-header .page-actions.tasks-toolbar .btn-primary,
    .tasks-page-wrapper .page-header .page-actions.tasks-toolbar .btn-secondary,
    .tasks-page-wrapper .page-header .page-actions.tasks-toolbar a.btn {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }

    .page-header .page-actions .auvi-back-btn,
    .page-header > .auvi-back-btn {
        width: 2.75rem;
        flex-shrink: 0;
    }

    .view-toggle {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .view-toggle a,
    .view-toggle .btn {
        flex: 1 1 calc(50% - 4px);
        min-width: 0;
        justify-content: center;
    }
}
/* Tasks kereső sáv */
.tasks-search-bar {
    width: 100%;
    background: white;
    padding: 1rem 1.25rem;
    border-radius: var(--radius-lg);
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.tasks-search-form {
    width: 100%;
}
.tasks-search-form .search-input-wrapper input {
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.9375rem;
}
.tasks-search-form .search-input-wrapper input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

/* Tasks kereső sáv mobilon – teljes szélesség */
@media (max-width: 768px) {
    .clients-section .tasks-search-bar {
        width: 100vw;
        max-width: 100vw;
        margin-left: calc(-50vw + 50%);
        margin-right: calc(-50vw + 50%);
        padding: 1rem;
        box-sizing: border-box;
    }
    .tasks-search-form {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        max-width: 100%;
    }
    .tasks-search-form .search-input-wrapper {
        width: 100%;
        min-width: 0;
        flex: 1 1 100%;
        max-width: 100%;
    }
    .tasks-search-form .search-input-wrapper input {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    .tasks-search-form .btn {
        width: 100%;
        max-width: 100%;
        justify-content: center;
        box-sizing: border-box;
    }
}

/* Kanban Board */
.kanban-board {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    min-height: 600px;
}

.kanban-column {
    background: #f8fafc;
    border-radius: var(--radius-lg);
    padding: 16px;
    border: 1px solid #e5e7eb;
    transition: all 0.3s ease;
}

.kanban-column.drag-over {
    background: #eff6ff;
    border: 2px dashed #3b82f6;
    box-shadow: inset 0 0 20px rgba(59, 130, 246, 0.1);
    transform: scale(1.02);
}

/* Pulse animáció sikeres státusz változásnál */
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 5px 15px rgba(16, 185, 129, 0.4);
        border-color: #10b981;
    }
    100% {
        transform: scale(1);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }
}

.kanban-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e5e7eb;
}

.kanban-header h3 {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 8px;
}

.task-count {
    background: #e5e7eb;
    color: #6b7280;
    padding: 4px 8px;
    border-radius: var(--radius-lg);
    font-size: 12px;
    font-weight: 600;
}

.kanban-tasks {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 500px;
}

.kanban-filters-wrapper {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}
.kanban-filter-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}
.kanban-filter-label {
    font-weight: 600;
    color: #374151;
}
.kanban-filter-btn {
    padding: 6px 12px;
    border-radius: 6px;
    text-decoration: none;
    background: #f3f4f6;
    color: #374151;
    font-size: 14px;
    font-weight: 500;
    border: 2px solid transparent;
}
.kanban-filter-btn.is-active {
    color: #fff;
}
.kanban-filter-hint {
    font-size: 12px;
    color: #6b7280;
    width: 100%;
}

.kanban-filters-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.kanban-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    min-width: 0;
}
.kanban-filters-toggle {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
}
.kanban-filters-chevron {
    margin-left: 0.25rem;
    transition: transform 0.18s ease;
}
.kanban-filters-wrapper:not(.is-collapsed) .kanban-filters-chevron {
    transform: rotate(180deg);
}
.kanban-filters-wrapper.is-collapsed .kanban-filters-body {
    display: none;
}
.kanban-filters-summary {
    display: none;
}
.kanban-filters-wrapper.is-collapsed .kanban-filters-summary:not([hidden]) {
    display: block;
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.35;
    color: #475569;
}
.kanban-filters-active-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: #1d4ed8;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
}
.kanban-filters-active-badge[hidden] {
    display: none;
}

.kanban-filter-select {
    display: none;
}

@media (max-width: 1024px) {
    .kanban-filters-wrapper {
        gap: 8px;
        margin-bottom: 12px;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    .kanban-filters-toggle {
        width: 100%;
    }
    .kanban-filters-chevron {
        margin-left: auto;
    }
    .kanban-filter-row {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
    }
    .kanban-filter-label {
        font-size: 0.8125rem;
    }
    .kanban-filter-chips {
        display: none;
    }
    .kanban-filter-select {
        display: block;
        width: 100%;
        max-width: 100%;
        min-height: 42px;
        padding: 0.55rem 2.25rem 0.55rem 0.75rem;
        border: 1px solid #cbd5e1;
        border-radius: 12px;
        background-color: #fff;
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
        background-repeat: no-repeat;
        background-position: right 0.7rem center;
        background-size: 18px;
        color: #0f172a;
        font-size: 0.95rem;
        font-weight: 600;
        appearance: none;
        -webkit-appearance: none;
    }
    .kanban-filter-hint {
        display: none;
    }
}

/* Task Card */
.task-card {
    background: white;
    border-radius: var(--radius-lg);
    padding: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: var(--shadow-sm);
    transition: all 0.2s ease;
    cursor: pointer;
    position: relative;
}

.task-card[draggable="true"] {
    cursor: grab;
}

.task-card[draggable="true"]:active {
    cursor: grabbing;
}

.task-card[draggable="true"]:active {
    cursor: grabbing;
}

.task-card.dragging {
    opacity: 0.5;
    transform: rotate(2deg) scale(1.05);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    cursor: grabbing;
    z-index: 1000;
}

.task-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.task-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.task-header h4 {
    font-size: 14px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.4;
    flex: 1;
    margin-right: 8px;
}

.task-status {
    font-size: 11px;
    padding: 4px 8px;
    border-radius: var(--radius-lg);
    font-weight: 500;
    white-space: nowrap;
}

.status-pending {
    background: #fef3c7;
    color: #92400e;
}

.status-in-progress {
    background: #dbeafe;
    color: #1e40af;
}

.status-completed {
    background: #d1fae5;
    color: #065f46;
}

.status-cancelled {
    background: #fee2e2;
    color: #991b1b;
}

.task-body {
    margin-bottom: 12px;
}

.task-description {
    font-size: 12px;
    color: #666;
    line-height: 1.4;
    margin-top: 4px;
    margin-bottom: 8px;
}

.task-meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.task-type {
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 4px;
}

.task-due {
    font-size: 12px;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 4px;
}

.task-due .material-symbols-outlined,
.task-location .material-symbols-outlined,
.task-assigned .material-symbols-outlined {
    font-size: 14px;
    flex-shrink: 0;
}

.task-location {
    font-size: 12px;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 4px;
}

.task-assigned {
    font-size: 12px;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 4px;
}

.task-footer {
    border-top: 1px solid #f3f4f6;
    padding-top: 12px;
}

.task-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease, visibility 0.3s ease;
    padding: 0;
}

.task-actions.collapsed {
    max-height: 0;
    opacity: 0;
    padding: 0;
    visibility: hidden;
}

.task-card .task-actions:not(.collapsed) {
    max-height: 500px;
    opacity: 1;
    padding-top: 8px;
    visibility: visible;
    display: flex;
    overflow-y: auto; /* Több gombnál (pl. több hozzárendelt) is mind látható maradjon */
}

.task-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: var(--radius-lg);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
    cursor: pointer;
    width: 100%;
    text-align: center;
}

.task-btn i {
    font-size: 16px;
    display: inline-block;
    line-height: 1;
    vertical-align: middle;
}

.task-btn-edit {
    background: #3b82f6;
    color: white;
    border: 1px solid #3b82f6;
}

.task-btn-edit:hover {
    background: #2563eb;
    border-color: #2563eb;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(59, 130, 246, 0.3);
}

.task-btn-delete {
    background: #ef4444;
    color: white;
    border: 1px solid #ef4444;
}

.task-btn-delete:hover {
    background: #dc2626;
    border-color: #dc2626;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.3);
}

.task-btn-print {
    background: #17a2b8;
    color: white;
    border: 1px solid #17a2b8;
}

.task-btn-print:hover {
    background: #138496;
    border-color: #138496;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(23, 162, 184, 0.3);
}

.task-btn-maintenance {
    background: #28a745;
    color: white;
    border: 1px solid #28a745;
}

.task-btn-maintenance:hover {
    background: #218838;
    border-color: #218838;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}

.task-btn-archive {
    background: #6b7280;
    color: white;
    border: 1px solid #6b7280;
}

.task-btn-archive:hover {
    background: #4b5563;
    border-color: #4b5563;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(107, 114, 128, 0.3);
}

/* List View */
.list-view {
    background: white;
    border-radius: var(--radius-lg);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.table-container {
    overflow-x: auto;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
}

.data-table th {
    background: #f8fafc;
    padding: 16px;
    text-align: left;
    font-weight: 600;
    color: #374151;
    border-bottom: 1px solid #e5e7eb;
    font-size: 14px;
}

.data-table td {
    padding: 16px;
    border-bottom: 1px solid #f3f4f6;
    vertical-align: top;
}

.data-table tr:hover {
    background: #f9fafb;
}

.task-title {
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 4px;
}

.task-description {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.4;
}

.priority-badge {
    display: inline-block;
    padding: 4px 8px;
    border-radius: var(--radius-lg);
    font-size: 12px;
    font-weight: bold;
    color: white;
}

/* priority-badge és task-type: inline style használata (pl. style="background-color: ...") - a data-attribútumok nem állítanak CSS változót */

.status-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: var(--radius-lg);
    font-size: 0.75rem;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
}

.status-badge.active {
    background: #d1fae5;
    color: #065f46;
}

.status-badge.inactive {
    background: #f3f4f6;
    color: #6b7280;
}

.status-badge.status-pending {
    background: #fef3c7;
    color: #92400e;
}

.status-badge.status-in-progress,
.status-badge.status-in_progress {
    background: #dbeafe;
    color: #1e40af;
}

.status-badge.status-waiting {
    background: #f3e8ff;
    color: #6b21a8;
}

.status-badge.status-completed {
    background: #d1fae5;
    color: #065f46;
}

.status-badge.inactive {
    background: #f3f4f6;
    color: #6b7280;
}

.status-badge.status-cancelled {
    background: #fee2e2;
    color: #991b1b;
}

/* Work Sheets Status Badges */
.status-badge.status-draft {
    background-color: #e5e7eb;
    color: #374151;
}

.status-badge.status-sent {
    background-color: #dbeafe;
    color: #1e40af;
}

.status-badge.status-signed {
    background-color: #fef3c7;
    color: #92400e;
}

.status-badge.status-completed {
    background-color: #d1fae5;
    color: #065f46;
}

/* Work Sheets Page Styles */
.task-link {
    color: #2563eb;
    text-decoration: none;
}

.task-link:hover {
    text-decoration: underline;
}

.text-muted {
    color: #666;
    font-size: 0.875rem;
}

.work-sheet-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
}

.client-info-row {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 0.75rem;
}

.client-info-row:last-child {
    margin-bottom: 0;
}

.info-label {
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.info-label .info-icon,
.info-label .material-symbols-outlined.info-icon {
    font-size: 1rem;
    color: #6b7280;
}

.info-label .material-symbols-outlined {
    font-size: 1rem;
    color: #6b7280;
}

.info-value {
    color: #1f2937;
    font-size: 0.9375rem;
}

/* Work Sheet Edit Page Styles */
.work-sheet-edit-container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    padding: 20px;
}

.work-sheet-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e5e7eb;
}

.work-sheet-header h1 {
    margin: 0;
    color: #2c3e50;
    font-size: 1.5rem;
}

.work-sheet-header-actions {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
    justify-content: flex-end;
    align-items: center;
}

.work-sheet-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: var(--radius-lg);
    margin-bottom: 30px;
    border: 1px solid #e5e7eb;
}

.work-sheet-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
}

.work-sheet-info .info-item {
    display: flex;
    flex-direction: column;
}

.work-sheet-info .info-item label {
    font-weight: bold;
    color: #666;
    margin-bottom: 5px;
    font-size: 12px;
}

.work-sheet-info .info-item span {
    color: #2c3e50;
}

.work-sheet-edit-container .form-section {
    background: white;
    padding: 25px;
    border-radius: var(--radius-lg);
    margin-bottom: 25px;
    border: 1px solid #e5e7eb;
}

.work-sheet-edit-container .form-section h2 {
    margin-top: 0;
    margin-bottom: 20px;
    color: #2c3e50;
    font-size: 18px;
}

.work-sheet-edit-container .form-section textarea {
    width: 100%;
    min-height: 150px;
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-family: inherit;
    font-size: 14px;
    resize: vertical;
}

.signature-section {
    margin-top: 30px;
}

.signature-canvas-container {
    border: 2px dashed #d1d5db;
    border-radius: var(--radius-lg);
    padding: 20px;
    background: #ffffff;
    margin-bottom: 15px;
}

.signature-canvas {
    border: 1px solid #d1d5db;
    background: white;
    cursor: crosshair;
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 600px;
    height: 200px;
}

.signature-controls {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-top: 15px;
}

.work-sheet-edit-container .form-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
}

.work-sheet-edit-container .form-section-header h2 {
    margin: 0;
    flex: 1;
}

.section-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    color: #666;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.section-toggle:hover {
    color: #2c3e50;
}

.section-toggle .toggle-icon {
    font-size: 20px;
    transition: none;
}

.section-toggle .toggle-text {
    font-size: 14px;
    font-weight: normal;
    margin-left: 0;
}

.work-sheet-edit-container .form-section-content {
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    max-height: 8000px;
    opacity: 1;
}

.work-sheet-edit-container .form-section-content.collapsed {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
}

.work-sheet-edit-container .form-section.collapsed {
    padding-bottom: 25px;
}

.signature-method-buttons {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.signature-method-btn {
    flex: 1;
    min-width: 150px;
    padding: 12px 20px;
    border: 2px solid #dc2626;
    background-color: white;
    color: #dc2626;
    cursor: pointer;
}

.signature-method-btn.active {
    background-color: #dc2626;
    color: white;
}

.signature-method-btn:hover {
    opacity: 0.9;
}

.location-type-btn {
    flex: 1;
    min-width: 140px;
    padding: 10px 16px;
    border: 2px solid #dc2626;
    background-color: white;
    color: #dc2626;
    cursor: pointer;
    border-radius: 6px;
}

.location-type-btn.active {
    background-color: #dc2626;
    color: white;
}

.location-type-btn:hover {
    opacity: 0.9;
}

.location-type-buttons {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    width: 100%;
}

.work-sheet-edit-container .ws-gps-coords-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 12px;
    align-items: flex-end;
    width: 100%;
}

.work-sheet-edit-container .ws-gps-field {
    flex: 1 1 200px;
    min-width: 0;
}

.work-sheet-edit-container .ws-gps-field-label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 4px;
}

.work-sheet-edit-container .ws-gps-field .form-input {
    width: 100%;
    margin: 0;
    box-sizing: border-box;
}

.work-sheet-edit-container .ws-gps-field .form-input,
.work-sheet-edit-container .ws-gps-fetch-btn {
    min-height: 2.75rem;
    box-sizing: border-box;
}

.work-sheet-edit-container .ws-gps-fetch-btn {
    flex: 0 0 auto;
    flex-basis: 100%;
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0.65rem 0 0;
    padding: 0 var(--space-4);
    font-size: 0.875rem;
    line-height: 1.25;
    border-width: 2px;
    white-space: nowrap;
}

.work-sheet-edit-container .ws-gps-hint {
    display: block;
    margin-top: 6px;
}

@media (max-width: 640px) {
    .work-sheet-edit-container .ws-gps-coords-row {
        flex-direction: column;
        align-items: stretch;
    }

    .work-sheet-edit-container .ws-gps-fetch-btn {
        flex-basis: auto;
        width: 100%;
        margin-top: 0.65rem;
    }
}

.time-input-group {
    display: flex;
    gap: 10px;
    align-items: center;
}

.distance-input-group {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.distance-input-group .form-input {
    flex: 1 1 80px;
    min-width: 80px;
    max-width: 120px;
}

.distance-input-group .btn {
    flex-shrink: 0;
}

.custom-location-result {
    word-break: break-word;
    overflow-wrap: break-word;
}

@media (max-width: 480px) {
    .distance-input-group {
        flex-direction: column;
        align-items: stretch;
    }
    .distance-input-group .form-input {
        flex: none;
        width: 100%;
        max-width: none;
        min-width: 0;
    }
}

.time-input-group .form-input {
    flex: 1;
}

.task-due-datetime-adjust {
    display: inline-flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    flex-shrink: 0;
}

.email-input-group {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

.email-input-group .form-input {
    flex: 1;
}

.email-sent-message {
    margin-top: 10px;
    padding: 10px;
    background-color: #d1fae5;
    border-radius: var(--radius-lg);
    color: #059669;
}

.personal-signature-section,
.email-signature-section {
    display: block;
}

.personal-signature-section.hidden,
.email-signature-section.hidden {
    display: none;
}

/* További munka: pipa+sor mindig a szekciócím alatt; checkbox piros accent */
.work-sheet-edit-container .followup-section-checkbox-always {
    padding: 0 1.25rem 0.85rem;
    border-bottom: 1px solid #e5e7eb;
}

.work-sheet-edit-container .form-group.followup-checkbox-row .followup-checkbox-label {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: normal;
    margin-bottom: 0;
    width: 100%;
    box-sizing: border-box;
}

.work-sheet-edit-container .form-group.followup-checkbox-row .followup-checkbox-label > span {
    flex: 1;
    min-width: 0;
    line-height: 1.45;
}

.work-sheet-edit-container .form-group.followup-checkbox-row input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    min-width: 1.125rem;
    max-width: 1.125rem;
    flex: 0 0 1.125rem;
    margin: 0.2rem 0 0 0;
    padding: 0;
    border: none;
    box-shadow: none;
    border-radius: 4px;
    box-sizing: border-box;
    accent-color: #059669;
}

.work-sheet-edit-container .form-group.followup-checkbox-row input[type="checkbox"]:hover {
    transform: none;
    box-shadow: none;
    border: none;
}

.work-sheet-edit-container .form-group.followup-checkbox-row input[type="checkbox"]:focus {
    transform: none;
    outline: 2px solid rgba(220, 53, 69, 0.5);
    outline-offset: 2px;
    box-shadow: none;
    border: none;
}

/* Mobile Styles */
@media (max-width: 768px) {
    .work-sheet-edit-container {
        padding: 10px;
        padding-bottom: 2rem;
        min-height: 0;
    }

    main:has(.work-sheet-edit-container) .content-wrapper,
    main:has(.work-sheet-edit-container) .content-main {
        min-height: 0;
        overflow: visible;
    }

    .work-sheet-edit-container .form-section {
        overflow: visible;
        min-height: 0;
    }

    .work-sheet-edit-container .form-section-content:not(.collapsed) {
        overflow: visible;
        max-height: 5000px;
    }

    .work-sheet-edit-container .form-section-content.collapsed {
        overflow: hidden;
        max-height: 0;
    }

    .work-sheet-edit-container form .alert.alert-info {
        clear: both;
        margin-top: 1.5rem;
        display: block;
    }

    .work-sheet-edit-container .custom-location-result {
        word-break: break-word;
        overflow-wrap: break-word;
        max-width: 100%;
    }

    .work-sheet-header {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.65rem;
    }

    .work-sheet-header h1 {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 1.15rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .work-sheet-header-actions {
        margin-left: auto;
        width: auto;
        flex-shrink: 0;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 0.4rem;
    }

    .work-sheet-info-grid {
        grid-template-columns: 1fr;
    }

    .work-sheet-edit-container .form-section {
        padding: 15px;
    }

    .signature-method-buttons {
        flex-direction: column;
    }

    .signature-method-btn {
        width: 100%;
    }

    .time-input-group {
        flex-direction: column;
        align-items: stretch;
    }

    .email-input-group {
        flex-direction: column;
        align-items: stretch;
    }
}


/* ========== tasks-calendar.css ========== */

/* Feladatok naptár nézet stílusok (main.css-ből kiemelve) */

/* Calendar View */
.calendar-view {
    background: white;
    border-radius: var(--radius-lg);
    border: 1px solid #e5e7eb;
    padding: 16px;
    min-width: 0;
    box-sizing: border-box;
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.calendar-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    order: 1;
}

/* Léptető balra, Google szinkron tőle jobbra (calendar-header-start flex gyerekek) */
.calendar-header-start {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    min-width: 0;
}

.calendar-header-start .calendar-nav {
    order: 1;
}

.calendar-header-start .calendar-gcal-sync {
    order: 2;
    margin-right: 0;
}

.calendar-gcal-connect-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(203, 213, 225, 0.9);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.94);
    text-decoration: none;
    flex-shrink: 0;
    order: 2;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
}

.calendar-gcal-connect-btn:hover {
    background: #fff;
    border-color: rgba(147, 197, 253, 0.95);
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.1);
    transform: translateY(-1px);
}

.calendar-gcal-connect-btn:focus-visible {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

.calendar-gcal-connect-btn-icon {
    display: block;
    flex-shrink: 0;
}

.calendar-location-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex-basis: 100%;
    order: 3;
    padding: 0.5rem 0;
}
.calendar-location-logo {
    max-height: 36px;
    max-width: 120px;
    object-fit: contain;
}
.calendar-location-icon {
    font-size: 24px;
    color: #6b7280;
}
.calendar-location-name {
    font-size: 0.95rem;
    font-weight: 500;
    color: #374151;
}

.calendar-mode-toggle {
    display: flex;
    gap: 8px;
    order: 2;
}

.calendar-month-picker-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 42px;
    padding: 0 12px;
    cursor: pointer;
    color: #64748b;
    border: 1px solid rgba(203, 213, 225, 0.9);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
}

.calendar-month-picker-wrap:hover {
    background: #fff;
    color: #1e40af;
    border-color: rgba(147, 197, 253, 0.95);
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.1);
    transform: translateY(-1px);
}

.calendar-month-picker {
    border: none;
    border-radius: 0;
    padding: 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: #475569;
    background: transparent;
    max-width: 150px;
    cursor: pointer;
}

.calendar-toolbar {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px 14px;
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 250, 252, 0.92) 100%);
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: var(--radius-lg);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 8px 24px rgba(15, 23, 42, 0.06);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    position: relative;
    z-index: 40;
    overflow: visible;
}

.calendar-toolbar-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 12px;
    min-width: 0;
}

.calendar-toolbar-row-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(216px, 336px);
    gap: 10px 12px;
    align-items: stretch;
}

.calendar-toolbar-search {
    display: flex;
    align-items: center;
    position: relative;
    min-width: 0;
    margin: 0;
}

.calendar-toolbar-search .material-symbols-outlined {
    font-size: 20px;
    color: #9ca3af;
    flex-shrink: 0;
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 1;
}

.calendar-search-input {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    margin: 0;
    padding-left: 40px;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(203, 213, 225, 0.85);
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.calendar-search-input:focus {
    outline: none;
    border-color: rgba(59, 130, 246, 0.55);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
    transform: none;
}

.calendar-location-filter-wrap {
    position: relative;
    min-width: 0;
    width: 100%;
    z-index: 1;
}

#tasks-calendar-view .calendar-toolbar .calendar-location-filter-wrap.is-open {
    z-index: 10025;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-trigger.form-select {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 42px;
    height: 42px;
    padding: 0 12px;
    margin: 0;
    box-sizing: border-box;
    cursor: pointer;
    text-align: left;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(203, 213, 225, 0.85);
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transform: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-trigger.form-select:hover {
    border-color: rgba(147, 197, 253, 0.9);
    background: #fff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

#tasks-calendar-view .calendar-toolbar .searchable-select-value {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-value.searchable-select-placeholder {
    color: #9ca3af;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-arrow {
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
    margin-left: 8px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    margin: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
    z-index: 10020;
    max-height: 280px;
    overflow: hidden;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-dropdown[hidden] {
    display: none !important;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-dropdown.open {
    display: block;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-wrap.is-open {
    z-index: 10021;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-search {
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.875rem;
    box-sizing: border-box;
    background: #fff;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-options {
    max-height: 220px;
    overflow-y: auto;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-option {
    padding: 10px 12px;
    cursor: pointer;
    font-size: 0.875rem;
    line-height: 1.35;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-option:hover {
    background: #eff6ff;
}

#tasks-calendar-view .calendar-toolbar .searchable-select-no-results {
    padding: 10px 12px;
    color: #9ca3af;
    font-size: 0.875rem;
}

.calendar-toolbar-row-meta {
    justify-content: space-between;
    position: relative;
    z-index: 2;
    overflow: visible;
}

.calendar-layer-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.calendar-layer-chip {
    border: 1px solid rgba(203, 213, 225, 0.9);
    background: rgba(255, 255, 255, 0.92);
    color: #475569;
    border-radius: 999px;
    padding: 8px 15px;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
}

.calendar-layer-chip:hover {
    border-color: rgba(147, 197, 253, 0.95);
    background: #fff;
    color: #1e40af;
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.12);
    transform: translateY(-1px);
}

.calendar-week-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-left: auto;
}

/* Naptár-specifikus gombok – a fejléc eszköztár a tasks-toolbar.css-ben van */
#tasks-calendar-view .btn.btn-secondary,
.calendar-reschedule-panel .btn.btn-secondary {
    background: rgba(255, 255, 255, 0.94);
    color: #475569;
    border: 1px solid rgba(203, 213, 225, 0.9);
    border-radius: 12px;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.12s ease;
}

#tasks-calendar-view .btn.btn-secondary:hover,
.calendar-reschedule-panel .btn.btn-secondary:hover {
    background: #fff;
    color: #1e40af;
    border-color: rgba(147, 197, 253, 0.95);
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.1);
    transform: translateY(-1px);
}

#tasks-calendar-view .btn.btn-secondary:focus-visible,
.calendar-reschedule-panel .btn.btn-secondary:focus-visible {
    outline: none;
    border-color: rgba(59, 130, 246, 0.55);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.14);
}

/* Egységes aktív gomb – fehér lap, kék szöveg */
#tasks-calendar-view .btn.btn-secondary.active,
#tasks-calendar-view .calendar-week-opt.active,
#tasks-calendar-view .calendar-mode-toggle .btn.btn-secondary.active,
#tasks-calendar-view .calendar-mode-toggle .week-ma-btn.active,
.calendar-layer-chip.active {
    background: #fff;
    color: #1d4ed8;
    border: 1px solid rgba(203, 213, 225, 0.65);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
    transform: none;
}

#tasks-calendar-view .calendar-nav .btn.btn-secondary {
    min-width: 42px;
    min-height: 42px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#tasks-calendar-view .calendar-mode-toggle {
    padding: 4px;
    gap: 4px;
    background: rgba(241, 245, 249, 0.85);
    border: 1px solid rgba(203, 213, 225, 0.75);
    border-radius: 14px;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

#tasks-calendar-view .calendar-mode-toggle .btn.btn-secondary {
    border: none;
    background: transparent;
    box-shadow: none;
    transform: none;
    color: #64748b;
}

#tasks-calendar-view .calendar-mode-toggle .btn.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.75);
    color: #334155;
    box-shadow: none;
    transform: none;
}

#tasks-calendar-view .calendar-week-options .calendar-week-opt {
    min-height: 36px;
    padding: 7px 14px !important;
    font-size: 0.8125rem !important;
    border-radius: 999px;
}

#tasks-calendar-view .calendar-gcal-sync .btn.btn-secondary {
    border-radius: 999px;
    font-size: 0.8rem;
    padding: 6px 14px;
}

#tasks-calendar-view .calendar-month-picker {
    border: none;
    background: transparent;
    box-shadow: none;
    color: #475569;
    font-weight: 600;
}

#tasks-calendar-view.layer-off-tasks .calendar-task-card:not(.calendar-google):not(.calendar-maintenance):not(.calendar-certificate),
#tasks-calendar-view.layer-off-google .calendar-google,
#tasks-calendar-view.layer-off-maintenance .calendar-maintenance,
#tasks-calendar-view.layer-off-certificate .calendar-certificate {
    display: none !important;
}

.calendar-task-card.calendar-search-hidden {
    display: none !important;
}

.calendar-reschedule-panel {
    position: fixed;
    inset: 0;
    z-index: 12000;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 16px;
}

.calendar-reschedule-panel[hidden] {
    display: none !important;
}

.calendar-reschedule-panel-inner {
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    padding: 16px;
    box-shadow: 0 -8px 30px rgba(15, 23, 42, 0.15);
}

.calendar-reschedule-panel-inner h4 {
    margin: 0 0 12px;
    font-size: 1rem;
}

.calendar-reschedule-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 10px;
    font-size: 0.85rem;
    color: #4b5563;
}

.calendar-reschedule-field input,
.calendar-reschedule-field select {
    border: 1px solid rgba(203, 213, 225, 0.85);
    border-radius: 12px;
    padding: 10px 12px;
    font-size: 1rem;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.calendar-reschedule-field input:focus,
.calendar-reschedule-field select:focus {
    outline: none;
    border-color: rgba(59, 130, 246, 0.55);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.calendar-reschedule-actions .btn {
    min-height: 42px;
    padding: 0 18px;
}

.calendar-reschedule-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
}

.calendar-reschedule-btn {
    border: none;
    background: rgba(255, 255, 255, 0.2);
    color: inherit;
    border-radius: 4px;
    padding: 2px 4px;
    margin-left: auto;
    cursor: pointer;
    line-height: 1;
    flex-shrink: 0;
}

.calendar-reschedule-btn .material-symbols-outlined {
    font-size: 16px;
    vertical-align: middle;
}

.calendar-header h2 {
    font-size: 24px;
    font-weight: 700;
    color: #1f2937;
}

.calendar-grid {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
}

/* Havi nézet: egyetlen 7 oszlopos rács – fejléc és napok oszlopai mindig egybeesnek */
.calendar-month-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 1px;
    background: #e5e7eb;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    overflow: hidden;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.calendar-month-grid > .calendar-day-name {
    background: #f9fafb;
    padding: 12px 6px;
    text-align: center;
    font-weight: 600;
    font-size: 13px;
    color: #6b7280;
    min-width: 0;
    border-bottom: 2px solid #d1d5db;
    box-sizing: border-box;
}

.calendar-day-name {
    background: #f9fafb;
    padding: 12px 8px;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    color: #6b7280;
}

.calendar-day {
    background: white;
    min-height: 100px;
    min-width: 0;
    padding: 6px;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.calendar-day.other-month {
    background: #f9fafb;
}

.calendar-day.today {
    background: #eff6ff;
}

.calendar-day.today .day-number {
    background: #3b82f6;
    color: white;
    border-radius: var(--radius-lg);
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-bottom: none;
    line-height: 1;
    box-sizing: border-box;
}

.day-number {
    font-weight: 600;
    font-size: 14px;
    color: #1f2937;
    margin-bottom: 4px;
    padding-bottom: 4px;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.day-tasks {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
    min-width: 0;
    width: 100%;
    flex: 1 1 auto;
}

.calendar-task {
    padding: 5px 6px;
    border-radius: var(--radius-lg);
    font-size: 11px;
    line-height: 1.2;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.2s;
    min-height: 44px;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 2px;
    position: relative;
    flex-shrink: 0;
}

.calendar-task:hover {
    opacity: 0.88;
    filter: brightness(1.05);
}

/* Befejezett vagy archivált feladatok szürke háttérrel */
.calendar-task.task-completed,
.time-task.task-completed {
    opacity: 0.7;
    font-style: italic;
}

/* Archivált feladatok - nem húzhatók */
.calendar-task.task-archived,
.time-task.task-archived {
    cursor: not-allowed;
    opacity: 0.6;
}

.calendar-task.task-archived:hover,
.time-task.task-archived:hover {
    opacity: 0.6;
    transform: none;
}

.calendar-task.calendar-task-compact {
    min-height: 28px;
    padding: 4px 6px;
    gap: 0;
}

.calendar-task.calendar-task-compact .calendar-task-header-row {
    align-items: center;
}

.calendar-task.calendar-task-compact .task-status-chips {
    display: none;
}

.calendar-task-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    width: 100%;
    min-width: 0;
    flex: 1;
    min-height: 0;
}
.calendar-task-header-row .task-title-short {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.calendar-task-worksheet-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: white;
    border-radius: 50%;
    color: #ef4444;
}
.calendar-task-worksheet-icon .material-symbols-outlined {
    font-size: 12px !important;
}

.time-task-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
}
.time-task-header-row .time-task-title {
    flex: 1;
    min-width: 0;
}
.time-task-worksheet-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: white;
    border-radius: 50%;
    color: #ef4444;
}
.time-task-worksheet-icon .material-symbols-outlined {
    font-size: 14px !important;
}
.calendar-task-worksheet-icon.worksheet-signed,
.time-task-worksheet-icon.worksheet-signed,
.calendar-task-maint-sheet-icon.maint-sheet-signed,
.time-task-maint-sheet-icon.maint-sheet-signed {
    color: #16a34a;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.35);
}

.time-task-cal-icons,
.calendar-task-cal-icons {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.calendar-task-maint-sheet-icon,
.time-task-maint-sheet-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 50%;
    color: #94a3b8;
}
.time-task-maint-sheet-icon {
    width: 20px;
    height: 20px;
}
.calendar-task-worksheet-icon .material-symbols-outlined,
.calendar-task-maint-sheet-icon .material-symbols-outlined {
    font-size: 12px !important;
}
.time-task-worksheet-icon .material-symbols-outlined,
.time-task-maint-sheet-icon .material-symbols-outlined {
    font-size: 14px !important;
}
.calendar-task-maint-sheet-icon.maint-sheet-sent-pending,
.time-task-maint-sheet-icon.maint-sheet-sent-pending {
    color: #ef4444;
    background: white;
}
.calendar-task-maint-sheet-icon.maint-sheet-draft,
.time-task-maint-sheet-icon.maint-sheet-draft {
    color: #94a3b8;
    background: rgba(255, 255, 255, 0.75);
}

.calendar-task-location {
    display: block;
    font-size: 9px;
    line-height: 1.2;
    opacity: 0.92;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    min-width: 0;
}
.time-task-location {
    display: block;
    flex-basis: 100%;
    font-size: 10px;
    opacity: 0.9;
    margin-top: 2px;
}

.task-title-short {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: inherit;
}

/* Többnapos feladat – „folytatódik” nyíl a jobb szélén */
.task-continues-arrow {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    padding: 2px 4px;
    opacity: 0.9;
}
.task-continues-arrow i {
    font-size: 14px;
}
.time-task .task-continues-arrow,
.time-task-cluster .task-continues-arrow {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 0;
}
.time-task,
.time-task-cluster {
    position: relative;
}

/* Week Time Grid View */
.week-time-grid {
    width: 100%;
    overflow-x: auto;
    --cal-week-days: 5;
}

.week-grid-header {
    display: grid;
    grid-template-columns: 50px repeat(var(--cal-week-days, 5), minmax(0, 1fr));
    border-bottom: 2px solid #e5e7eb;
    background: #f9fafb;
    position: sticky;
    top: 0;
    z-index: 10;
}

.time-column-header {
    border-right: 1px solid #e5e7eb;
}

.day-column-header {
    padding: 8px 6px;
    text-align: center;
    border-right: 1px solid #e5e7eb;
    min-width: 0;
}

.day-column-header.today {
    background: #eff6ff;
}

.day-column-header .day-name {
    font-size: 10px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
}

.day-column-header .day-number {
    font-size: 16px;
    font-weight: 700;
    color: #1f2937;
    margin-top: 2px;
}

.day-column-header.today .day-number {
    background: #3b82f6;
    color: white;
    border-radius: var(--radius-lg);
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 2px auto 0;
    padding: 0;
    border-bottom: none;
    line-height: 1;
    box-sizing: border-box;
}

.week-grid-body {
    display: grid;
    grid-template-columns: 50px 1fr;
    position: relative;
}

.time-column {
    border-right: 2px solid #e5e7eb;
    background: #f9fafb;
}

.time-slot {
    height: 65px;
    padding: 2px 4px;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: flex-start;
}

.time-label {
    font-size: 10px;
    font-weight: 600;
    color: #6b7280;
}

.days-columns {
    display: grid;
    grid-template-columns: repeat(var(--cal-week-days, 5), minmax(0, 1fr));
}

.day-column {
    border-right: 1px solid #e5e7eb;
    position: relative;
    min-width: 0;
}

.day-column.today {
    background: #eff6ff;
}

/* Heti / havi nézet – MA gomb a nézetváltó elején */
.week-ma-btn {
    min-width: 36px;
    font-weight: 600;
}

.week-time-grid.week-highlight-today .day-column.today,
.week-time-grid.week-highlight-today .day-column-header.today,
.calendar-month-grid.month-highlight-today .calendar-day.today {
    background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
    box-shadow: inset 0 0 0 2px #3b82f6;
}

.hour-cell {
    height: 65px;
    border-bottom: 1px solid #e5e7eb;
    padding: 2px;
    position: relative;
    transition: all 0.2s;
    min-width: 0;
    overflow: hidden;
}

.hour-cell:hover {
    background: #f9fafb;
    cursor: pointer;
}

.hour-cell.hour-drag-over {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 2px dashed #3b82f6;
    box-shadow: inset 0 0 15px rgba(59, 130, 246, 0.2);
    transform: scale(1.02);
}

.hour-cell::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s;
}

.hour-cell:hover::after {
    opacity: 0.5;
}

.week-next-week-drop {
    margin-top: 12px;
    padding: 16px 20px;
    background: #f3f4f6;
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    text-align: center;
    color: #6b7280;
    font-size: 14px;
    transition: all 0.2s;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.week-next-week-drop:hover {
    background: #e5e7eb;
    color: #4b5563;
}

.week-next-week-drop .material-symbols-outlined {
    font-size: 20px;
}

.time-task {
    border-left: none;
    border-radius: var(--radius-lg);
    padding: 6px 8px;
    margin-bottom: 1px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    cursor: grab;
    transition: all 0.2s;
    font-size: 11px;
    min-width: 0;
    min-height: 54px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

.time-task.dragging-task {
    opacity: 0.5;
    transform: scale(1.05) rotate(2deg);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
    cursor: grabbing;
    z-index: 1000;
}

.time-task:hover {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    transform: scale(1.02);
    z-index: 5;
    opacity: 0.9;
}

/* Feladat kártya ne legyen kattintható - CSAK drag & drop */
.time-task {
    cursor: grab;
    user-select: none;
}

.time-task[draggable="true"]:active,
.time-task:active {
    cursor: grabbing;
}

.time-task * {
    pointer-events: none;
    user-select: none;
}

.time-task a {
    pointer-events: none;
    text-decoration: none;
    color: inherit;
    cursor: grab;
}

.time-task-title {
    font-weight: 600;
    margin-bottom: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px;
    line-height: 1.2;
    color: inherit;
}

.time-task-meta {
    font-size: 9px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px;
    line-height: 1.1;
    color: rgba(255, 255, 255, 0.9);
}

.time-task-meta i {
    font-size: 10px;
}

.time-task-meta span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Idősáv halmaz - több feladat egy cellában */
.time-task-cluster {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    min-height: 38px;
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    color: white;
    border-radius: var(--radius-lg);
    cursor: pointer;
    font-weight: 600;
    font-size: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: all 0.2s ease;
}
.time-task-cluster:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transform: scale(1.02);
}
.time-task-cluster .time-task-cluster-count {
    white-space: nowrap;
}
.time-task-cluster-icon {
    font-size: 18px;
    margin-right: 4px;
}

/* Cluster modal - feladatok listája */
.cluster-task-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cluster-task-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    gap: 12px;
}
.cluster-task-item:hover {
    background: #f3f4f6;
}
.cluster-task-info {
    flex: 1;
    min-width: 0;
}
.cluster-task-title {
    display: block;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 4px;
}
.cluster-task-meta {
    font-size: 0.875rem;
    color: #6b7280;
}
.cluster-task-meta i {
    margin-right: 4px;
}
.cluster-task-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}
.cluster-task-actions .task-modal-btn {
    padding: 8px 12px;
}
.cluster-loading, .cluster-error {
    padding: 2rem;
    text-align: center;
    color: #6b7280;
}
.cluster-loading i {
    font-size: 24px;
    margin-right: 8px;
}
.cluster-spin {
    animation: cluster-spin 1s linear infinite;
}
@keyframes cluster-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Task Form */
/* Task Add Page Header */
.task-add-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
    margin-bottom: 1.5rem;
}

.task-add-header .content-title {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #111827;
}

.task-add-header .btn {
    margin: 0;
}

.task-form {
    max-width: 100%;
}

.task-form .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.task-form .form-row:has(.form-group:only-child) {
    grid-template-columns: 1fr;
}

/* form-group: task-form, maintenance-form-card, maintenance-form - közös */
.task-form .form-group,
.maintenance-form-card .form-group,
.maintenance-form .form-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Hozzárendelve multi-select (task_add) */
.assigned-to-multiselect {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 0.75rem;
    background: #fff;
    max-height: 200px;
    overflow-y: auto;
}
.assigned-to-actions {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.assigned-to-list {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.assigned-to-multiselect .assigned-to-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    padding: 0.25rem 0;
}
.assigned-to-multiselect .assigned-to-item:hover {
    color: var(--primary-500, #3b82f6);
}
.assigned-to-multiselect .assigned-to-item input[type="checkbox"] {
    margin: 0;
    width: auto;
    min-width: 1rem;
    flex-shrink: 0;
    cursor: pointer;
}

/* Értesítés gomb és panel */
.notification-bell-container {
    position: relative;
}
/* Mobil értesítés ikon – desktop-on rejtve, mobilon a hamburger balján */
.notification-bell-mobile {
    position: relative;
}
@media (min-width: 769px) {
    .header-actions-mobile {
        display: none;
    }
    .notification-bell-mobile {
        display: none;
    }
}
.notification-bell-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.5rem;
    color: inherit;
    position: relative;
    border-radius: var(--radius-lg);
    transition: background 0.2s;
}
.notification-bell-btn:hover {
    background: rgba(0,0,0,0.05);
}
.notification-bell-btn .material-symbols-outlined {
    font-size: 1.5rem;
    color: var(--gray-700);
}
.notification-badge {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 1.1rem;
    height: 1.1rem;
    font-size: 0.65rem;
    font-weight: 700;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-variant-numeric: tabular-nums lining-nums;
    background: #ef4444;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 2px;
    box-sizing: border-box;
}
.notification-badge-inner {
    display: block;
    line-height: 1;
    text-align: center;
}
.notification-badge-mobile {
    background: #ef4444;
    color: #fff;
    font-size: 0.7rem;
    padding: 0.1rem 0.4rem;
    border-radius: 10px;
    margin-left: 0.25rem;
}
.notification-panel {
    display: none;
    position: absolute;
    top: calc(100% + 0.5rem + 5px);
    right: 0;
    min-width: 320px;
    width: 380px;
    max-height: 420px;
    /* Tömör háttér – ne látszódjon át a tartalom mögötte (asztal + mobil) */
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-lg);
    box-shadow:
        0 20px 48px rgba(15, 23, 42, 0.14),
        0 4px 14px rgba(15, 23, 42, 0.08);
    z-index: 1000;
    overflow: hidden;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.notification-panel.active {
    display: block;
}
.notification-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    font-weight: 600;
    font-size: 1rem;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.notification-mark-all {
    background: none;
    border: none;
    color: #3b82f6;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    transition: background 0.2s;
}
.notification-mark-all:hover {
    background: rgba(59, 130, 246, 0.1);
}
.notification-panel-list {
    max-height: 340px;
    overflow-y: auto;
    padding: 0.5rem 0;
}
.notification-panel-list::-webkit-scrollbar {
    width: 6px;
}
.notification-panel-list::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
}
.notification-panel-list::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}
.notification-panel-empty {
    padding: 2rem 1.5rem;
    text-align: center;
    color: #64748b;
    font-size: 0.9rem;
}
.notif-item {
    display: block;
    padding: 1rem 1.25rem;
    margin: 0 0.5rem 0.5rem;
    border-radius: 12px;
    border-left: 5px solid #3b82f6;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    transition: background 0.2s, box-shadow 0.2s, transform 0.15s;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}
.notif-item:hover {
    background: #f8fafc;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.notif-item:active {
    transform: scale(0.99);
}
.notif-item.read {
    opacity: 0.8;
    border-left-color: #94a3b8;
}
.notif-item strong {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 1rem;
    color: #1e293b;
    font-weight: 600;
}
.notif-item p {
    margin: 0 0 0.6rem;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.5;
}
.notif-item small {
    display: block;
    font-size: 0.8rem;
    color: #94a3b8;
    margin-bottom: 0.5rem;
}
.notif-item .notif-open-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.6rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
}
.notif-item .notif-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    flex-shrink: 0;
}
.notif-item .notif-actions .task-action-btn {
    width: 1.75rem;
    height: 1.75rem;
    min-width: 1.75rem;
    min-height: 1.75rem;
    padding: 0;
}
.notif-item .notif-actions .task-action-btn .material-symbols-outlined {
    font-size: 1rem;
}
/* Értesítés típus színek */
.notif-item[data-type="certificate"] { border-left-color: #f59e0b; }
.notif-item[data-type="task"] { border-left-color: #3b82f6; }
/* Mobil: nagyobb érintési felület, jobb elválasztás */
@media (max-width: 768px) {
    .notification-panel {
        position: fixed;
        top: calc(var(--header-height, 80px) + env(safe-area-inset-top, 0px));
        left: 0.75rem;
        right: 0.75rem;
        min-width: unset;
        width: auto;
        max-width: none;
        border-radius: 12px;
        max-height: min(70vh, calc(100dvh - var(--header-height, 80px) - env(safe-area-inset-top, 0px) - 1rem));
        z-index: 10050;
        background: #ffffff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    .notif-item {
        padding: 1.15rem 1.25rem;
        margin: 0 0.75rem 0.6rem;
        min-height: 88px;
    }
    .notif-item strong { font-size: 1.05rem; }
    .notif-item p { font-size: 0.95rem; margin-bottom: 0.5rem; }
}
.notifications-page-list .notification-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 0.75rem;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.notifications-page-list .notification-item.read { opacity: 0.8; }
.notifications-page-list .notification-item-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}
.notifications-page-list .btn-danger-outline {
    padding: 0.35rem 0.6rem;
    background: #dc2626;
    color: #fff;
    border: 1px solid #dc2626;
    border-radius: 0.375rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-size: 0.875rem;
}
.notifications-page-list .btn-danger-outline:hover {
    background: #b91c1c;
    color: #fff;
}
.notifications-page-list .btn-danger-outline .material-symbols-outlined {
    font-size: 1.32rem;
    color: #fff;
}
/* Összes értesítés törlése gomb – ne jelenjen meg dupla ikon (a .btn-danger::before + HTML span) */
.page-actions .btn-danger:has(.material-symbols-outlined)::before {
    display: none;
}
.notifications-empty { padding: 2.5rem; text-align: center; color: #64748b; font-size: 0.95rem; }

/* ===== Client assignments page ===== */
.client-assignments-page .client-assign-form-card {
    overflow: visible;
    position: relative;
    z-index: 2;
}
.client-assignments-page .client-assign-form-card .card-content {
    overflow: visible;
}
.client-assignments-page .client-assign-list-card {
    position: relative;
    z-index: 1;
    margin-top: 1.25rem;
    clear: both;
}
.client-assignments-page .client-assign-form-card .searchable-select-wrap.is-open {
    margin-bottom: 15rem;
}
.client-assignments-page .client-assign-list-search-section {
    margin-bottom: 1rem;
}
.client-assignments-page .client-assign-list-search-section .search-form {
    margin: 0;
}
.client-assignments-page .card-header-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}
.client-assignments-page .results-info-badge {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 500;
}
.client-assignments-page .assign-user-name {
    display: block;
    font-weight: 600;
    color: #111827;
}
.client-assignments-page .assign-user-email {
    display: block;
    font-size: 0.8rem;
    color: #6b7280;
    margin-top: 0.15rem;
}
.client-assignments-page .badge {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    font-size: 0.75rem;
    border-radius: 0.25rem;
    font-weight: 500;
}
.client-assignments-page .badge-info {
    background: #e0f2fe;
    color: #0369a1;
}
.client-assignments-page .col-actions {
    width: 1%;
    white-space: nowrap;
}
.client-assignments-page .form-inline {
    display: inline;
}

.client-assignments-page .client-assign-mobile-actions .work-sheet-actions {
    justify-content: flex-end;
}
.client-assignments-page .searchable-select-wrap.is-disabled .searchable-select-trigger {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}
.client-assignments-page .client-assign-locations-hint {
    margin: 0 0 0.75rem;
    font-size: 0.875rem;
    color: #6b7280;
}
.client-assignments-page .client-assign-locations-multiselect {
    margin-top: 0.25rem;
}

.client-assignments-page .client-assign-tabs {
    display: flex;
    gap: 0.5rem;
    margin: 0 0 0.75rem;
    flex-wrap: wrap;
}

.client-assignments-page .client-assign-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-height: 2.5rem;
    padding: 0.55rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #475569;
    font-family: inherit;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

.client-assignments-page .client-assign-tab:hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #1e293b;
}

.client-assignments-page .client-assign-tab.active {
    background: linear-gradient(135deg, #3b82f6, #2563eb);
    border-color: #2563eb;
    color: #fff;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.22);
}

.client-assignments-page .client-assign-tab-panel {
    margin-top: 0.15rem;
}

@media (max-width: 768px) {
    .client-assignments-page .client-assign-form-card,
    .client-assignments-page .client-assign-list-card {
        overflow: hidden;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    .client-assignments-page .client-assign-form-card.client-assign-dropdown-open {
        overflow: visible;
    }
    .client-assignments-page .client-assign-form-card.client-assign-dropdown-open .card-content {
        overflow: visible;
    }
    .client-assignments-page .client-assign-form-card .searchable-select-dropdown.open {
        position: fixed;
        z-index: 10050;
        max-height: min(50vh, 320px);
    }
    .client-assignments-page .client-assign-form-card .card-content,
    .client-assignments-page .client-assign-list-card .card-content {
        overflow-x: hidden;
        padding: 1rem;
        box-sizing: border-box;
    }
    .client-assignments-page .client-assign-form-card .searchable-select-wrap.is-open {
        margin-bottom: 0;
    }
    .client-assignments-page .client-assign-form-card .searchable-select-trigger {
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }
    .client-assignments-page .client-assign-form-card .form-group {
        min-width: 0;
        width: 100%;
        max-width: 100%;
    }
    .client-assignments-page .client-assign-form-card .form-actions {
        padding: 1rem 0 0;
        margin: 0;
    }
    .client-assignments-page .client-assign-list-search-section.search-section {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: 100%;
    }
    .client-assignments-page .client-assign-list-search-section .search-group {
        flex-direction: column;
        align-items: stretch;
    }
    .client-assignments-page .client-assign-list-search-section .search-input,
    .client-assignments-page .client-assign-list-search-section .btn-secondary {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    .client-assignments-page .client-assign-form-card .form-row-2 {
        grid-template-columns: 1fr;
    }
    .client-assignments-page .client-assign-form-card .form-actions .btn {
        width: 100%;
        justify-content: center;
    }
    .client-assignments-page .client-assign-tabs {
        width: 100%;
    }
    .client-assignments-page .client-assign-tab {
        flex: 1 1 0;
        min-height: 44px;
        font-size: 0.9rem;
    }
    .client-assignments-page .client-card .client-header h3 {
        font-size: 1rem;
        line-height: 1.35;
        word-break: break-word;
    }
    .client-assignments-page .client-info-row .info-value {
        word-break: break-word;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 768px) {
    .notifications-page-list .notification-item {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }
    .notifications-page-list .notification-item .btn {
        align-self: flex-start;
    }
    .notification-item-content {
        word-wrap: break-word;
        overflow-wrap: break-word;
        min-width: 0;
    }
}

/* Responsive */
@media (max-width: 1024px) {
    .kanban-board {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .kanban-column {
        min-height: 300px;
    }
}

@media (max-width: 768px) {
    /* Kanban szűrők mobilon - padding balról jobbról */
    .kanban-filters-wrapper {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Kanban oszlopok mobilon - üres oszlop ne legyen magas */
    .kanban-tasks {
        min-height: 60px;
    }
    .kanban-column {
        min-height: auto;
    }

    .view-toggle {
        flex-direction: column;
        gap: 4px;
    }
    
    .view-toggle .btn {
        justify-content: center;
    }
    
    /* Naptár mobilos átalakítás - napok egymás alatt */
    .calendar-grid {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
    
    .calendar-month-grid {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        background: transparent;
        border: none;
        overflow: visible;
    }
    
    .calendar-month-grid > .calendar-day-name {
        display: none;
    }
    
    .calendar-day {
        width: 100%;
        min-height: auto;
        min-width: 0;
        overflow: visible;
        margin-bottom: 0;
        border: 1px solid #e5e7eb;
        border-radius: var(--radius-lg);
        padding: 1rem;
        background: white;
    }
    
    /* Hide empty other-month days on mobile */
    .calendar-container .calendar-day.other-month,
    .week-view .calendar-day.other-month,
    .tasks-calendar-view .calendar-month-grid > .calendar-day.other-month {
        display: none;
    }
    
    .calendar-day-name {
        font-weight: 600;
        font-size: 1rem;
        margin-bottom: 0.5rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #e5e7eb;
        display: block;
    }
    
    /* Heti nézet mobilos átalakítás - napok és idővonal látható */
    .week-time-grid {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        overflow-x: visible;
    }
    
    .week-grid-header {
        display: none;
    }
    
    .week-grid-body {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
    
    .time-column {
        display: none;
    }
    
    .days-columns {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        width: 100%;
    }
    
    .day-column {
        width: 100%;
        border: 1px solid #e5e7eb;
        border-radius: var(--radius-lg);
        padding: 1rem;
        display: block;
        background: white;
    }
    
    .day-column::before {
        content: attr(data-date-label);
        font-weight: 600;
        font-size: 1rem;
        margin-bottom: 0.75rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #e5e7eb;
        display: block;
        color: #1f2937;
    }
    
    .day-column-header {
        font-weight: 600;
        font-size: 1rem;
        margin-bottom: 0.75rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #e5e7eb;
        display: block;
        color: #1f2937;
    }
    
    .day-column-header .day-name,
    .day-column-header .day-number {
        display: inline-block;
    }
    
    .hour-cell {
        min-height: 50px;
        padding: 0.5rem;
        border-bottom: 1px solid #f3f4f6;
        position: relative;
        padding-left: 3.5rem;
    }
    
    .hour-cell::before {
        content: attr(data-hour) ':00';
        font-weight: 600;
        color: #6b7280;
        font-size: 0.875rem;
        position: absolute;
        left: 0.5rem;
        top: 0.5rem;
        width: 2.5rem;
    }
    
    .hour-cell:last-child {
        border-bottom: none;
    }
    
    .time-task {
        margin-top: 0.25rem;
        min-height: 54px;
        padding: 8px 10px;
    }
    
    .calendar-task {
        min-height: 48px;
        padding: 8px 10px;
        font-size: 13px;
    }
    
    .time-task-cluster {
        min-height: 48px;
        padding: 10px 12px;
    }
    
    .task-card {
        padding: 12px;
    }
    
    .task-header {
        flex-direction: column;
        gap: 8px;
    }
    
    .task-actions {
        justify-content: center;
        width: 100%;
    }
    
    .task-btn {
        flex: 1;
        justify-content: center;
        padding: 10px 12px;
        font-size: 13px;
        gap: 8px;
    }
    
    .kanban-column .task-btn span,
    .calendar-day .task-btn span {
        display: inline-block;
        font-size: 13px;
        font-weight: 500;
    }
    
    .task-btn i {
        font-size: 18px;
        flex-shrink: 0;
    }
    
    .form-actions {
        flex-direction: column;
    }
    
    .calendar-header {
        flex-direction: column;
        gap: 1rem;
    }
    
    .calendar-nav {
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.75rem;
        align-items: center;
        justify-content: center;
    }
    
    .calendar-nav h2 {
        flex-basis: 100%;
        width: 100%;
        text-align: center;
        margin: 0;
        font-size: 1.25rem;
        order: -1;
    }
    
    .calendar-nav .btn {
        width: calc(50% - 0.375rem);
        flex: 0 0 calc(50% - 0.375rem);
    }

    .calendar-header-start {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .calendar-header-start .calendar-gcal-connect-btn {
        width: 100%;
        height: 44px;
        align-self: center;
        margin: 0;
    }
    
    .calendar-mode-toggle {
        width: 100%;
        flex-wrap: wrap;
    }
    
    .calendar-mode-toggle .week-ma-btn {
        flex-basis: 100%;
        width: 100%;
        order: -1;
    }
    
    .calendar-mode-toggle a {
        width: calc(33.333% - 0.34rem);
        flex: 0 0 calc(33.333% - 0.34rem);
        justify-content: center;
    }

    .calendar-color-legend {
        margin-left: 0;
        width: 100%;
    }

    .calendar-color-legend-toggle {
        width: 100%;
        justify-content: center;
    }

    .calendar-color-legend-panel {
        position: fixed;
        left: 16px;
        right: 16px;
        top: auto;
        bottom: 16px;
        width: auto;
        max-height: 50vh;
        z-index: 10030;
    }

    .calendar-agenda-row {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 10px;
    }

    .calendar-agenda-time {
        padding-top: 12px;
        font-size: 0.75rem;
    }

    .calendar-toolbar {
        padding: 10px;
        gap: 8px;
    }

    .calendar-toolbar-row-filters {
        grid-template-columns: 1fr;
    }

    .calendar-toolbar-row-meta {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .calendar-layer-toggles {
        justify-content: flex-start;
    }

    .calendar-week-options {
        margin-left: 0;
        width: 100%;
    }

    .calendar-week-options .calendar-week-opt {
        flex: 1;
        justify-content: center;
    }

    #tasks-calendar-view .calendar-toolbar .calendar-location-filter-wrap .searchable-select-dropdown.open {
        position: absolute;
        top: calc(100% + 4px);
        left: 0;
        right: 0;
        width: auto;
        z-index: 10030;
    }

    .time-task-header-row,
    .calendar-task-header-row {
        display: flex;
        align-items: flex-start;
        gap: 4px;
    }
    
    .week-grid-header {
        grid-template-columns: 50px repeat(var(--cal-week-days, 5), minmax(0, 1fr));
    }
    
    .week-grid-body {
        grid-template-columns: 50px 1fr;
    }
    
    .time-column {
        width: 50px;
    }
    
    .time-label {
        font-size: 9px;
    }
    
    .day-column-header .day-name {
        font-size: 10px;
    }
    
    .day-column-header .day-number {
        font-size: 16px;
    }
    
    .time-task {
        font-size: 11px;
    }
    
    .time-task-title {
        font-size: 11px;
    }
    
    .time-task-meta {
        font-size: 9px;
    }
}

/* Google Naptár overlay események */
.calendar-task.calendar-google,
.time-task.calendar-google {
    border-left: 3px solid rgba(255, 255, 255, 0.85);
    cursor: pointer;
}
.calendar-task.calendar-google:hover,
.time-task.calendar-google:hover {
    filter: brightness(1.05);
}

/* Google G + naptár ikon egymás fölött */
.gcal-icon-stack {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    margin-right: 4px;
    vertical-align: middle;
    flex-shrink: 0;
    line-height: 1;
}
.gcal-icon-stack--compact {
    margin-right: 3px;
}
.gcal-icon-stack .gcal-google-svg {
    display: block;
    flex-shrink: 0;
}
.gcal-icon-stack .gcal-google-svg path {
    fill: #ffffff;
}
.gcal-icon-stack .gcal-stack-type-icon {
    margin: 0 !important;
    line-height: 1;
    color: inherit;
    opacity: 0.95;
}
.gcal-icon-stack--compact .gcal-stack-type-icon {
    font-size: 12px !important;
}

/* Nap nézet (napi eseménylista) */

.calendar-agenda-view {
    margin-top: 4px;
    position: relative;
    z-index: 1;
}

.calendar-agenda-summary {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    padding: 0 2px;
    color: #64748b;
    font-size: 0.875rem;
    font-weight: 600;
}

.calendar-agenda-today-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.calendar-agenda-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 180px;
    padding: 24px 16px;
    border: 1px dashed rgba(203, 213, 225, 0.95);
    border-radius: 16px;
    background: rgba(248, 250, 252, 0.85);
    color: #64748b;
    text-align: center;
}

.calendar-agenda-empty .material-symbols-outlined {
    font-size: 36px;
    color: #94a3b8;
}

.calendar-agenda-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.calendar-agenda-row {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
}

.calendar-agenda-time {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding-top: 14px;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #64748b;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
}

.calendar-agenda-card-wrap {
    min-width: 0;
}

.calendar-agenda-card {
    display: grid;
    grid-template-columns: 5px minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 0;
    width: 100%;
    min-height: 56px;
    padding: 0;
    border-radius: 14px;
    border: 1px solid rgba(203, 213, 225, 0.85);
    background: #fff;
    color: #0f172a;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    overflow: hidden;
    cursor: pointer;
    transition: box-shadow 0.18s ease, transform 0.12s ease, border-color 0.18s ease;
}

.calendar-agenda-card:hover {
    border-color: rgba(147, 197, 253, 0.95);
    box-shadow: 0 8px 22px rgba(59, 130, 246, 0.12);
    transform: translateY(-1px);
}

.calendar-agenda-card-accent {
    width: 5px;
    min-height: 100%;
}

.calendar-agenda-card-body {
    padding: 12px 14px;
    min-width: 0;
}

.calendar-agenda-card-title {
    font-size: 0.9375rem;
    font-weight: 700;
    line-height: 1.35;
    color: #0f172a;
    word-break: break-word;
}

.calendar-agenda-card-meta,
.calendar-agenda-card-type {
    margin-top: 4px;
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.35;
}

.calendar-search-hidden-row {
    display: none !important;
}

/* Hónapnézet +N további */
.calendar-day-more-btn {
    display: block;
    width: 100%;
    margin-top: 4px;
    padding: 4px 8px;
    border: none;
    border-radius: 8px;
    background: rgba(241, 245, 249, 0.95);
    color: #475569;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease;
}

.calendar-day-more-btn:hover {
    background: rgba(219, 234, 254, 0.95);
    color: #1d4ed8;
}

/* Színjelmagyarázat */
.calendar-color-legend {
    position: relative;
    margin-left: auto;
    flex-shrink: 0;
    z-index: 3;
}

.calendar-color-legend[open] {
    z-index: 10025;
}

.calendar-color-legend-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    list-style: none;
    cursor: pointer;
    white-space: nowrap;
}

.calendar-color-legend-toggle::-webkit-details-marker {
    display: none;
}

.calendar-color-legend-toggle .material-symbols-outlined {
    font-size: 18px;
}

.calendar-color-legend-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 10026;
    width: min(320px, calc(100vw - 32px));
    max-height: min(360px, 60vh);
    overflow: auto;
    padding: 12px;
    border: 1px solid rgba(203, 213, 225, 0.95);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.14);
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    isolation: isolate;
}

.calendar-color-legend:not([open]) .calendar-color-legend-panel {
    display: none;
}

.calendar-color-legend-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.calendar-color-legend-swatch {
    width: 14px;
    height: 14px;
    border-radius: 4px;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
}

.calendar-color-legend-label {
    font-size: 0.8125rem;
    color: #334155;
    line-height: 1.3;
}

#tasks-calendar-view.layer-off-tasks .calendar-legend-layer-tasks,
#tasks-calendar-view.layer-off-google .calendar-legend-layer-google,
#tasks-calendar-view.layer-off-maintenance .calendar-legend-layer-maintenance,
#tasks-calendar-view.layer-off-certificate .calendar-legend-layer-certificate {
    opacity: 0.35;
}

#tasks-calendar-view[data-calendar-mode="agenda"] .calendar-week-options {
    display: none;
}

/* Mobil kanban: tabos/swipe-os oszlopváltó */
.kanban-mobile-tabs,
.kanban-swipe-hint {
    display: none;
}

@media (max-width: 1024px) {
    .kanban-status-filters {
        display: none !important;
    }

    .kanban-mobile-tabs {
        position: sticky;
        top: 0;
        z-index: 20;
        display: flex;
        gap: 8px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        margin: 0 0 12px;
        padding: 8px 2px 10px;
        background: linear-gradient(180deg, rgba(248, 250, 252, 0.98), rgba(248, 250, 252, 0.9));
        scrollbar-width: none;
    }

    .kanban-mobile-tabs::-webkit-scrollbar {
        display: none;
    }

    .kanban-mobile-tab {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
        min-height: 38px;
        padding: 8px 12px;
        border: 1px solid #dbe3ef;
        border-radius: 999px;
        background: #fff;
        color: #475569;
        font-size: 0.86rem;
        font-weight: 700;
        box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
        cursor: pointer;
        transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
    }

    .kanban-mobile-tab strong {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 22px;
        height: 22px;
        padding: 0 7px;
        border-radius: 999px;
        background: #e2e8f0;
        color: #334155;
        font-size: 0.75rem;
    }

    .kanban-mobile-tab.active {
        border-color: #2563eb;
        background: #2563eb;
        color: #fff;
        box-shadow: 0 10px 24px rgba(37, 99, 235, 0.24);
    }

    .kanban-mobile-tab.active strong {
        background: rgba(255, 255, 255, 0.22);
        color: #fff;
    }

    .kanban-mobile-tab:active {
        transform: scale(0.97);
    }

    .kanban-board {
        display: block;
        min-height: 0;
        touch-action: pan-y;
        position: relative;
    }

    .kanban-swipe-hint {
        position: fixed;
        top: 50%;
        left: auto;
        right: auto;
        z-index: 15;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 56px;
        margin-top: 0;
        transform: translateY(-50%);
        pointer-events: none;
        color: #94a3b8;
        opacity: 0.45;
    }

    .kanban-swipe-hint .material-symbols-outlined {
        font-size: 22px;
        line-height: 1;
    }

    .kanban-swipe-hint--left {
        left: max(4px, env(safe-area-inset-left, 0px));
        background: linear-gradient(90deg, rgba(248, 250, 252, 0.92), rgba(248, 250, 252, 0));
    }

    .kanban-swipe-hint--right {
        right: max(4px, env(safe-area-inset-right, 0px));
        background: linear-gradient(270deg, rgba(248, 250, 252, 0.92), rgba(248, 250, 252, 0));
    }

    .kanban-board:not(.kanban-board-inview) .kanban-swipe-hint {
        display: none;
    }

    .kanban-board.kanban-board-inview .kanban-swipe-hint--left,
    .kanban-board.kanban-board-inview .kanban-swipe-hint--right {
        display: flex;
    }

    .kanban-board.kanban-board-inview[data-swipe-prev="0"] .kanban-swipe-hint--left {
        display: none;
    }

    .kanban-board.kanban-board-inview[data-swipe-next="0"] .kanban-swipe-hint--right {
        display: none;
    }

    .kanban-swipe-hint.kanban-swipe-hint-pulse {
        animation: kanbanSwipeHintPulse 1s ease-in-out 4;
    }

    .kanban-board .kanban-column {
        display: none;
        min-height: auto;
    }

    .kanban-board .kanban-column.kanban-mobile-active {
        display: block;
    }

    .kanban-board.kanban-mobile-switching .kanban-column.kanban-mobile-active {
        animation-duration: 0.24s;
        animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
        animation-fill-mode: both;
    }

    .kanban-board.kanban-swipe-left .kanban-column.kanban-mobile-active {
        animation-name: kanbanMobileSlideFromRight;
    }

    .kanban-board.kanban-swipe-right .kanban-column.kanban-mobile-active {
        animation-name: kanbanMobileSlideFromLeft;
    }

    .kanban-tasks {
        min-height: 60px;
    }
}

@keyframes kanbanMobileSlideFromRight {
    from {
        opacity: 0;
        transform: translateX(24px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes kanbanMobileSlideFromLeft {
    from {
        opacity: 0;
        transform: translateX(-24px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes kanbanSwipeHintPulse {
    0%, 100% {
        opacity: 0.38;
        color: #94a3b8;
        transform: translateY(-50%) scale(1);
    }
    50% {
        opacity: 0.95;
        color: #2563eb;
        transform: translateY(-50%) scale(1.14);
    }
}



/* ========== kiszervezve: pages/tasks.php ========== */
.gcal-task-type-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.gcal-type-btn { flex: 1; min-width: 90px; padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; cursor: pointer; font-size: 0.9rem; font-weight: 500; }
.gcal-type-btn:hover { border-color: #3b82f6; }
.gcal-type-btn.active { background: #eff6ff; border-color: #2563eb; color: #1d4ed8; }
.gcal-link-form.gcal-loading .gcal-field-extra { opacity: 0.5; pointer-events: none; }
#google-event-modal .searchable-select-dropdown.open { z-index: 10050; }
#google-event-modal .gcal-modal-footer {
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 8px;
}
#google-event-modal .gcal-modal-footer .btn-primary,
#google-event-modal .gcal-modal-footer .btn-secondary,
#google-event-modal .gcal-modal-footer .task-modal-btn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
}
#tasks-calendar-view .calendar-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 0;
}
#tasks-calendar-view .calendar-toolbar {
    width: 100%;
    flex: 1 1 100%;
    box-sizing: border-box;
}
#tasks-calendar-view .calendar-toolbar .searchable-select-dropdown:not(.open) {
    display: none !important;
}
#tasks-calendar-view .calendar-toolbar .searchable-select-dropdown.open {
    display: block;
}
#tasks-calendar-view .calendar-header-start {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    min-width: 0;
}
#tasks-calendar-view .calendar-header-start .calendar-nav {
    order: 1;
    margin-left: 0;
}
#tasks-calendar-view .calendar-header-start .calendar-gcal-sync {
    order: 2;
    margin-right: 0 !important;
}
.calendar-google-linked {
    box-shadow: inset 3px 0 0 rgba(26, 115, 232, 0.85);
}
#gcal-modal-source-badge {
    display: none;
    margin: 0 0 10px;
    padding: 6px 10px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #1a73e8;
    background: #e8f0fe;
    border-radius: 6px;
}
#gcal-modal-stale-warning {
    margin: 0 0 10px;
    padding: 10px 12px;
    font-size: 0.88rem;
    line-height: 1.45;
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fcd34d;
    border-radius: 8px;
}
#gcal-modal-stale-warning[hidden] { display: none !important; }
#gcal-modal-auvi-summary {
    display: none;
    margin-bottom: 12px;
    padding: 10px 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.9rem;
}
#gcal-modal-auvi-summary .task-detail-row { margin-bottom: 6px; }
#gcal-modal-auvi-summary .task-detail-row:last-child { margin-bottom: 0; }


/* ========== equipment.css ========== */

/* Eszközkezelés stílusok (main.css-ből kiemelve) */

/* =============================================================================
   ESZKÖZKEZELÉS STÍLUSOK
   ============================================================================= */

.equipment-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1.5rem;
}

.equipment-card {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    transition: all 0.2s ease;
}

.equipment-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.equipment-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e5e7eb;
}

.equipment-card-header h4 {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
    flex: 1;
}

/* Szerkesztő fejléc */
.equipment-add-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.equipment-add-card-header-main {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    min-width: 0;
    flex: 1 1 auto;
}

.equipment-add-card-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
}

.equipment-group-nav-row,
.equipment-group-nav-row .form-group {
    min-width: 0;
    max-width: 100%;
}
.equipment-group-nav-row {
    margin-bottom: 1rem;
}
.equipment-group-nav-row small {
    display: block;
    overflow-wrap: anywhere;
}
.equipment-group-stepper {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.equipment-group-stepper .form-select {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: 100%;
}
.equipment-group-stepper .btn,
.equipment-group-stepper .btn-secondary {
    flex: 0 0 auto;
    width: auto;
    min-width: 2.75rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
#equipment-form .distance-input-group {
    max-width: 100%;
    min-width: 0;
}
#equipment-form .distance-input-group .btn,
#equipment-form .distance-input-group .btn-secondary {
    width: auto;
    flex: 0 0 auto;
}

@media (max-width: 640px) {
    .equipment-add-card-header {
        align-items: center;
    }

    .equipment-add-card-title {
        font-size: 1.05rem;
        line-height: 1.3;
    }
}

.equipment-badge {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: var(--radius-lg);
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
}

.equipment-badge.fire_alarm {
    background: #fee2e2;
    color: #991b1b;
}

.equipment-badge.fire_smoke_barrier {
    background: #fef3c7;
    color: #92400e;
}

.equipment-badge.emergency_lighting {
    background: #fef3c7;
    color: #92400e;
}

.equipment-badge.gas_detection {
    background: #d1fae5;
    color: #065f46;
}

.equipment-badge.smoke_heat_exhaust {
    background: #e0e7ff;
    color: #3730a3;
}

.equipment-card-body {
    margin-bottom: 1rem;
}

.equipment-card-body p {
    margin: 0.5rem 0;
    font-size: 0.875rem;
    color: #6b7280;
}

.equipment-card-body strong {
    color: #374151;
    font-weight: 500;
}

/* Equipment card actions - már definiálva fentebb */

.no-data {
    text-align: center;
    padding: 3rem;
    color: #6b7280;
    font-size: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.no-data-link {
    display: inline-flex;
    margin-top: 0;
    text-decoration: none;
}

.equipment-add-existing-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.875rem;
}
.equipment-add-existing-list .equipment-group-sample,
.equipment-add-existing-list .equipment-card-compact-sample {
    margin: 0;
    color: #475569;
    font-size: 0.84rem;
}

#equipment-list.clients-grid {
    padding-bottom: 1.5rem;
}

.equipment-suggest-wrap {
    position: relative;
    width: 100%;
}
.equipment-suggest-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 2px;
    background: #fff;
    border: 2px solid #e5e7eb;
    border-radius: var(--radius-lg, 0.5rem);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 10020;
    max-height: 240px;
    overflow-y: auto;
}
.equipment-suggest-dropdown.open {
    display: block;
}
.equipment-suggest-option.is-active,
.equipment-suggest-option:hover {
    background: #eff6ff;
}

@media (max-width: 768px) {
    .equipment-add-existing-list {
        grid-template-columns: 1fr;
    }
    .equipment-suggest-dropdown.open {
        position: fixed;
        z-index: 10020;
    }
}

.system-specific-fields {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

/* Operation log status styles */
.operation-log-status {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.log-status-exists {
    color: #10b981;
    font-size: 0.875rem;
}

.log-status-exists .material-symbols-outlined {
    margin-right: 4px;
}

.log-create-btn {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
}

.log-create-btn .material-symbols-outlined {
    margin-right: 2px;
}

.log-confirmation-hidden {
    display: none;
}

.log-confirmation {
    margin-top: 0.5rem;
    padding: 0.75rem;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    border-radius: var(--radius-lg).375rem;
}

.log-confirmation-text {
    margin: 0 0 0.5rem 0;
    font-size: 0.875rem;
    color: #92400e;
}

.log-confirmation-text .material-symbols-outlined {
    margin-right: 4px;
}

.log-confirmation-actions {
    display: flex;
    gap: 0.5rem;
}

.log-confirmation-form {
    display: inline;
}

.log-confirmation-btn {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
}

.log-confirmation-btn .material-symbols-outlined {
    margin-right: 2px;
}

.location-form-hidden {
    display: none;
}

.profile-icon.material-symbols-outlined {
    font-size: 24px;
}

.client-info-icon,
.client-section-icon {
    display: inline-block;
    vertical-align: middle;
    margin-right: 4px;
}

.client-detail-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.client-detail-row .material-symbols-outlined {
    font-size: 18px;
    color: #6b7280;
    flex-shrink: 0;
}

.client-section-icon {
    color: #ef4444;
}

.certificate-form-close-btn {
    margin-left: auto;
}

/* Tanúsítvány form fehér háttere */
#certificate-form.client-form-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
}
#certificate-form .card-header {
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}
#certificate-form .card-content {
    background: #ffffff;
}

/* Mobilon: Bezárás gomb új sorban, középre */
@media (max-width: 768px) {
    #certificate-form .card-header {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    #certificate-form .card-title {
        text-align: center;
    }
    #certificate-form .certificate-form-close-btn {
        margin-left: 0;
        align-self: center;
    }

    /* Equipment list mobile: keep small side gutters */
    #equipment-list.clients-grid {
        padding-left: 0.4rem;
        padding-right: 0.4rem;
        padding-bottom: 1.5rem;
        box-sizing: border-box;
    }
    #equipment-list.clients-grid .client-card {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
}

.expiry-date-display {
    padding: 8px 12px;
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: var(--radius-lg);
    color: #16a34a;
}

.certificate-type-icon {
    font-size: 16px;
    margin-right: 4px;
}

.certificate-type-icon[data-cert-color] {
    color: var(--cert-color);
}

.certificate-info-icon {
    font-size: 16px;
    margin-right: 6px;
}

.certificate-status-badge {
    margin-left: 8px;
}

.certificate-actions {
    padding-top: 1rem;
    border-top: 1px solid #f3f4f6;
}

.certificate-actions-grid {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: center;
}

.certificate-form-hidden {
    display: none;
}

.empty-icon.material-symbols-outlined {
    font-size: 64px;
}

.btn-back-override {
    pointer-events: auto;
    z-index: 9999;
    position: relative;
}

.btn-back .material-symbols-outlined {
    margin-right: 6px;
}

/* Karbantartási jegyzőkönyv stílusok */
.maintenance-document {
    max-width: 1000px;
    margin: 0 auto;
    background: white;
    padding: 40px;
    font-family: 'Arial', sans-serif;
    line-height: 1.4;
    color: #333;
    font-size: 14px;
}

.document-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 4px;
    border-bottom: 0.5px solid #000;
    padding-bottom: 3px;
}

.company-logo {
    height: 47px;
    width: auto;
    margin: 0 0 5px 0;
    max-width: 176px;
}

.company-info p {
    margin: 0;
    color: #666;
    font-style: italic;
    font-size: 12px;
    line-height: 1.4;
}

.document-info {
    text-align: left;
    font-size: 12px;
    line-height: 1.4;
}

.document-info p {
    margin: 2px 0;
    line-height: 1.4;
}

.document-title {
    text-align: center;
    margin-bottom: 15px;
}

.document-title h2 {
    color: #dc2626;
    font-size: 18px;
    margin: 0 0 5px 0;
    line-height: 1.4;
    font-weight: bold;
}

.document-title i {
    margin-right: 8px;
    font-size: 16px;
}

.regulation-ref {
    color: #666;
    font-style: italic;
    font-size: 12px;
    margin: 0;
    line-height: 1.4;
}

.document-title--regulation-below h2 {
    margin-top: 0;
    margin-bottom: 6px;
}
.document-title--regulation-below .regulation-ref {
    margin-top: 0;
    margin-bottom: 0;
}


.section {
    margin-bottom: 20px;
    page-break-inside: avoid;
}

.section h3 {
    color: #dc2626;
    border-bottom: 1px solid #dc2626;
    padding-bottom: 4px;
    margin-bottom: 12px;
    font-size: 16px;
    line-height: 1.4;
    font-weight: bold;
}

.section h4 {
    color: #333;
    margin: 15px 0 8px 0;
    font-size: 14px;
    line-height: 1.4;
    font-weight: bold;
}

.info-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2px;
    margin: 2px 0;
}

.info-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    margin-bottom: 3px;
    font-size: 13px;
    line-height: 1.4;
}

.info-item label {
    font-weight: bold;
    color: #555;
    font-size: 13px;
    margin-bottom: 2px;
}

.info-item span {
    flex: 1;
    font-size: 13px;
}

.equipment-list {
    display: grid;
    gap: 10px;
    margin-bottom: 20px;
}

.equipment-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: #f8f9fa;
    border-radius: var(--radius-lg);
    border-left: 3px solid #dc2626;
}

.equipment-type {
    font-weight: bold;
}

.equipment-count {
    color: #dc2626;
    font-weight: bold;
}

.equipment-manufacturer {
    color: #666;
    font-style: italic;
}

.extinguisher-table table,
.participants-table table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-size: 12px;
}

.extinguisher-table th,
.extinguisher-table td,
.participants-table th,
.participants-table td {
    border: 1px solid #ddd;
    padding: 4px 6px;
    text-align: left;
    font-size: 11px;
}

.extinguisher-table th,
.participants-table th {
    background: #f8f9fa;
    font-weight: bold;
    color: #555;
    font-size: 11px;
}

.text-center {
    text-align: center;
}

.signature-field {
    width: 120px;
    border-bottom: 1px solid #333;
    border-left: none;
    border-right: none;
    border-top: none;
}

.notes-content {
    background: transparent;
    padding: 0;
    border-radius: var(--radius-lg);
    border: none;
    min-height: 80px;
}

.notes-section {
    margin-bottom: 10px;
}

.notes-title {
    margin-bottom: 6px;
    font-weight: bold;
    font-size: 13px;
}

.notes-box {
    padding: 8px 10px;
    background-color: transparent;
    border: 1px solid #ddd;
    border-radius: 0;
    font-size: 12px;
    line-height: 1.4;
}

.signature-section,
.signature-table {
    margin: 25px 0 15px 0;
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border: none;
}

.signature-table td {
    vertical-align: top;
    text-align: center;
    padding: 4px 15px;
    border: none;
}

.signature-table .sig-cell.sig-left {
    width: 50%;
}

.signature-table .sig-cell.sig-right {
    width: 50%;
}

.signature-table .sig-row.sig-area td {
    padding-top: 0;
    padding-bottom: 8px;
    vertical-align: bottom;
}

.signature-table .sig-row.sig-area {
    min-height: 80px;
}

.signature-table .sig-row.sig-area .signature-line,
.signature-table .sig-row.sig-area .signature-image-container {
    margin: 0 auto;
}

.signature-table .sig-row.sig-title td,
.signature-table .sig-row.sig-name td,
.signature-table .sig-row.sig-date td {
    font-size: 0.9rem;
    line-height: 1.3;
}

.signature-table .sig-maintainer-cert {
    margin-top: 0.35rem;
    font-size: 0.85rem;
    color: #374151;
}

/* Régi struktúra kompatibilitás (signature-section/box) */
.signature-box {
    flex: 1;
    text-align: center;
    border: none;
}

.signature-line {
    border-bottom: 1px solid #333;
    width: 200px;
    height: 80px;
    margin: 0 auto 10px;
}

.signature-box p {
    margin: 5px 0;
    font-size: 0.9rem;
}

.signature-image-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
}

.signature-image {
    max-width: min(240px, 100%);
    max-height: 96px;
    width: auto;
    height: auto;
    object-fit: contain;
    border: none;
    background: transparent;
}

/* Ellenőrzési pontok táblázat stílusok */
.checklist-table {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0;
    font-size: 11px;
}

.checklist-table th {
    background-color: #f5f5f5;
    padding: 4px 6px;
    text-align: left;
    border: 1px solid #ddd;
    font-weight: bold;
    font-size: 10.5px;
}

.checklist-table td {
    padding: 4px 6px;
    border: 1px solid #ddd;
    font-size: 10.5px;
}

.checklist-table .status-ok {
    background-color: #d1fae5;
    color: #059669;
    font-weight: bold;
    text-align: center;
}

.checklist-table .status-error {
    background-color: #fecaca;
    color: #b91c1c;
    font-weight: bold;
    text-align: center;
}

.checklist-table .status-na {
    background-color: #f3f4f6;
    color: #6b7280;
    font-weight: bold;
    text-align: center;
}

.checklist-megjegyzes-row {
    background: #f9fafb;
}
.checklist-table td.checklist-megjegyzes-cell,
.checklist-megjegyzes-cell {
    padding-left: 2rem;
    font-size: 0.9rem;
    color: #4b5563;
}
.checklist-megjegyzes-cell .megjegyzes-label {
    font-weight: 600;
    color: #374151;
    margin-right: 0.5rem;
}
.checklist-table .status-unknown {
    background-color: #fef3c7;
    color: #d97706;
    text-align: center;
}

/* Állapot oszlop fix szélesség – Megfelelő / Nem felel meg / Nem releváns egyforma hely */
.checklist-table:not(.suppression-status-fixed-table) th.checklist-table-th-center,
.checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-center {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
}

/* Oltórendszer jegyzőkönyv: szűkebb "Állapot" oszlop (konkrétan a 2. oszlop) – nem az oltó fix-táblákra */
.maintenance-document.maintenance-doc-suppression .checklist-table:not(.suppression-status-fixed-table),
.maintenance-document.maintenance-doc-suppression .checklist-table-print-split:not(.suppression-status-fixed-table) {
    table-layout: fixed;
    width: 100%;
}
.maintenance-document.maintenance-doc-suppression .checklist-table:not(.suppression-status-fixed-table) th:nth-child(2),
.maintenance-document.maintenance-doc-suppression .checklist-table:not(.suppression-status-fixed-table) td:nth-child(2),
.maintenance-document.maintenance-doc-suppression .checklist-table-print-split:not(.suppression-status-fixed-table) th:nth-child(2),
.maintenance-document.maintenance-doc-suppression .checklist-table-print-split:not(.suppression-status-fixed-table) td:nth-child(2) {
    width: 50px;
    min-width: 50px;
    max-width: 50px;
    white-space: normal;
    word-break: break-word;
}

/* Oltó + tűzjelző: számértékek sorai a táblázat végén – nincs zöld/sárga állapot színezés */
.checklist-table tr.checklist-table-row-data td {
    background-color: #fff;
    color: #333;
}
.checklist-table td.checklist-table-td-data {
    background-color: #fff !important;
    color: #333 !important;
    font-weight: normal;
    text-align: left;
    white-space: normal;
    word-break: break-word;
}

/* Ellenőrzési táblázat 2 részre szedve – képernyő és nyomtatás azonos */
.maintenance-document .checklist-table-print-split {
    font-size: 10px;
    margin: 4px 0;
}
.maintenance-document .checklist-table-print-split th,
.maintenance-document .checklist-table-print-split td {
    padding: 2px 5px;
    font-size: 10px;
    line-height: 1.2;
    border: 1px solid #333;
}
.maintenance-document .checklist-table-print-split th {
    font-size: 10.5px;
    font-weight: bold;
}

/* fire_maintenance: képernyő = nyomtatás (WYSIWYG) – betűméret +25% */
.maintenance-doc-fire {
    font-size: 13px;
    line-height: 1.25;
    padding: 20px;
    max-width: 210mm;
    margin: 0 auto;
}
.maintenance-doc-fire .document-header {
    margin-bottom: 4px;
    padding-bottom: 3px;
    border-bottom: 0.5px solid #000;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.maintenance-doc-fire .document-title {
    text-align: center;
    margin-bottom: 4px;
}
.maintenance-doc-fire .document-title h2 {
    font-size: 20px;
    margin: 0 0 2px 0;
    line-height: 1.15;
}
.maintenance-doc-fire .regulation-ref {
    font-size: 13px;
    margin: 0;
    line-height: 1.15;
}
.maintenance-doc-fire .document-title--regulation-below h2 {
    margin-top: 0;
    margin-bottom: 3px;
}
.maintenance-doc-fire .document-title--regulation-below .regulation-ref {
    margin-top: 0;
    margin-bottom: 0;
    font-style: normal;
    color: #333;
}
.maintenance-doc-fire .maintenance-fire-otsz-checklists > h3 {
    font-size: 16px;
}
.maintenance-doc-fire .maintenance-checklist-part-title {
    font-size: 14px;
    margin: 4px 0 2px 0;
    padding-bottom: 0;
    border-bottom: none;
    font-weight: bold;
    line-height: 1.15;
}
.maintenance-doc-fire .section {
    margin-bottom: 3px;
}
.maintenance-doc-fire .checklist-table-section h3 {
    margin: 0 0 2px 0;
}
.maintenance-doc-fire .section h3 {
    font-size: 16px;
    margin: 0 0 4px 0;
    padding-bottom: 2px;
    border-bottom: 0.5px solid #000;
    line-height: 1.15;
}
.maintenance-doc-fire .maintenance-info-container {
    gap: 4px;
    margin-bottom: 3px;
}
.maintenance-doc-fire .maintenance-info-section {
    margin-bottom: 0;
}

/* Létesítmény és Karbantartási adatok táblázatos elrendezés */
.maintenance-info-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    margin: 4px 0;
}
.maintenance-info-table th,
.maintenance-info-table td {
    padding: 4px 8px;
    border: 1px solid #ccc;
    text-align: left;
    vertical-align: top;
}
.maintenance-info-th {
    font-weight: bold;
    color: #333;
    background: #f5f5f5;
    width: 35%;
    min-width: 140px;
}
.maintenance-info-td {
    color: #2c3e50;
}
.maintenance-time-footnote {
    display: block;
    font-size: 0.82rem;
    color: #5c6370;
    margin: 0.45rem 0 0 0;
    line-height: 1.4;
    font-weight: normal;
}
.maintenance-time-footnote--app {
    margin-top: 0.35rem;
}
.maintenance-time-footnote--form {
    margin-top: 0.4rem;
    max-width: 28rem;
}
.maintenance-doc-fire .maintenance-info-table {
    font-size: 14px !important;
}
.maintenance-doc-fire .maintenance-info-table th,
.maintenance-doc-fire .maintenance-info-table td {
    font-size: 14px !important;
    padding: 4px 8px !important;
}
.maintenance-doc-fire .maintenance-info-table .result-megfelelő,
.maintenance-doc-fire .maintenance-info-table .result-nem_megfelelő,
.maintenance-doc-fire .maintenance-info-table .result-nem_releváns {
    font-size: 14px !important;
}

.maintenance-doc-fire .info-grid-compact {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2px 8px;
    margin: 2px 0;
}
.maintenance-doc-fire .info-grid-compact .info-item {
    gap: 4px;
    margin-bottom: 1px;
    font-size: 13px !important;
    line-height: 1.15;
}
.maintenance-doc-fire .info-grid-compact .info-item label {
    min-width: 100px;
    font-size: 13px !important;
}
.maintenance-doc-fire .info-grid-compact .info-item span {
    font-size: 13px !important;
}
.maintenance-doc-fire .info-grid-compact .result-megfelelő,
.maintenance-doc-fire .info-grid-compact .result-nem_megfelelő,
.maintenance-doc-fire .info-grid-compact .result-nem_releváns {
    font-size: 13px !important;
}
.maintenance-doc-fire .company-logo {
    height: 66px;
    max-width: 206px;
}
.maintenance-doc-fire .company-brand {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.65rem;
}
.maintenance-doc-fire .company-brand-name {
    font-size: 1.85rem;
    font-weight: 700;
    line-height: 1.1;
    display: flex;
    align-items: center;
}
.maintenance-doc-fire .company-info p {
    font-size: 13px;
    margin: 0;
    line-height: 1.15;
}
.maintenance-doc-fire .document-info,
.maintenance-doc-fire .document-info p {
    font-size: 13px;
    margin: 0;
    line-height: 1.15;
}
/* Ellenőrzési táblázat +25% */
.maintenance-doc-fire .checklist-table-print-split {
    font-size: 12.5px;
    margin: 4px 0;
}
.maintenance-doc-fire .checklist-table-print-split th,
.maintenance-doc-fire .checklist-table-print-split td {
    font-size: 12.5px;
    padding: 2px 5px;
    line-height: 1.2;
}
.maintenance-doc-fire .checklist-table-print-split th {
    font-size: 13px;
}

/* maintenance_view (képernyő): egy olvasható, reszponzív nézet – nem A4/papír előnézet. Nyomtatás: @media print érintetlen. */
@media not print {
    body.maintenance-view-read {
        background: #ebeef2;
        margin: 0;
        min-height: 100vh;
    }

    .maintenance-view-read.maintenance-document {
        max-width: min(100%, 56rem);
        margin: 0 auto;
        padding: 1.25rem clamp(0.75rem, 3vw, 1.75rem);
        font-size: 15px;
        line-height: 1.5;
        border-radius: 12px;
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07);
        box-sizing: border-box;
    }

    .maintenance-view-read .document-actions-top {
        margin: 0 0 1rem 0;
        padding: 0.75rem 1rem;
        background: #f1f3f5;
        border-radius: 10px;
        border: 1px solid #e2e5ea;
    }

    /* Tűzjelző: képernyőn ne 210 mm „lap” */
    .maintenance-view-read.maintenance-doc-fire {
        max-width: min(100%, 56rem);
        font-size: 15px;
        line-height: 1.5;
        padding: 1.25rem clamp(0.75rem, 3vw, 1.75rem);
    }

    .maintenance-view-read .document-title {
        margin-bottom: 1rem;
    }

    .maintenance-view-read .document-title h2 {
        font-size: clamp(1.15rem, 2.4vw, 1.4rem);
        line-height: 1.35;
    }

    .maintenance-view-read .regulation-ref {
        font-size: 0.9rem;
        line-height: 1.45;
    }

    .maintenance-view-read .document-info,
    .maintenance-view-read .document-info p {
        font-size: 0.9rem;
        line-height: 1.45;
    }

    .maintenance-view-read .company-info p {
        font-size: 0.85rem;
    }

    .maintenance-view-read .section {
        margin-bottom: 1.25rem;
    }

    .maintenance-view-read .section h3 {
        font-size: 1.08rem;
        margin-bottom: 0.65rem;
        padding-bottom: 0.35rem;
    }

    .maintenance-view-read .section h4 {
        font-size: 1rem;
    }

    .maintenance-view-read .maintenance-info-container {
        gap: 0.75rem;
    }

    .maintenance-view-read .maintenance-info-table,
    .maintenance-view-read .maintenance-info-table th,
    .maintenance-view-read .maintenance-info-table td {
        font-size: 15px;
        line-height: 1.45;
    }

    .maintenance-view-read .maintenance-info-table th,
    .maintenance-view-read .maintenance-info-table td {
        padding: 0.5rem 0.75rem;
    }

    .maintenance-view-read.maintenance-doc-fire .maintenance-info-table,
    .maintenance-view-read.maintenance-doc-fire .maintenance-info-table th,
    .maintenance-view-read.maintenance-doc-fire .maintenance-info-table td {
        font-size: 15px !important;
        line-height: 1.45 !important;
        padding: 0.5rem 0.75rem !important;
    }

    .maintenance-view-read.maintenance-doc-fire .document-title h2 {
        font-size: clamp(1.2rem, 2.6vw, 1.45rem);
    }

    .maintenance-view-read.maintenance-doc-fire .section h3 {
        font-size: 1.1rem;
    }

    .maintenance-view-read.maintenance-doc-fire .company-info p,
    .maintenance-view-read.maintenance-doc-fire .document-info,
    .maintenance-view-read.maintenance-doc-fire .document-info p {
        font-size: 0.95rem;
        line-height: 1.45;
    }

    .maintenance-view-read.maintenance-doc-fire .info-grid-compact .info-item,
    .maintenance-view-read.maintenance-doc-fire .info-grid-compact .info-item label,
    .maintenance-view-read.maintenance-doc-fire .info-grid-compact .info-item span {
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    /* Ellenőrző táblázatok: olvasható méret képernyőn */
    .maintenance-view-read .checklist-table-print-split {
        font-size: 13px;
        margin: 0.75rem 0;
    }

    .maintenance-view-read .checklist-table-print-split th,
    .maintenance-view-read .checklist-table-print-split td {
        font-size: 13px;
        line-height: 1.4;
        padding: 7px 9px;
    }

    .maintenance-view-read .checklist-table-print-split th {
        font-size: 13px;
    }

    .maintenance-view-read.maintenance-doc-fire .checklist-table-print-split,
    .maintenance-view-read.maintenance-doc-fire .checklist-table-print-split th,
    .maintenance-view-read.maintenance-doc-fire .checklist-table-print-split td {
        font-size: 13px;
        line-height: 1.4;
        padding: 7px 9px;
    }

    .maintenance-view-read.maintenance-doc-fire .checklist-table-print-split th {
        font-size: 13px;
    }

    .maintenance-view-read .checklist-table {
        font-size: 13px;
        margin: 0.65rem 0;
    }

    .maintenance-view-read .checklist-table th,
    .maintenance-view-read .checklist-table td {
        font-size: 13px;
        line-height: 1.4;
        padding: 8px 10px;
    }

    .maintenance-view-read .checklist-table th {
        font-size: 13px;
    }

    .maintenance-view-read .checklist-table td.checklist-megjegyzes-cell,
    .maintenance-view-read .checklist-megjegyzes-cell {
        font-size: 13px;
        padding-left: 1.25rem;
    }

    .maintenance-view-read .notes-title {
        font-size: 1rem;
    }

    .maintenance-view-read .notes-box {
        font-size: 14px;
        line-height: 1.5;
        padding: 0.65rem 0.85rem;
    }

    .maintenance-view-read.maintenance-doc-fire .notes-title {
        font-size: 1rem;
    }

    .maintenance-view-read.maintenance-doc-fire .notes-box {
        font-size: 14px;
        line-height: 1.5;
    }

    .maintenance-view-read .signature-table .sig-row.sig-title td,
    .maintenance-view-read .signature-table .sig-row.sig-name td,
    .maintenance-view-read .signature-table .sig-row.sig-date td {
        font-size: 14px;
        line-height: 1.45;
    }

    .maintenance-view-read.maintenance-doc-fire .signature-table td {
        font-size: 14px;
    }

    .maintenance-view-read .document-footer {
        font-size: 0.8rem;
        line-height: 1.45;
    }

    /* RWA: képernyőn ne „zsúfolt lap” */
    .maintenance-view-read.rwa-maintenance-doc.maintenance-document {
        font-size: 15px;
    }

    .maintenance-view-read.rwa-maintenance-doc .document-title h2 {
        font-size: clamp(1.1rem, 2.2vw, 1.3rem);
    }

    .maintenance-view-read.rwa-maintenance-doc .section h3 {
        font-size: 1.05rem;
    }

    .maintenance-view-read.rwa-maintenance-doc .checklist-table th,
    .maintenance-view-read.rwa-maintenance-doc .checklist-table td {
        font-size: 13px;
        padding: 7px 9px;
    }

    .maintenance-view-read.rwa-maintenance-doc .checklist-table td.checklist-megjegyzes-cell {
        font-size: 12px;
    }

    .maintenance-view-read.rwa-maintenance-doc .info-grid-compact .info-item label,
    .maintenance-view-read.rwa-maintenance-doc .info-grid-compact .info-item span {
        font-size: 14px;
    }
}

/* fire_maintenance: táblázat alatti részek (tapasztalatok, aláírások) +15% */
.maintenance-doc-fire .tapasztalatok-megjegyzesek-section h3 {
    font-size: 16px;
}
.maintenance-doc-fire .notes-title {
    font-size: 15px;
}
.maintenance-doc-fire .notes-box {
    font-size: 14px;
    background-color: transparent !important;
    border-radius: 0 !important;
}
.maintenance-doc-fire .signature-table td {
    font-size: 12px;
}

/* RWA jegyzőkönyv – egy oldalra illesztés, nagyobb kérdésszekció */
.rwa-maintenance-doc .document-header,
.rwa-maintenance-doc .document-title {
    margin-bottom: 0.5rem;
}
.rwa-maintenance-doc .document-title h2 {
    font-size: 1.2rem;
}
.rwa-maintenance-doc .maintenance-info-container .section {
    margin-bottom: 0.4rem;
}
.rwa-maintenance-doc .section {
    margin-bottom: 0.5rem;
}
.rwa-maintenance-doc .section h3 {
    margin-bottom: 0.35rem;
    font-size: 1.05rem;
}
.rwa-maintenance-doc .info-grid-compact .info-item {
    padding: 0.25rem 0.4rem;
}
.rwa-maintenance-doc .checklist-table {
    font-size: 10.5px;
    margin: 4px 0;
}
.rwa-maintenance-doc .checklist-table th,
.rwa-maintenance-doc .checklist-table td {
    padding: 4px 6px;
    font-size: 9.5px;
}
.rwa-maintenance-doc .checklist-table th {
    font-size: 9.5px;
}
.rwa-maintenance-doc .checklist-table td.checklist-megjegyzes-cell {
    font-size: 8.5px;
    padding: 3px 6px 3px 1.5rem;
}
@media print {
    body .rwa-maintenance-doc {
        page-break-inside: avoid;
    }
    body .rwa-maintenance-doc .main-content {
        page-break-inside: avoid;
    }
    body .rwa-maintenance-doc .section {
        margin-bottom: 0.35rem;
    }
    body .rwa-maintenance-doc .document-header,
    body .rwa-maintenance-doc .document-title {
        margin-bottom: 0.25rem;
    }
    body .rwa-maintenance-doc .document-title h2 {
        font-size: 1rem;
    }
    body .rwa-maintenance-doc .maintenance-info-container .section,
    body .rwa-maintenance-doc .section {
        margin-bottom: 0.25rem;
    }
    body .rwa-maintenance-doc .section h3 {
        margin-bottom: 0.2rem;
        font-size: 0.9rem;
    }
    body .rwa-maintenance-doc .checklist-table {
        font-size: 8.5px;
        margin: 2px 0;
    }
    body .rwa-maintenance-doc .checklist-table th,
    body .rwa-maintenance-doc .checklist-table td {
        padding: 3px 5px;
        font-size: 8.5px;
    }
    body .rwa-maintenance-doc .checklist-table th {
        font-size: 8.5px;
    }
    body .rwa-maintenance-doc .checklist-table td.checklist-megjegyzes-cell {
        font-size: 7.5px;
        padding: 2px 5px 2px 1rem;
    }
    body .rwa-maintenance-doc .notes-section,
    body .rwa-maintenance-doc .tapasztalatok-megjegyzesek-section {
        margin-top: 0.3rem;
    }
    body .rwa-maintenance-doc .notes-section h4,
    body .rwa-maintenance-doc .notes-title {
        font-size: 0.85rem;
        margin-bottom: 0.2rem;
    }
    body .rwa-maintenance-doc .notes-box {
        font-size: 9px;
        padding: 0.25rem;
        min-height: auto;
    }
    body .rwa-maintenance-doc .signature-table {
        margin-top: 0.4rem;
        padding: 0.3rem 0;
    }
    body .rwa-maintenance-doc .signature-table td {
        font-size: 9px;
    }
}

.document-footer {
    text-align: center;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #ddd;
    color: #666;
    font-size: 0.75rem;
}

.document-footer p {
    margin: 2px 0;
}

/* Navigációs gombok a lap legtetején */
.document-actions-top {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 0 0 20px 0;
    padding: 20px 0;
    background: #f8f9fa;
    border-bottom: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
}

.action-btn,
button.action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    min-height: 2.5rem;
    box-sizing: border-box;
    border: none;
    border-radius: var(--radius-lg);
    text-decoration: none;
    font-weight: bold;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
}

.action-btn .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.action-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    text-decoration: none;
}

.action-btn.btn-secondary,
a.action-btn.btn-secondary,
button.action-btn.btn-secondary {
    background: #6b7280;
    color: white;
}

.action-btn.btn-secondary:hover,
a.action-btn.btn-secondary:hover,
button.action-btn.btn-secondary:hover {
    background: #4b5563;
    color: white;
}

.action-btn.btn-primary,
a.action-btn.btn-primary,
button.action-btn.btn-primary {
    background: var(--menu-primary);
    color: white;
}

.action-btn.btn-primary:hover,
a.action-btn.btn-primary:hover,
button.action-btn.btn-primary:hover {
    background: var(--menu-primary-hover);
    color: white;
}

.btn-print {
    background: #059669;
    color: white;
}

.btn-print:hover {
    background: #047857;
    color: white;
}

.action-btn i {
    font-size: 16px;
}

/* Státusz és eredmény színek */
.status-draft { color: #6b7280; }
/* Maintenance view status colors - csak szövegszín, nem badge */
.status-in_progress { color: #d97706; }
.status-completed { color: #059669; }
.status-approved { color: #1e40af; }

/* Task status badges - egységes háttérszín és szövegszín */
.status-badge.status-in_progress {
    background: #dbeafe;
    color: #1e40af;
}

.result-megfelelő, .result-sikeres { color: #059669; font-weight: bold; }
.result-nem_felelt_meg, .result-sikertelen { color: #dc2626; font-weight: bold; }
.result-részben_megfelelő, .result-részben_sikeres { color: #d97706; font-weight: bold; }

/* Kompakt layout a fő szekciókhoz - szekciók egymás alatt, adatok több oszlopban */
.maintenance-info-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 4px;
    width: 100%;
    box-sizing: border-box;
}

.maintenance-info-section {
    margin-bottom: 0;
    width: 100%;
    box-sizing: border-box;
}

/* Kompakt info grid - 2-3 oszlopban az adatok */
.info-grid-compact {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px 12px;
    margin: 4px 0;
    width: 100%;
    box-sizing: border-box;
}

.info-grid-compact .info-item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: 2px;
    font-size: 12px;
    line-height: 1.3;
}

.info-grid-compact .info-item label {
    font-weight: bold;
    color: #555;
    font-size: 12px;
    min-width: 120px;
    flex-shrink: 0;
    margin-bottom: 0;
}

.info-grid-compact .info-item span {
    flex: 1;
    font-size: 12px;
    word-wrap: break-word;
}

/* Hasábok tartalmának egyenletes eloszlása */
.three-column-section .info-item {
    word-wrap: break-word;
    overflow-wrap: break-word;
    min-width: 0;
    max-width: 100%;
}

.three-column-section .info-item span {
    word-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;
    max-width: 100%;
    display: inline-block;
}

/* Email címek speciális kezelése */
.three-column-section .info-item span[style*="email"],
.three-column-section .info-item span:contains("@") {
    word-break: break-all;
    hyphens: auto;
}

/* Karbantartási checklist stílusok */
.maintenance-checklist {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 15px;
}

.checklist-wrapper {
    margin-bottom: 2px;
}

.checklist-item {
    background: #fff;
    border: none;
    border-bottom: 1px solid #f0f0f0;
    border-radius: var(--radius-lg);
    padding: 8px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 32px;
}

.checklist-question {
    font-weight: 500;
    color: #333;
    font-size: 12px;
    line-height: 1.4;
    flex: 1;
    margin: 0;
}

.checklist-result {
    margin: 0;
    flex-shrink: 0;
}

.result-megfelelő {
    color: #059669;
    font-weight: bold;
    background: transparent;
    padding: 0;
    border: none;
    border-radius: 0;
    font-size: 11px;
}

.result-nem_megfelelő {
    color: #b91c1c;
    font-weight: bold;
    background: transparent;
    padding: 0;
    border: none;
    border-radius: 0;
    font-size: 11px;
}

.result-nem_releváns {
    color: #6b7280;
    font-weight: bold;
    background: #f3f4f6;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
}

.equipment-extra-info {
    margin-top: 6px;
    padding-left: 12px;
}

.equipment-details, .equipment-notes {
    font-size: 0.9rem;
    color: #6b7280;
    margin-top: 2px;
}

.equipment-notes {
    font-style: italic;
}

.equipment-count {
    color: #dc2626;
    font-weight: 500;
    font-size: 1rem;
}

/* PDF mód */
.pdf-mode {
    font-size: 12px;
}

.pdf-mode .maintenance-document {
    padding: 20px;
    max-width: none;
}

.pdf-mode .company-logo {
    height: 47px;
    max-width: 176px;
}

/* Nyomtatási stílusok - Ultra kompakt A4 */
@media print {
    @page {
        size: A4 portrait;
        margin: 5mm;
    }
    
    body {
        margin: 0;
        padding: 0;
        -webkit-print-color-adjust: exact;
        color-adjust: exact;
        print-color-adjust: exact;
        font-size: 10.5px;
        line-height: 1.25;
        color: #000;
    }
    
    .maintenance-document {
        max-width: none;
        padding: 0;
        padding-bottom: 20px;
        box-shadow: none;
        font-size: 10.5px;
        line-height: 1.25;
    }
    
    
    .signature-spacer {
        height: 40px;
        width: 100%;
        clear: both;
    }
    
    .document-actions-top {
        display: none;
    }
    
    /* Fejléc ultra kompakt */
    .document-header {
        margin-bottom: 4px;
        padding-bottom: 3px;
        border-bottom: 0.5px solid #000;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .company-logo {
        height: 53px;
        max-width: 165px;
        margin: 0;
    }
    
    .company-info p {
        font-size: 8.5px;
        margin: 0;
        line-height: 1.15;
    }
    
    .maintenance-document .document-info {
        font-size: 8.5px;
        text-align: left;
    }
    
    .maintenance-document .document-info p {
        margin: 0;
        line-height: 1.15;
    }
    
    /* Cím ultra kompakt */
    .document-title {
        text-align: center;
        margin-bottom: 4px;
    }
    
    .document-title h2 {
        font-size: 13.5px;
        margin: 0 0 2px 0;
        line-height: 1.15;
        font-weight: bold;
    }
    
    .document-title i {
        margin-right: 3px;
        font-size: 11.5px;
    }
    
    .regulation-ref {
        font-size: 8.5px;
        margin: 0;
        line-height: 1.15;
    }
    
    /* Kompakt layout a fő szekciókhoz - nyomtatás */
    .maintenance-info-container {
        display: flex;
        flex-direction: column;
        gap: 4px;
        margin-bottom: 3px;
    }
    
    .maintenance-info-section {
        margin-bottom: 0;
        page-break-inside: avoid;
        width: 100%;
    }
    
    .info-grid-compact {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2px 8px;
        margin: 2px 0;
    }
    
    .info-grid-compact .info-item {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 4px;
        margin-bottom: 1px;
        font-size: 8.5px;
        line-height: 1.15;
    }
    
    .info-grid-compact .info-item label {
        font-weight: bold;
        min-width: 80px;
        font-size: 8.5px;
        flex-shrink: 0;
    }
    
    .info-grid-compact .info-item span {
        font-size: 8.5px;
    }
    
    /* Létesítmény és Karbantartási adatok táblázat – nyomtatás */
    .maintenance-info-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 10px;
        margin: 2px 0;
        page-break-inside: avoid;
    }
    .maintenance-info-table th,
    .maintenance-info-table td {
        padding: 3px 6px;
        border: 0.5px solid #333;
        font-size: 10px;
    }
    .maintenance-info-th {
        font-weight: bold;
        background: #f0f0f0;
        width: 35%;
    }
    .maintenance-doc-fire .maintenance-info-table {
        font-size: 11px !important;
    }
    .maintenance-doc-fire .maintenance-info-table th,
    .maintenance-doc-fire .maintenance-info-table td {
        font-size: 11px !important;
        padding: 3px 6px !important;
    }
    
    /* Szekciók kompakt */
    .section {
        margin-bottom: 3px;
        page-break-inside: avoid;
    }
    
    .section h3 {
        font-size: 11.5px;
        margin: 0 0 4px 0;
        padding-bottom: 2px;
        border-bottom: 0.5px solid #000;
        line-height: 1.15;
        font-weight: bold;
    }
    
    .section h4 {
        font-size: 10.5px;
        margin: 4px 0 3px 0;
        line-height: 1.15;
        font-weight: bold;
    }
    
    /* Info grid - nyomtatás */
    .info-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 2px;
        margin: 2px 0;
    }
    
    .info-item {
        display: flex;
        align-items: flex-start;
        gap: 4px;
        margin-bottom: 3px;
        font-size: 9.5px;
        line-height: 1.15;
    }
    
    .info-item label {
        font-weight: bold;
        min-width: 58px;
        font-size: 9.5px;
    }
    
    .info-item span {
        font-size: 9.5px;
    }
    
    /* Checklist szuper kompakt */
    .maintenance-checklist {
        gap: 0px;
        margin-bottom: 2px;
    }
    
    .checklist-wrapper {
        margin-bottom: 0px;
    }
    
    .checklist-item {
        padding: 3px 0;
        margin: 0;
        font-size: 8.5px;
        border: none;
        border-bottom: 1px solid #e0e0e0;
        border-radius: var(--radius-lg);
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 6px;
        min-height: 16px;
        background: #fff;
    }
    
    .checklist-question {
        font-size: 8.5px;
        font-weight: normal;
        margin: 0;
        line-height: 1.15;
        flex: 1;
    }
    
    .checklist-result {
        margin: 0;
        flex-shrink: 0;
    }
    
    .checklist-result span {
        font-size: 7.5px;
        padding: 2px 4px;
        border-radius: 2px;
        font-weight: bold;
    }
    
    .equipment-extra-info {
        margin: 0 0 0 6px;
        font-size: 7.5px;
        padding: 0;
        line-height: 1.15;
    }
    
    .equipment-details, .equipment-notes {
        font-size: 7.5px;
        margin: 0;
        line-height: 1.15;
    }
    
    .equipment-count {
        font-size: 8.5px;
        font-weight: bold;
    }
    
    /* Aláírás táblázat - sorok egyszerű igazítva */
    .signature-table,
    .signature-section {
        margin: 8px 0 6px 0;
        page-break-inside: avoid;
        width: 100%;
        border: none;
    }
    
    .signature-table td {
        vertical-align: top;
        text-align: center;
        padding: 2px 15px;
        border: none;
        font-size: 10px;
        line-height: 1.2;
    }
    
    .signature-table .sig-row.sig-area td {
        padding-bottom: 4px;
        vertical-align: bottom;
    }
    
    .signature-line {
        border-bottom: 0.5px solid #000;
        width: 90px;
        height: 30px;
        margin: 0 auto 3px;
    }
    
    .signature-box p {
        font-size: 10px;
        margin: 0;
        line-height: 1.2;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .signature-table .sig-row.sig-date td {
        overflow: visible;
        white-space: normal;
        font-size: 10px;
    }
    
    /*
     * Lábléc: fixed helyett normál folyás – a fixed nem foglal helyet, ezért a táblázat
     * rálógott a „Ez a dokumentum elektronikus…” szövegre (első oldal alja).
     */
    .document-footer {
        position: static !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100%;
        max-width: 100%;
        text-align: center;
        margin: 0;
        padding: 0;
        border-top: 0.5px solid #ccc;
        font-size: 5.9px;
        line-height: 0.95;
        background: transparent;
        clear: both;
    }
    
    .document-footer p {
        margin: 0;
    }
    
    
    /* Színek nyomtatáshoz - eredeti színek megtartása */
    .result-megfelelő {
        background-color: transparent;
        color: #059669;
        font-weight: bold;
    }
    
    .result-nem_megfelelő {
        background-color: transparent;
        color: #b91c1c;
        font-weight: bold;
    }
    
    .result-nem_releváns {
        background-color: #f3f4f6;
        color: #6b7280;
        font-weight: bold;
    }
    
    .checklist-table .status-ok {
        background-color: #d1fae5 !important;
        color: #059669 !important;
    }
    .checklist-table .status-error {
        background-color: #fecaca !important;
        color: #b91c1c !important;
    }
    .checklist-table .status-na {
        background-color: #f3f4f6 !important;
        color: #6b7280 !important;
    }
    
    .checklist-table:not(.suppression-status-fixed-table) th.checklist-table-th-center,
    .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-center {
        width: 130px;
        min-width: 130px;
        max-width: 130px;
    }

    /* Oltórendszer: keskeny Állapot – csak a nem fix táblákra (a fix táblát a suppression-status-fixed-table szabályok adják) */
    .maintenance-document.maintenance-doc-suppression .checklist-table:not(.suppression-status-fixed-table) th.checklist-table-th-center,
    .maintenance-document.maintenance-doc-suppression .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-center,
    .maintenance-document.maintenance-doc-suppression .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-data {
        width: 50px;
        min-width: 50px;
        max-width: 50px;
    }

    /* Táblázatok ultra kompakt - minimális padding és kisebb betűméret */
    /* Karbantartási ellenőrzési táblázat – enyhe (~3%) kicsinyítés: kevesebb sor magasság az 1. oldalon */
    .checklist-table-part-1 {
        page-break-after: always;
        break-after: page;
    }
    .checklist-table-print-split {
        font-size: 9.7px;
        margin: 3px 0;
    }
    .checklist-table-print-split th,
    .checklist-table-print-split td {
        padding: 1px 4px;
        font-size: 9.7px;
        line-height: 1.13;
        border: 1px solid #333;
    }
    .checklist-table-print-split th {
        font-size: 10.2px;
        font-weight: bold;
    }

    /* fire_maintenance: nyomtatás = képernyő (WYSIWYG) – betűméret +25% */
    .maintenance-doc-fire {
        font-size: 13px !important;
        line-height: 1.25 !important;
        padding: 20px !important;
    }
    .maintenance-doc-fire .company-logo { height: 66px; max-width: 206px; }
    .maintenance-doc-fire .company-brand {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 0.65rem;
    }
    .maintenance-doc-fire .company-brand-name {
        font-size: 1.85rem;
        font-weight: 700;
        line-height: 1.1;
        display: flex;
        align-items: center;
    }
    .maintenance-doc-fire .document-header { margin-bottom: 4px !important; padding-bottom: 3px !important; }
    .maintenance-doc-fire .document-title { margin-bottom: 4px !important; }
    .maintenance-doc-fire .document-title h2 { font-size: 20px !important; margin: 0 0 2px 0 !important; }
    .maintenance-doc-fire .regulation-ref { font-size: 13px !important; }
    .maintenance-doc-fire .section { margin-bottom: 3px !important; }
    .maintenance-doc-fire .section h3 { font-size: 16px !important; margin: 0 0 4px 0 !important; }
    .maintenance-doc-fire .checklist-table-section h3 { margin: 0 0 2px 0 !important; }
    .maintenance-doc-fire .info-grid-compact { gap: 2px 8px !important; margin: 2px 0 !important; }
    .maintenance-doc-fire .info-grid-compact .info-item { gap: 4px !important; margin-bottom: 1px !important; }
    .maintenance-doc-fire .info-grid-compact .info-item label,
    .maintenance-doc-fire .info-grid-compact .info-item span { font-size: 13px !important; }
    .maintenance-doc-fire .info-grid-compact .result-megfelelő,
    .maintenance-doc-fire .info-grid-compact .result-nem_megfelelő,
    .maintenance-doc-fire .info-grid-compact .result-nem_releváns { font-size: 13px !important; }
    .maintenance-doc-fire .company-info p,
    .maintenance-doc-fire .document-info,
    .maintenance-doc-fire .document-info p { font-size: 13px !important; }
    .maintenance-doc-fire .tapasztalatok-megjegyzesek-section h3 { font-size: 16px !important; }
    .maintenance-doc-fire .notes-title { font-size: 15px !important; }
    .maintenance-doc-fire .notes-box { font-size: 14px !important; }
    .maintenance-doc-fire .signature-table td { font-size: 12px !important; }
    .maintenance-doc-fire .checklist-table-print-split { font-size: 12.1px; margin: 3px 0; }
    .maintenance-doc-fire .checklist-table-print-split th,
    .maintenance-doc-fire .checklist-table-print-split td { font-size: 12.1px; padding: 1px 4px; line-height: 1.13; }
    .maintenance-doc-fire .checklist-table-print-split th { font-size: 12.6px; }

    /* Oltórendszer: táblázat szöveg enyhe kicsinyítése */
    .maintenance-doc-suppression .checklist-table-print-split { font-size: 8.75px; margin: 3px 0; }
    .maintenance-doc-suppression .checklist-table-print-split th,
    .maintenance-doc-suppression .checklist-table-print-split td { font-size: 8.75px; padding: 1px 4px; line-height: 1.13; }
    .maintenance-doc-suppression .checklist-table-print-split th { font-size: 9.2px; font-weight: bold; }

    .checklist-table {
        font-size: 6.8px;
        margin: 4px 0;
    }
    
    .checklist-table th,
    .checklist-table td {
        padding: 1px 3px;
        border: 0.5px solid #000;
        font-size: 6.8px;
        line-height: 1.06;
    }
    
    .checklist-table th {
        background: #f3f4f6;
        font-weight: bold;
    }
    
    .extinguisher-table table,
    .participants-table table {
        font-size: 7.5px;
        border-collapse: collapse;
        width: 100%;
    }
    
    .extinguisher-table th,
    .extinguisher-table td,
    .participants-table th,
    .participants-table td {
        border: 0.5px solid #000;
        padding: 2px 4px;
        font-size: 7.5px;
        line-height: 1.1;
    }
    
    .extinguisher-table th,
    .participants-table th {
        background: #f3f4f6;
        font-weight: bold;
    }
    
    /* Megjegyzések ultra kompakt - minimális padding */
    .notes-content {
        background: transparent;
        padding: 0;
        border-radius: var(--radius-lg);
        border: none;
        font-size: 8px;
        line-height: 1.2;
        text-align: left;
        word-wrap: break-word;
        min-height: 40px;
    }
    
    /* Tapasztalatok és megjegyzések mindig a második oldalon (kivéve RWA: egy oldal) */
    .tapasztalatok-megjegyzesek-section {
        page-break-before: always;
        break-before: page;
    }
    body .rwa-maintenance-doc .tapasztalatok-megjegyzesek-section {
        page-break-before: auto;
        break-before: auto;
    }
    /* fire_maintenance: tapasztalatok + aláírások a 2. oldalon (checklist 2. rész után) */
    .maintenance-doc-fire .tapasztalatok-megjegyzesek-section {
        page-break-before: auto;
        break-before: auto;
        margin-top: 8px;
    }
    /* Oltórendszer: tapasztalatok + aláírások a 2. oldalon (tűzjelző 2. rész után) */
    .maintenance-doc-suppression .tapasztalatok-megjegyzesek-section {
        page-break-before: auto;
        break-before: auto;
        margin-top: 8px;
    }
    .maintenance-doc-fire .signature-spacer {
        height: 15px;
    }
    .maintenance-doc-fire .signature-table {
        margin-top: 12px;
    }
    
    .notes-section {
        margin-bottom: 4px;
    }
    
    .notes-title {
        margin-bottom: 2px;
        font-weight: bold;
        font-size: 9px;
    }
    
    .notes-box {
        padding: 4px 6px;
        background-color: transparent;
        border: 0.5px solid #333;
        border-radius: 0;
        font-size: 8px;
        line-height: 1.2;
    }
    
    /* Oldaltörés tiltása - minden egy oldalon */
    .section {
        page-break-inside: avoid;
        break-inside: avoid;
    }
    /* Hosszú ellenőrzési táblák törhetnek oldalakon (különben egy blokk túlnyúlik) */
    .maintenance-document .section.checklist-table-section,
    .maintenance-document .checklist-table-section.section {
        page-break-inside: auto !important;
        break-inside: auto !important;
    }
    .maintenance-document .checklist-table {
        page-break-inside: auto !important;
        break-inside: auto !important;
    }
    
    .checklist-wrapper {
        page-break-inside: avoid;
        break-inside: avoid;
    }
    
    .signature-table,
    .signature-section {
        page-break-inside: avoid;
        break-inside: avoid;
    }
}

/* Mobil nézet – nyomtatásnál NEM alkalmazzuk, hogy az aláírások egymás mellett maradjanak */
@media not print and (max-width: 768px) {
    .maintenance-document {
        padding: 8px;
        font-size: 11px;
        line-height: 1.3;
    }
    
    .document-actions-top {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: 12px;
        padding: 12px;
    }
    
    .document-actions-top .action-btn {
        flex: 1 1 calc(50% - 8px);
        min-width: 0;
        justify-content: center;
    }

    .document-actions-top .auvi-back-btn {
        flex: 0 0 auto;
        order: 100;
        margin-left: auto;
    }
    
    .document-header {
        flex-direction: column;
        gap: 8px;
        margin-bottom: 4px;
        padding-bottom: 4px;
    }
    
    .company-logo {
        height: 42px;
        max-width: 141px;
    }
    
    .company-info p {
        font-size: 10px;
    }
    
    .document-info {
        text-align: left;
        font-size: 10px;
    }
    
    .document-info p {
        margin: 1px 0;
    }
    
    .document-title {
        margin-bottom: 10px;
    }
    
    .document-title h2 {
        font-size: 14px;
        margin-bottom: 3px;
    }
    
    .document-title i {
        font-size: 13px;
    }
    
    .regulation-ref {
        font-size: 10px;
    }
    
    .maintenance-info-container {
        gap: 6px;
        margin-bottom: 8px;
    }
    
    .maintenance-info-section {
        margin-bottom: 8px;
    }
    
    .maintenance-info-table {
        font-size: 12px;
    }
    .maintenance-info-table th,
    .maintenance-info-table td {
        padding: 3px 6px;
        font-size: 12px;
    }
    .maintenance-info-th {
        min-width: 120px;
    }
    .maintenance-doc-fire .maintenance-info-table th,
    .maintenance-doc-fire .maintenance-info-table td {
        font-size: 13px !important;
    }
    
    .info-grid-compact {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    
    .info-grid-compact .info-item {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 4px;
        font-size: 10px;
        padding: 4px 6px;
    }
    
    .info-grid-compact .info-item label {
        min-width: 100px;
        font-size: 10px;
    }
    
    .info-grid-compact .info-item span {
        font-size: 10px;
    }
    
    /* fire_maintenance: képernyő = nyomtatás – adatok egymás mellett, 3 oszlop */
    .maintenance-doc-fire .info-grid-compact {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 2px 8px !important;
    }
    
    .maintenance-doc-fire .info-grid-compact .info-item {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        font-size: 13px !important;
        padding: 0 !important;
    }
    
    .maintenance-doc-fire .info-grid-compact .info-item label {
        min-width: 100px !important;
        font-size: 13px !important;
    }
    
    .maintenance-doc-fire .info-grid-compact .info-item span {
        font-size: 13px !important;
    }
    
    .info-grid {
        grid-template-columns: 1fr;
    }
    
    .info-item {
        flex-direction: column;
        gap: 2px;
        font-size: 11px;
    }
    
    .info-item label {
        min-width: auto;
        font-size: 11px;
    }
    
    .section {
        margin-bottom: 12px;
    }
    
    .section h3 {
        font-size: 12px;
        margin-bottom: 6px;
        padding-bottom: 3px;
    }
    
    .section h4 {
        font-size: 11px;
        margin: 8px 0 4px 0;
    }
    
    .checklist-table {
        font-size: 8.5px;
        margin: 6px 0;
    }
    
    .checklist-table th,
    .checklist-table td {
        padding: 3px 4px;
        font-size: 8.5px;
    }
    
    .checklist-table th {
        font-size: 8.5px;
    }
    
    .checklist-table td.checklist-megjegyzes-cell {
        font-size: 7.5px;
        padding: 2px 4px 2px 1rem;
    }

    /* Karbantartási lap táblák mobil: ne vágja le az „Állapot” oszlopot (fix 130px túl széles) */
    .maintenance-document .checklist-table {
        table-layout: fixed;
        width: 100%;
        max-width: 100%;
    }
    .maintenance-document .checklist-table th:first-child,
    .maintenance-document .checklist-table td:first-child {
        width: 58%;
        min-width: 0;
        word-break: break-word;
        overflow-wrap: anywhere;
        hyphens: auto;
    }
    .maintenance-document .checklist-table:not(.suppression-status-fixed-table) th.checklist-table-th-center,
    .maintenance-document .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-center,
    .maintenance-document .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-data {
        width: 42%;
        min-width: 0;
        max-width: none;
        white-space: normal;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .maintenance-document .checklist-table-section {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
    }
    .maintenance-document.maintenance-doc-suppression {
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
    }
    
    .extinguisher-table table,
    .participants-table table {
        font-size: 9px;
    }
    
    .extinguisher-table th,
    .extinguisher-table td,
    .participants-table th,
    .participants-table td {
        padding: 3px 4px;
        font-size: 9px;
    }
    
    .equipment-item {
        padding: 6px 8px;
        font-size: 10px;
    }
    
    .notes-section,
    .tapasztalatok-megjegyzesek-section {
        margin-top: 8px;
    }
    
    .notes-section h4,
    .notes-title {
        font-size: 11px;
        margin-bottom: 4px;
    }
    
    .notes-box {
        font-size: 10px;
        padding: 6px;
        min-height: 40px;
    }
    
    .signature-table td {
        font-size: 10px;
    }
    
    .signature-table img {
        max-height: 50px;
    }
    
    .document-footer {
        margin-top: 12px;
        padding-top: 8px;
        font-size: 9px;
    }
    
    /* RWA jegyzőkönyv mobilon – további kicsinyítés */
    .rwa-maintenance-doc.maintenance-document {
        padding: 6px;
        font-size: 10px;
    }
    
    .rwa-maintenance-doc .document-title h2 {
        font-size: 12px;
    }
    
    .rwa-maintenance-doc .section h3 {
        font-size: 11px;
    }
    
    .rwa-maintenance-doc .info-grid-compact .info-item label,
    .rwa-maintenance-doc .info-grid-compact .info-item span {
        font-size: 9px;
    }
    
    .rwa-maintenance-doc .checklist-table th,
    .rwa-maintenance-doc .checklist-table td {
        padding: 2px 3px;
        font-size: 7.5px;
    }
    
    .rwa-maintenance-doc .checklist-megjegyzes-cell {
        font-size: 6.5px;
    }
    
    .rwa-maintenance-doc .notes-box {
        font-size: 9px;
    }
    
    .rwa-maintenance-doc .signature-table td {
        font-size: 9px;
    }
}

/* maintenance_view mobilon/tableten: olvasható méret (a fenti „előnézet” kicsinyítés felülírása) */
@media not print and (max-width: 768px) {
    .maintenance-view-read.maintenance-document {
        padding: 12px 10px;
        font-size: 15px;
        line-height: 1.5;
    }

    .maintenance-view-read .document-title h2 {
        font-size: 1.12rem;
        line-height: 1.35;
    }

    .maintenance-view-read .maintenance-info-table th,
    .maintenance-view-read .maintenance-info-table td {
        font-size: 14px;
        line-height: 1.45;
    }

    .maintenance-view-read.maintenance-document .checklist-table,
    .maintenance-view-read.maintenance-document .checklist-table th,
    .maintenance-view-read.maintenance-document .checklist-table td {
        font-size: 13px;
        line-height: 1.4;
    }

    .maintenance-view-read.maintenance-document .checklist-table td.checklist-megjegyzes-cell {
        font-size: 12px;
        padding-left: 0.75rem;
    }

    .maintenance-view-read .checklist-table-print-split,
    .maintenance-view-read .checklist-table-print-split th,
    .maintenance-view-read .checklist-table-print-split td {
        font-size: 12px;
        line-height: 1.35;
        padding: 6px 7px;
    }

    .maintenance-view-read .notes-title,
    .maintenance-view-read .notes-section h4 {
        font-size: 14px;
    }

    .maintenance-view-read .notes-box {
        font-size: 14px;
        line-height: 1.45;
    }

    .maintenance-view-read .signature-table td {
        font-size: 13px;
    }

    /* Tűzjelző: TJK kompakt rács ne 3 oszlop mobilon */
    .maintenance-view-read.maintenance-doc-fire .info-grid-compact {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .maintenance-view-read.maintenance-doc-fire .info-grid-compact .info-item {
        flex-wrap: wrap !important;
        font-size: 14px !important;
        padding: 6px 8px !important;
    }

    .maintenance-view-read.maintenance-doc-fire .info-grid-compact .info-item label,
    .maintenance-view-read.maintenance-doc-fire .info-grid-compact .info-item span {
        font-size: 14px !important;
    }

    .maintenance-view-read.rwa-maintenance-doc.maintenance-document {
        font-size: 15px;
        padding: 10px 8px;
    }

    .maintenance-view-read.rwa-maintenance-doc .document-title h2 {
        font-size: 1.05rem;
    }

    .maintenance-view-read.rwa-maintenance-doc .checklist-table th,
    .maintenance-view-read.rwa-maintenance-doc .checklist-table td {
        font-size: 12px;
        padding: 6px 7px;
    }

    .maintenance-view-read.rwa-maintenance-doc .checklist-megjegyzes-cell,
    .maintenance-view-read.rwa-maintenance-doc .checklist-table td.checklist-megjegyzes-cell {
        font-size: 11px;
    }

    .maintenance-view-read.rwa-maintenance-doc .info-grid-compact .info-item label,
    .maintenance-view-read.rwa-maintenance-doc .info-grid-compact .info-item span {
        font-size: 13px;
    }

    .maintenance-view-read.rwa-maintenance-doc .notes-box {
        font-size: 14px;
    }

    .maintenance-view-read.rwa-maintenance-doc .signature-table td {
        font-size: 12px;
    }
}

/* Nagyon keskeny képernyő – további arányos kicsinyítés */
@media not print and (max-width: 400px) {
    .maintenance-document {
        padding: 6px;
        font-size: 10px;
    }
    
    .document-title h2 {
        font-size: 12px;
    }
    
    .company-logo {
        height: 33px;
        max-width: 118px;
    }
    
    .info-grid-compact .info-item label,
    .info-grid-compact .info-item span {
        font-size: 9px;
    }
    
    .maintenance-doc-fire .info-grid-compact .info-item label,
    .maintenance-doc-fire .info-grid-compact .info-item span {
        font-size: 13px !important;
    }
    
    .section h3 {
        font-size: 11px;
    }
    
    .checklist-table th,
    .checklist-table td {
        font-size: 7.5px;
        padding: 2px 3px;
    }
    
    .checklist-megjegyzes-cell {
        font-size: 6.5px;
    }

    .maintenance-document .checklist-table th:first-child,
    .maintenance-document .checklist-table td:first-child {
        width: 55%;
    }
    .maintenance-document .checklist-table:not(.suppression-status-fixed-table) th.checklist-table-th-center,
    .maintenance-document .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-center,
    .maintenance-document .checklist-table:not(.suppression-status-fixed-table) td.checklist-table-td-data {
        width: 45%;
    }
    
    .rwa-maintenance-doc .document-title h2 {
        font-size: 11px;
    }
    
    .rwa-maintenance-doc .checklist-table th,
    .rwa-maintenance-doc .checklist-table td {
        font-size: 6.5px;
    }

    /* maintenance_view: 400px alatt is maradjon olvasható */
    .maintenance-view-read.maintenance-document {
        font-size: 14px;
        padding: 8px 6px;
    }

    .maintenance-view-read.maintenance-document .checklist-table th,
    .maintenance-view-read.maintenance-document .checklist-table td {
        font-size: 12px;
        padding: 5px 6px;
    }

    .maintenance-view-read .checklist-table-print-split th,
    .maintenance-view-read .checklist-table-print-split td {
        font-size: 11px;
    }

    .maintenance-view-read.rwa-maintenance-doc .checklist-table th,
    .maintenance-view-read.rwa-maintenance-doc .checklist-table td {
        font-size: 11px;
    }
}



/* ========== maintenance-app-summary.css ========== */

/* Maintenance app summary stílusok (main.css-ből kiemelve) */

/* =============================================================================
   MAINTENANCE VIEW – alkalmazásba ágyazott összesítő (maintenance_view_app_summary)
   ============================================================================= */
/* .page-title alapból flex sor → h1 + jogszabály egy sorban; itt külön sor kell */
.maintenance-app-summary .page-title {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
}

.maintenance-app-summary .page-title h1 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--gray-900, #111827);
    margin: 0;
}

.maintenance-app-summary .page-title h1 i {
    color: var(--primary-600, #dc2626);
    font-size: 1.25rem;
}

.maintenance-app-summary__subtitle {
    margin: 0;
    font-size: 0.875rem;
    color: var(--gray-600, #4b5563);
    font-style: italic;
    max-width: 42rem;
}

.maintenance-app-summary__subtitle--below-title {
    margin-top: 0;
    margin-bottom: 0;
    font-style: normal;
    font-weight: 500;
    color: var(--gray-800, #1f2937);
}

.maintenance-app-summary__header {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 1rem;
}

.maintenance-app-summary__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.maintenance-app-summary__actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.maintenance-app-summary__actions .btn .material-symbols-outlined {
    font-size: 18px;
    line-height: 1;
}

.maintenance-app-summary__meta-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.maintenance-app-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.65rem;
    background: var(--gray-100, #f3f4f6);
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 999px;
    font-size: 0.8125rem;
    color: var(--gray-800, #1f2937);
}

.maintenance-app-pill strong {
    font-weight: 600;
    color: var(--gray-600, #4b5563);
}

.maintenance-app-summary__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
}

/* Létesítmény + Karbantartás: egy sorban 50%–50%; hosszú szöveg ne törje szét az oszlopokat */
.maintenance-app-summary__grid > .maintenance-app-card:not(.maintenance-app-card--wide) {
    min-width: 0;
}

.maintenance-app-card {
    background: #fff;
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: var(--radius-lg, 12px);
    padding: 1.1rem 1.25rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.maintenance-app-card--wide {
    grid-column: 1 / -1;
}

@media (max-width: 768px) {
    .maintenance-app-summary__grid {
        grid-template-columns: 1fr;
    }

    .maintenance-app-card--wide {
        grid-column: 1;
    }

    /* Gombok egymás alatt, teljes szélesség */
    .maintenance-app-summary__actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }

    .maintenance-app-summary__actions .btn {
        width: 100%;
        max-width: 100%;
        justify-content: center;
        flex: none;
        box-sizing: border-box;
    }

    /* Dok. azonosító, Létrehozva stb. – olvasható, egymás alatti sávok */
    .maintenance-app-summary__meta-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }

    .maintenance-app-summary .maintenance-app-pill {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
        border-radius: 10px;
        padding: 0.5rem 0.75rem;
        gap: 0.25rem 0.5rem;
    }

    .maintenance-app-summary .maintenance-app-pill strong {
        flex: 0 0 auto;
    }
}

.maintenance-app-card--muted {
    background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
    border-style: dashed;
}

.maintenance-app-card__title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--gray-900, #111827);
    margin: 0 0 0.85rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--gray-100, #f3f4f6);
}

.maintenance-app-card__title .material-symbols-outlined {
    font-size: 1.25rem;
    color: var(--primary-500, #ef4444);
}

.maintenance-app-card__hint {
    font-weight: 400;
    font-size: 0.8rem;
    color: var(--gray-500, #6b7280);
}

.maintenance-app-card__subtitle {
    font-size: 0.9rem;
    font-weight: 600;
    margin: 0.6rem 0 0.45rem;
    color: var(--gray-700, #374151);
}

.maintenance-app-dl {
    display: grid;
    grid-template-columns: minmax(100px, 38%) 1fr;
    gap: 0.35rem 0.75rem;
    margin: 0;
    font-size: 0.9rem;
}

.maintenance-app-dl dt {
    margin: 0;
    font-weight: 600;
    color: var(--gray-600, #4b5563);
}

.maintenance-app-dl dd {
    margin: 0;
    color: var(--gray-900, #111827);
    word-break: break-word;
}

.maintenance-app-dl--inline {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.maintenance-app-dl--inline dt {
    grid-column: 1 / -1;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--gray-500, #6b7280);
}

.maintenance-app-dl--inline dd {
    grid-column: 1 / -1;
    font-weight: 500;
    margin-bottom: 0.35rem;
}

.maintenance-app-checklist {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.maintenance-app-checklist--dense {
    gap: 0.35rem;
}

.maintenance-app-checklist__item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    padding: 0.5rem 0.65rem;
    background: var(--gray-50, #f9fafb);
    border-radius: 8px;
    border: 1px solid var(--gray-100, #f3f4f6);
}

.maintenance-app-checklist__item--data {
    background: #fff;
    border-style: dashed;
}

.maintenance-app-checklist__q {
    flex: 1;
    min-width: 140px;
    font-size: 0.875rem;
    line-height: 1.4;
    color: var(--gray-800, #1f2937);
}

.maintenance-app-checklist__val {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--gray-900, #111827);
}

.mv-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}

.mv-badge--ok {
    background: #d1fae5;
    color: #047857;
}

.mv-badge--bad {
    background: #fee2e2;
    color: #b91c1c;
}

.mv-badge--na {
    background: #f3f4f6;
    color: #6b7280;
}

.mv-badge--unk {
    background: #fef3c7;
    color: #b45309;
}

.maintenance-app-prose h3 {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--gray-500, #6b7280);
    margin: 0.75rem 0 0.35rem 0;
}

.maintenance-app-prose h3:first-child {
    margin-top: 0;
}

.maintenance-app-prose__box {
    padding: 0.75rem 1rem;
    background: var(--gray-50, #f9fafb);
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 8px;
    font-size: 0.9rem;
    line-height: 1.5;
    color: var(--gray-800, #1f2937);
}

.maintenance-app-lead {
    margin: 0 0 0.75rem 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--gray-700, #374151);
}

.maintenance-app-stats {
    margin: 0 0 1rem 0;
    font-size: 0.9rem;
    color: var(--gray-700, #374151);
}

.maintenance-app-inline-btn {
    margin-top: 0.25rem;
}

.maintenance-app-card--signatures {
    width: 100%;
    max-width: 100%;
}

.maintenance-app-signature-table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    margin-top: 0.25rem;
}

.maintenance-app-signature-table td {
    width: 50%;
    vertical-align: middle;
    text-align: center;
    padding: 0.75rem 0.5rem;
    border: 1px solid var(--gray-200, #e5e7eb);
    background: #fff;
}

.maintenance-app-signature-table__area td {
    vertical-align: middle;
    min-height: 100px;
    padding: 1rem 0.75rem;
    background: var(--gray-50, #f9fafb);
}

.maintenance-app-signature-table__label td {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gray-800, #1f2937);
    padding-top: 0.65rem;
    padding-bottom: 0.35rem;
    background: var(--gray-100, #f3f4f6);
}

.maintenance-app-signature-table__name td,
.maintenance-app-signature-table__date td {
    font-size: 0.875rem;
    color: var(--gray-700, #374151);
    padding-top: 0.35rem;
    padding-bottom: 0.65rem;
}

.maintenance-app-summary__maint-cert {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--gray-600, #4b5563);
}

.sig-audit-meta {
    margin-top: 0.35rem;
    font-size: 0.7rem;
    line-height: 1.3;
    color: #6b7280;
    word-break: break-all;
    text-transform: lowercase;
    font-weight: 400;
}

.maintenance-app-signature-img-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 88px;
}

.maintenance-app-signature-img {
    max-width: 100%;
    max-height: 120px;
    width: auto;
    height: auto;
    object-fit: contain;
}

.maintenance-app-signature-placeholder {
    font-size: 0.8125rem;
    color: var(--gray-400, #9ca3af);
    font-style: italic;
    padding: 1rem;
}

.maintenance-app-muted {
    font-weight: 400;
    color: var(--gray-500, #6b7280);
    font-size: 0.85rem;
}



/* ========== clients-view.css ========== */

/* Clients view stílusok (main.css-ből kiemelve) */

/* =============================================================================
   CLIENTS VIEW PAGE STYLES (clients.php view action)
   ============================================================================= */

.client-view-container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0;
}

.client-view-content {
    width: 100%;
}

.client-view-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--gray-200);
}

.client-view-header h2 {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--gray-900);
    margin: 0;
}

.client-view-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

.client-view-header .client-view-actions-grid {
    justify-content: flex-end;
    margin-top: 0;
    padding-top: 0;
    margin-left: auto;
}

.client-view-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(340px, 1fr));
    gap: 1.25rem;
    margin-top: 2rem;
}

.client-view-container .client-view-section-card,
.client-view-content .client-view-section-card {
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--gray-200);
    padding: 1.5rem;
    margin-bottom: 0;
}

.client-view-section-card h3 {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--gray-900);
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.client-section-icon {
    font-size: 1.25rem;
    color: var(--primary-500);
}

.client-view-details {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.client-view-details p {
    margin: 0;
    font-size: 0.875rem;
    color: var(--gray-700);
    line-height: 1.6;
}

.client-view-details strong {
    font-weight: 600;
    color: var(--gray-900);
    margin-right: 0.5rem;
}

.client-view-details a:not(.btn) {
    color: var(--primary-500);
    text-decoration: none;
}

.client-view-details a:not(.btn):hover {
    text-decoration: underline;
}

.client-view-subheader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.client-view-subsection-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    color: var(--gray-900, #111827);
    font-size: 1rem;
    margin: 0.2rem 0 0.65rem;
}

.client-view-subheader-left {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: baseline;
    flex: 1 1 auto;
}

.client-view-subheader .btn {
    flex-shrink: 0;
    width: 100%;
    justify-content: center;
}

.client-view-muted {
    color: var(--gray-500, #6b7280);
    font-size: 0.875rem;
}

.client-view-stat {
    font-weight: 700;
    color: var(--gray-900, #111827);
    font-size: 1.1rem;
}

.client-view-mini-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
}

.client-view-mini-items--systems {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.client-view-mini-item {
    background: var(--gray-50, #f9fafb);
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 14px;
    padding: 0.85rem 0.9rem;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
}

.client-view-mini-item-title {
    display: inline-block;
    font-weight: 700;
    color: var(--gray-900, #111827);
    text-decoration: none;
}

.client-view-mini-item-title:hover {
    text-decoration: underline;
}

.client-view-mini-item-title--no-link {
    text-decoration: none;
}

.client-view-mini-item-sub {
    margin-top: 0.25rem;
    color: var(--gray-600, #4b5563);
    font-size: 0.875rem;
    line-height: 1.35;
}

.client-view-mini-item-actions {
    margin-top: 0.6rem;
}

.client-view-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    background: #f3f4f6;
    color: #374151;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.client-view-badge--primary {
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
}

.client-view-table-responsive {
    overflow-x: auto;
    border-radius: 12px;
}

.client-view-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 520px;
    background: white;
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 12px;
}

.client-view-table--compact {
    min-width: 720px;
}

.client-view-table th {
    text-align: left;
    padding: 0.6rem 0.75rem;
    color: var(--gray-500, #6b7280);
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--gray-200, #e5e7eb);
}

.client-view-table td {
    padding: 0.6rem 0.75rem;
    border-top: 1px solid var(--gray-200, #e5e7eb);
    color: var(--gray-800, #1f2937);
    font-size: 0.875rem;
    vertical-align: top;
}

.client-view-table tr:hover td {
    background: rgba(59, 130, 246, 0.03);
}

.client-maintenance-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
    white-space: nowrap;
}

.client-maintenance-badge--eves,
.client-maintenance-badge--feleves,
.client-maintenance-badge--negyedeves,
.client-maintenance-badge--negyedevi,
.client-maintenance-badge--havi {
    background: #f3f4f6;
    color: #374151;
}

.client-maintenance-badge--eves {
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
}

.client-maintenance-badge--feleves {
    background: rgba(16, 185, 129, 0.12);
    color: #0f766e;
}

.client-maintenance-badge--negyedeves,
.client-maintenance-badge--negyedevi {
    background: rgba(245, 158, 11, 0.14);
    color: #92400e;
}

.client-maintenance-badge--havi {
    background: rgba(239, 68, 68, 0.12);
    color: #b91c1c;
}

.client-view-details .client-view-empty {
    color: var(--gray-500);
    font-style: italic;
}

.location-contacts-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.location-contacts-list__item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--gray-200);
    border-radius: var(--radius-md, 8px);
    background: var(--gray-50, #f9fafb);
}

.location-contacts-list__info {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
    flex: 1 1 12rem;
}

.location-contacts-list__info span {
    font-size: 0.8125rem;
    color: var(--gray-600);
    word-break: break-word;
}

.location-contacts-list__meta {
    color: var(--gray-500) !important;
    font-size: 0.75rem !important;
}

.location-contacts-list__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.location-contacts-inline-form {
    display: inline;
    margin: 0;
}

.location-contacts-add-form {
    margin-top: 1rem;
}

.location-contacts-add-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.85rem;
    align-items: stretch;
}

.location-contacts-add-grid .form-input,
.location-contacts-add-grid input {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.location-contacts-add-grid .btn-primary {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    white-space: nowrap;
    box-sizing: border-box;
}

@media (min-width: 900px) {
    .location-contacts-add-grid {
        grid-template-columns: 1.2fr 1.4fr 1fr auto;
        gap: 0.85rem 1rem;
        align-items: end;
    }

    .location-contacts-add-grid .btn-primary {
        width: auto;
        min-height: 2.75rem;
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
}

#location-extra-contacts-card {
    scroll-margin-top: 5rem;
    padding: 0;
    overflow: hidden;
    border-radius: var(--radius-lg, 0.5rem);
}

#location-extra-contacts-card .card-header {
    border-top-left-radius: var(--radius-lg, 0.5rem);
    border-top-right-radius: var(--radius-lg, 0.5rem);
}

#location-extra-contacts-card:has(.card-content.collapsed) .card-header {
    border-radius: var(--radius-lg, 0.5rem);
    border-bottom: none;
}

@media (max-width: 1200px) {
    .client-view-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .client-view-header {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 0.65rem;
    }

    .client-view-header h2 {
        flex: 1 1 auto;
        min-width: 0;
        font-size: 1.2rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .client-view-actions,
    .client-view-actions-grid {
        margin-left: auto;
        flex-shrink: 0;
        justify-content: flex-end;
    }
    
    .client-view-subheader {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .client-view-subheader .btn {
        width: 100%;
        justify-content: center;
    }
    
    .client-view-grid {
        grid-template-columns: 1fr;
    }
}

/* PWA első indítás: engedélykérési modál */
.pwa-permission-modal {
    position: fixed;
    inset: 0;
    z-index: 99998;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: pwa-permission-fadein 0.3s ease;
}
@keyframes pwa-permission-fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}
.pwa-permission-inner {
    background: #ffffff;
    border-radius: 16px;
    padding: 1.5rem;
    max-width: 360px;
    width: 100%;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.15);
}
.pwa-permission-icon-wrap {
    width: 56px;
    height: 56px;
    margin: 0 auto 1rem;
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pwa-permission-icon {
    font-size: 28px;
    color: #1d4ed8;
}
.pwa-permission-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 0.5rem;
    text-align: center;
}
.pwa-permission-desc {
    font-size: 0.9375rem;
    color: #64748b;
    margin: 0 0 1rem;
    text-align: center;
    line-height: 1.5;
}
.pwa-permission-desc--sub {
    font-size: 0.8125rem;
    margin-top: -0.35rem;
    margin-bottom: 1rem;
    color: #94a3b8;
}
.pwa-permission-list {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
}
.pwa-permission-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #475569;
    margin-bottom: 0.75rem;
    line-height: 1.4;
}
.pwa-permission-list li .material-symbols-outlined {
    font-size: 1.25rem;
    color: #1d4ed8;
    flex-shrink: 0;
}
.pwa-permission-actions {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.pwa-permission-btn {
    width: 100%;
    justify-content: center;
}
.pwa-permission-btn .material-symbols-outlined.spin {
    animation: gps-spin 1s linear infinite;
}

/* Biometrikus regisztráció prompt (bejelentkezés után) */
.biometric-prompt-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10002;
    padding: 20px;
}
.biometric-prompt-modal {
    background: white;
    border-radius: 12px;
    padding: 2rem;
    max-width: 400px;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
    text-align: center;
}
.biometric-prompt-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.biometric-prompt-icon .material-symbols-outlined {
    font-size: 32px;
    color: white;
}
.biometric-prompt-modal h3 {
    margin: 0 0 0.5rem;
    font-size: 1.25rem;
    color: #1a202c;
}
.biometric-prompt-modal p {
    margin: 0 0 1.5rem;
    color: #64748b;
    font-size: 0.9375rem;
}
.biometric-prompt-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.biometric-prompt-btn {
    padding: 0.75rem 1.25rem;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    transition: background 0.2s, color 0.2s;
}
.biometric-prompt-yes {
    background: #2563eb;
    color: white;
}
.biometric-prompt-yes:hover:not(:disabled) {
    background: #1d4ed8;
}
.biometric-prompt-yes:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}
.biometric-prompt-no {
    background: #f1f5f9;
    color: #64748b;
}
.biometric-prompt-no:hover {
    background: #e2e8f0;
}
.biometric-prompt-hint {
    margin-top: 1rem;
    font-size: 0.875rem;
    color: #059669;
}

/* Biometrikus bejelentkezés oldal (PWA) */
.biometric-login-page {
    min-height: calc(100vh - 100px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}
.biometric-login-container {
    max-width: 420px;
    width: 100%;
}
.biometric-login-card {
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    border-radius: 20px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.05);
    padding: 2.5rem;
    text-align: center;
    border: 1px solid rgba(37, 99, 235, 0.15);
}
.biometric-login-icon-wrap {
    width: 96px;
    height: 96px;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 50%, #1e40af 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 40px rgba(37, 99, 235, 0.4);
    animation: biometric-pulse 2s ease-in-out infinite;
}
@keyframes biometric-pulse {
    0%, 100% { box-shadow: 0 12px 40px rgba(37, 99, 235, 0.4); }
    50% { box-shadow: 0 12px 50px rgba(37, 99, 235, 0.5); }
}
.biometric-login-icon-wrap .biometric-login-icon {
    font-size: 48px;
    color: #fff;
}
.biometric-login-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a202c;
    margin: 0 0 0.5rem 0;
}
.biometric-login-subtitle {
    color: #64748b;
    font-size: 0.9375rem;
    margin: 0 0 0.5rem 0;
}
.biometric-login-email {
    color: #94a3b8;
    font-size: 0.8125rem;
    margin: 0 0 1.5rem 0;
    display: none;
}
.biometric-login-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.biometric-retry-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.875rem 1.5rem;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    color: white;
    border: none;
    border-radius: 12px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}
.biometric-retry-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 25px rgba(37, 99, 235, 0.35);
}
.biometric-retry-btn .material-symbols-outlined {
    font-size: 22px;
}
.biometric-password-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    color: #64748b;
    font-size: 0.9375rem;
    text-decoration: none;
    border-radius: 10px;
    transition: background 0.2s, color 0.2s;
}
.biometric-password-link:hover {
    background: #f1f5f9;
    color: #475569;
}
.biometric-password-link .material-symbols-outlined {
    font-size: 20px;
}

/* =============================================================================
   Ügyfél + helyszín lista / részletek: műveleti gombok – közvetlen Material ikon
   (ugyanaz a .client-actions-grid / .client-view-actions-grid markup a locations oldalon;
   a globális task-actions.css elrejtené a .task-action-btn .material-symbols-outlined
   elemet – itt felülírjuk)
   ============================================================================= */
.client-actions-grid .task-action-btn::before,
.client-view-actions-grid .task-action-btn::before {
    content: none;
    display: none;
}

.client-actions-grid .task-action-btn .material-symbols-outlined,
.client-view-actions-grid .task-action-btn .material-symbols-outlined {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.client-actions-grid .task-action-btn i[class*="la-"],
.client-view-actions-grid .task-action-btn i[class*="la-"] {
    display: none;
}



/* ========== email-client.css ========== */

/* Email kliens stílusok (main.css-ből kiemelve) */

/* =============================================================================
   Email kliens (IMAP/SMTP) – ugyanaz a vizuális nyelv, mint clients / task-modal
   ============================================================================= */
.email-client-page .email-client-intro {
    color: var(--gray-600);
    font-size: 0.875rem;
    max-width: 56rem;
    line-height: 1.6;
    margin: 0 0 1rem;
}
.email-client-page {
    --email-scrollbar-size: 8px;
    --email-scrollbar-track: #f1f5f9;
    --email-scrollbar-thumb: #cbd5e1;
    --email-scrollbar-thumb-hover: #94a3b8;
    --email-form-input-border: #d1d5db;
    --email-form-input-bg: #fff;
    --email-form-input-text: #111827;
    --email-form-input-focus: #3b82f6;
    --email-form-input-focus-ring: rgb(59 130 246 / 0.15);
    --email-form-fieldset-border: #e2e8f0;
    --email-form-fieldset-bg: #f8fafc;
}
.email-client-page .email-client-intro a {
    color: #2563eb;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.email-client-page .email-client-intro a:hover {
    color: #1d4ed8;
}
.email-client-page .email-client-intro strong {
    color: var(--gray-800);
}
.email-client-page .email-client-spam-note {
    font-size: 0.8125rem;
    color: #64748b;
    margin: 0 0 0.75rem;
    line-height: 1.45;
    max-width: 72rem;
}
.email-client-page .email-client-list-fast-note {
    font-size: 0.8125rem;
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    margin: 0 0 0.75rem;
    line-height: 1.45;
    max-width: 72rem;
}
.email-client-page .email-spam-badge {
    flex-shrink: 0;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.12rem 0.35rem;
    border-radius: 4px;
    background: #fef3c7;
    color: #b45309;
    margin-right: 0.35rem;
    vertical-align: middle;
}
.email-client-page .email-spam-badge-high {
    background: #fee2e2;
    color: #b91c1c;
}
.email-client-page .email-not-spam-btn {
    display: none;
    align-items: center;
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
    padding: 0.12rem 0.46rem;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    background: #f1f5f9;
    color: #334155;
    font-size: 0.64rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    transition: background-color 0.14s ease, border-color 0.14s ease, color 0.14s ease, box-shadow 0.14s ease;
}
.email-client-page .email-not-spam-btn:hover {
    background: #e2e8f0;
    border-color: #94a3b8;
    color: #1e293b;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}
.email-client-page .email-not-spam-btn:focus-visible {
    outline: 2px solid rgba(59, 130, 246, 0.28);
    outline-offset: 1px;
}
.email-client-page #email-client-banner.alert {
    margin-bottom: 1rem;
}
.email-client-page .email-client-hint {
    font-size: 0.8125rem;
    color: var(--gray-600);
    margin-top: 0.75rem;
    line-height: 1.5;
}
.email-client-page .email-client-hint code {
    font-size: 0.8em;
    background: var(--gray-100);
    padding: 0.1em 0.35em;
    border-radius: var(--radius);
    color: var(--gray-800);
}
.email-client-page .email-search-unread-hint {
    margin-top: 0.35rem;
    max-width: 42rem;
}
/* Asztalon: ne a teljes oldal görgessen a hosszú levéllista miatt – csak a lista oszlop */
@media (min-width: 901px) {
    main:has(.email-client-page) {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }
    .clients-section.email-client-page {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
        box-sizing: border-box;
    }
    .email-client-page > .page-header,
    .email-client-page > .email-client-intro,
    .email-client-page > #email-client-banner,
    .email-client-page > .email-client-spam-note {
        flex-shrink: 0;
    }
}
.email-client-page .email-client-layout {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: calc(100vh - 200px);
    max-height: calc(100vh - 120px);
    align-items: stretch;
    min-width: 0;
}
.email-client-page .email-account-top-rail {
    flex-shrink: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 0.45rem 0.65rem;
}
.email-client-page .email-account-top-rail-inner {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}
.email-client-page .email-rail-new-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    min-height: 2.5rem;
    padding: 0;
    border-radius: 50%;
    background: #dc2626;
    border: 1px solid #b91c1c;
    color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.email-client-page .email-rail-contacts-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    min-height: 2.5rem;
    margin-left: auto;
    padding: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, #0d9488, #14b8a6);
    border: 1px solid #0f766e;
    color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.email-client-page .email-rail-contacts-btn:hover {
    background: linear-gradient(135deg, #0f766e, #0d9488);
    border-color: #115e59;
    color: #fff;
}
.email-client-page .email-rail-contacts-btn .material-symbols-outlined {
    font-size: 1.4rem;
    margin: 0;
}
.email-client-page .email-rail-new-btn:hover {
    background: #b91c1c;
    border-color: #991b1b;
    color: #fff;
}
.email-client-page .email-rail-new-btn .material-symbols-outlined {
    font-size: 1.4rem;
    margin: 0;
}
.email-client-page .email-rail-hint {
    margin: 0.35rem 0 0;
    font-size: 0.75rem;
}
.email-client-page .email-rail-hint[hidden] {
    margin: 0;
    padding: 0;
}
.email-client-page .email-rail-hint:not([hidden]) {
    padding: 0.35rem 0.55rem;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
}
.email-client-page .email-account-top-rail .email-account-list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.25rem;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding: 0.1rem 0;
}
.email-client-page .email-account-top-rail .email-account-item {
    flex: 0 0 auto;
    justify-content: center;
    padding: 0.15rem;
    margin-bottom: 0;
    border-radius: 8px;
}
.email-client-page .email-account-top-rail .email-account-item.active {
    background: #dbeafe;
    border-color: #93c5fd;
}
.email-client-page .email-account-top-rail .email-account-btn {
    flex: 0 0 auto;
    padding: 0.15rem;
    justify-content: center;
}
.email-client-page .email-account-top-rail .email-account-text,
.email-client-page .email-account-top-rail .email-account-edit,
.email-client-page .email-account-top-rail .email-account-del {
    display: none !important;
}
.email-client-page .email-account-top-rail .email-account-avatar {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 0.72rem;
}
.email-client-page .email-account-top-rail .email-account-avatar-spinner {
    font-size: 1.35rem;
}
.email-client-page .email-account-top-rail .email-account-unread-badge {
    top: 0;
    right: 0;
}
.email-client-page .email-account-top-rail .email-account-empty {
    font-size: 0.8rem;
    padding: 0.35rem 0.5rem;
    white-space: nowrap;
}
.email-client-page .email-mobile-accounts-btn {
    display: none;
}
@media (min-width: 901px) {
    .email-client-page .email-mobile-accounts-btn {
        display: none !important;
    }
    .email-client-page .email-client-layout {
        flex: 1 1 auto;
        min-height: 0;
        max-height: none;
        overflow: hidden;
    }
    .email-client-page .email-client-main {
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
    }
}
@media (max-width: 900px) {
    body.email-mobile-sidebar-lock {
        overflow: hidden;
    }
    .email-client-page .email-client-layout {
        max-height: none;
        min-height: auto;
    }
    .email-client-page .email-account-top-rail {
        border-radius: 12px;
        padding: 0.4rem 0.5rem;
    }
    .email-client-page .email-mobile-accounts-btn {
        display: inline-flex;
        min-height: 2.4rem;
        padding-inline: 0.7rem;
    }
    .email-client-page .email-client-main {
        overflow: visible;
        min-height: 0;
    }
    .email-client-page .email-client-body {
        max-height: none;
        overflow: visible;
        min-height: 0;
    }
    .email-client-page .email-client-list-wrap {
        min-height: 0;
        max-height: none;
        border-radius: 12px;
        padding: 0.25rem 0.35rem;
        flex: 1 1 auto;
    }
    .email-client-page .email-client-toolbar {
        gap: 0.5rem;
        padding: 0.6rem 0.7rem;
        border-radius: 12px;
    }
    .email-client-page .email-search-toolbar {
        gap: 0.5rem;
        padding: 0.6rem 0.7rem;
        border-radius: 12px;
    }
    .email-client-page .email-search-filters {
        width: 100%;
        gap: 0.55rem;
    }
    .email-client-page .email-search-filter-group {
        width: 100%;
    }
    .email-client-page .email-message-item {
        padding: 0.58rem 0.5rem;
        border-radius: 10px;
        grid-template-columns: auto minmax(0, 1fr) auto;
        column-gap: 0.45rem;
    }
    .email-client-page .email-msg-from {
        font-size: 0.84rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .email-client-page .email-msg-subj {
        font-size: 0.86rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .email-client-page .email-msg-date {
        font-size: 0.74rem;
        color: #6b7280;
    }
    .email-client-page .email-reading-pane:not([hidden]) {
        position: static;
        inset: auto;
        z-index: auto;
        border-radius: 12px;
        border: 1px solid #e5e7eb;
        box-shadow: var(--shadow);
        overflow-x: hidden;
        overflow-y: visible;
        max-width: 100%;
        min-width: 0;
    }
    .email-client-page .email-reading-bar {
        position: sticky;
        top: 0;
        z-index: 20;
        justify-content: space-between;
        gap: 0.4rem;
        padding: 0.4rem 0.55rem;
        background: #fff;
    }
    .email-client-page .email-reading-detail {
        padding: 0.6rem 0.7rem 0.9rem;
        overflow-x: hidden;
        overflow-y: visible;
        max-width: 100%;
        min-width: 0;
    }
    .email-client-page .email-reading-pane #email-detail-content {
        display: block;
        overflow-x: hidden;
        overflow-y: visible;
        max-width: 100%;
        min-width: 0;
    }
    .email-client-page .email-mobile-actionbar {
        display: flex;
        flex: 1 1 auto;
        justify-content: flex-end;
        margin-left: auto;
        padding: 0;
        min-width: 0;
    }
    .email-client-page .email-detail-body {
        overflow-x: hidden;
        overflow-y: visible;
        min-height: 0;
        max-height: none;
        height: auto;
        max-width: 100%;
        min-width: 0;
        width: 100%;
    }
    .email-client-page .email-detail-body iframe,
    .email-client-page .email-detail-body .email-body-html-mount,
    .email-client-page .email-detail-body pre,
    .email-client-page .email-detail-body .email-body-plain {
        max-height: none !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        height: auto !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    .email-client-page .email-detail-body iframe.email-body-iframe {
        overflow: hidden !important;
        min-height: 180px !important;
        flex: 0 0 auto !important;
        max-width: 100% !important;
        border-radius: 8px;
    }
    .email-client-page .email-detail-body .email-body-html-mount img,
    .email-client-page .email-detail-body .email-body-html-mount table,
    .email-client-page .email-detail-body .email-body-html-mount td,
    .email-client-page .email-detail-body .email-body-html-mount div {
        max-width: 100% !important;
    }
    .email-client-page .email-detail-body .email-body-html-mount table {
        max-width: 100% !important;
        table-layout: fixed !important;
    }
    .email-client-page .email-detail-body .email-body-html-mount,
    .email-client-page .email-detail-body .email-body-html-mount * {
        box-sizing: border-box;
    }
    .email-client-page .email-detail-body .email-body-html-mount {
        overflow-x: hidden !important;
        word-wrap: break-word;
        overflow-wrap: anywhere;
        min-height: auto !important;
        height: auto !important;
    }
    .email-client-page .email-detail-body .email-body-html-mount td,
    .email-client-page .email-detail-body .email-body-html-mount th,
    .email-client-page .email-detail-body .email-body-html-mount p,
    .email-client-page .email-detail-body .email-body-html-mount span {
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .email-client-page .email-detail-body .email-body-html-mount a {
        overflow-wrap: anywhere;
    }
}
.email-client-page .email-client-sidebar {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 1rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: min(200px, calc(100vh - 200px));
}
.email-client-page .email-client-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
/* Egy oszlop: lista teljes szélesség; megnyitott levél ugyanitt (Gmail-szerű) */
.email-client-page .email-client-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
    gap: 0;
}
.email-client-page .email-list-pane:not([hidden]) {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.email-client-page .email-reading-pane:not([hidden]) {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    overflow: hidden;
}
.email-client-page .email-reading-bar {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem 0.35rem 0.5rem;
    border-bottom: 1px solid #e8eaed;
    background: #fff;
    overflow: visible;
}
/* Asztali: auvi-back-btn (nyíl + „Vissza”); mobil: kerek ikon – ne erőltessünk fix 40px kört */
.email-client-page .email-back-btn {
    flex-shrink: 0;
}
.email-client-page .email-back-btn .material-symbols-outlined {
    font-size: 1.25rem;
}
.email-client-page .email-reading-detail {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0.75rem 1rem 1rem;
    border: none;
    box-shadow: none;
    border-radius: 0;
}
/* display:flex csak ha a lista nincs [hidden] — különben felülírná a böngésző rejtését és a levél a lista alá kerülne */
.email-client-page .email-client-list-wrap,
.email-client-page .email-client-detail {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 1rem;
    min-height: 0;
    min-width: 0;
}
.email-client-page .email-client-list-wrap:not([hidden]),
.email-client-page .email-client-detail {
    display: flex;
    flex-direction: column;
}
.email-client-page .email-client-body > .email-client-list-wrap {
    min-height: 0;
}
.email-client-page .email-client-list-wrap {
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f1f5f9;
}
.email-client-page .email-client-list-wrap::-webkit-scrollbar {
    width: var(--email-scrollbar-size, 8px);
}
.email-client-page .email-client-list-wrap::-webkit-scrollbar-track {
    background: var(--email-scrollbar-track, #f1f5f9);
    border-radius: 4px;
}
.email-client-page .email-client-list-wrap::-webkit-scrollbar-thumb {
    background: var(--email-scrollbar-thumb, #cbd5e1);
    border-radius: 4px;
}
.email-client-page .email-client-list-wrap::-webkit-scrollbar-thumb:hover {
    background: var(--email-scrollbar-thumb-hover, #94a3b8);
}
.email-client-page .email-client-detail:not(.email-reading-detail) {
    overflow: hidden;
}
.email-client-page .email-reading-detail.email-client-detail {
    background: transparent;
}

/* Levélnézet: teljes szélesség; asztalon lista + olvasó oszlop */
.email-client-page .email-client-main.email-reading-active .email-client-body {
    width: 100%;
    max-width: none;
    min-width: 0;
}
.email-client-page .email-client-main.email-reading-active .email-reading-pane:not([hidden]) {
    width: 100%;
    max-width: none;
    min-width: 0;
    flex: 1 1 auto;
}
.email-client-page .email-client-main.email-reading-active .email-reading-detail,
.email-client-page .email-client-main.email-reading-active #email-detail,
.email-client-page .email-client-main.email-reading-active #email-detail-content {
    width: 100%;
    max-width: none;
    min-width: 0;
    box-sizing: border-box;
}
@media (min-width: 901px) {
    .email-client-page .email-client-main.email-reading-active .email-client-body {
        display: grid;
        grid-template-columns: minmax(280px, 36%) minmax(0, 1fr);
        gap: 0.75rem;
        align-items: stretch;
    }
    .email-client-page .email-client-main.email-reading-active .email-list-pane:not([hidden]) {
        min-height: 0;
        max-height: none;
    }
    .email-client-page .email-client-main.email-reading-active .email-reading-pane:not([hidden]) {
        grid-column: auto;
        min-height: min(70vh, 720px);
    }
}
@media (max-width: 900px) {
    .email-client-page .email-client-main.email-reading-active .email-client-body {
        display: flex;
        flex-direction: column;
    }
    .email-client-page .email-client-main.email-reading-active .email-reading-pane:not([hidden]) {
        width: 100%;
        max-width: none;
        margin: 0;
    }
}
.email-detail-load-failed {
    padding: 1.25rem 1rem;
    text-align: center;
    color: #64748b;
}
.email-detail-load-failed-text {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    line-height: 1.5;
}
.email-client-page .email-client-toolbar {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 0.75rem 1rem;
    flex-shrink: 0;
}
.email-client-page .email-toolbar-primary,
.email-client-page .email-toolbar-secondary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem 0.85rem;
    min-width: 0;
}
.email-client-page .email-toolbar-primary {
    width: 100%;
}
.email-client-page .email-toolbar-secondary {
    width: 100%;
}
.email-client-page .email-toolbar-secondary .email-client-pagination {
    margin-left: auto;
    font-size: 0.8125rem;
    color: #64748b;
    white-space: nowrap;
}
.email-client-page .email-toolbar-secondary .email-client-pagination:empty {
    display: none;
}
.email-client-page .email-search-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 0.85rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: 0.85rem 1.1rem;
    flex-shrink: 0;
}
.email-client-page .email-search-toolbar .email-toolbar-action {
    flex-shrink: 0;
}
.email-client-page .email-search-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 14rem;
    min-width: 0;
    max-width: 100%;
}
.email-client-page .email-search-input-icon {
    position: absolute;
    left: 0.65rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.2rem;
    color: var(--gray-500);
    pointer-events: none;
    z-index: 1;
}
.email-client-page .email-search-toolbar .email-search-label {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex: 1 1 14rem;
    min-width: 0;
    max-width: 100%;
}
.email-client-page .email-search-label .material-symbols-outlined {
    font-size: 1.35rem;
    color: var(--gray-500);
    flex-shrink: 0;
}
.email-client-page .email-search-input {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: 2.5rem;
    padding: 0.45rem 0.75rem 0.45rem 2.35rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.9rem;
}
.email-client-page .email-search-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0.65rem 1rem;
    font-size: 0.8125rem;
    color: var(--gray-600);
    flex: 1 1 100%;
    width: 100%;
}
.email-client-page .email-search-filter-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.9rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #f8fafc;
}
.email-client-page .email-search-filter-title {
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #475569;
    text-transform: uppercase;
}
.email-client-page .email-search-check {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    margin: 0;
}
.email-client-page-header .page-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}
.email-client-page .email-client-header-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-left: auto;
}
.email-client-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    flex-wrap: wrap;
}
.email-client-page .email-header-settings-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-left: auto;
}
.email-client-page .email-signature-scope {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}
.email-client-page .email-signature-account-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 1.35rem;
    max-height: 16rem;
    overflow: auto;
    padding: 0.75rem 0.9rem;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
}
.email-client-page .email-signature-account-item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.15rem 0;
    cursor: pointer;
    font-weight: 500;
    color: #374151;
    white-space: nowrap;
}
.email-client-page .email-signature-account-item input[type="checkbox"] {
    margin: 0;
    flex-shrink: 0;
}
#email-signature-modal .email-signature-account-list {
    gap: 0.7rem 1.5rem;
}
#email-signature-modal .email-signature-account-item {
    gap: 0.5rem;
}

#email-signature-modal .email-signature-tabs-row {
    margin-bottom: 0.35rem;
}
#email-signature-modal .email-signature-account-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.35rem;
}
#email-signature-modal .email-signature-account-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 2.15rem;
    padding: 0.35rem 0.85rem;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
    color: #334155;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}
#email-signature-modal .email-signature-account-tab:hover {
    border-color: #93c5fd;
    background: #f8fbff;
}
#email-signature-modal .email-signature-account-tab.is-active {
    border-color: #2563eb;
    background: #eff6ff;
    color: #1d4ed8;
    box-shadow: inset 0 0 0 1px rgb(37 99 235 / 0.08);
}
#email-signature-modal .email-signature-account-tab.has-signature::after {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    flex-shrink: 0;
}
#email-signature-modal .email-signature-active-meta {
    margin: 0.45rem 0 0;
    font-size: 0.8125rem;
    color: #64748b;
}
#email-signature-modal .email-signature-active-meta strong {
    color: #0f172a;
    font-weight: 600;
}
#email-signature-modal .email-signature-copy-panel {
    margin-top: 1rem;
    padding: 0.85rem 0.95rem;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #f8fafc;
}
#email-signature-modal .email-signature-copy-head {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-bottom: 0.65rem;
}
#email-signature-modal .email-signature-copy-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #0f172a;
}
#email-signature-modal .email-signature-copy-hint {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.4;
}
#email-signature-modal .email-signature-copy-targets {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    max-height: 11rem;
    overflow: auto;
    padding-right: 0.15rem;
}
#email-signature-modal .email-signature-copy-item {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    margin: 0;
    padding: 0.55rem 0.65rem;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
}
#email-signature-modal .email-signature-copy-item input[type="checkbox"] {
    margin: 0.15rem 0 0;
    flex-shrink: 0;
}
#email-signature-modal .email-signature-copy-text {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}
#email-signature-modal .email-signature-copy-name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0f172a;
}
#email-signature-modal .email-signature-copy-email {
    font-size: 0.75rem;
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#email-signature-modal .email-signature-copy-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}
#email-signature-modal .email-signature-copy-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* Email beállítások – összecsukható szekciók */
#email-signature-modal .email-settings-intro {
    margin: 0 0 0.85rem;
    font-size: 0.8125rem;
    color: var(--gray-500);
    line-height: 1.45;
}
#email-signature-modal .email-settings-sections {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
#email-signature-modal .email-settings-section {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fafafa;
    overflow: hidden;
}
#email-signature-modal .email-settings-section[open] {
    background: #fff;
    border-color: #d1d5db;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
#email-signature-modal .email-settings-section-summary {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.7rem 0.85rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
}
#email-signature-modal .email-settings-section-summary::-webkit-details-marker {
    display: none;
}
#email-signature-modal .email-settings-section-summary::marker {
    content: '';
}
#email-signature-modal .email-settings-section-icon {
    flex: 0 0 auto;
    font-size: 1.35rem;
    color: #475569;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 0.35rem;
}
#email-signature-modal .email-settings-section[open] .email-settings-section-icon {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}
#email-signature-modal .email-settings-section-titles {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
#email-signature-modal .email-settings-section-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #111827;
}
#email-signature-modal .email-settings-section-desc {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.35;
}
#email-signature-modal .email-settings-section-chevron {
    flex: 0 0 auto;
    font-size: 1.35rem;
    color: #94a3b8;
    transition: transform 0.2s ease;
}
#email-signature-modal .email-settings-section[open] .email-settings-section-chevron {
    transform: rotate(180deg);
    color: #475569;
}
#email-signature-modal .email-settings-section-body {
    padding: 0 0.85rem 0.85rem;
    border-top: 1px solid #f1f5f9;
}
#email-signature-modal .email-settings-section-body .form-row {
    margin-bottom: 0.65rem;
}
#email-signature-modal .email-settings-section-body .form-row:last-child {
    margin-bottom: 0;
}
#email-signature-modal .email-settings-section-body .email-client-hint {
    margin-top: 0.35rem;
    margin-bottom: 0;
}
#email-signature-modal .email-settings-section-body #email-btn-rebuild-db-cache {
    margin-top: 0.5rem;
}

#email-signature-modal .email-shortcuts-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0.65rem;
    font-size: 0.875rem;
}
#email-signature-modal .email-shortcuts-table th,
#email-signature-modal .email-shortcuts-table td {
    padding: 0.4rem 0.55rem;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
    vertical-align: top;
}
#email-signature-modal .email-shortcuts-table th {
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #475569;
    background: #f8fafc;
}
#email-signature-modal .email-shortcuts-table kbd {
    display: inline-block;
    min-width: 1.6rem;
    padding: 0.12rem 0.45rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #fff;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
    line-height: 1.35;
    box-shadow: 0 1px 0 #e2e8f0;
}
.email-client-page .email-rich-editor-card {
    border: 1px solid #d1d5db;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}
.email-client-page .email-rich-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.65rem;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
}
.email-client-page .email-rich-toolbar select,
.email-client-page .email-rich-toolbar input[type="color"] {
    width: auto;
    min-width: 0;
}
.email-client-page .email-rich-toolbar select {
    height: 2.4rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: #334155;
    font-size: 0.8125rem;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}
.email-client-page .email-rich-toolbar input[type="color"] {
    width: 2.4rem;
    height: 2.4rem;
    padding: 0.2rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}
.email-client-page .email-rich-toolbar input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
}
.email-client-page .email-rich-toolbar input[type="color"]::-webkit-color-swatch {
    border: none;
    border-radius: 7px;
}
.email-client-page .email-rich-toolbar input[type="color"]::-moz-color-swatch {
    border: none;
    border-radius: 7px;
}
.email-client-page .email-rich-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: #334155;
    cursor: pointer;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
    transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}
.email-client-page .email-rich-btn:hover {
    background: #eff6ff;
    border-color: #93c5fd;
    box-shadow: 0 4px 10px rgb(59 130 246 / 0.12);
    transform: translateY(-1px);
}
.email-client-page .email-rich-btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
}
.email-client-page .email-rich-btn .material-symbols-outlined {
    font-size: 1.1rem;
    line-height: 1;
}
.email-client-page .email-rich-editor {
    min-height: 9rem;
    padding: 1.15rem 1.25rem;
    background: #fff;
    color: #111827;
    font-size: 0.875rem;
    line-height: 1.55;
    outline: none;
}
#email-signature-modal .email-rich-editor {
    min-height: 16rem;
    padding: 1.15rem 1.25rem !important;
    box-sizing: border-box;
}
#email-signature-modal .email-rich-editor > :first-child {
    margin-top: 0;
}
#email-signature-modal .email-rich-editor > :last-child {
    margin-bottom: 0;
}
.email-client-page .email-rich-editor ul,
.email-client-page .email-rich-editor ol {
    margin: 0.35rem 0;
    padding-left: 1.1rem;
    list-style-position: inside;
}
.email-client-page .email-rich-editor li {
    margin: 0.15rem 0;
}
.email-client-page .email-rich-editor .email-compose-signature-separator {
    border: 0;
    border-top: 1px solid #cbd5e1;
    margin: 0.9rem 0 0.85rem;
}
.email-client-page .email-rich-editor .email-compose-signature-block {
    color: #475569;
}
.email-client-page .email-rich-editor:empty::before {
    content: attr(data-placeholder);
    color: #94a3b8;
}
.email-client-page .email-ai-status {
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    color: var(--gray-600);
}
.email-client-page .email-ai-status--live {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
}
.email-client-page .email-ai-status--err {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}
.email-client-page .email-ai-status--nokey,
.email-client-page .email-ai-status--na {
    background: #f3f4f6;
    color: #6b7280;
}
.email-client-page .email-ai-status--check {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #1d4ed8;
}
.email-client-page .email-ai-status--warn {
    background: #fffbeb;
    border-color: #fde68a;
    color: #b45309;
}
.email-client-page .email-toolbar-action {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.75rem;
    padding: 0.65rem 1.15rem;
    font-size: 0.9375rem;
    font-weight: 600;
}
.email-client-page .email-toolbar-action .material-symbols-outlined {
    font-size: 1.35rem;
}
.email-client-page .email-toolbar-pagination-group {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem 0.85rem;
    flex-wrap: wrap;
}
.email-client-page .email-toolbar-info-row {
    flex: 1 1 100%;
    width: 100%;
    text-align: left;
}
.email-client-page .email-list-view-options {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.85rem;
    flex: 1 1 auto;
    min-width: 0;
    margin-left: auto;
    padding: 0.2rem 0.45rem;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    background: #f8fafc;
    font-size: 0.8125rem;
    color: var(--gray-600);
}
.email-client-page .email-list-sync-hint {
    font-size: 0.8rem;
    color: #64748b;
    white-space: nowrap;
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
}
.email-client-page .email-toolbar-nav {
    display: none;
}
.email-client-page .email-list-loading-more {
    padding: 0.75rem 0.5rem 0.9rem;
    text-align: center;
    color: #64748b;
    font-size: 0.8125rem;
}

/* Email betöltési folyamat modal */
.email-load-progress-modal {
    position: fixed;
    inset: 0;
    z-index: 11050;
    display: none;
    align-items: center;
    justify-content: center;
}
.email-load-progress-modal[hidden] {
    display: none !important;
}
.email-load-progress-modal:not([hidden])[aria-hidden="false"] {
    display: flex !important;
}
.email-load-progress-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.38);
    backdrop-filter: blur(2px);
}
.email-load-progress-card {
    position: relative;
    width: min(92vw, 460px);
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    box-shadow: 0 20px 40px rgba(2, 6, 23, 0.25);
    padding: 1rem 1rem 0.9rem;
}
.email-load-progress-title {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.7rem;
}
.email-load-progress-track {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}
.email-load-progress-bar {
    width: 0%;
    height: 100%;
    background: linear-gradient(90deg, #3b82f6 0%, #2563eb 100%);
    border-radius: 999px;
    transition: width 0.22s ease;
}
.email-load-progress-bar.is-indeterminate {
    width: 38%;
    animation: email-load-progress-indeterminate 1.1s ease-in-out infinite;
}
.email-load-progress-text {
    margin-top: 0.55rem;
    font-size: 0.84rem;
    color: #475569;
}
.email-load-progress-actions {
    margin-top: 0.75rem;
    display: flex;
    justify-content: flex-end;
}
.email-load-progress-mini {
    position: fixed;
    right: 14px;
    bottom: 14px;
    z-index: 11040;
    width: min(92vw, 320px);
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(2, 6, 23, 0.2);
    padding: 0.65rem 0.7rem 0.7rem;
}
.email-load-progress-mini-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.45rem;
    color: #0f172a;
    font-size: 0.82rem;
}
.email-load-progress-mini-open {
    border: none;
    background: transparent;
    color: #2563eb;
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 600;
    padding: 0;
}
.email-load-progress-track--mini {
    height: 7px;
}
.email-load-progress-text--mini {
    margin-top: 0.42rem;
    font-size: 0.76rem;
}
.email-cache-sync-status {
    position: fixed;
    right: 14px;
    bottom: 72px;
    z-index: 11039;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.55rem;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #ffffff;
    color: #475569;
    box-shadow: 0 10px 24px rgba(2, 6, 23, 0.18);
}
.email-cache-sync-status-icon {
    display: inline-flex;
    font-size: 26px;
    line-height: 1;
    animation: email-cache-sync-spin 1s linear infinite;
}
@keyframes email-cache-sync-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.email-body-html-mount.email-images-off img,
.email-body-html-mount.email-images-off picture,
.email-body-html-mount.email-images-off source,
.email-body-html-mount.email-images-off svg,
.email-body-html-mount.email-images-off video {
    visibility: hidden !important;
    max-height: 24px !important;
}
.email-body-html-mount.email-images-off [style*="background-image"] {
    background-image: none !important;
}
/* AI vizsgálat indulási beállító modal */
.email-ai-scan-modal {
    position: fixed;
    inset: 0;
    z-index: 11055;
    display: none;
    align-items: center;
    justify-content: center;
}
.email-ai-scan-modal[hidden] {
    display: none !important;
}
.email-ai-scan-modal:not([hidden])[aria-hidden="false"] {
    display: flex !important;
}
.email-ai-scan-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.4);
    backdrop-filter: blur(2px);
}
.email-ai-scan-card {
    position: relative;
    width: min(92vw, 440px);
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    box-shadow: 0 20px 40px rgba(2, 6, 23, 0.25);
    padding: 1rem;
}
.email-ai-scan-title {
    margin: 0 0 0.45rem;
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
}
.email-ai-scan-hint {
    margin: 0 0 0.75rem;
    color: #475569;
    font-size: 0.86rem;
}
.email-ai-scan-label {
    display: block;
    margin-bottom: 0.3rem;
    font-size: 0.78rem;
    color: #475569;
    font-weight: 600;
}
.email-ai-scan-select {
    width: 100%;
    min-height: 2.45rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 0.35rem 0.6rem;
    font-size: 0.9rem;
    color: #0f172a;
    background: #fff;
}
.email-ai-scan-actions {
    margin-top: 0.85rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}
@keyframes email-load-progress-indeterminate {
    0% { transform: translateX(-95%); }
    100% { transform: translateX(260%); }
}
.email-client-page .email-nav-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.85rem;
    min-height: 2.75rem;
    padding: 0.5rem 0.6rem;
}
.email-client-page .email-nav-btn .material-symbols-outlined {
    font-size: 1.65rem;
    line-height: 1;
}
@media (max-width: 768px) {
    .email-client-page-header {
        align-items: flex-start;
        justify-content: flex-start;
    }
    .email-client-page-header .page-title {
        width: 100%;
    }
    .email-client-page .email-client-header-actions {
        width: 100%;
        justify-content: space-between;
        margin-left: 0;
    }
    .email-client-page .email-client-header-actions > .email-header-settings-btn {
        margin-left: 0;
        inline-size: 2.5rem;
        block-size: 2.5rem;
        min-inline-size: 2.5rem;
        min-block-size: 2.5rem;
        flex: 0 0 2.5rem;
        padding: 0;
        gap: 0;
        justify-content: center;
        align-items: center;
        border-radius: 999px;
    }
    .email-client-page .email-header-settings-text {
        display: none;
    }
    .email-client-page .email-client-header-actions > .email-header-settings-btn .material-symbols-outlined {
        font-size: 1.2rem;
    }
}
.email-client-page .email-sidebar-new-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 2.6rem;
    padding: 0.55rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
}
.email-client-page .email-sidebar-new-btn .material-symbols-outlined {
    font-size: 1.2rem;
}
.email-client-page .email-folder-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--gray-700);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}
.email-client-page .email-folder-label select,
.email-client-page #email-folder-select {
    min-width: 12rem;
    min-height: 2.65rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: var(--radius-lg);
    font-size: 0.9375rem;
    color: #111827;
    background: #fff;
}
.email-client-page .email-client-toolbar .email-client-pagination {
    display: inline-block;
    font-size: 0.8125rem;
    color: var(--gray-600);
    white-space: normal;
    line-height: 1.3;
}
@media (max-width: 639px) {
    .email-client-page .email-folder-label {
        display: flex;
        width: 100%;
        align-items: center;
    }

    .email-client-page .email-folder-label select,
    .email-client-page #email-folder-select {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
    }

    .email-client-page .email-toolbar-pagination-group {
        flex: 1 1 100%;
        margin-left: 0;
        justify-content: space-between;
    }
}
.email-client-page .email-client-sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}
.email-client-page .email-client-sidebar-head h2,
.email-client-page .email-sidebar-title {
    font-size: 1.0625rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}
.email-client-page .email-sidebar-collapse-btn {
    border: none;
    background: #f3f4f6;
    color: var(--gray-700);
    border-radius: var(--radius-md);
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s ease, transform 0.2s ease;
}
.email-client-page .email-sidebar-collapse-btn:hover {
    background: #e5e7eb;
}
.email-client-page .email-sidebar-collapse-btn .material-symbols-outlined {
    font-size: 1.35rem;
    line-height: 1;
}
@media (min-width: 901px) {
    .email-client-page.email-sidebar-collapsed .email-client-sidebar {
        padding: 0.5rem 0.35rem;
        align-items: center;
    }
    .email-client-page.email-sidebar-collapsed .email-client-sidebar-head {
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        border-bottom: none;
        padding-bottom: 0;
        margin-bottom: 0.35rem;
        width: 100%;
        gap: 0.35rem;
    }
    .email-client-page.email-sidebar-collapsed .email-sidebar-title {
        display: none;
    }
    .email-client-page.email-sidebar-collapsed .email-sidebar-collapse-btn .material-symbols-outlined {
        transform: rotate(180deg);
    }
    .email-client-page.email-sidebar-collapsed .email-sidebar-new-btn {
        width: 2.5rem;
        height: 2.5rem;
        min-height: 2.5rem;
        padding: 0;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        background: #dc2626;
        border: 1px solid #b91c1c;
        color: #fff;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    }
    .email-client-page.email-sidebar-collapsed .email-sidebar-new-btn:hover {
        background: #b91c1c;
        border-color: #991b1b;
        color: #fff;
    }
    .email-client-page.email-sidebar-collapsed .email-sidebar-new-text {
        display: none;
    }
    .email-client-page.email-sidebar-collapsed .email-sidebar-new-btn .material-symbols-outlined {
        font-size: 1.4rem;
        margin: 0;
    }
    .email-client-page.email-sidebar-collapsed #email-imap-hint {
        display: none;
    }
    .email-client-page.email-sidebar-collapsed .email-account-text,
    .email-client-page.email-sidebar-collapsed .email-account-edit,
    .email-client-page.email-sidebar-collapsed .email-account-del {
        display: none !important;
    }
    .email-client-page.email-sidebar-collapsed .email-account-item {
        justify-content: center;
        padding: 0.2rem 0;
    }
    .email-client-page.email-sidebar-collapsed .email-account-btn {
        flex: 0 0 auto;
        padding: 0.15rem;
        justify-content: center;
    }
    .email-client-page.email-sidebar-collapsed .email-account-avatar {
        width: 2.5rem;
        height: 2.5rem;
        font-size: 0.72rem;
    }
    .email-client-page.email-sidebar-collapsed .email-account-empty {
        font-size: 0.65rem;
        padding: 0.35rem 0.15rem;
        text-align: center;
        line-height: 1.25;
    }
}
.email-client-page .email-account-label {
    display: block;
    font-weight: 600;
    color: #111827;
}
.email-client-page .email-account-mail {
    display: block;
    font-size: 0.75rem;
    color: var(--gray-500);
    margin-top: 0.15rem;
}
.email-client-page .email-account-edit {
    flex-shrink: 0;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    color: var(--gray-700);
    border-radius: var(--radius-md);
    cursor: pointer;
    padding: 0.25rem 0.4rem;
    font-size: 0.9rem;
    line-height: 1;
    transition: var(--transition);
}
.email-client-page .email-account-edit:hover {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #1d4ed8;
}
.email-client-page .email-account-empty,
.email-client-page .email-msg-error {
    padding: 0.75rem;
    font-size: 0.875rem;
    color: var(--gray-600);
}
.email-client-page .email-msg-error {
    color: var(--error-600);
}
/* Gmail-szerű sor: olvasatlan fehér + félkövér; olvasott halvány háttér */
.email-client-page .email-message-item.unread {
    background: #fff;
}
.email-client-page .email-message-item.read {
    background: #f2f4f8;
}
.email-client-page .email-message-item.unread .email-msg-from,
.email-client-page .email-message-item.unread .email-msg-subj {
    font-weight: 700;
    color: #202124;
}
.email-client-page .email-message-item.read .email-msg-from {
    font-weight: 400;
    color: #5f6368;
}
.email-client-page .email-message-item.read .email-msg-subj {
    font-weight: 400;
    color: #3c4043;
}
.email-client-page .email-msg-icons {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.email-client-page .email-answered-badge {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 0.12rem 0.42rem;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}
.email-client-page .email-msg-folder {
    font-size: 0.65rem;
    color: #64748b;
    font-weight: 600;
    max-width: 5.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.email-client-page .email-msg-from {
    font-size: 0.8125rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.email-client-page .email-msg-subj-wrap {
    min-width: 0;
    overflow: hidden;
}
.email-client-page .email-msg-subj {
    display: block;
    font-size: 0.8125rem;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.email-client-page .email-msg-date {
    font-size: 0.75rem;
    color: #5f6368;
    text-align: right;
    white-space: nowrap;
    padding-left: 0.35rem;
}
.email-client-page .email-detail-meta {
    flex-shrink: 0;
}
.email-client-page .email-detail-meta h3 {
    margin: 0 0 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: #111827;
}
.email-client-page .email-detail-meta p {
    font-size: 0.875rem;
    color: var(--gray-700);
    margin: 0.35rem 0;
}
.email-client-page .email-detail-meta strong {
    color: var(--gray-600);
    font-weight: 600;
}
.email-client-page .email-attachment-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.email-client-page .email-attachment-toggle-btn {
    flex-shrink: 0;
    align-self: flex-start;
}
.email-client-page #email-detail-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.email-client-page .email-detail-placeholder {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    text-align: center;
    color: var(--gray-500);
    font-size: 0.875rem;
}
@media (max-width: 768px) {
    .email-client-page .email-attachment-head {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 0.5rem;
        justify-content: space-between;
    }

    .email-client-page .email-attachment-toggle-btn {
        width: 2.25rem;
        min-width: 2.25rem;
        height: 2.25rem;
        padding: 0;
        justify-content: center;
        align-items: center;
        align-self: flex-start;
        border-radius: 999px;
    }

    .email-client-page .email-attachment-toggle-btn .email-attachment-toggle-text {
        display: none;
    }

    .email-client-page .email-attachment-toggle-btn .material-symbols-outlined {
        margin: 0;
    }

    .email-client-page .email-attachment-actions {
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: center;
    }

    .email-client-page .email-attachment-actions .btn {
        width: 2.5rem;
        min-width: 2.5rem;
        height: 2.5rem;
        min-height: 2.5rem;
        padding: 0;
        justify-content: center;
        align-items: center;
        border-radius: 999px;
        font-size: 0;
        gap: 0;
        flex: 0 0 2.5rem;
    }

    .email-client-page .email-attachment-actions .btn .material-symbols-outlined {
        font-size: 1.15rem;
        margin: 0;
    }
}
.email-client-page .email-reading-detail .email-detail-body iframe,
.email-client-page .email-reading-detail .email-detail-body .email-body-html-mount {
    min-height: min(62vh, 640px);
}

/* Email kliens modálok: natív task-modal + tiszta fehér, lábléc fix (gombok mindig látszanak) */
#email-account-modal.task-modal,
#email-compose-modal.task-modal,
#email-signature-modal.task-modal,
#email-contacts-modal.task-modal {
    z-index: 10050;
}
#email-account-modal .task-modal-content,
#email-compose-modal .task-modal-content,
#email-signature-modal .task-modal-content,
#email-contacts-modal .task-modal-content {
    z-index: 10051;
}
#email-account-modal .task-modal-content.email-modal-task-shell {
    max-width: 520px;
}
#email-compose-modal .task-modal-content,
#email-compose-modal .task-modal-content.email-compose-shell,
#email-compose-modal .task-modal-content.email-modal-task-shell-wide,
#email-signature-modal .task-modal-content,
#email-signature-modal .task-modal-content.email-modal-task-shell {
    width: min(1200px, 94vw);
    max-width: min(1200px, 94vw);
    min-height: min(88vh, 920px);
}
#email-contacts-modal .task-modal-content,
#email-contacts-modal .task-modal-content.email-contacts-modal-shell {
    width: min(96vw, 720px);
    max-width: min(96vw, 720px);
    min-height: min(68vh, 560px);
    max-height: min(92vh, 820px);
    display: flex;
    flex-direction: column;
}
/* Tömör fehér doboz – nincs „szürke iszap” (Windows / gyenge üveg esetén sem) */
#email-account-modal .task-modal-content,
#email-compose-modal .task-modal-content,
#email-signature-modal .task-modal-content,
#email-contacts-modal .task-modal-content {
    background: #fff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: var(--shadow-xl), 0 25px 50px -12px rgb(0 0 0 / 0.18) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
#email-account-modal .task-modal-header,
#email-compose-modal .task-modal-header,
#email-signature-modal .task-modal-header,
#email-contacts-modal .task-modal-header {
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
}
#email-account-modal .task-modal-body,
#email-compose-modal .task-modal-body,
#email-signature-modal .task-modal-body,
#email-contacts-modal .task-modal-body {
    background: #fff;
    padding-top: 20px;
    padding-bottom: 20px;
}
#email-account-modal .task-modal-footer,
#email-compose-modal .task-modal-footer,
#email-signature-modal .task-modal-footer,
#email-contacts-modal .task-modal-footer {
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}
#email-account-modal .task-modal-footer .btn,
#email-compose-modal .task-modal-footer .btn,
#email-signature-modal .task-modal-footer .btn,
#email-contacts-modal .task-modal-footer .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.75rem;
    padding: 0.65rem 1.15rem;
    font-size: 0.9375rem;
    font-weight: 600;
}
#email-account-modal .task-modal-footer .btn .material-symbols-outlined,
#email-compose-modal .task-modal-footer .btn .material-symbols-outlined,
#email-signature-modal .task-modal-footer .btn .material-symbols-outlined,
#email-contacts-modal .task-modal-footer .btn .material-symbols-outlined {
    font-size: 1.1rem;
    line-height: 1;
}
#email-account-modal .email-modal-form,
#email-compose-modal .email-modal-form,
#email-signature-modal .email-modal-form {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}
/* Nyitott email-modál: a kliens háttér-scroll panelei ne vegyenek át görgetést */
body.email-modal-open .email-client-page .email-client-list-wrap,
body.email-modal-open .email-client-page .email-detail-body,
body.email-modal-open .email-client-page .email-detail-body .email-body-html-mount,
body.email-modal-open .email-client-page .email-account-list {
    overflow: hidden !important;
}

#email-account-modal.task-modal:not(.task-modal-hidden),
#email-compose-modal.task-modal:not(.task-modal-hidden),
#email-signature-modal.task-modal:not(.task-modal-hidden),
#email-contacts-modal.task-modal:not(.task-modal-hidden),
#email-folder-picker-modal.task-modal:not(.task-modal-hidden) {
    overscroll-behavior: none;
}

#email-account-modal .task-modal-body.email-modal-scroll,
#email-compose-modal .task-modal-body.email-modal-scroll,
#email-signature-modal .task-modal-body.email-modal-scroll,
#email-contacts-modal .task-modal-body.email-modal-scroll {
    max-height: min(58vh, 480px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--email-scrollbar-thumb, #cbd5e1) var(--email-scrollbar-track, #f1f5f9);
}
#email-compose-modal .task-modal-body.email-modal-scroll,
#email-signature-modal .task-modal-body.email-modal-scroll {
    max-height: min(74vh, 820px);
}
#email-contacts-modal .task-modal-body.email-modal-scroll {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding-top: 16px;
    padding-bottom: 16px;
}
#email-account-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar,
#email-compose-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar,
#email-signature-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar,
#email-contacts-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar {
    width: var(--email-scrollbar-size, 8px);
}
#email-account-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-track,
#email-compose-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-track,
#email-signature-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-track,
#email-contacts-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-track {
    background: var(--email-scrollbar-track, #f1f5f9);
    border-radius: 4px;
}
#email-account-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb,
#email-compose-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb,
#email-signature-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb,
#email-contacts-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb {
    background: var(--email-scrollbar-thumb, #cbd5e1);
    border-radius: 4px;
}
#email-account-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb:hover,
#email-compose-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb:hover,
#email-signature-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb:hover,
#email-contacts-modal .task-modal-body.email-modal-scroll::-webkit-scrollbar-thumb:hover {
    background: var(--email-scrollbar-thumb-hover, #94a3b8);
}
#email-account-modal.task-modal.task-modal-zoom:not(.task-modal-hidden):not(.task-modal-zoom-open) .task-modal-content,
#email-contacts-modal.task-modal.task-modal-zoom:not(.task-modal-hidden):not(.task-modal-zoom-open) .task-modal-content {
    opacity: 0;
    transform: scale(0.82) translateY(22px);
    transform-origin: center center;
}
#email-account-modal.task-modal.task-modal-zoom.task-modal-zoom-open .task-modal-content,
#email-contacts-modal.task-modal.task-modal-zoom.task-modal-zoom-open .task-modal-content {
    opacity: 1;
    transform: scale(1) translateY(0);
}

@media (max-width: 768px) {
    #email-compose-modal .task-modal-content {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        margin: 0 !important;
        inset: 0 !important;
        border-radius: 0 !important;
    }

    #email-compose-modal .email-modal-form {
        height: 100%;
    }

    #email-compose-modal .task-modal-body.email-modal-scroll {
        max-height: none;
        flex: 1 1 auto;
    }

    /* Címtár: teljes képernyő (a 96vw/720px korlát felülírása) */
    #email-contacts-modal.task-modal:not(.task-modal-hidden) {
        align-items: stretch !important;
        justify-content: flex-start !important;
        padding: 0 !important;
    }

    #email-contacts-modal .task-modal-content,
    #email-contacts-modal .task-modal-content.email-contacts-modal-shell {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        min-height: 100dvh !important;
        margin: 0 !important;
        border-radius: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-top: 0 !important;
        box-shadow: none !important;
    }

    #email-contacts-modal.task-modal.task-modal-zoom:not(.task-modal-hidden):not(.task-modal-zoom-open) .task-modal-content {
        transform: translateY(100%) !important;
        opacity: 1 !important;
    }

    #email-contacts-modal.task-modal.task-modal-zoom.task-modal-zoom-open .task-modal-content {
        transform: translateY(0) !important;
        opacity: 1 !important;
    }

    #email-contacts-modal .task-modal-body.email-modal-scroll {
        max-height: none !important;
        flex: 1 1 auto;
        min-height: 0;
    }

    #email-contacts-modal .email-contacts-list {
        max-height: none;
        flex: 1 1 auto;
        min-height: 12rem;
    }

    #email-contacts-modal .email-contacts-toolbar-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    #email-contacts-modal .email-contacts-toolbar-actions .btn,
    #email-contacts-modal .email-contacts-import-label {
        width: 100%;
        justify-content: center;
        min-height: 2.75rem;
    }

}

/* Űrlap – globális .form-row (2 oszlop) felülírása */
.email-modal-form .form-row:not(.two) {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 1rem;
    grid-template-columns: unset;
}
.email-modal-form .form-row.two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 1rem;
}
.email-modal-form .form-row.two > div {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
@media (max-width: 500px) {
    .email-modal-form .form-row.two {
        grid-template-columns: 1fr;
    }
}
.email-modal-form label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #6b7280;
}
.email-modal-form .email-modal-checkbox-label {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    color: #374151;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
}
.email-modal-form .email-modal-checkbox-label input[type="checkbox"] {
    width: auto;
    flex-shrink: 0;
}
.email-modal-form input[type="text"],
.email-modal-form input[type="email"],
.email-modal-form input[type="password"],
.email-modal-form input[type="number"],
.email-modal-form select,
.email-modal-form textarea {
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--email-form-input-border, #d1d5db);
    border-radius: var(--radius-lg);
    font-size: 0.875rem;
    color: var(--email-form-input-text, #111827);
    background: var(--email-form-input-bg, #fff);
    width: 100%;
    box-sizing: border-box;
    font-family: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.email-modal-form input:focus,
.email-modal-form select:focus,
.email-modal-form textarea:focus {
    outline: none;
    border-color: var(--email-form-input-focus, #3b82f6);
    box-shadow: 0 0 0 3px var(--email-form-input-focus-ring, rgb(59 130 246 / 0.15));
}
.email-modal-form textarea {
    resize: vertical;
    min-height: 7rem;
}
.email-modal-form .email-fieldset {
    border: 1px solid var(--email-form-fieldset-border, #e2e8f0);
    border-radius: var(--radius-lg);
    padding: 1rem 1rem 0.25rem;
    margin: 1.25rem 0;
    background: var(--email-form-fieldset-bg, #f8fafc);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.email-modal-form .email-fieldset legend {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #0f172a;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0 0.5rem;
}

.email-modal-discover-actions {
    margin-top: 0.5rem;
}
.email-modal-discover-btn {
    font-size: 0.8125rem !important;
    padding: 8px 14px !important;
}
.email-modal-discover-btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}
.email-modal-discover-hint {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0.5rem 0 0;
    line-height: 1.45;
    max-width: 42rem;
}

.email-gmail-notice {
    margin-top: 0.5rem;
    padding: 0.65rem 0.75rem;
    font-size: 0.78rem;
    line-height: 1.45;
    color: #1e40af;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: var(--radius-lg);
}
.email-gmail-notice a {
    color: #1d4ed8;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.email-gmail-notice a:hover {
    color: #1e3a8a;
}
.email-client-page .email-account-list {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    flex: 1;
}
.email-client-page .email-account-item {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.35rem;
    border-radius: var(--radius-lg);
    margin-bottom: 4px;
    border: 1px solid transparent;
}
.email-client-page .email-account-item.active {
    background: #eff6ff;
    border-color: #bfdbfe;
}
.email-client-page .email-account-btn {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-align: left;
    border: none;
    background: transparent;
    color: #111827;
    cursor: pointer;
    font-size: 0.875rem;
    padding: 0.25rem;
    min-width: 0;
}
.email-client-page .email-account-item--all .email-account-label {
    font-weight: 700;
}

.email-client-page .email-account-btn {
    position: relative;
}

.email-client-page .email-account-unread-badge {
    position: absolute;
    top: 0.35rem;
    right: 0.35rem;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1.15rem;
    text-align: center;
    box-shadow: 0 0 0 2px #fff;
}

.email-client-page .email-all-accounts-bar {
    padding: 0.55rem 0.75rem 0.35rem;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}

.email-client-page .email-account-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.35rem;
}

.email-client-page .email-account-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.28rem 0.65rem;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
}

.email-client-page .email-account-chip:hover {
    border-color: #93c5fd;
    background: #eff6ff;
}

.email-client-page .email-account-chip.active {
    border-color: #2563eb;
    background: #dbeafe;
    color: #1e3a8a;
}

.email-client-page .email-account-chip-badge {
    min-width: 1rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1rem;
    text-align: center;
}

.email-client-page .email-merge-status {
    margin: 0;
    font-size: 0.78rem;
    color: #64748b;
}

.email-client-page .email-merge-status--warn {
    color: #b45309;
}

.email-client-page .email-account-avatar {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    font-size: 0.68rem;
    font-weight: 700;
    color: #fff;
    background: hsl(var(--av-hue, 210), 52%, 42%);
    letter-spacing: -0.03em;
    line-height: 1;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25) inset;
}
.email-client-page .email-account-avatar-initials {
    position: relative;
    z-index: 1;
    transition: opacity 0.15s ease, visibility 0.15s ease;
}
.email-client-page .email-account-avatar-spinner {
    display: none;
    position: absolute;
    inset: 0;
    z-index: 2;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    line-height: 1;
    color: #fff;
    font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;
    transform-origin: center center;
}
.email-client-page .email-account-item.is-switching .email-account-avatar-initials {
    opacity: 0;
    visibility: hidden;
}
.email-client-page .email-account-item.is-switching .email-account-avatar-spinner {
    display: inline-flex;
    animation: email-account-avatar-hourglass 2.6s ease-in-out infinite;
}
@keyframes email-account-avatar-hourglass {
    0% { transform: rotate(0deg); }
    22% { transform: rotate(180deg); }
    50% { transform: rotate(180deg); }
    72% { transform: rotate(360deg); }
    100% { transform: rotate(360deg); }
}
.email-client-page .email-account-avatar.email-account-avatar--all {
    background: linear-gradient(135deg, #1d4ed8, #06b6d4);
    color: #fff;
    font-size: 1.25rem;
    font-weight: 800;
}
.email-client-page .email-account-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    text-align: left;
}
.email-client-page .email-account-text .email-account-label,
.email-client-page .email-account-text .email-account-mail {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.email-client-page .email-account-del {
    flex-shrink: 0;
    padding: 0.25rem 0.45rem;
    font-size: 0.8rem;
    line-height: 1;
    border: 1px solid #fecaca;
    background: #fef2f2;
    color: #b91c1c;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: var(--transition);
}
.email-client-page .email-account-del:hover {
    background: #fee2e2;
    border-color: #f87171;
}
.email-client-page .email-message-list {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    flex: 0 0 auto;
}
.email-client-page .email-list-state {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 1.15rem 0.75rem;
    color: #64748b;
    font-size: 0.9rem;
}
.email-client-page .email-list-state-icon {
    font-size: 1.35rem;
    animation: email-cache-sync-spin 1s linear infinite;
}
.email-client-page .email-month-group {
    list-style: none;
    margin: 0;
    padding: 0;
}
.email-client-page .email-month-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.75rem;
    border: 0;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #334155;
    font-size: 0.95rem;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}
.email-client-page .email-month-toggle[aria-expanded="true"] {
    background: #eef6ff;
    color: #1e3a8a;
}
.email-client-page .email-month-toggle-icon {
    font-size: 1.2rem;
    transition: transform 0.18s ease;
}
.email-client-page .email-month-toggle[aria-expanded="true"] .email-month-toggle-icon {
    transform: rotate(180deg);
}
.email-client-page .email-month-items {
    list-style: none;
    margin: 0;
    padding: 0;
}
.email-client-page .email-list-sentinel {
    width: 100%;
    height: 1px;
    pointer-events: none;
}
.email-client-page .email-msg-seen-icon {
    width: 1rem;
    text-align: center;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.2;
    user-select: none;
    flex-shrink: 0;
}
.email-client-page .email-msg-seen-icon--read {
    color: #059669;
}
.email-client-page .email-msg-seen-icon--unread {
    color: #2563eb;
}
.email-client-page .email-list-bulk-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.45rem 0.65rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.8125rem;
}
.email-client-page .email-bulk-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.55rem;
    margin-left: auto;
}
.email-client-page .email-bulk-actions[hidden] {
    display: none !important;
}
.email-client-page .email-list-bulk-bar:not(.email-list-bulk-bar--has-selection) .email-bulk-count {
    display: none;
}
.email-client-page .email-bulk-select-all-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    user-select: none;
}
.email-client-page .email-bulk-count {
    color: #64748b;
    min-width: 4rem;
}
.email-client-page .email-msg-bulk-check-wrap {
    display: inline-flex;
    align-items: center;
    padding-top: 0.35rem;
    cursor: pointer;
}
.email-client-page .email-msg-bulk-check {
    width: 1rem;
    height: 1rem;
    accent-color: #2563eb;
    cursor: pointer;
}
.email-client-page .email-search-hit {
    background: #fef08a;
    color: inherit;
    padding: 0 0.05em;
    border-radius: 2px;
}
.email-client-page .email-imap-test-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
}
.email-client-page .email-imap-test-result {
    font-size: 0.8125rem;
    color: #64748b;
    max-width: 100%;
}
.email-client-page .email-imap-test-result--ok {
    color: #059669;
}
.email-client-page .email-imap-test-result--err {
    color: #dc2626;
}
.email-client-page .email-message-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.3rem 0.65rem;
    padding: 0.6rem 0.65rem;
    border-bottom: 1px solid #e8eaed;
    cursor: pointer;
    font-size: 0.875rem;
    color: #111827;
    transition: background 0.12s ease;
}
.email-client-page .email-msg-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
}
.email-client-page .email-msg-side {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.15rem;
    min-width: 3.6rem;
}
.email-client-page .email-message-item:hover {
    box-shadow: inset 1px 0 0 #dadce0, inset -1px 0 0 #dadce0;
}
.email-client-page .email-message-item.active {
    background: #e8f0fe !important;
    border-left: 3px solid #1a73e8;
    padding-left: calc(0.65rem - 3px);
}
.email-client-page .email-message-item.email-message-item--spam-suspect:not(.active) {
    background: #fff8db;
    border-left: 3px solid #f59e0b;
    padding-left: calc(0.65rem - 3px);
}
.email-client-page .email-message-item.email-message-item--spam-confirmed:not(.active) {
    background: #fee2e2;
    border-left: 3px solid #dc2626;
    padding-left: calc(0.65rem - 3px);
}
.email-client-page .email-message-item.email-message-item--spam-suspect:hover:not(.active),
.email-client-page .email-message-item.email-message-item--spam-confirmed:hover:not(.active) {
    box-shadow: inset 1px 0 0 transparent, inset -1px 0 0 transparent;
}
.email-client-page .email-message-subject {
    font-weight: 600;
    display: block;
}
.email-client-page .email-message-meta {
    color: var(--gray-500);
    font-size: 0.78rem;
}
.email-client-page .email-detail-header {
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}
.email-client-page .email-detail-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: auto;
}
.email-client-page .email-detail-body iframe,
.email-client-page .email-detail-body .email-body-html-mount {
    width: 100%;
    flex: 1 1 auto;
    min-height: min(52vh, 520px);
    height: 100%;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    background: #fff;
}
.email-client-page .email-detail-body .email-body-html-mount {
    box-sizing: border-box;
    overflow: auto;
    font-family: system-ui, sans-serif;
    padding: 12px;
    margin: 0;
}
.email-client-page .email-detail-body pre,
.email-client-page .email-detail-body .email-body-plain {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.875rem;
    margin: 0;
    color: var(--gray-800);
    line-height: 1.55;
    flex: 1 1 auto;
    min-height: min(45vh, 420px);
    overflow: auto;
}

/* Levél részletek: műveletek */
.email-client-page .email-detail-actions {
    display: none;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}
.email-client-page .email-detail-act {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8125rem;
}
.email-client-page .email-detail-act .material-symbols-outlined {
    font-size: 18px;
}
.email-client-page .email-detail-act-danger:hover {
    border-color: #fecaca;
    color: #b91c1c;
    background: #fef2f2;
}

.email-client-page .email-mobile-actionbar {
    display: none;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    padding: 0.35rem 0 0.55rem;
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}
.email-client-page .email-mobile-action-btn {
    min-width: 2.2rem;
    min-height: 2.2rem;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}
.email-client-page .email-mobile-action-label {
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
}
.email-client-page .email-mobile-action-btn .material-symbols-outlined {
    font-size: 20px;
}
.email-client-page .email-mobile-overflow-menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    left: auto;
    z-index: 30;
    min-width: min(84vw, 280px);
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
    overflow: hidden;
}
.email-client-page .email-mobile-overflow-item {
    width: 100%;
    border: 0;
    background: #fff;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-align: left;
    padding: 0.65rem 0.8rem;
    font-size: 0.86rem;
}
.email-client-page .email-mobile-overflow-item:hover {
    background: #f8fafc;
}
.email-client-page .email-mobile-overflow-item .material-symbols-outlined,
.email-client-page .email-detail-act .material-symbols-outlined,
.email-ctx-item .material-symbols-outlined {
    font-size: 18px;
}
.email-client-page .email-mobile-overflow-danger,
.email-ctx-item-danger {
    color: #b91c1c;
}
@media (max-width: 768px) {
    .email-client-page .email-mobile-overflow-menu {
        left: auto;
        right: 0;
        min-width: min(84vw, 280px);
    }
}
@media (max-width: 380px) {
    .email-client-page .email-mobile-action-label {
        display: none;
    }
}

/* Jobb klikk menü */
.email-msg-context-menu {
    position: fixed;
    z-index: 10060;
    min-width: 200px;
    padding: 0.35rem 0;
    margin: 0;
    list-style: none;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg, 8px);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
}
.email-ctx-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.85rem;
    border: none;
    background: transparent;
    font-size: 0.875rem;
    text-align: left;
    cursor: pointer;
    color: var(--gray-800, #1f2937);
}
.email-ctx-item:hover {
    background: #f3f4f6;
}
.email-ctx-item .material-symbols-outlined {
    opacity: 0.85;
}
.email-ctx-item-danger:hover {
    background: #fef2f2;
}

/* Profi levélírás modál */
#email-compose-modal .email-compose-shell {
    max-width: min(92vw, 720px);
    width: 100%;
}
#email-compose-modal .email-compose-header {
    align-items: flex-start;
    gap: 1rem;
}
#email-compose-modal .email-compose-header-text {
    flex: 1;
    min-width: 0;
}
#email-compose-modal .email-compose-subtitle {
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--gray-500, #6b7280);
    line-height: 1.45;
}
#email-compose-modal .email-compose-body {
    max-height: min(70vh, 640px);
}
#email-compose-modal .email-compose-fields {
    margin-bottom: 1rem;
}
#email-compose-modal .email-compose-row {
    display: grid;
    grid-template-columns: 88px 1fr;
    align-items: center;
    gap: 0.65rem 0.75rem;
    margin-bottom: 0.65rem;
}
@media (max-width: 520px) {
    #email-compose-modal .email-compose-row {
        grid-template-columns: 1fr;
    }
}
#email-compose-modal .email-compose-lbl {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gray-600, #4b5563);
    margin: 0;
}
#email-compose-modal .email-compose-input {
    width: 100%;
    padding: 0.5rem 0.65rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.875rem;
}
#email-compose-modal .email-compose-input:focus {
    outline: none;
    border-color: var(--primary-500, #3b82f6);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}
#email-compose-modal .email-compose-row-actions {
    margin: 0.25rem 0 0.75rem 88px;
}
@media (max-width: 520px) {
    #email-compose-modal .email-compose-row-actions {
        margin-left: 0;
    }
}
#email-compose-modal .email-compose-editor-card {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    background: #fafafa;
}
#email-compose-modal .email-rich-toolbar,
#email-signature-modal .email-rich-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 0.65rem;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
}
#email-compose-modal .email-rich-toolbar select,
#email-signature-modal .email-rich-toolbar select {
    width: auto !important;
    min-width: 8rem;
    height: 2.4rem;
    padding: 0.45rem 0.7rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: #334155;
    font-size: 0.8125rem;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
    flex: 0 0 auto;
}
#email-compose-modal .email-rich-toolbar input[type="color"],
#email-signature-modal .email-rich-toolbar input[type="color"] {
    width: 2.4rem !important;
    min-width: 2.4rem !important;
    height: 2.4rem;
    padding: 0.2rem;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 auto;
}
#email-compose-modal .email-rich-btn,
#email-signature-modal .email-rich-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    min-width: 2.4rem;
    height: 2.4rem;
    padding: 0;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: #334155;
    cursor: pointer;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.04);
    transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
    flex: 0 0 auto;
}
#email-compose-modal .email-rich-btn:hover,
#email-signature-modal .email-rich-btn:hover {
    background: #eff6ff;
    border-color: #93c5fd;
    box-shadow: 0 4px 10px rgb(59 130 246 / 0.12);
    transform: translateY(-1px);
}
#email-compose-modal .email-rich-btn .material-symbols-outlined,
#email-signature-modal .email-rich-btn .material-symbols-outlined {
    font-size: 1.1rem;
    line-height: 1;
}
#email-compose-modal .email-compose-editor-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #f3f4f6;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.8125rem;
}
#email-compose-modal .email-compose-editor-title {
    font-weight: 600;
    color: var(--gray-700, #374151);
}
#email-compose-modal .email-compose-editor-toggles {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}
#email-compose-modal .email-compose-html-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    font-weight: 500;
    color: var(--gray-600, #4b5563);
}
#email-compose-modal .email-compose-ai-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.5rem 0.75rem;
    background: #eff6ff;
    border-bottom: 1px solid #bfdbfe;
    font-size: 0.8125rem;
}
#email-compose-modal .email-compose-ai-label {
    font-weight: 600;
    color: #1e40af;
}
#email-compose-modal .email-compose-ai-select {
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    border: 1px solid #93c5fd;
    font-size: 0.8125rem;
}
#email-compose-modal .email-compose-ai-hint {
    color: #64748b;
    font-size: 0.75rem;
    flex: 1 1 100%;
}
#email-compose-modal .email-compose-ai-bar.is-ai-busy {
    background: #dbeafe;
}
#email-compose-modal .email-compose-ai-status {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #1d4ed8;
    font-weight: 500;
    font-size: 0.8125rem;
}
#email-compose-modal .email-compose-ai-status-icon {
    font-size: 18px;
    animation: email-compose-ai-spin 0.9s linear infinite;
}
@keyframes email-compose-ai-spin {
    to { transform: rotate(360deg); }
}
#email-compose-modal .email-compose-textarea {
    display: block;
    width: 100%;
    min-height: 220px;
    padding: 1.15rem 1.25rem;
    border: none;
    border-radius: 0;
    font-size: 0.875rem;
    line-height: 1.55;
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    resize: vertical;
    background: #fff;
    box-sizing: border-box;
}
#email-compose-modal .email-compose-textarea:focus {
    outline: none;
}
#email-compose-modal .email-compose-code-view {
    border-top: 1px solid #e5e7eb;
    border-radius: 0;
    min-height: 180px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8125rem;
    background: #f8fafc;
}
.email-msg-context-menu[hidden],
#email-compose-modal .email-compose-code-view[hidden] {
    display: none !important;
}
#email-compose-modal .email-rich-toolbar {
    border-bottom: 1px solid #e5e7eb;
}
#email-compose-modal #compose-editor {
    min-height: 220px;
}
#email-compose-modal .email-compose-footer {
    background: #f9fafb;
}

.email-detail-loading {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 2rem 1.25rem;
    color: #64748b;
    font-size: 0.9375rem;
}
.email-detail-loading .material-symbols-outlined {
    font-size: 1.35rem;
    animation: email-detail-loading-spin 1.2s linear infinite;
}
@keyframes email-detail-loading-spin {
    to { transform: rotate(360deg); }
}

/* Összecsukható szűrők – asztalon mindig nyitva, összefoglaló rejtve */
.email-client-page .email-search-filters-panel {
    flex: 0 0 auto;
    width: 100%;
    margin: 0;
    border: 0;
    padding: 0;
}
.email-client-page .email-search-filters-summary {
    display: none;
}
@media (min-width: 901px) {
    .email-client-page .email-search-filters-panel {
        display: block;
    }
    .email-client-page .email-search-filters-panel > .email-search-filters {
        display: flex !important;
    }
}
@media (min-width: 769px) {
    .email-client-page .email-search-filters-panel {
        display: block;
    }
    .email-client-page .email-search-filters-panel > .email-search-filters {
        display: flex;
    }
}

/* =============================================================================
   Email kliens – mobil / keskeny nézet (≤900px, egyezik az isEmailMobileView-tel)
   ============================================================================= */
@media (max-width: 900px) {
    .email-client-page > .page-header {
        margin-bottom: 0.35rem;
    }

    .email-client-page .email-client-intro,
    .email-client-page .email-client-spam-note,
    .email-client-page #email-client-banner.alert {
        margin-bottom: 0.5rem;
    }

    .email-client-page .email-client-layout {
        min-height: 0;
        max-height: none;
        gap: 0.4rem;
    }

    .email-client-page .email-client-main {
        gap: 0.4rem;
        min-height: 0;
    }

    .email-client-page .email-client-body {
        min-height: 0 !important;
        max-height: none !important;
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
    }

    .email-client-page .email-client-list-wrap {
        min-height: 0 !important;
        max-height: none !important;
        flex: 1 1 auto;
        padding: 0.15rem 0.25rem;
    }

    .email-client-page .email-client-toolbar {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        padding: 0.55rem 0.65rem;
        flex-shrink: 0;
    }

    .email-client-page .email-toolbar-primary,
    .email-client-page .email-toolbar-secondary {
        width: 100%;
        gap: 0.4rem;
    }

    .email-client-page .email-toolbar-primary {
        flex-direction: column;
        align-items: stretch;
    }

    .email-client-page .email-toolbar-secondary {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: stretch;
    }

    .email-client-page .email-toolbar-secondary > .btn-primary.email-toolbar-action,
    .email-client-page .email-toolbar-secondary > #email-btn-refresh {
        grid-column: 1 / -1;
    }

    .email-client-page .email-toolbar-secondary .email-client-pagination {
        grid-column: 1 / -1;
        margin-left: 0;
        text-align: left;
    }

    .email-client-page .email-toolbar-secondary > .email-toolbar-action,
    .email-client-page .email-toolbar-secondary > .btn-primary.email-toolbar-action {
        width: 100%;
        min-height: 48px;
        padding: 0.7rem 0.85rem;
        font-size: 0.9375rem;
        justify-content: center;
        box-sizing: border-box;
    }

    /* Frissítés: ugyanolyan méret, mint Új levél; nem szürke másodlagos */
    .email-client-page .email-toolbar-secondary > #email-btn-refresh {
        background: linear-gradient(135deg, #0f766e, #0d9488);
        border: 1px solid #0f766e;
        color: #fff;
        font-weight: 600;
        box-shadow: 0 1px 2px rgba(15, 118, 110, 0.25);
    }

    .email-client-page .email-toolbar-secondary > #email-btn-refresh:hover,
    .email-client-page .email-toolbar-secondary > #email-btn-refresh:focus-visible {
        background: linear-gradient(135deg, #0d9488, #14b8a6);
        border-color: #0d9488;
        color: #fff;
    }

    .email-client-page .email-toolbar-secondary > #email-btn-refresh .material-symbols-outlined {
        color: #fff;
    }

    .email-client-page .email-toolbar-secondary .email-toolbar-pagination-group {
        grid-column: 1 / -1;
        width: 100%;
        margin: 0;
    }

    .email-client-page .email-list-view-options {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        width: 100%;
        margin-left: 0;
        gap: 0.35rem 0.65rem;
        padding: 0.45rem 0.55rem;
        border-radius: 12px;
    }

    .email-client-page .email-list-view-options .email-search-check {
        min-height: auto;
        padding: 0;
    }

    .email-client-page .email-search-toolbar {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.4rem;
        padding: 0.55rem 0.65rem;
        flex: 0 0 auto;
    }

    .email-client-page .email-search-toolbar .email-search-input-wrap {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 100%;
        flex: 0 0 auto;
        min-height: 0;
        margin: 0;
        order: 0;
    }

    .email-client-page .email-search-toolbar .email-search-label {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        width: 100%;
        max-width: 100%;
        flex: 0 0 auto;
        min-height: 0;
        margin: 0;
    }

    .email-client-page .email-search-toolbar .email-search-input {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
        min-height: 44px;
    }

    .email-client-page .email-search-toolbar > .email-toolbar-action {
        width: 100%;
        max-width: 100%;
        flex: 0 0 auto;
        margin: 0;
        padding: 0.55rem 0.85rem;
        min-height: 44px;
        justify-content: center;
        box-sizing: border-box;
    }

    .email-client-page .email-search-toolbar .email-search-label {
        order: 0;
    }

    .email-client-page .email-search-toolbar > #email-btn-search-run {
        order: 1;
    }

    .email-client-page .email-search-toolbar > #email-btn-search-clear {
        order: 2;
    }

    .email-client-page .email-search-toolbar > #email-btn-search-ai {
        order: 3;
    }

    .email-client-page .email-search-toolbar > #email-btn-search-spam-bulk {
        order: 4;
    }

    .email-client-page .email-search-filters-panel {
        order: 5;
        width: 100%;
        flex: 0 0 auto;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        background: #f8fafc;
        overflow: hidden;
        margin: 0;
    }

    .email-client-page .email-search-filters-summary {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        min-height: 44px;
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
        font-weight: 600;
        color: #334155;
        cursor: pointer;
        list-style: none;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }

    .email-client-page .email-search-filters-summary::-webkit-details-marker {
        display: none;
    }

    .email-client-page .email-search-filters-summary::before {
        content: "▸";
        font-size: 0.75rem;
        color: #64748b;
        transition: transform 0.15s ease;
    }

    .email-client-page .email-search-filters-panel[open] .email-search-filters-summary::before {
        transform: rotate(90deg);
    }

    .email-client-page .email-search-filters-panel > .email-search-filters {
        padding: 0 0.65rem 0.65rem;
        border-top: 1px solid #e2e8f0;
    }

    .email-client-page .email-folder-label select,
    .email-client-page #email-folder-select,
    .email-client-page .email-search-input {
        min-height: 44px;
        font-size: 1rem;
    }

    .email-client-page .email-client-toolbar > .email-mobile-accounts-btn {
        justify-content: center;
        min-height: 44px;
    }

    .email-client-page .email-client-toolbar > .btn-primary.email-toolbar-action {
        order: unset;
    }

    .email-client-page .email-toolbar-pagination-group {
        margin-left: 0;
        justify-content: center;
    }

    .email-client-page .email-search-filters {
        flex: 0 0 auto;
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
        font-size: 0.9375rem;
        margin: 0;
        width: 100%;
    }

    .email-client-page .email-search-filter-group {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 0;
        padding: 0.55rem 0.65rem;
    }

    .email-client-page .email-search-filter-group + .email-search-filter-group {
        margin-top: 0.35rem;
        padding-top: 0.55rem;
        border-top: 1px solid #e2e8f0;
    }

    .email-client-page .email-search-filter-title {
        display: block;
        width: 100%;
        font-size: 0.72rem;
        margin: 0 0 0.45rem;
        padding-bottom: 0.4rem;
        border-bottom: 1px solid #e2e8f0;
    }

    .email-client-page .email-search-check {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 100%;
        gap: 0.7rem;
        min-height: 44px;
        padding: 0.4rem 0;
        margin: 0;
        font-size: 0.9375rem;
        font-weight: 500;
        line-height: 1.35;
        color: #1e293b;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }

    .email-client-page .email-search-check input[type="checkbox"] {
        width: 1.3rem;
        height: 1.3rem;
        min-width: 1.3rem;
        min-height: 1.3rem;
        margin: 0;
        flex-shrink: 0;
        accent-color: #2563eb;
        cursor: pointer;
    }

    .email-client-page .email-search-unread-hint {
        width: 100%;
        max-width: none;
        margin: 0.15rem 0 0.35rem;
        padding: 0.55rem 0.65rem;
        font-size: 0.8125rem;
        line-height: 1.45;
        background: #eff6ff;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        box-sizing: border-box;
    }

    .email-client-page .email-list-bulk-bar {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.45rem;
        padding: 0.45rem 0.55rem;
        font-size: 0.875rem;
    }

    .email-client-page .email-bulk-select-all-label {
        min-height: auto;
        gap: 0.55rem;
        font-size: 0.9375rem;
        font-weight: 500;
    }

    .email-client-page .email-bulk-count {
        min-width: 0;
        margin: 0;
    }

    .email-client-page .email-bulk-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0.4rem;
        width: 100%;
        margin-left: 0;
    }

    .email-client-page .email-bulk-select-all-label input[type="checkbox"],
    .email-client-page .email-msg-bulk-check {
        width: 1.25rem;
        height: 1.25rem;
        min-width: 1.25rem;
        min-height: 1.25rem;
    }

    .email-client-page .email-bulk-actions .btn {
        min-height: 40px;
        padding: 0.45rem 0.6rem;
        font-size: 0.875rem;
        flex: 1 1 calc(50% - 0.25rem);
        justify-content: center;
    }

    .email-client-page .email-bulk-actions #email-btn-bulk-delete {
        flex-basis: 100%;
    }

    .email-client-page .email-message-item {
        padding: 0.72rem 0.55rem;
        min-height: 3.25rem;
        column-gap: 0.55rem;
        row-gap: 0.35rem;
    }

    .email-client-page .email-msg-bulk-check-wrap {
        padding-top: 0.15rem;
        min-width: 2rem;
        min-height: 2rem;
        align-items: center;
        justify-content: center;
    }

    .email-client-page .email-msg-from {
        font-size: 0.9rem;
    }

    .email-client-page .email-msg-subj {
        font-size: 0.88rem;
    }

    .email-client-page .email-msg-date {
        font-size: 0.78rem;
    }

    .email-client-page .email-mobile-actionbar .email-detail-act {
        min-height: 44px;
        min-width: 44px;
    }

    .email-client-page .email-reading-bar {
        padding: 0.35rem 0.5rem;
    }

    .email-client-page .email-reading-detail {
        padding: 0.5rem 0.65rem 0.75rem;
    }

    .email-client-page .email-detail-body .email-body-html-mount img,
    .email-client-page .email-detail-body .email-body-html-mount video,
    .email-client-page .email-detail-body .email-body-html-mount svg {
        max-width: 100% !important;
        height: auto !important;
    }

    .email-client-page .email-detail-body iframe.email-body-iframe {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
}

/* Címzett / Cc / Bcc javaslatok – a mező alatt, chip-sorban (nem lebegő dropdown) */
#email-compose-modal .email-compose-row-autocomplete .email-compose-field-wrap,
.email-client-page .email-compose-row-autocomplete .email-compose-field-wrap {
    position: relative;
    flex: 1;
    min-width: 0;
}

#email-compose-modal .email-compose-suggest,
.email-compose-suggest {
    position: static;
    left: auto;
    top: auto;
    z-index: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.4rem;
    width: 100%;
    max-width: 100%;
    max-height: none;
    margin-top: 0.45rem;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    box-sizing: border-box;
}

#email-compose-modal .email-compose-suggest[hidden],
.email-compose-suggest[hidden] {
    display: none !important;
}

#email-compose-modal .email-compose-suggest-item,
.email-compose-suggest .email-compose-suggest-item {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 0.45rem;
    width: auto;
    max-width: 100%;
    margin: 0;
    padding: 0.4rem 0.65rem 0.4rem 0.4rem;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #f8fafc;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    text-align: left;
    cursor: pointer;
    color: #0f172a;
    font: inherit;
    box-sizing: border-box;
    transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}

#email-compose-modal .email-compose-suggest-item:hover,
#email-compose-modal .email-compose-suggest-item.active,
.email-compose-suggest .email-compose-suggest-item:hover,
.email-compose-suggest .email-compose-suggest-item.active {
    background: #eff6ff;
    border-color: #bfdbfe;
    box-shadow: 0 1px 3px rgba(37, 99, 235, 0.12);
}

#email-compose-modal .email-compose-suggest-avatar,
.email-compose-suggest .email-compose-suggest-avatar {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 50%;
    background: #e2e8f0;
    color: #334155;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    text-transform: uppercase;
}

#email-compose-modal .email-compose-suggest-item:hover .email-compose-suggest-avatar,
#email-compose-modal .email-compose-suggest-item.active .email-compose-suggest-avatar,
.email-compose-suggest .email-compose-suggest-item:hover .email-compose-suggest-avatar,
.email-compose-suggest .email-compose-suggest-item.active .email-compose-suggest-avatar {
    background: #dbeafe;
    color: #1d4ed8;
}

#email-compose-modal .email-compose-suggest-text,
.email-compose-suggest .email-compose-suggest-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.05rem;
    min-width: 0;
    flex: 1;
}

#email-compose-modal .email-compose-suggest-main,
.email-compose-suggest .email-compose-suggest-main {
    display: block;
    max-width: 14rem;
    font-weight: 600;
    font-size: 0.82rem;
    line-height: 1.2;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#email-compose-modal .email-compose-suggest-sub,
.email-compose-suggest .email-compose-suggest-sub {
    display: block;
    max-width: 14rem;
    font-size: 0.72rem;
    font-weight: 400;
    line-height: 1.2;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Mappaválasztó, piszkozat, beállítások kiegészítők */
.email-client-page .email-folder-picker-list {
    list-style: none;
    margin: 0.75rem 0 0;
    padding: 0;
    max-height: 320px;
    overflow: auto;
}

.email-client-page .email-folder-picker-item {
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.55rem 0.7rem;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
    color: #0f172a;
}

.email-client-page .email-folder-picker-item:hover {
    background: #eff6ff;
}

.email-client-page .email-folder-picker-tag {
    font-size: 0.75rem;
    color: #64748b;
    margin-left: 0.35rem;
}

.email-client-page .email-compose-draft-restore {
    margin-bottom: 0.75rem;
    padding: 0.65rem 0.75rem;
    background: #fffbeb;
    border: 1px solid #fcd34d;
    border-radius: 10px;
    font-size: 0.9rem;
}

.email-client-page .email-manage-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.email-client-page .email-manage-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.9rem;
}

.email-client-page .email-manage-add-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.75rem;
}

.email-client-page .email-manage-add-row--stack > * {
    flex: 1 1 10rem;
    min-width: 8rem;
}

.email-client-page .email-detail-links {
    margin: 0.35rem 0 0.5rem;
    font-size: 0.9rem;
    color: #334155;
}

.email-client-page .email-search-date-lbl {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: #475569;
}

.email-client-page .email-search-date-input {
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    padding: 0.2rem 0.4rem;
    font-size: 0.85rem;
}

.email-client-page .email-notify-accounts {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin: 0.5rem 0 0.75rem;
}

.email-folder-picker-shell,
.email-attachment-preview-shell {
    max-width: 520px;
    width: min(96vw, 520px);
}

/* --- Mappasáv: teljes szélesség, vízszintes chip lista --- */
.email-client-page .email-folder-strip {
    flex-shrink: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 0.55rem 0.75rem 0.65rem;
}
.email-client-page .email-folder-strip--collapsed {
    padding-bottom: 0.55rem;
}
.email-client-page .email-folder-strip--collapsed .email-folder-strip-list {
    display: none;
}
.email-client-page .email-folder-strip-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #4b5563;
    cursor: pointer;
    flex-shrink: 0;
}
.email-client-page .email-folder-strip-toggle:hover {
    background: #f3f4f6;
    color: #111827;
}
.email-client-page .email-folder-strip-toggle-icon {
    font-size: 20px;
    transition: transform 0.15s ease;
}
.email-client-page .email-folder-strip:not(.email-folder-strip--collapsed) .email-folder-strip-toggle-icon {
    transform: rotate(90deg);
}
.email-client-page .email-folder-strip-current {
    font-size: 0.84rem;
    font-weight: 600;
    color: #1e40af;
    max-width: min(240px, 40vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.email-client-page .email-folder-strip:not(.email-folder-strip--collapsed) .email-folder-strip-current {
    display: none;
}
.email-client-page .email-folder-strip-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem 0.75rem;
}
.email-client-page .email-folder-strip-title {
    font-size: 0.78rem;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-right: 0.15rem;
}
.email-client-page .email-folder-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #4b5563;
    cursor: pointer;
}
.email-client-page .email-folder-icon-btn:hover {
    background: #f3f4f6;
    color: #111827;
}
.email-client-page .email-folder-icon-btn .material-symbols-outlined {
    font-size: 18px;
}
.email-client-page .email-folder-subscribed-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: #6b7280;
    margin-left: auto;
    cursor: pointer;
    white-space: nowrap;
}
.email-client-page .email-folder-strip-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: flex-start;
    gap: 0.35rem;
    width: 100%;
    min-height: 2.25rem;
    max-height: 9.5rem;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 0.1rem 0;
}
.email-client-page .email-folder-chip-wrap {
    display: inline-flex;
    align-items: stretch;
    max-width: 100%;
    flex-shrink: 0;
}
.email-client-page .email-folder-tree-item {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}
.email-client-page .email-folder-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    max-width: 220px;
    padding: 0.35rem 0.65rem;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    background: #f9fafb;
    color: #1f2937;
    font-size: 0.82rem;
    line-height: 1.2;
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}
.email-client-page .email-folder-chip:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
}
.email-client-page .email-folder-tree-item.is-selected .email-folder-chip {
    background: #eff6ff;
    border-color: #93c5fd;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.15);
    color: #1e3a8a;
    font-weight: 600;
}
.email-client-page .email-folder-tree-icon {
    font-size: 17px !important;
    color: #64748b;
    flex-shrink: 0;
}
.email-client-page .email-folder-tree-item--inbox .email-folder-tree-icon { color: #2563eb; }
.email-client-page .email-folder-tree-item--sent .email-folder-tree-icon { color: #059669; }
.email-client-page .email-folder-tree-item--drafts .email-folder-tree-icon { color: #d97706; }
.email-client-page .email-folder-tree-item--trash .email-folder-tree-icon { color: #dc2626; }
.email-client-page .email-folder-tree-item--spam .email-folder-tree-icon { color: #ea580c; }
.email-client-page .email-folder-tree-item--archive .email-folder-tree-icon { color: #7c3aed; }
.email-client-page .email-folder-tree-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.email-client-page .email-folder-tree-badge {
    flex-shrink: 0;
    min-width: 1.15rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: #2563eb;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
}
.email-client-page .email-folder-tree-item.is-selected .email-folder-tree-badge {
    background: #1d4ed8;
}
.email-client-page .email-folder-tree-menu-btn {
    flex: 0 0 auto;
    align-self: center;
    margin-left: -0.15rem;
    border: none;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    border-radius: 6px;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.12s ease;
}
.email-client-page .email-folder-chip-wrap:hover .email-folder-tree-menu-btn,
.email-client-page .email-folder-tree-item.is-selected .email-folder-tree-menu-btn {
    opacity: 1;
}
.email-client-page .email-folder-tree-menu-btn .material-symbols-outlined {
    font-size: 16px;
}
.email-client-page .email-folder-strip-empty {
    font-size: 0.82rem;
    color: #9ca3af;
    padding: 0.25rem 0.15rem;
}
.email-client-page .email-folder-toolbar-group {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}
.email-client-page .email-folder-label-text {
    font-size: 0.85rem;
    color: #6b7280;
}
.email-client-page .email-current-folder-label {
    font-size: 0.95rem;
    color: #111827;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.email-client-page .email-folder-select-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.email-folder-ctx-menu {
    position: fixed;
    z-index: 12050;
    min-width: 190px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    padding: 0.35rem 0;
}
.email-folder-ctx-item {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    width: 100%;
    border: none;
    background: transparent;
    text-align: left;
    padding: 0.45rem 0.75rem;
    font-size: 0.86rem;
    color: #1f2937;
    cursor: pointer;
}
.email-folder-ctx-item:hover {
    background: #f3f4f6;
}
.email-folder-ctx-item.is-danger {
    color: #b91c1c;
}
.email-folder-ctx-item .material-symbols-outlined {
    font-size: 18px;
    color: inherit;
}
.email-message-item--spam-batch-pending,
.email-message-item--action-pending {
    opacity: 0.55;
    pointer-events: none;
}
.email-message-item--optimistic-hidden {
    display: none !important;
}

/* Címtár modal – a .email-client-page diven kívül van (#email-contacts-modal) */
#email-contacts-modal .task-modal-overlay {
    z-index: 1;
}
#email-contacts-modal .email-contacts-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: stretch;
    flex-shrink: 0;
}
#email-contacts-modal .email-contacts-search-wrap {
    position: relative;
    flex: 1 1 220px;
    min-width: 0;
}
#email-contacts-modal .email-contacts-search-icon {
    position: absolute;
    left: 0.65rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.15rem;
    color: #64748b;
    pointer-events: none;
}
#email-contacts-modal .email-contacts-search-input {
    width: 100%;
    min-height: 2.5rem;
    padding: 0.5rem 0.75rem 0.5rem 2.35rem;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    font-size: 0.9rem;
    font-family: inherit;
    line-height: 1.25;
    box-sizing: border-box;
    background: #fff;
    color: #0f172a;
}
#email-contacts-modal .email-contacts-search-input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgb(59 130 246 / 0.15);
}
#email-contacts-modal .email-contacts-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}
#email-contacts-modal .email-contacts-toolbar-actions .btn,
#email-contacts-modal .email-contacts-import-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
}
#email-contacts-modal .email-contacts-import-label {
    margin: 0;
    cursor: pointer;
}
#email-contacts-modal .email-contacts-toolbar-actions .material-symbols-outlined {
    font-size: 1rem;
}
#email-contacts-modal .email-contacts-count {
    margin: 0.55rem 0 0.4rem;
    font-size: 0.8125rem;
    color: #64748b;
    flex-shrink: 0;
}
#email-contacts-modal .email-contacts-list {
    flex: 1 1 auto;
    min-height: 180px;
    max-height: min(44vh, 420px);
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f8fafc;
    padding: 0.4rem;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f1f5f9;
}
#email-contacts-modal .email-contacts-list::-webkit-scrollbar {
    width: 8px;
}
#email-contacts-modal .email-contacts-list::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
#email-contacts-modal .email-contacts-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 0.4rem;
}
#email-contacts-modal .email-contacts-row:last-child {
    margin-bottom: 0;
}
#email-contacts-modal .email-contacts-row-main {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
}
#email-contacts-modal .email-contacts-row-name {
    font-weight: 600;
    font-size: 0.9rem;
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#email-contacts-modal .email-contacts-row-email {
    display: block;
    font-size: 0.8125rem;
    color: #475569;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#email-contacts-modal .email-contacts-row-meta {
    display: block;
    font-size: 0.75rem;
    color: #94a3b8;
}
#email-contacts-modal .email-contacts-row-actions {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
#email-contacts-modal .email-contacts-row-actions .btn {
    min-width: 4.5rem;
}
#email-contacts-modal .email-contacts-add-card {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid #e5e7eb;
    flex-shrink: 0;
}
#email-contacts-modal .email-contacts-add-title {
    margin: 0 0 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
}
#email-contacts-modal .email-manage-add-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0;
}
#email-contacts-modal .email-manage-add-row--stack > * {
    flex: 1 1 10rem;
    min-width: 8rem;
}
#email-contacts-modal .email-manage-add-row .modal-form-input {
    flex: 1 1 10rem;
    width: auto;
    min-width: 8rem;
    min-height: 2.5rem;
    height: 2.5rem;
    max-height: 2.5rem;
    padding: 0 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    font-size: 0.9rem;
    font-family: inherit;
    line-height: 1.25;
    box-sizing: border-box;
    background: #fff;
    color: #0f172a;
    align-self: center;
}
#email-contacts-modal .email-manage-add-row .modal-form-input:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgb(59 130 246 / 0.15);
}
#email-contacts-modal .email-manage-add-row .btn {
    flex: 0 0 auto;
    min-height: 2.5rem;
    height: 2.5rem;
    max-height: 2.5rem;
    padding: 0 1rem;
    align-self: center;
}

/* Mobil: új cím mezők egymás alatt, normál magassággal (a fenti flex:1 után kell) */
@media (max-width: 640px) {
    #email-contacts-modal .email-manage-add-row,
    #email-contacts-modal .email-manage-add-row--stack {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
    }

    #email-contacts-modal .email-manage-add-row--stack > * {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }

    #email-contacts-modal .email-manage-add-row .modal-form-input {
        flex: 0 0 2.5rem;
        width: 100%;
        min-width: 0;
        height: 2.5rem;
        min-height: 2.5rem;
        max-height: 2.5rem;
        align-self: stretch;
    }

    #email-contacts-modal .email-manage-add-row .btn {
        flex: 0 0 auto;
        width: 100%;
        height: 2.75rem;
        min-height: 2.75rem;
        max-height: none;
        justify-content: center;
        align-self: stretch;
    }
}
#email-contacts-modal .email-contacts-loading,
#email-contacts-modal .email-contacts-empty,
#email-contacts-modal .email-contacts-error {
    margin: 0;
    padding: 1.25rem 0.75rem;
    text-align: center;
    font-size: 0.875rem;
    color: #64748b;
}
#email-contacts-modal .email-contacts-error {
    color: #dc2626;
}

@media (max-width: 720px) {
    .email-client-page .email-folder-subscribed-toggle {
        margin-left: 0;
        width: 100%;
    }
    .email-client-page .email-folder-chip {
        max-width: 180px;
    }
}



/* ========== quick-camera.css ========== */

/* Quick camera stílusok (main.css-ből kiemelve) */

/* =============================================================================
   GYORS FOTÓ / QUICK CAMERA
   ============================================================================= */
.quick-camera-page {
    min-height: 60vh;
    padding: 1rem;
    position: relative;
}
/* iOS: display:none file input gyakran nem nyílik programozott click-re */
.quick-photo-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
    pointer-events: none;
}
.quick-camera-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}
.quick-camera-back {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--primary-600, #dc2626);
    text-decoration: none;
    font-weight: 500;
}
.quick-camera-back:hover {
    text-decoration: underline;
}
.quick-camera-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 3rem 2rem;
    background: rgba(255,255,255,0.9);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}
.quick-camera-placeholder .material-symbols-outlined {
    font-size: 64px;
    color: #94a3b8;
}
.quick-photo-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: #000;
    display: none;
    flex-direction: column;
}
.quick-photo-overlay.active {
    display: flex;
}
.quick-photo-native-placeholder {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    color: rgba(255,255,255,0.7);
    font-size: 1rem;
}
.quick-photo-native-placeholder .material-symbols-outlined {
    font-size: 80px;
    opacity: 0.6;
}
.quick-photo-native-placeholder p {
    margin: 0;
}
.quick-camera-content {
    padding: 1.5rem;
    max-width: 400px;
    margin: 0 auto;
}
.quick-camera-status-card {
    background: #fff;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    border: 1px solid #e5e7eb;
}
.quick-camera-status-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9375rem;
    color: #374151;
}
.quick-camera-status-row .status-icon {
    font-size: 20px;
    color: #6b7280;
}
.quick-camera-status-row.gps-error {
    color: #dc2626;
}
.quick-camera-status-row.gps-error .status-icon {
    color: #dc2626;
}
.quick-camera-status-row:not(.gps-error) .status-icon {
    color: #16a34a;
}
.quick-photo-upload-ok .status-icon {
    color: #16a34a;
}
.quick-photo-cooldown .status-icon {
    color: #6b7280;
}
.quick-camera-save-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e5e7eb;
    font-size: 0.9375rem;
    color: #374151;
    cursor: pointer;
}
.quick-camera-save-option input {
    width: 18px;
    height: 18px;
}
.quick-camera-launch-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 1rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    border: none;
    border-radius: 12px;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.4);
}
.quick-camera-launch-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, #1d4ed8, #1e40af);
    transform: translateY(-1px);
}
.quick-camera-launch-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.quick-camera-launch-btn .material-symbols-outlined {
    font-size: 24px;
}
.quick-photo-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.quick-photo-canvas {
    display: none;
}

/* Gyors fotó – mappa választó, összecsukható szekciók, progress */
.quick-camera-folder-selector {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
    margin-bottom: 1rem;
    padding: 0.875rem 1rem;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    font-size: 0.9375rem;
}
.quick-section-folder-save .quick-camera-folder-selector {
    margin-bottom: 0;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
}
.quick-folder-selector-label,
.quick-camera-folder-selector > label:first-child {
    font-weight: 600;
    color: #374151;
    margin: 0;
}
.quick-camera-folder-selector--locked {
    background: #fffbeb;
    border: 1px solid #fde68a;
}
.quick-folder-locked-msg {
    margin: 0;
    font-size: 0.9375rem;
    color: #374151;
    line-height: 1.5;
}
.quick-folder-radios {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.5rem;
}
.quick-folder-chip {
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.quick-folder-chip-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    pointer-events: none;
}
.quick-folder-chip-face {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.95rem;
    border: 1px solid #d1d5db;
    border-radius: 999px;
    background: #fff;
    color: #374151;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.3;
    transition: border-color 0.2s, background-color 0.2s, color 0.2s, box-shadow 0.2s;
    user-select: none;
}
.quick-folder-chip:hover .quick-folder-chip-face {
    border-color: #93c5fd;
    background: #f8fafc;
}
.quick-folder-chip:has(.quick-folder-chip-input:checked) .quick-folder-chip-face {
    border-color: #2563eb;
    background: #dbeafe;
    color: #1e3a8a;
    font-weight: 600;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.25);
}
.quick-folder-chip-icon {
    font-size: 18px;
    color: #64748b;
    flex-shrink: 0;
    line-height: 1;
}
.quick-folder-chip:has(.quick-folder-chip-input:checked) .quick-folder-chip-icon {
    color: #2563eb;
}
.quick-folder-chip-label {
    min-width: 0;
}
.quick-folder-chip-input:focus-visible + .quick-folder-chip-face {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}
.quick-folder-default-star {
    font-size: 16px;
    color: #f59e0b;
    flex-shrink: 0;
    line-height: 1;
}
.quick-folder-chip--default .quick-folder-chip-label {
    padding-right: 0.1rem;
}
.quick-folder-default-bar {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 0.75rem;
    margin-top: 0.35rem;
    padding-top: 0.75rem;
    border-top: 1px dashed #d1d5db;
    flex: 0 0 auto;
}
.quick-folder-default-info {
    margin: 0;
    font-size: 0.8125rem;
    color: #6b7280;
    line-height: 1.4;
    flex: 0 1 auto;
}
.quick-folder-set-default-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
    font-size: 0.8125rem;
    padding: 0.4rem 0.75rem;
}
.quick-folder-set-default-btn .material-symbols-outlined {
    font-size: 18px;
}
.quick-folder-set-default-btn:disabled {
    opacity: 0.55;
    cursor: default;
}
.quick-folder-admin {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}
.quick-folder-list-wrap {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}
.quick-folder-list-title {
    margin: 0 0 0.75rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #374151;
}
.quick-folder-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.quick-folder-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}
.quick-folder-list-item--protected {
    background: #f0fdf4;
    border-color: #bbf7d0;
}
.quick-folder-list-meta {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}
.quick-folder-list-meta strong {
    font-size: 0.9375rem;
    color: #111827;
}
.quick-folder-list-path {
    font-size: 0.8125rem;
    color: #6b7280;
    word-break: break-all;
}
.quick-folder-delete-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
    padding: 0.35rem 0.65rem;
    font-size: 0.8125rem;
}
.quick-folder-protected-badge {
    font-size: 0.75rem;
    color: #166534;
    background: #dcfce7;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    flex-shrink: 0;
}
.quick-folder-admin-label {
    display: block;
    font-weight: 600;
    font-size: 0.875rem;
    color: #374151;
    margin-bottom: 0.35rem;
}
.quick-folder-admin-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}
.quick-folder-admin-input {
    flex: 1 1 180px;
    min-width: 0;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.9375rem;
}
.quick-folder-create-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
}
.quick-folder-admin-hint {
    margin: 0.5rem 0 0;
    font-size: 0.8125rem;
    color: #6b7280;
    line-height: 1.45;
}
.quick-section {
    background: #fff;
    border-radius: 12px;
    padding: 0;
    margin-bottom: 1rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    border: 1px solid #e5e7eb;
}
.quick-section-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    cursor: pointer;
    user-select: none;
}
.quick-section-header h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    flex: 1;
    order: 1;
}
.quick-section-toggle {
    order: 2;
    flex-shrink: 0;
    margin-left: auto;
    margin-right: 0;
    padding: 0.35rem;
    background: none;
    border: none;
    cursor: pointer;
    color: #6b7280;
    border-radius: 50%;
}
.quick-section-toggle:hover {
    background: #f1f5f9;
    color: #374151;
}
.quick-section-toggle .material-symbols-outlined {
    font-size: 24px;
    display: block;
}
.quick-section-body {
    padding: 0 1.25rem 1.25rem;
    margin-top: -0.5rem;
}
.quick-section.collapsed .quick-section-body {
    display: none !important;
}
.quick-progress-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0.75rem 0;
}
.quick-progress-wrap[style*="display: none"] {
    display: none !important;
}
.quick-progress-bar {
    height: 10px;
    background: #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.06);
}
.quick-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #3b82f6, #2563eb);
    width: 0%;
    transition: width 0.3s ease;
    border-radius: 10px;
    min-width: 4px;
}
.quick-progress-text,
.quick-progress-counter {
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
}
.quick-photo-upload-ok {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #f0fdf4;
    border-radius: 10px;
    color: #16a34a;
    font-size: 0.9375rem;
    margin: 0.5rem 0;
}
.quick-photo-upload-ok .material-symbols-outlined {
    font-size: 22px;
}
.quick-bulk-hint {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0 0 0.75rem;
}
.quick-bulk-gps-error {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: #fef2f2;
    border-radius: 10px;
    color: #dc2626;
    font-size: 0.875rem;
    margin-bottom: 0.75rem;
}
.quick-bulk-gps-error .material-symbols-outlined {
    font-size: 22px;
    flex-shrink: 0;
}
.quick-photo-success-msg {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #16a34a;
    font-size: 0.9375rem;
    margin-top: 0.5rem;
}
.quick-photo-success-msg .material-symbols-outlined {
    font-size: 20px;
}
.quick-photo-bulk-input {
    display: none;
}
.quick-bulk-btn,
.quick-photo-bulk-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.75rem 1rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #10b981, #059669);
    border: none;
    border-radius: 10px;
    cursor: pointer;
}
.quick-bulk-btn:hover:not(:disabled),
.quick-photo-bulk-btn:hover:not(:disabled) {
    background: linear-gradient(135deg, #059669, #047857);
}
.quick-bulk-btn:disabled,
.quick-photo-bulk-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Kompakt megerősítő modal (középen, mobilon sem teljes képernyős) */
.quick-confirm-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    align-items: center;
    justify-content: center;
    padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
}
.quick-confirm-modal.show {
    display: flex;
}
.quick-confirm-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.quick-confirm-modal-content {
    position: relative;
    width: min(360px, calc(100vw - 2rem));
    max-width: 360px;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22);
    overflow: hidden;
    border: 1px solid #e5e7eb;
}
.quick-confirm-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}
.quick-confirm-modal-header--danger {
    background: #fef2f2;
}
.quick-confirm-modal-header h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #b91c1c;
}
.quick-confirm-modal-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.06);
    color: #64748b;
    cursor: pointer;
    flex-shrink: 0;
}
.quick-confirm-modal-close .material-symbols-outlined {
    font-size: 20px;
}
.quick-confirm-modal-body {
    padding: 1rem;
}
.quick-confirm-modal-text {
    margin: 0 0 0.65rem;
    font-size: 0.9375rem;
    line-height: 1.45;
    color: #374151;
}
.quick-confirm-modal-warning {
    margin: 0;
    padding: 0.6rem 0.75rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
}
.quick-confirm-modal-footer {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding: 0.75rem 1rem 1rem;
    border-top: 1px solid #f1f5f9;
    background: #f8fafc;
}
.quick-confirm-modal-footer .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 40px;
    padding: 0.5rem 0.85rem;
    font-size: 0.875rem;
}
.quick-confirm-modal-footer .btn-danger .material-symbols-outlined {
    font-size: 18px;
}

/* Dupla kuka elkerülése: a globális .btn-danger::before ikon felesleges, mert a gombban már van .material-symbols-outlined span */
.quick-confirm-modal-footer .btn-danger:has(.material-symbols-outlined)::before {
    display: none;
}

/* GPS koordináta modal – tömeges feltöltéshez */
.quick-gps-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.quick-gps-modal.show {
    display: flex;
}
.quick-gps-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.5);
}
.quick-gps-modal-content {
    position: relative;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    max-width: 480px;
    width: 100%;
    overflow: hidden;
}
.quick-gps-source-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.85rem;
}
.quick-gps-source-tab {
    flex: 1 1 auto;
    min-width: 7.5rem;
    padding: 0.45rem 0.65rem;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #f8fafc;
    color: #334155;
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
}
.quick-gps-source-tab.is-active {
    background: #eff6ff;
    border-color: #93c5fd;
    color: #1d4ed8;
}
.quick-gps-panel {
    margin-bottom: 0.35rem;
}
.quick-gps-panel[hidden] {
    display: none !important;
}
.quick-gps-panel-hint {
    margin: 0 0 0.75rem;
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.45;
}
.quick-gps-map-search-row {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: stretch;
    margin-bottom: 0.65rem;
}
.quick-gps-map-search-row .quick-gps-text-input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.quick-gps-map-search-row .quick-gps-map-search-btn {
    width: 100%;
    justify-content: center;
    white-space: nowrap;
}
.quick-gps-site-item--no-gps {
    opacity: 0.72;
}
.quick-gps-site-item--no-gps .quick-gps-site-item__meta {
    color: #b45309;
}
.quick-gps-field-label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #374151;
}
.quick-gps-text-input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    font-size: 0.9375rem;
    margin-bottom: 0.65rem;
}
.quick-gps-text-input:focus {
    outline: none;
    border-color: var(--primary-500);
}
.quick-gps-site-list {
    list-style: none;
    margin: 0 0 0.65rem;
    padding: 0;
    max-height: 11rem;
    overflow: auto;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
}
.quick-gps-site-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    width: 100%;
    padding: 0.55rem 0.7rem;
    border: none;
    border-bottom: 1px solid #e2e8f0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}
.quick-gps-site-item:last-child {
    border-bottom: none;
}
.quick-gps-site-item.is-active,
.quick-gps-site-item:hover {
    background: #eff6ff;
}
.quick-gps-site-item__label {
    font-size: 0.875rem;
    font-weight: 600;
    color: #0f172a;
}
.quick-gps-site-item__meta {
    font-size: 0.75rem;
    color: #64748b;
}
.quick-gps-site-empty {
    padding: 0.75rem;
    font-size: 0.8125rem;
    color: #64748b;
    text-align: center;
}
.quick-gps-geocode-btn {
    width: 100%;
    margin-bottom: 0.65rem;
}
.quick-gps-manual-details {
    margin-top: 0.35rem;
    font-size: 0.8125rem;
    color: #475569;
}
.quick-gps-manual-details summary {
    cursor: pointer;
    font-weight: 600;
    margin-bottom: 0.5rem;
}
.quick-gps-coords-preview {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.85rem;
    padding: 0.55rem 0.7rem;
    border-radius: 8px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
    font-size: 0.8125rem;
}
.quick-gps-coords-preview .material-symbols-outlined {
    font-size: 1.1rem;
}
.quick-camera-set-location-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.65rem;
    width: 100%;
    justify-content: center;
}
.quick-gps-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    background: var(--primary-500);
    color: #fff;
}
.quick-gps-modal-header h3 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}
.quick-gps-modal-close {
    background: rgba(255,255,255,0.2);
    border: none;
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
}
.quick-gps-modal-close:hover {
    background: rgba(255,255,255,0.3);
}
.quick-gps-modal-body {
    padding: 1.25rem;
}
.quick-gps-modal-desc {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0 0 1rem;
}
.quick-gps-inputs {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
}
.quick-gps-inputs label {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #374151;
}
.quick-gps-inputs input {
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    font-size: 0.9375rem;
}
.quick-gps-inputs input:focus {
    outline: none;
    border-color: var(--primary-500);
}
.quick-gps-fetch-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.625rem 1rem;
}
.quick-gps-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background: var(--gray-50);
    border-top: 1px solid var(--gray-200);
}

/* Gyors fotó – mobil */
@media (max-width: 768px) {
    .quick-camera-page {
        padding: 0.25rem 0 1rem;
        padding-bottom: max(1rem, env(safe-area-inset-bottom));
        overflow-x: hidden;
        box-sizing: border-box;
    }

    body.auvi-has-tabbar .quick-camera-page {
        padding-bottom: calc(var(--tabbar-height, 58px) + env(safe-area-inset-bottom, 0px) + 1rem);
    }
    .quick-camera-page .page-header {
        margin-bottom: 0.75rem;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
    }
    .quick-camera-page .page-title h1 {
        font-size: 1.35rem;
        line-height: 1.25;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .quick-camera-page .page-actions {
        width: auto;
        margin-left: auto;
        flex-shrink: 0;
        flex-direction: row;
        justify-content: flex-end;
    }
    .quick-camera-page .page-actions .btn:not(.auvi-back-btn) {
        width: auto;
        justify-content: center;
        min-height: 44px;
    }
    .quick-camera-folder-selector {
        flex-direction: column;
        align-items: stretch;
        padding: 0.875rem 1rem;
        gap: 0.65rem;
        width: 100%;
        box-sizing: border-box;
    }
    .quick-section-folder-save .quick-camera-folder-selector {
        padding: 0;
    }
    .quick-camera-folder-selector > label:first-child {
        width: 100%;
    }
    .quick-folder-radios {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        gap: 0.5rem;
    }
    .quick-folder-chip {
        display: block;
        width: 100%;
    }
    .quick-folder-chip-face {
        display: flex;
        width: 100%;
        border-radius: 10px;
        padding: 0.75rem 1rem;
        min-height: 48px;
        box-sizing: border-box;
        font-size: 0.9375rem;
    }
    .quick-folder-chip-icon {
        font-size: 20px;
    }
    .quick-folder-chip-label {
        flex: 1;
    }
    .quick-folder-default-star {
        margin-left: auto;
    }
    .quick-folder-default-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
        margin-top: 0.25rem;
        padding-top: 0.6rem;
    }
    .quick-folder-default-info {
        flex: 0 0 auto;
    }
    .quick-folder-set-default-btn {
        width: 100%;
        justify-content: center;
        min-height: 44px;
        font-size: 0.875rem;
        padding: 0.6rem 1rem;
    }
    .quick-folder-admin-row {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }
    .quick-folder-admin-input {
        flex: 0 0 auto;
        width: 100%;
        height: 2.75rem;
        min-height: 2.75rem;
        max-height: 2.75rem;
        padding: 0.5rem 0.75rem;
        box-sizing: border-box;
    }
    .quick-folder-create-btn {
        width: 100%;
        min-height: 44px;
        box-sizing: border-box;
        justify-content: center;
    }
    .quick-folder-admin-hint {
        font-size: 0.8125rem;
    }
    .quick-folder-list-item {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
        padding: 0.75rem;
    }
    .quick-folder-delete-btn {
        width: 100%;
        justify-content: center;
        min-height: 44px;
        padding: 0.6rem 1rem;
        font-size: 0.875rem;
    }
    .quick-folder-protected-badge {
        align-self: flex-start;
    }
    .quick-section-header {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 0.875rem 1rem;
        gap: 0.5rem;
        min-height: 48px;
    }
    .quick-section-header h3 {
        order: 1;
        flex: 1;
        font-size: 0.9375rem;
        line-height: 1.35;
        padding-right: 0.25rem;
    }
    .quick-section-toggle {
        order: 2;
        margin-left: auto;
        margin-right: 0;
        flex-shrink: 0;
        min-width: 44px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .quick-section-body {
        padding: 0 1rem 1rem;
    }
    .quick-camera-status-card {
        padding: 1rem;
        margin-bottom: 1rem;
    }
    .quick-camera-launch-btn,
    .quick-bulk-btn,
    .quick-photo-bulk-btn {
        min-height: 48px;
        padding: 0.875rem 1rem;
    }
    .quick-camera-save-option {
        min-height: 44px;
        align-items: center;
    }
    .quick-progress-bar {
        height: 12px;
    }
    .quick-progress-fill {
        border-radius: 12px;
    }
    .quick-confirm-modal {
        align-items: center;
        justify-content: center;
    }
    .quick-confirm-modal-content {
        width: min(340px, calc(100vw - 1.5rem));
        max-width: 340px;
    }
    .quick-confirm-modal-footer {
        flex-direction: column-reverse;
        align-items: stretch;
    }
    .quick-confirm-modal-footer .btn {
        width: 100%;
        min-height: 44px;
    }
    .quick-gps-modal {
        padding: max(0.75rem, env(safe-area-inset-top)) max(0.75rem, env(safe-area-inset-right)) max(0.75rem, env(safe-area-inset-bottom)) max(0.75rem, env(safe-area-inset-left));
        align-items: flex-end;
    }
    .quick-gps-modal-content {
        max-height: calc(100dvh - 1.5rem);
        overflow-y: auto;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    .quick-gps-modal-footer {
        flex-direction: column-reverse;
        align-items: stretch;
    }
    .quick-gps-modal-footer .btn {
        width: 100%;
        min-height: 44px;
        justify-content: center;
    }
}

/* GPS koordináta modal – tömeges feltöltés (full-screen) */
.quick-gps-modal--fullscreen {
    padding: 0 !important;
    align-items: stretch;
    justify-content: stretch;
}
.quick-gps-modal--fullscreen .quick-gps-modal-content--fullscreen {
    max-width: none !important;
    width: 100vw !important;
    height: 100dvh !important;
    max-height: none !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.quick-gps-modal--fullscreen .quick-gps-modal-content--fullscreen .quick-gps-modal-header,
.quick-gps-modal--fullscreen .quick-gps-modal-content--fullscreen .quick-gps-modal-footer {
    flex: 0 0 auto;
}
.quick-gps-modal--fullscreen .quick-gps-modal-content--fullscreen .quick-gps-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 400px) {
    .quick-section-folders .quick-section-header h3 {
        font-size: 0.875rem;
    }
    .quick-folder-list-path {
        font-size: 0.75rem;
    }
}
.quick-photo-focus-frame {
    position: absolute;
    inset: 20%;
    pointer-events: auto;
    z-index: 2;
}
.quick-photo-focus-frame .qpf-top,
.quick-photo-focus-frame .qpf-bottom,
.quick-photo-focus-frame .qpf-left,
.quick-photo-focus-frame .qpf-right {
    position: absolute;
    background: rgba(255,255,255,0.8);
    transition: opacity 0.3s;
}
.quick-photo-focus-frame .qpf-top { top: 0; left: 20%; right: 20%; height: 3px; }
.quick-photo-focus-frame .qpf-bottom { bottom: 0; left: 20%; right: 20%; height: 3px; }
.quick-photo-focus-frame .qpf-left { left: 0; top: 20%; bottom: 20%; width: 3px; }
.quick-photo-focus-frame .qpf-right { right: 0; top: 20%; bottom: 20%; width: 3px; }
.quick-photo-focus-frame.focused .qpf-top,
.quick-photo-focus-frame.focused .qpf-bottom,
.quick-photo-focus-frame.focused .qpf-left,
.quick-photo-focus-frame.focused .qpf-right {
    background: #22c55e;
}
.quick-photo-orientation-badge {
    position: absolute;
    top: 1rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: rgba(0,0,0,0.7);
    color: #fff;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 500;
    pointer-events: none;
}
.quick-photo-orientation-badge .material-symbols-outlined {
    font-size: 20px;
}
.quick-photo-osd {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1rem 1.5rem;
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: linear-gradient(transparent, rgba(0,0,0,0.7));
    z-index: 3;
}
.quick-photo-close {
    background: rgba(255,255,255,0.2);
    border: none;
    color: #fff;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.quick-photo-close .material-symbols-outlined {
    font-size: 24px;
}
.quick-photo-status {
    font-size: 0.875rem;
    color: #fff;
}
.quick-photo-status.gps-ok { color: #86efac; }
.quick-photo-status.gps-error { color: #fca5a5; }
.quick-photo-upload-ok {
    font-size: 0.875rem;
    color: #86efac;
    opacity: 0;
    transition: opacity 0.3s;
}
.quick-photo-upload-ok.visible {
    opacity: 1;
}
.quick-photo-cooldown {
    font-size: 0.875rem;
    color: #94a3b8;
}
.quick-photo-capture {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #fff;
    border: 4px solid rgba(255,255,255,0.5);
    color: #1e293b;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.quick-photo-capture .material-symbols-outlined {
    font-size: 32px;
}



/* ========== tasks-map.css ========== */

/* Tasks map stílusok (main.css-ből kiemelve) */

/* =============================================================================
   TASKS MAP - Képek térképen (nulláról)
   ============================================================================= */
.tasks-map-section { position: relative; }
.tasks-map-search-bar {
    margin-bottom: 1rem;
    padding: 1rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.tasks-map-search-form {
    flex: 1 1 100%;
}
.tasks-map-date-filters {
    flex-basis: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e5e7eb;
}
.tasks-map-date-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.65rem 0.75rem;
}
.tasks-map-date-field {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin: 0;
}
.tasks-map-date-field-label {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #6b7280;
    line-height: 1;
}
.tasks-map-date-label {
    display: inline-flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
}
.tasks-map-date-select {
    min-width: 7.25rem;
    height: 2.5rem;
    padding: 0 0.65rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.9375rem;
    background: #fff;
    cursor: pointer;
    box-sizing: border-box;
}
.tasks-map-date-select:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59,130,246,0.2);
}
.tasks-map-date-select:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    background: #f3f4f6;
}
.tasks-map-filter-all-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    height: 2.5rem;
    padding: 0 1rem;
    white-space: nowrap;
    box-sizing: border-box;
}
.tasks-map-filter-all-icon {
    font-size: 1.125rem;
    line-height: 1;
}
.tasks-map-date-hint {
    margin: 0;
    padding: 0.55rem 0.75rem;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #6b7280;
    background: #f9fafb;
    border: 1px solid #eef0f3;
    border-radius: 8px;
    border-left: 3px solid #d1d5db;
}
.tasks-map-date-filters--all-active .tasks-map-date-hint {
    color: #7f1d1d;
    background: #fef2f2;
    border-color: #fecaca;
    border-left-color: #dc2626;
}
.tasks-map-search-bar .map-2connect-row {
    flex-basis: 100%;
    width: 100%;
    margin-top: 0.5rem;
    padding-top: 0.25rem;
    border-top: 1px solid #e5e7eb;
}
.tasks-map-folder-selector {
    flex-basis: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
    margin-top: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e5e7eb;
}
.tasks-map-folder-label {
    font-weight: 600;
    font-size: 0.9375rem;
    color: #374151;
    margin: 0;
}
.tasks-map-folder-locked {
    margin: 0;
    font-size: 0.8125rem;
    color: #6b7280;
    line-height: 1.4;
}
.tasks-map-folder-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.5rem;
}
.tasks-map-folder-selector .quick-folder-chip {
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.tasks-map-folder-selector .quick-folder-chip-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    pointer-events: none;
}
.tasks-map-folder-selector .quick-folder-chip-face {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.95rem;
    border: 1px solid #d1d5db;
    border-radius: 999px;
    background: #fff;
    color: #374151;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.3;
    transition: border-color 0.2s, background-color 0.2s, color 0.2s, box-shadow 0.2s;
    user-select: none;
}
.tasks-map-folder-selector .quick-folder-chip:hover .quick-folder-chip-face {
    border-color: #93c5fd;
    background: #f8fafc;
}
.tasks-map-folder-selector .quick-folder-chip:has(.quick-folder-chip-input:checked) .quick-folder-chip-face {
    border-color: #2563eb;
    background: #dbeafe;
    color: #1e3a8a;
    font-weight: 600;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.25);
}
.tasks-map-folder-selector .quick-folder-chip:has(.quick-folder-chip-input:disabled) .quick-folder-chip-face {
    opacity: 0.85;
    cursor: default;
}
.tasks-map-folder-selector .quick-folder-chip-icon {
    font-size: 18px;
    color: #64748b;
    flex-shrink: 0;
    line-height: 1;
}
.tasks-map-folder-selector .quick-folder-chip:has(.quick-folder-chip-input:checked) .quick-folder-chip-icon {
    color: #2563eb;
}
.tasks-map-load-stats {
    flex-basis: 100%;
    width: 100%;
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #6b7280;
}
.tasks-map-search-bar .map-2connect-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.9rem;
    color: #4b5563;
}
.tasks-map-search-bar .map-2connect-checkbox input { cursor: pointer; }
.tasks-map-search-bar .map-search-status {
    display: block;
    width: 100%;
    margin-top: 0.5rem;
    padding: 0.25rem 0;
    font-size: 0.875rem;
    color: #6b7280;
    text-align: left;
}
.tasks-map-layout {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: var(--radius-lg, 12px);
    padding: 1rem;
    min-height: 500px;
}
.tasks-map-container {
    position: relative;
    min-height: 400px;
    height: 60vh;
    border-radius: 12px;
    overflow: hidden;
}
.tasks-map-container .map-div {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.tasks-map-section .map-loading-overlay {
    position: absolute;
    inset: 0;
    z-index: 100;
    background: rgba(255,255,255,0.95);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}
.tasks-map-section .map-loading-overlay.hidden { display: none; }
.tasks-map-section .map-loading-overlay p { margin: 0; font-size: 0.9375rem; color: #4b5563; }
.tasks-map-section .map-loading-overlay .loading-spinner {
    width: 44px; height: 44px;
    border: 3px solid #e5e7eb;
    border-top-color: #dc2626;
    border-radius: 50%;
    animation: tasks-map-spin 0.7s linear infinite;
}
@keyframes tasks-map-spin { to { transform: rotate(360deg); } }
.tasks-map-section .leaflet-pane,
.tasks-map-section .leaflet-tile-pane { z-index: 1; }
.tasks-map-section .leaflet-marker-pane,
.tasks-map-section .leaflet-popup-pane,
.tasks-map-section .leaflet-control { z-index: 2; }
.tasks-map-section #imagesMap .leaflet-marker-icon.custom-marker,
.tasks-map-section #imagesMap .leaflet-marker-icon.marker-cluster {
    background: #dc2626 !important;
    color: #fff !important;
    border-radius: 50%;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    font-weight: 600;
    font-size: 12px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
.tasks-map-section #imagesMap .leaflet-marker-icon.custom-marker .marker-number,
.tasks-map-section #imagesMap .leaflet-marker-icon.marker-cluster .marker-number,
.tasks-map-section #imagesMap .leaflet-marker-icon.marker-cluster div {
    background: transparent !important;
    color: #fff !important;
    margin: 0; padding: 0;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}
.tasks-map-section .popup-content { padding: 0.25rem; min-width: 140px; }
.tasks-map-section .popup-link {
    display: inline-block;
    margin-top: 0.5rem;
    padding: 0.4rem 0.75rem;
    background: #dc2626;
    color: #fff !important;
    border-radius: 6px;
    font-size: 0.8125rem;
    text-decoration: none;
}
.tasks-map-section .popup-link:hover { background: #b91c1c; }
/* Keresési találat jelölő – piros, nincs kép (Leaflet default marker kikapcsolva) */
.tasks-map-section .leaflet-marker-icon.search-result-marker {
    background: none !important;
    background-image: none !important;
    border: none !important;
}
.tasks-map-section .search-result-marker .search-result-pin {
    display: block;
    width: 28px;
    height: 28px;
    background: #dc2626;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(0,0,0,0.4);
}
@media (max-width: 768px) {
    .tasks-map-search-form {
        flex-direction: column;
        align-items: stretch;
    }

    .tasks-map-search-form .search-input-wrapper {
        width: 100%;
    }

    .tasks-map-search-form .search-input-wrapper input {
        font-size: 16px;
    }

    .tasks-map-search-form .btn {
        width: 100%;
        justify-content: center;
    }

    .tasks-map-date-controls {
        width: 100%;
    }
    .tasks-map-date-field {
        flex: 1;
        min-width: calc(50% - 0.4rem);
    }
    .tasks-map-filter-all-btn {
        width: 100%;
    }
    .tasks-map-folder-chips {
        flex-direction: column;
        align-items: stretch;
    }
    .tasks-map-folder-selector .quick-folder-chip {
        display: block;
        width: 100%;
    }
    .tasks-map-folder-selector .quick-folder-chip-face {
        display: flex;
        width: 100%;
        border-radius: 10px;
        padding: 0.75rem 1rem;
        min-height: 48px;
        box-sizing: border-box;
        font-size: 0.9375rem;
    }
    .tasks-map-folder-selector .quick-folder-chip-label {
        flex: 1;
    }
}



/* ========== image-viewer.css ========== */

/* Image viewer stílusok (main.css-ből kiemelve) */

/* Fullscreen aktív: minden más eltűnik */
body.iv-fullscreen-active > *:not(.image-viewer-fullscreen) {
    display: none !important;
}
body.iv-fullscreen-active > .image-viewer-fullscreen {
    display: block !important;
}
body.iv-fullscreen-active {
    overflow: hidden !important;
}

/* =============================================================================
   IMAGE VIEWER - Képnéző
   ============================================================================= */
.image-viewer-page {
    padding: 1rem;
    max-width: 1200px;
    margin: 0 auto;
}
.image-viewer-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}
.image-viewer-header h1 { flex: 1; }
.image-viewer-header .auvi-back-btn {
    display: none;
}
.image-viewer-content {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    padding: 1rem;
}
.image-display-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1rem 0;
}
.image-display-wrapper .image-wrapper {
    flex: 1;
    min-width: 0;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
}
.iv-zoom-viewport {
    position: relative;
    width: 100%;
    height: calc(100dvh - 14rem);
    min-height: 300px;
    overflow: hidden;
    touch-action: none;
    cursor: zoom-in;
    background: #f3f4f6;
    border-radius: 8px;
}
.iv-zoom-viewport.is-zoomed {
    cursor: grab;
}
.iv-zoom-viewport.is-panning {
    cursor: grabbing;
}
.iv-zoom-img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: auto;
    height: auto;
    max-width: calc(100% - 0.5rem);
    max-height: calc(100% - 0.5rem);
    object-fit: contain;
    transform: translate(-50%, -50%);
    transform-origin: center center;
    will-change: transform;
    user-select: none;
    -webkit-user-drag: none;
}
.image-viewer-delete-btn,
.iv-fs-delete {
    border-radius: 50%;
    border: none;
    background: rgba(239, 68, 68, 0.9);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.image-viewer-delete-btn:hover,
.iv-fs-delete:hover {
    background: #dc2626;
}
.image-viewer-delete-btn {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 10;
    width: 40px;
    height: 40px;
}
.image-viewer-delete-btn .material-symbols-outlined {
    font-size: 1.25rem;
}
.iv-zoom-controls {
    position: absolute;
    bottom: 0.65rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 12;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.35rem;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    touch-action: manipulation;
    pointer-events: auto;
}
.iv-zoom-btn {
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    touch-action: manipulation;
}
.iv-zoom-btn:hover {
    background: rgba(255, 255, 255, 0.15);
}
.iv-zoom-btn .material-symbols-outlined {
    font-size: 1.25rem;
}
.iv-zoom-level {
    min-width: 3.25rem;
    text-align: center;
    font-size: 0.8rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.95);
    font-variant-numeric: tabular-nums;
    user-select: none;
}
.nav-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid #e5e7eb;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nav-btn:hover:not(:disabled) { background: #f3f4f6; }
.nav-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.image-nav-info {
    text-align: center;
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 1rem;
}
.thumbnail-strip {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.5rem 0;
}
.thumb-item {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
}
.thumb-item.active { border-color: var(--primary-600, #2563eb); }
.thumb-item img { width: 100%; height: 100%; object-fit: cover; }

.image-viewer-fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    z-index: 99999;
    background: #000;
    overflow: hidden;
}
.image-viewer-fullscreen:not(:fullscreen) {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.image-viewer-fullscreen:fullscreen {
    width: 100%;
    height: 100%;
    background: #000;
}
.iv-fs-top-buttons {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 100001;
    display: flex;
    align-items: center;
    gap: 8px;
}
.iv-fs-delete {
    width: 48px;
    height: 48px;
}
.iv-fs-delete .material-symbols-outlined {
    font-size: 1.5rem;
}
.iv-fs-close {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255,255,255,0.25);
    border: 2px solid rgba(255,255,255,0.5);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.iv-fs-close:hover { background: rgba(255,255,255,0.45); }
.iv-fs-close .material-symbols-outlined { font-size: 28px; }
.iv-fs-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.78);
    border: 1px solid rgba(255, 255, 255, 0.38);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45);
    pointer-events: auto;
}
.iv-fs-nav:hover:not(:disabled) {
    background: rgba(30, 41, 59, 0.92);
    border-color: rgba(255, 255, 255, 0.55);
}
.iv-fs-nav:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}
.iv-fs-prev { left: max(0.75rem, env(safe-area-inset-left)); }
.iv-fs-next { right: max(0.75rem, env(safe-area-inset-right)); }
.iv-fs-nav .material-symbols-outlined { font-size: 36px; }
.iv-fs-img-wrap {
    position: absolute;
    inset: 0;
    z-index: 1;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
    touch-action: none;
    cursor: zoom-in;
    width: 100%;
    height: 100%;
}
.iv-fs-img-wrap.iv-zoom-viewport {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    background: transparent;
    border-radius: 0;
}
.iv-fs-img-wrap.is-zoomed {
    cursor: grab;
}
.iv-fs-img-wrap.is-panning {
    cursor: grabbing;
}
.iv-fs-img-wrap .iv-zoom-img {
    max-width: 100%;
    max-height: 100%;
}
.iv-fs-img-wrap .iv-zoom-controls {
    bottom: max(3.5rem, calc(env(safe-area-inset-bottom) + 3rem));
    z-index: 20;
}
.iv-fs-counter {
    position: absolute;
    bottom: max(1rem, calc(env(safe-area-inset-bottom) + 0.5rem));
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, 0.95);
    font-size: 1rem;
    font-weight: 600;
    z-index: 90;
    pointer-events: none;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Képnéző fullscreen – mobilon valóban teljes képernyő, gombok a szélen */
@media (max-width: 768px) {
    .image-viewer-page {
        padding: 0.5rem;
    }
    .image-viewer-header {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    .image-viewer-header h1 {
        order: 1;
        flex: 1;
        min-width: 0;
        font-size: 1.15rem;
    }
    .image-viewer-header .auvi-back-btn {
        display: inline-flex;
        order: 2;
        margin-left: auto;
    }
    .image-viewer-header #fullscreenBtn,
    .image-viewer-header .btn-primary {
        order: 10;
        width: 100%;
        justify-content: center;
    }
    .image-viewer-content {
        padding: 0.5rem;
    }
    .image-display-wrapper {
        touch-action: pan-y;
        gap: 0.35rem;
    }
    .image-display-wrapper .iv-zoom-viewport {
        touch-action: none;
        height: calc(100dvh - 16rem);
        min-height: 240px;
        border-radius: 6px;
    }
    .image-viewer-fullscreen {
        padding: 0;
        box-sizing: border-box;
    }
    .iv-fs-top-buttons {
        top: max(0.5rem, env(safe-area-inset-top));
        right: max(0.5rem, env(safe-area-inset-right));
    }
    .iv-fs-close {
        width: 44px;
        height: 44px;
        background: rgba(255,255,255,0.35);
        border: 2px solid rgba(255,255,255,0.6);
    }
    .iv-fs-close .material-symbols-outlined {
        font-size: 26px;
    }
    .iv-fs-img-wrap {
        padding: 0;
    }
    .iv-fs-img-wrap .iv-zoom-img {
        max-width: 100%;
        max-height: 100%;
    }
    .iv-fs-prev {
        left: max(0.25rem, env(safe-area-inset-left));
        width: 40px;
        height: 40px;
    }
    .iv-fs-next {
        right: max(0.25rem, env(safe-area-inset-right));
        width: 40px;
        height: 40px;
    }
    .iv-fs-nav .material-symbols-outlined {
        font-size: 28px;
    }
    .iv-fs-counter {
        bottom: max(0.5rem, env(safe-area-inset-bottom));
        z-index: 25;
    }
    .image-viewer-fullscreen .iv-fs-img-wrap .iv-zoom-controls {
        bottom: max(5rem, calc(env(safe-area-inset-bottom) + 3.75rem));
    }
}



/* ========== operation-log-print.css ========== */

/* Üzemeltetési napló nyomtatási stílusok (main.css-ből kiemelve) */

/* =============================================================================
   ÜZEMELTETÉSI NAPLÓ NYOMTATÁS – felülírások (keretek, layout)
   ============================================================================= */
body.operation-log-print-page {
    background: white !important;
    background-image: none !important;
    color: #000 !important;
}
body.operation-log-print-page .operation-log-content .log-page:not(.log-page-maintenance-attach) .section {
    border: 1px solid #000 !important;
}
body.operation-log-print-page .operation-log-content .log-page:not(.log-page-maintenance-attach) .section-header {
    border-bottom: 1px solid #000 !important;
}
body.operation-log-print-page .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-grid {
    display: table !important;
    border-collapse: collapse !important;
}
body.operation-log-print-page .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item {
    display: table-row !important;
}
body.operation-log-print-page .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item label,
body.operation-log-print-page .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item .value {
    display: table-cell !important;
    border: 1px solid #000 !important;
}
body.operation-log-print-page .operation-log-content .log-table,
body.operation-log-print-page .operation-log-content .log-table th,
body.operation-log-print-page .operation-log-content .log-table td {
    border: 1px solid #000 !important;
}
body.operation-log-print-page .operation-log-content .system-card {
    border: 1px solid #000 !important;
}
body.operation-log-print-page .operation-log-content .equipment-item {
    border-bottom: 1px solid #e0e0e0 !important;
}

/* Munkalap megtekintő – nyomtatási méretek (felülírja a maintenance blokk 8.5px-et) */
@media print {
    html body .work-sheet-view-container .print-container { font-size: 12px !important; }
    html body .work-sheet-view-container .document-info { font-size: 12px !important; }
    html body .work-sheet-view-container .document-info .info-section h3 { font-size: 12px !important; }
    html body .work-sheet-view-container .document-info .info-row,
    html body .work-sheet-view-container .document-info .info-label,
    html body .work-sheet-view-container .document-info .info-value { font-size: 11px !important; }
    html body .work-sheet-view-container .content-section h3 { font-size: 14px !important; }
    html body .work-sheet-view-container .content-section .content-text { font-size: 11px !important; }
    html body .work-sheet-view-container .footer { font-size: 11px !important; }
}

/* Email kliens: css/email-client.css – main.bundle.css elején importálva (közepi @import a böngészőkben érvénytelen lehet) */

/* Oltórendszer Karbantartási Jegyzőkönyv: keskeny „Állapot” oszlop – aktív a böngészőben/nyomtatásban (a MAINTENANCE_MPDF_EXTRACT blokk komment, ezért külön kellett) */
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table {
    table-layout: fixed;
    width: 100%;
}
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table col:first-child {
    width: calc(100% - 34px);
}
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table col:nth-child(2) {
    width: 34px;
}
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table th:nth-child(2),
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table td:nth-child(2),
.maintenance-document.maintenance-doc-suppression table.checklist-table.suppression-status-fixed-table td.checklist-table-td-data {
    width: 34px;
    min-width: 34px;
    max-width: 34px;
    padding-left: 2px;
    padding-right: 2px;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

/* Karbantartás jegyzőkönyv PDF (mPDF): a MAINTENANCE_MPDF_EXTRACT_* közötti részt a pages/maintenance_pdf.php kinyeri; kommentben van, hogy a böngésző ne alkalmazza a globális html/body szabályokat. */
/* MAINTENANCE_MPDF_EXTRACT_START
@page { margin: 8mm; }
html, body {
    margin: 0;
    padding: 0;
    font-family: dejavusans, sans-serif;
    font-size: 9pt;
    line-height: 1.25;
    color: #000;
    background: #fff;
}
.maintenance-document, .main-content {
    display: block !important;
    max-width: none !important;
    width: 100%;
    margin: 0;
    padding: 4px 0;
    background: #fff;
    box-shadow: none !important;
}
.maintenance-doc-fire { font-size: 9pt; padding: 0; max-width: none !important; }

.maintenance-doc-fire .document-header { margin-bottom: 3px; padding-bottom: 2px; }
.maintenance-doc-fire .company-logo { height: 34px; max-width: 150px; margin-bottom: 2px; }
.maintenance-doc-fire .company-info p { font-size: 7pt; }
.maintenance-doc-fire .document-info, .maintenance-doc-fire .document-info p { font-size: 7pt; }
.maintenance-doc-fire .document-title { margin: 3px 0; }
.maintenance-doc-fire .document-title--regulation-below h2 { font-size: 10pt; margin: 0 0 3px 0; }
.maintenance-doc-fire .document-title--regulation-below .regulation-ref { font-size: 7pt; margin: 0; }
.maintenance-doc-fire .maintenance-info-container .section { margin-bottom: 4px; }
.maintenance-doc-fire .maintenance-info-container .section h3 {
    font-size: 9pt;
    margin: 4px 0 2px 0;
    padding-bottom: 1px;
}
.maintenance-doc-fire .maintenance-info-container .maintenance-info-table { font-size: 7pt; margin: 2px 0; }
.maintenance-doc-fire .maintenance-info-container .maintenance-info-table th,
.maintenance-doc-fire .maintenance-info-container .maintenance-info-table td {
    padding: 2px 4px;
    font-size: 7pt;
}
.maintenance-doc-fire .maintenance-fire-otsz-checklists > h3,
.maintenance-doc-fire .section.checklist-table-section > h3 {
    font-size: 9pt;
    margin: 4px 0 2px 0;
    padding-bottom: 1px;
}
.maintenance-doc-fire .maintenance-checklist-part-title { font-size: 8pt; margin: 2px 0; }
.maintenance-doc-fire .checklist-table-print-split,
.maintenance-doc-fire .checklist-table-print-split th,
.maintenance-doc-fire .checklist-table-print-split td {
    font-size: 6.8pt;
    line-height: 1.12;
    padding: 1px 3px;
}
.document-header {
    display: block !important;
    margin-bottom: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #000;
}
.company-logo { height: 44px; width: auto; max-width: 170px; display: block; margin: 0 0 4px 0; }
.company-info p { font-size: 8pt; margin: 0; color: #444; }
.document-info { font-size: 8pt; text-align: left; }
.document-info p { margin: 1px 0; }
.document-title { text-align: center; margin: 6px 0; }
.document-title h2 { color: #b91c1c; font-size: 11pt; margin: 0 0 4px 0; line-height: 1.2; }
.document-title--regulation-below h2 { margin-bottom: 4px; }
.document-title--regulation-below .regulation-ref { margin-top: 0; margin-bottom: 0; }
.regulation-ref { font-size: 8pt; color: #333; margin: 0; }

.section { margin-bottom: 8px; page-break-inside: avoid; }

.maintenance-document .section.checklist-table-section,
.maintenance-document .maintenance-fire-otsz-checklists {
    page-break-inside: auto !important;
}
.maintenance-document .maintenance-fire-otsz-checklists .checklist-table-part-wrap,
.maintenance-document .section.checklist-table-section .checklist-table-print-split,
.maintenance-document .section.checklist-table-section .checklist-table,
.maintenance-document .maintenance-fire-otsz-checklists .checklist-table {
    page-break-inside: auto !important;
}
.section h3 {
    color: #b91c1c;
    font-size: 10pt;
    border-bottom: 1px solid #b91c1c;
    padding-bottom: 2px;
    margin: 8px 0 4px 0;
}
.section h4 { font-size: 9pt; margin: 6px 0 4px 0; }
.maintenance-info-container, .maintenance-info-section {
    display: block !important;
    width: 100%;
    margin-bottom: 6px;
}
.maintenance-info-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8pt;
    margin: 4px 0;
}
.maintenance-info-table th, .maintenance-info-table td {
    border: 1px solid #333;
    padding: 3px 6px;
    text-align: left;
    vertical-align: top;
}
.maintenance-info-th { font-weight: bold; background: #f0f0f0; width: 34%; }
.info-grid, .info-grid-compact { display: block !important; width: 100%; margin: 4px 0; }
.info-grid-compact .info-item, .info-item {
    display: block !important;
    margin-bottom: 4px;
    font-size: 8pt;
    line-height: 1.3;
}
.info-grid-compact .info-item label, .info-item label {
    font-weight: bold;
    display: inline;
    margin-right: 6px;
    color: #333;
}
.info-grid-compact .info-item span, .info-item span { display: inline; }
.three-column-section { display: block !important; width: 100%; }
.checklist-table, table.checklist-table {
    width: 100%;
    border-collapse: collapse;
    margin: 6px 0;
    font-size: 7.5pt;
}
.checklist-table th, .checklist-table td {
    border: 1px solid #333;
    padding: 2px 4px;
    vertical-align: top;
}
.checklist-table th { background: #f0f0f0; font-weight: bold; }
.maintenance-document .checklist-table-print-split {
    width: 100%;
    border-collapse: collapse;
    margin: 4px 0;
    font-size: 7.5pt;
}
.maintenance-document .checklist-table-print-split th,
.maintenance-document .checklist-table-print-split td {
    border: 1px solid #333;
    padding: 2px 4px;
    line-height: 1.2;
}
.maintenance-document .checklist-table-print-split th { background: #f0f0f0; font-weight: bold; }
.checklist-table .status-ok { background: #d1fae5; color: #047857; font-weight: bold; text-align: center; }
.checklist-table .status-error { background: #fecaca; color: #991b1b; font-weight: bold; text-align: center; }
.checklist-table .status-na { background: #f3f4f6; color: #4b5563; font-weight: bold; text-align: center; }
.checklist-table .status-unknown { background: #fef3c7; color: #b45309; text-align: center; }
.checklist-table tr.checklist-table-row-data td,
.checklist-table td.checklist-table-td-data {
    background: #fff !important;
    color: #000 !important;
    font-weight: normal;
}
.checklist-megjegyzes-cell, .checklist-table td.checklist-megjegyzes-cell {
    padding-left: 12px;
    font-size: 8pt;
    color: #374151;
}
.result-megfelelő { color: #047857; font-weight: bold; }
.result-nem_megfelelő, .result-nem_felelt_meg { color: #991b1b; font-weight: bold; }
.result-nem_releváns, .result-nem_relevans { color: #6b7280; font-weight: bold; }
.signature-table, .signature-section {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0 8px 0;
}
.signature-table td {
    border: none;
    padding: 4px 8px;
    vertical-align: top;
    text-align: center;
    font-size: 8pt;
}
.signature-image { max-width: 200px; max-height: 72px; width: auto; height: auto; }
.signature-line {
    border-bottom: 1px solid #333;
    width: 180px;
    height: 50px;
    margin: 0 auto 6px;
}
.notes-section { margin: 6px 0; }
.notes-title { font-weight: bold; font-size: 8pt; margin-bottom: 3px; }
.notes-box {
    border: 1px solid #999;
    padding: 5px 8px;
    font-size: 8pt;
    line-height: 1.35;
    white-space: pre-wrap;
}
.document-footer {
    text-align: center;
    margin-top: 12px;
    padding-top: 8px;
    border-top: 1px solid #ccc;
    font-size: 7pt;
    color: #555;
}
.document-footer p { margin: 2px 0; }
.extinguisher-table table, .participants-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 8pt;
    margin: 6px 0;
}
.extinguisher-table th, .extinguisher-table td,
.participants-table th, .participants-table td {
    border: 1px solid #333;
    padding: 3px 5px;
}
.maintenance-checklist { display: block !important; margin-bottom: 8px; }
.checklist-item {
    display: block !important;
    padding: 4px 0;
    border-bottom: 1px solid #e5e7eb;
    font-size: 8pt;
}
.equipment-item {
    display: block !important;
    padding: 4px 0 4px 8px;
    margin-bottom: 4px;
    border-left: 3px solid #b91c1c;
    background: #f9fafb;
}
.text-center { text-align: center; }
.document-actions-top { display: none !important; }
img { max-width: 100%; height: auto; }
table { border-collapse: collapse; }

/* Nyomtatási oldalnézetben ne jelenjen meg jobb oldali scrollbar a checklist blokkokon */
body.maintenance-view-app-page .maintenance-document .checklist-table-section,
body.operation-log-print-page .log-page-maintenance-attach .checklist-table-section {
    overflow: visible;
    max-width: none;
}

/* Végleges nyomtatási scrollbar tiltás (karbantartás + üzemeltetési napló nyomtatás) */
@media print {
    html,
    body,
    body.maintenance-view-app-page,
    body.operation-log-print-page,
    body.maintenance-view-app-page main,
    body.operation-log-print-page main,
    #operation-log-print-root,
    #operation-log-print-root .operation-log-content,
    #operation-log-print-root .log-page,
    #operation-log-print-root .log-page-maintenance-attach,
    #operation-log-print-root .log-page-maintenance-attach .maintenance-document,
    body.maintenance-view-app-page .maintenance-document,
    body.maintenance-view-app-page .maintenance-document .main-content,
    body.maintenance-view-app-page .maintenance-document .section,
    body.maintenance-view-app-page .maintenance-document .checklist-table-section,
    body.operation-log-print-page .log-page-maintenance-attach .section,
    body.operation-log-print-page .log-page-maintenance-attach .checklist-table-section {
        overflow: visible !important;
        overflow-x: visible !important;
        overflow-y: visible !important;
        max-height: none !important;
        scrollbar-width: none !important; /* Firefox */
        -ms-overflow-style: none !important; /* IE/Edge legacy */
    }

    body.maintenance-view-app-page *::-webkit-scrollbar,
    body.operation-log-print-page *::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
    }
}
/* MAINTENANCE_MPDF_EXTRACT_END */


/* ========== kiszervezve: pages/operation_log_print.php ========== */
/* Layout: operation_log_print – main.css felülírás (#operation-log-print-root > .section stb., nélkül) */
body.operation-log-print-page {
    background: white;
    background-image: none;
    color: #000;
}
body.operation-log-print-page main {
    max-width: none;
    padding: 0;
    background: white;
}
#operation-log-print-root {
    width: 100%;
}
/* system-card: main.css felülírása (padding, border) – specifikusabb szelektor */
#operation-log-print-root .system-card {
    padding: 0;
    box-shadow: none;
    border: 1px solid #000;
    border-left: 1px solid #000;
    border-radius: 0;
    width: 100%;
    max-width: none;
    margin-bottom: 0;
}
/* Napló: minden kerekítés kikapcsolva – main.css felülírása */
#operation-log-print-root .section,
#operation-log-print-root .section-header,
#operation-log-print-root .system-header,
#operation-log-print-root .equipment-grid,
#operation-log-print-root .systems-grid {
    border-radius: 0;
}
#operation-log-print-root .systems-grid {
    display: block;
    width: 100%;
}

/* Láthatatlan keret: széles monitorokon a tartalom ne nyúljon túl */
.operation-print-inner {
    max-width: 1100px;
    margin: 0 auto;
}

.operation-print-wrapper { font-family: Arial, sans-serif; background: white; color: #000; }
.operation-print-toolbar { background: #f8fafc; padding: 1rem; border-bottom: 1px solid #e5e7eb; margin-bottom: 1.5rem; }
.operation-print-toolbar-inner { display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: flex-end; align-items: center; }
.naplo-header-with-logo { text-align: left; }
.naplo-logo-row { display: flex; align-items: center; gap: 1.5rem; }
.naplo-logo { height: 50px; width: auto; }
.naplo-credit, .naplo-footer-credit { font-size: 0.8rem; margin-top: 0.5rem; color: #000; }
.operation-log-content { background: white; color: #000; padding: 2rem; box-sizing: border-box; width: 100%; }
.log-page { min-height: 50vh; page-break-after: always; margin-bottom: 2rem; padding: 0.8rem; display: flex; flex-direction: column; background: white; color: #000; }
.log-page:last-child { page-break-after: auto; }
/* Borító – teljes oldal kitöltése; kereten belül középre, lábjegyzet a kereten kívül */
.log-page-cover {
    padding: 0;
    margin-left: -2rem;
    margin-right: -2rem;
    width: calc(100% + 4rem);
    box-sizing: border-box;
    min-height: calc(100vh - 5.5rem);
    justify-content: space-between;
}
.log-page-cover-frame {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: 2px solid #000;
    box-sizing: border-box;
    padding: 2rem 1.25rem 2.25rem;
    min-height: calc(100vh - 9rem);
}
.log-page-cover-brand {
    margin: 0 0 1.75rem 0;
}
.log-page-cover-logo {
    display: block;
    height: 96px;
    width: auto;
    max-width: min(320px, 70vw);
    margin: 0 auto;
    object-fit: contain;
}
.log-page-cover-company {
    margin: 0.65rem 0 0 0;
    font-size: 1.15rem;
    font-weight: bold;
    letter-spacing: 0.02em;
    color: #000;
    line-height: 1.2;
}
.log-page-cover-title {
    font-size: 1.45rem;
    font-weight: bold;
    margin: 0 0 1.75rem 0;
    line-height: 1.25;
    max-width: 100%;
    color: #000;
}
.log-page-cover-location {
    font-size: 1rem;
    font-weight: bold;
    margin: 0 0 2rem 0;
    line-height: 1.35;
    max-width: 100%;
    color: #000;
}
.log-page-cover-meta {
    font-size: 0.9rem;
    color: #000;
}
.log-page-cover-meta-table {
    margin: 0 auto;
    border: none;
    border-collapse: collapse;
    border-spacing: 0;
}
.log-page-cover-meta-table th,
.log-page-cover-meta-table td {
    border: none;
    padding: 0.15em 0;
    vertical-align: baseline;
}
.log-page-cover-label-cell {
    text-align: right;
    font-weight: normal;
    padding-right: 0.65em;
    white-space: nowrap;
}
.log-page-cover-value-cell {
    text-align: left;
}
.log-page-cover-row-lezaras th,
.log-page-cover-row-lezaras td {
    padding-top: 1.35em;
}
.log-page-cover-line {
    display: inline-block;
    min-width: 14em;
    border-bottom: 1px solid #000;
    min-height: 1.15em;
    vertical-align: baseline;
}
.log-page-training-attach {
    page-break-before: always;
}
.log-page-training-attach .ft-doc {
    max-width: 100%;
}
#operation-log-print-root .log-page-maintenance-attach .maintenance-document { max-width: 1000px; padding: 1.5rem 2rem; margin: 0 auto; font-size: 12px; line-height: 1.3; }
#operation-log-print-root .log-page-maintenance-attach .company-info p,
#operation-log-print-root .log-page-maintenance-attach .document-info,
#operation-log-print-root .log-page-maintenance-attach .document-info p,
#operation-log-print-root .log-page-maintenance-attach .regulation-ref { font-size: 10.5px; }
#operation-log-print-root .log-page-maintenance-attach .maintenance-info-table,
#operation-log-print-root .log-page-maintenance-attach .maintenance-info-table th,
#operation-log-print-root .log-page-maintenance-attach .maintenance-info-table td { font-size: 10.5px; }
#operation-log-print-root .log-page-maintenance-attach .maintenance-time-footnote {
    display: block;
    font-size: 9.5px;
    color: #4b5563;
    margin-top: 0.35rem;
    line-height: 1.35;
    font-weight: normal;
}
#operation-log-print-root .log-page-maintenance-attach .checklist-table-print-split,
#operation-log-print-root .log-page-maintenance-attach .checklist-table-print-split th,
#operation-log-print-root .log-page-maintenance-attach .checklist-table-print-split td { font-size: 11px; line-height: 1.3; }
/* Csatolt oltórendszer „Állapot” oszlop: a részletes szabályok a lap alján vannak (kaskád utolsó + !important a szélességre) */
#operation-log-print-root .log-page-maintenance-attach .section h3,
#operation-log-print-root .log-page-maintenance-attach .checklist-table-section h3 { font-size: 13px; }
#operation-log-print-root .log-page-maintenance-attach .info-grid { display: grid; }
#operation-log-print-root .log-page-maintenance-attach .info-item { display: flex; flex-direction: row; table-layout: auto; }
#operation-log-print-root .log-page-maintenance-attach .info-item label,
#operation-log-print-root .log-page-maintenance-attach .info-item span,
#operation-log-print-root .log-page-maintenance-attach .info-item .value { display: inline; }
.naplo-header { margin-bottom: 0.8rem; border-bottom: 2px solid #000; padding-bottom: 0.5rem; color: #000; }
.naplo-header h1 { font-size: 1.2rem; font-weight: bold; margin: 0 0 0.3rem 0; color: #000; }
.naplo-header p { font-size: 0.8rem; margin: 0 0 0.15rem 0; color: #000; }
/* Napló szekciók és info-grid – main.css felülírás (#operation-log-print-root) */
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .section {
    margin-bottom: 1rem; border: 1px solid #000; width: 100%; box-sizing: border-box;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .section-header {
    background: #f0f0f0; padding: 0.5rem; border-bottom: 1px solid #000;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .section-header h2 {
    font-size: 0.95rem; font-weight: bold; color: #000; text-align: center; margin: 0;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .section-subtitle {
    font-size: 0.75rem; font-style: italic; text-align: center; margin-top: 0.25rem; color: #000;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-grid {
    display: table; width: 100%; border-collapse: collapse;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item {
    display: table-row;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item label {
    display: table-cell; font-weight: bold; font-size: 0.8rem; padding: 0.4rem 0.5rem;
    border: 1px solid #000; background: #f0f0f0; width: 30%; color: #000;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item .value {
    display: table-cell; padding: 0.4rem 0.5rem; border: 1px solid #000;
    background: white; font-size: 0.8rem; color: #000; width: 70%;
}
#operation-log-print-root .operation-log-content .log-page:not(.log-page-maintenance-attach) .info-item.lemondo-jelszo-row { border-top: 1px solid #ddd; }
#operation-log-print-root .info-item.lemondo-jelszo-row .value.value-dotted { border-bottom: 1px dotted #333; }
.jelszo-warning { margin: 0.5rem 0 0 0; font-size: 0.85em; color: #666; font-style: italic; padding: 0 0.5rem; }
.log-page-personnel .section-personnel { margin-bottom: 1.5rem; }
.log-page-personnel .section-personnel:last-of-type { margin-bottom: 0; }
.personnel-table-title { font-size: 0.95rem; font-weight: bold; text-align: center; margin: 0 0 0.5rem 0; color: #000; }
.log-table-personnel { table-layout: fixed; }
.log-table-personnel th { font-size: 0.75rem; }
.log-table-personnel td { min-height: 1.8rem; vertical-align: top; }
.system-header { background: #f0f0f0; padding: 0.4rem; text-align: center; border-bottom: 1px solid #000; }
.system-header h3 { font-size: 0.85rem; font-weight: bold; margin: 0; }
.equipment-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.22rem 0.95rem; padding: 0.48rem; font-size: 0.8rem; line-height: 1.4; }
/* Napló eszközök: nincs piros jel, nincs kerekítés, kis hézag a szöveg előtt */
#operation-log-print-root .equipment-item {
    display: flex; align-items: baseline; gap: 0.34rem; padding: 0.2rem 0 0.2rem 0.55rem;
    border-bottom: 1px solid #e0e0e0; border-left: none; border-radius: 0; background: transparent;
}
.equipment-item .eq-name { flex: 1; min-width: 0; }
.equipment-item .eq-qty { flex-shrink: 0; font-weight: bold; font-size: 0.8rem; }
.equipment-item .eq-detail { flex-shrink: 0; color: #444; font-size: 0.72rem; }
.equipment-item-manual { min-height: 2.4rem; }
.equipment-item-empty { min-height: 2.6rem; }
.log-table-container { padding: 0.5rem; }
.log-table { width: 100%; border-collapse: collapse; font-size: 0.75rem; border: 1px solid #000; }
.log-table thead { background: #f0f0f0; }
.log-table th { padding: 0.3rem 0.25rem; text-align: center; font-weight: bold; font-size: 0.7rem; border: 1px solid #000; color: #000; }
.log-table td { padding: 0.3rem 0.25rem; border: 1px solid #000; text-align: center; font-size: 0.7rem; color: #000; }
.log-table .signature-cell { text-align: center; }
/* Kézírásra alkalmas táblázatok: szélesebb cellák, több hely */
.log-table-writeable { table-layout: fixed; }
.log-table-writeable th { padding: 0.5rem 0.5rem; font-size: 0.8rem; text-align: center; }
.log-table-writeable td { padding: 0.6rem 0.5rem; font-size: 0.8rem; text-align: left; min-height: 2.2rem; }
.log-table-writeable .signature-cell { text-align: center; min-width: 3.5rem; }
.log-table-writeable tbody tr { min-height: 2.5rem; }
.log-table-writeable tbody td { height: 2.5rem; vertical-align: top; }
.training-brief-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; margin-bottom: 0.45rem; }
.training-brief-col { border: 1px solid #000; padding: 0.35rem 0.45rem; }
.training-brief-title { margin: 0 0 0.22rem 0; font-size: 0.72rem; font-weight: bold; min-height: 0.9rem; }
.training-brief-title-spacer { visibility: hidden; }
.training-brief-col h4 { margin: 0 0 0.22rem 0; font-size: 0.72rem; font-weight: bold; min-height: 0.9rem; }
.training-brief-col ul,
.training-brief-list { margin: 0; padding-left: 0.95rem; }
.training-brief-col li,
.training-brief-list li { font-size: 0.62rem; line-height: 1.24; margin-bottom: 0.1rem; }
.log-table-oktatas-detailed thead tr:nth-child(1) th { font-size: 0.66rem; padding: 0.18rem 0.2rem; font-weight: bold; }
.log-table-oktatas-detailed thead tr:nth-child(2) th { font-size: 0.66rem; padding: 0.18rem 0.2rem; font-weight: bold; }
.log-table-oktatas-detailed th .sub-th { font-size: 0.66rem; font-weight: bold; display: block; }
#operation-log-print-root .log-table.log-table-oktatas-detailed {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}
#operation-log-print-root .log-table.log-table-writeable.log-table-oktatas-detailed tbody tr { min-height: 0; height: auto; }
#operation-log-print-root .log-table.log-table-writeable.log-table-oktatas-detailed tbody td {
    height: 2.14rem;
    min-height: 2.14rem;
    padding-top: 0.29rem;
    padding-bottom: 0.29rem;
}
#operation-log-print-root .log-table.log-table-writeable.log-table-oktatas-detailed tbody td[rowspan="2"] {
    height: 4.28rem;
    min-height: 4.28rem;
    vertical-align: top;
}
.log-table-oktatas-detailed .training-time-cell { text-align: left; vertical-align: bottom; color: #555; font-size: 0.58rem; padding-left: 0.15rem; }
.log-table-oktatas-detailed .training-date-cell,
.log-table-oktatas-detailed .training-name-cell,
.log-table-oktatas-detailed .training-trainer-cell,
.log-table-oktatas-detailed .training-role-cell,
.log-table-oktatas-detailed .training-exam-cell,
.log-table-oktatas-detailed .training-rating-cell {
    text-align: left;
    vertical-align: middle;
}
.log-table-oktatas-detailed .training-sig-img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 3.2rem;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    object-fit: contain;
    object-position: center center;
}
.log-table-oktatas-detailed td.signature-cell {
    padding: 0.15rem 0.2rem !important;
    vertical-align: middle;
    text-align: center;
    overflow: hidden;
}
.table-note { font-size: 0.7rem; font-style: italic; margin: 0.3rem 0.5rem 0 0; color: #333; }
.checkbox-box { display: inline-block; width: 1.5rem; height: 1.5rem; border: 2px solid #666; background: white; vertical-align: middle; position: relative; text-align: center; line-height: 1; }
.checkbox-box__mark {
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -55%);
    font-size: 0.95rem;
    font-weight: bold;
    line-height: 1;
    color: #111;
}
.checkbox-box--fail {
    border-color: #b91c1c;
}
.checkbox-box--fail .checkbox-box__mark {
    color: #dc2626;
    font-size: 1.05rem;
}
.checkbox-box--checked::after,
.checkbox-box--fail::after {
    content: none !important;
}
.daily-megfelel-label { font-size: 0.58rem; font-weight: bold; margin-left: 0.15rem; vertical-align: middle; }
.daily-megfelel-label--no { color: #b91c1c; }
.daily-signature-img { display: block; max-width: 100%; max-height: 1.65rem; margin: 0 auto; object-fit: contain; }
/* Napi tábla: kompakt sorok – kitöltve is egy A4 oldal */
.log-table-daily-checks tbody tr {
    height: calc(0.85rem + 0.35rem);
}
.log-table-daily-checks tbody td {
    padding: 0.08rem 0.12rem;
    vertical-align: middle;
    line-height: 1.1;
    overflow: hidden;
    box-sizing: border-box;
}
.log-table-daily-checks tbody td.daily-alairas-cell {
    text-align: center;
    overflow: hidden;
    line-height: 1;
}
.daily-signature-wrap {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}
.log-table-daily-checks .daily-signature-img {
    display: block;
    max-height: 0.95rem;
    max-width: 100%;
    width: 72px;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
    vertical-align: middle;
    opacity: 1;
    visibility: visible;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}
.daily-nev-cell, .daily-alairas-cell { font-size: 0.62rem; }
.yn-cell { font-size: 0.65rem; white-space: nowrap; }
.quarterly-otsz-checklist { margin: 0 0 0.35rem 0; padding: 0 0.25rem; }
.quarterly-otsz-checklist-intro { font-size: 0.62rem; font-weight: bold; margin: 0 0 0.2rem 0; color: #000; line-height: 1.35; }
.quarterly-otsz-checklist-cols { display: flex; gap: 0.75rem; align-items: flex-start; }
.quarterly-otsz-checklist-cols .quarterly-otsz-checklist-ul { flex: 1; min-width: 0; }
.quarterly-otsz-checklist-ul { margin: 0; padding-left: 1.15rem; font-size: 0.58rem; line-height: 1.32; color: #000; }
.quarterly-otsz-checklist-ul li { margin-bottom: 0.08rem; }
.log-table-quarterly { font-size: 0.65rem; table-layout: fixed; width: 100%; }
.log-table-quarterly .quarterly-col-status { width: 24%; }
.log-table-quarterly .quarterly-th-status,
.log-table-quarterly .quarterly-td-status { width: 24%; text-align: center; }
.log-table-quarterly th { font-size: 0.6rem; padding: 0.2rem 0.15rem; line-height: 1.15; }
.log-table-quarterly td { font-size: 0.6rem; padding: 0.2rem 0.15rem; }
.log-table-quarterly .megjegyzes-cell { min-height: 6.5rem; height: auto; padding: 0.35rem 0.45rem; text-align: left; vertical-align: top; border-bottom: 1px solid #000; }
table.quarterly-megjegyzes-pdf { width: 100%; border-collapse: collapse; }
.quarterly-fill-label-cell { width: 18%; font-size: 0.62rem; font-weight: bold; white-space: nowrap; padding: 0.2rem 0.35rem 0.15rem 0; vertical-align: bottom; }
.quarterly-fill-value-cell { border-bottom: 1px dotted #333; min-height: 1.25rem; height: 1.25rem; padding: 0 0.2rem 0.15rem 0.2rem; vertical-align: bottom; font-size: 0.62rem; }
.quarterly-fill-value-cell--signature { min-height: 1.65rem; height: 1.65rem; }
.quarterly-fill-value-cell--signature .daily-signature-img { margin: 0; max-width: 12rem; }
.quarterly-megjegyzes-text { display: block; font-size: 0.58rem; line-height: 1.35; font-weight: normal; }
.log-table-quarterly .checkbox-box { width: 1rem; height: 1rem; }
/* Negyedéves státusz: kitöltve zöld ✓ / piros × (.oplog-status-mark), keret nélkül */
.log-table-quarterly .quarterly-td-status .checkbox-box {
    width: auto;
    height: auto;
    min-width: 0.9rem;
    min-height: 0.9rem;
    border: none;
    background: transparent;
    vertical-align: middle;
    position: relative;
}
.log-table-quarterly .quarterly-td-status .checkbox-box--empty {
    width: 0.9rem;
    height: 0.9rem;
    border: 1px solid #999;
    background: #fff;
}
.log-table-quarterly .quarterly-td-status .checkbox-box__mark {
    position: static;
    transform: none;
    display: inline-block;
    font-size: 1rem;
    line-height: 1;
    color: #16a34a;
    font-weight: bold;
}
.log-table-quarterly .quarterly-td-status .checkbox-box--fail .checkbox-box__mark {
    color: #dc2626;
    font-size: 1.1rem;
}
.signature-cell { text-align: center; font-weight: bold; font-style: italic; min-width: 80px; }

/* RWA – Negyedéves üzemeltetői ellenőrzés */
.section-rwa-quarterly { margin-bottom: 0.4rem; }
.rwa-quarterly-header { display: flex; gap: 2rem; padding: 0.5rem 0.4rem; border-bottom: 1px solid #e0e0e0; }
.rwa-quarterly-field { display: flex; align-items: center; gap: 0.5rem; flex: 1; }
.rwa-quarterly-field label { font-size: 0.8rem; font-weight: bold; white-space: nowrap; }
.rwa-quarterly-field .value-dotted { flex: 1; border-bottom: 1px dotted #333; min-height: 1.2rem; }
.log-table-rwa-quarterly { font-size: 0.65rem; }
.log-table-rwa-quarterly th { font-size: 0.6rem; padding: 0.2rem 0.15rem; text-align: center; }
.log-table-rwa-quarterly td { font-size: 0.6rem; padding: 0.2rem 0.15rem; text-align: left; }
.log-table-rwa-quarterly td:first-child { width: 28%; }
.log-table-rwa-quarterly td:nth-child(1), .log-table-rwa-quarterly td:nth-child(4) { text-align: left; }
.log-table-rwa-quarterly td:nth-child(2), .log-table-rwa-quarterly td:nth-child(3),
.log-table-rwa-quarterly td:nth-child(5), .log-table-rwa-quarterly td:nth-child(6) { text-align: center; width: 4%; }
.rwa-quarterly-megallapitas { margin-top: 0.6rem; }
.rwa-quarterly-question { font-size: 0.75rem; margin-bottom: 0.25rem; }
.rwa-quarterly-lines { margin-top: 0.2rem; }
.rwa-quarterly-lines label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.15rem; }
.rwa-quarterly-line { border-bottom: 1px dotted #333; min-height: 1.2rem; margin-bottom: 0.15rem; }
.rwa-quarterly-signatures { display: flex; gap: 2rem; margin-top: 1rem; padding-top: 0.5rem; }
.rwa-quarterly-sig { flex: 1; }
.rwa-quarterly-sig label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.2rem; }
.rwa-quarterly-sig-line { border-bottom: 1px solid #333; min-height: 1.5rem; }
.rwa-quarterly-ph { font-size: 0.65rem; font-style: italic; }

/* Oltórendszer – Heti ellenőrzések (RWA formátumhoz igazítva) */
.section-suppression-weekly { margin-bottom: 0.4rem; }
.suppression-weekly-block { border: 1px solid #333; padding: 0.5rem; margin-bottom: 0.5rem; }
.suppression-weekly-header { display: flex; gap: 2rem; padding: 0.5rem 0.4rem; border-bottom: 1px solid #e0e0e0; }
.suppression-weekly-field { display: flex; align-items: center; gap: 0.5rem; flex: 1; }
.suppression-weekly-field label { font-size: 0.8rem; font-weight: bold; white-space: nowrap; }
.suppression-weekly-field .value-dotted { flex: 1; border-bottom: 1px dotted #333; min-height: 1.2rem; }
.suppression-weekly-questions { padding: 0.4rem 0; }
.suppression-weekly-row { display: flex; gap: 1.5rem; margin-bottom: 0.35rem; flex-wrap: wrap; }
.suppression-weekly-q { flex: 1; min-width: 45%; }
.suppression-weekly-q label { font-size: 0.75rem; font-weight: bold; display: block; margin-bottom: 0.2rem; }
.suppression-weekly-q .yn-cell { font-size: 0.65rem; white-space: nowrap; margin-right: 0.5rem; }
.suppression-weekly-megjegyzes { margin-top: 0.4rem; }
.suppression-weekly-megjegyzes label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.15rem; }
.suppression-weekly-line { border-bottom: 1px dotted #333; min-height: 1.2rem; margin-bottom: 0.15rem; }
.suppression-weekly-sig { margin-top: 0.5rem; padding-top: 0.3rem; }
.suppression-weekly-sig label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.2rem; }
.suppression-weekly-sig-line { border-bottom: 1px solid #333; min-height: 1.5rem; }
.suppression-weekly-ph { font-size: 0.65rem; font-style: italic; }

/* Oltórendszer – Havi ellenőrzések (2 hónap / oldal) */
.section-suppression-monthly { margin-bottom: 0.4rem; }
.suppression-monthly-block { border: 1px solid #333; padding: 0.5rem; margin-bottom: 0.5rem; }
.suppression-monthly-block:last-child { margin-bottom: 0; }
.suppression-monthly-month { font-size: 0.85rem; font-weight: bold; margin: 0 0 0.35rem 0; padding: 0; }
.suppression-monthly-header { display: flex; gap: 2rem; padding: 0.5rem 0.4rem; border-bottom: 1px solid #e0e0e0; }
.suppression-monthly-field { display: flex; align-items: center; gap: 0.5rem; flex: 1; }
.suppression-monthly-field label { font-size: 0.8rem; font-weight: bold; white-space: nowrap; }
.suppression-monthly-field .value-dotted { flex: 1; border-bottom: 1px dotted #333; min-height: 1.2rem; }
.suppression-monthly-grid { padding: 0.4rem 0; }
.suppression-monthly-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem 0.8rem; margin-bottom: 0.4rem; }
.suppression-monthly-q { min-width: 0; }
.suppression-monthly-q label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.15rem; }
.suppression-monthly-q .yn-cell { font-size: 0.6rem; white-space: nowrap; margin-right: 0.3rem; }
.suppression-monthly-megjegyzes { margin-top: 0.5rem; }
.suppression-monthly-megjegyzes label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.15rem; }
.suppression-monthly-line { border-bottom: 1px dotted #333; min-height: 1.2rem; margin-bottom: 0.15rem; }
.suppression-monthly-sig { margin-top: 0.5rem; padding-top: 0.3rem; }
.suppression-monthly-sig label { font-size: 0.7rem; font-weight: bold; display: block; margin-bottom: 0.2rem; }
.suppression-monthly-sig-line { border-bottom: 1px solid #333; min-height: 1.5rem; }
.suppression-monthly-ph { font-size: 0.65rem; font-style: italic; }
.suppression-monthly-sub { margin: 0.2rem 0 0 0; font-size: 0.85rem; }

/* Oltórendszer – Heti/Havi üzemeltetői ellenőrzési lapok (kép szerinti tartalom, app stílus) */
.section-suppression-checksheet { margin-bottom: 0.5rem; }
.suppression-checksheet-meta { width: 100%; border-collapse: collapse; margin-bottom: 0.35rem; }
.suppression-checksheet-meta th,
.suppression-checksheet-meta td { border: 1px solid #000; font-size: 0.7rem; padding: 0.18rem 0.32rem; text-align: left; }
.suppression-checksheet-meta th { width: 19%; background: #f7f7f7; font-weight: bold; }
.suppression-checksheet-title-row { display: flex; justify-content: space-between; gap: 0.8rem; font-size: 0.72rem; font-weight: bold; margin: 0.25rem 0 0.2rem 0; }
.suppression-checksheet-reg { white-space: nowrap; }
.suppression-checksheet-intro { margin: 0 0 0.25rem 1.05rem; padding: 0; font-size: 0.64rem; line-height: 1.25; }
.suppression-checksheet-intro li { margin: 0 0 0.08rem 0; }
.log-page-suppression-checksheet-weekly .suppression-checksheet-title-row { font-size: 0.94rem; }
.log-page-suppression-checksheet-weekly .suppression-checksheet-intro { font-size: 0.83rem; line-height: 1.3; }
.log-page-suppression-checksheet-monthly .suppression-checksheet-title-row { font-size: 0.94rem; }
.log-page-suppression-checksheet-monthly .suppression-checksheet-intro { font-size: 0.83rem; line-height: 1.3; }
.log-table-suppression-checksheet { table-layout: fixed; font-size: 0.62rem; }
.log-table-suppression-checksheet th,
.log-table-suppression-checksheet td { font-size: 0.6rem; padding: 0.12rem 0.16rem; }
.log-table-suppression-checksheet td { height: 1.05rem; }
.log-table-suppression-checksheet-weekly td { height: 2.1rem; }
.log-table-suppression-checksheet-monthly td { height: 2.1rem; }
.log-table-suppression-checksheet .num-col { width: 5%; text-align: center; font-weight: bold; }
.log-table-suppression-checksheet th:nth-child(2),
.log-table-suppression-checksheet td:nth-child(2) { width: 37%; }
.log-table-suppression-checksheet th:nth-child(3),
.log-table-suppression-checksheet td:nth-child(3) { width: 19%; }
.log-table-suppression-checksheet th:nth-child(4),
.log-table-suppression-checksheet td:nth-child(4) { width: 19%; }
.log-table-suppression-checksheet th:nth-child(5),
.log-table-suppression-checksheet td:nth-child(5) { width: 20%; }
.suppression-checksheet-tvm { margin: 0.22rem 0 0 0; text-align: right; font-size: 0.62rem; font-style: italic; color: #444; }

/* Tűz- és füstgátló üzemeltetési napló */
.fsm-inventory-meta { margin-bottom: 0.45rem; }
.log-table-fsm-inventory { table-layout: fixed; font-size: 0.58rem; }
.log-table-fsm-inventory th,
.log-table-fsm-inventory td { font-size: 0.56rem; padding: 0.14rem 0.18rem; text-align: left; vertical-align: top; }
.log-table-fsm-inventory th { text-align: center; }
.log-table-fsm-inventory .num-col { width: 4%; text-align: center; }
.log-table-fsm-inventory th:nth-child(2),
.log-table-fsm-inventory td:nth-child(2) { width: 26%; }
.log-table-fsm-inventory th:nth-child(3),
.log-table-fsm-inventory td:nth-child(3) { width: 18%; }
.log-table-fsm-inventory th:nth-child(4),
.log-table-fsm-inventory td:nth-child(4) { width: 14%; }
.log-table-fsm-inventory th:nth-child(5),
.log-table-fsm-inventory td:nth-child(5) { width: 18%; }
.log-table-fsm-inventory th:nth-child(6),
.log-table-fsm-inventory td:nth-child(6) { width: 20%; }
.log-table-fsm-inventory .fsm-inventory-name { font-weight: bold; }
.log-table-fsm-maintenance th { font-size: 0.62rem; }
.log-page-fsm-checksheet .suppression-checksheet-intro li { font-size: 0.58rem; line-height: 1.28; margin-bottom: 0.12rem; }
#operation-log-print-root .log-page-fsm-monthly-form .section-fsm-monthly-form {
    padding: 0.45rem 0.5rem 0.55rem 0.7rem;
    box-sizing: border-box;
}
#operation-log-print-root .log-page-fsm-monthly-form .fsm-monthly-form-header {
    margin-bottom: 0.35rem;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}
#operation-log-print-root .log-page-fsm-monthly-form .log-table-container {
    padding-left: 0.2rem;
    padding-right: 0.15rem;
}
#operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-megallapitas {
    margin-top: 0.6rem;
    padding-left: 0.45rem;
    padding-right: 0.25rem;
    box-sizing: border-box;
}
#operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-question,
#operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-lines,
#operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-lines label,
#operation-log-print-root .log-page-fsm-monthly-form .fsm-monthly-notes-filled {
    padding-left: 0;
}
#operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-signatures {
    padding-left: 0.45rem;
    padding-right: 0.25rem;
    box-sizing: border-box;
}
#operation-log-print-root .log-page-fsm-monthly-form .fsm-monthly-signatures {
    display: block;
    max-width: 55%;
}
#operation-log-print-root .log-page-fsm-monthly-form .fsm-monthly-signatures .rwa-quarterly-sig {
    max-width: 100%;
}
.log-page-fsm-monthly-form .log-table-fsm-monthly-form td { font-size: 0.54rem; line-height: 1.22; text-align: left; }
.log-page-fsm-monthly-form .log-table-fsm-monthly-form th { font-size: 0.52rem; }
.log-page-fsm-monthly-form .fsm-monthly-notes-filled { font-size: 0.58rem; line-height: 1.35; margin: 0.15rem 0 0 0; text-align: left; }
.log-page-fsm-monthly-form .fsm-monthly-sig-line .daily-signature-img { max-height: 2.2rem; margin: 0; }

/* Napi ellenőrzések – 2 hónap 1 oldalra: Nap | Megf. | Név | Aláírás */
.section-daily-checks { margin-bottom: 0.4rem; flex: 1 1 auto; }
.section-daily-checks > .section-header {
    margin-bottom: 0.45rem;
}
.section-daily-checks > .daily-checks-two-col,
.section-daily-checks > table.daily-checks-two-col-pdf {
    margin-top: 0.35rem;
}
.daily-checks-two-col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.daily-month-block {
    border: 1px solid #333;
    padding: 0.5rem;
    padding-top: 0.55rem;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}
.daily-month-block .log-table-container {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}
.daily-month-title { font-size: 0.85rem; font-weight: bold; margin: 0 0 0.4rem 0; padding: 0; line-height: 1.2; }
.log-table-daily-checks { font-size: 0.65rem; table-layout: fixed; width: 100%; }
.log-table-daily-checks col.col-daily-nap { width: 5%; }
.log-table-daily-checks col.col-daily-megfelel { width: 9%; }
.log-table-daily-checks col.col-daily-nev { width: 38%; }
.log-table-daily-checks col.col-daily-alairas { width: 48%; }
.log-table-daily-checks th { font-size: 0.6rem; padding: 0.2rem 0.1rem; }
.log-table-daily-checks td { padding: 0.15rem 0.15rem; vertical-align: middle; }
.daily-date-cell {
    text-align: center;
    white-space: nowrap;
    font-size: 0.62rem;
    padding-left: 0.08rem;
    padding-right: 0.08rem;
}
.daily-megfelel-cell { text-align: center; padding: 0.05rem 0.08rem; }
/* Kitöltött MEGF./státusz: zöld ✓ / piros ×, keret nélkül (ne .checkbox-box) */
.oplog-status-mark {
    display: inline-block;
    border: none;
    background: transparent;
    font-size: 0.95rem;
    font-weight: bold;
    line-height: 1;
    color: #16a34a;
    vertical-align: middle;
}
.oplog-status-mark--fail {
    color: #dc2626;
    font-size: 1.05rem;
}
.log-table-daily-checks .daily-megfelel-cell .oplog-status-mark {
    font-size: 0.9rem;
}
.log-table-quarterly .quarterly-td-status .oplog-status-mark {
    font-size: 1rem;
}
/* Üres MEGF.: kis négyzet; kitöltött: a .oplog-status-mark */
.log-table-daily-checks .daily-megfelel-cell .checkbox-box-sm {
    width: auto;
    height: auto;
    min-width: 0.75rem;
    min-height: 0.75rem;
    border: none;
    background: transparent;
    vertical-align: middle;
    position: relative;
}
.log-table-daily-checks .daily-megfelel-cell .checkbox-box--empty {
    width: 0.7rem;
    height: 0.7rem;
    border: 1px solid #999;
    background: #fff;
}
.log-table-daily-checks .daily-megfelel-cell .checkbox-box__mark {
    position: static;
    transform: none;
    display: inline-block;
    font-size: 0.85rem;
    line-height: 1;
    color: #16a34a;
}
.log-table-daily-checks .daily-megfelel-cell .checkbox-box--fail .checkbox-box__mark {
    color: #dc2626;
    font-size: 0.9rem;
}
.daily-nev-cell {
    font-size: 0.62rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 0.2rem;
    padding-right: 0.15rem;
}
.daily-alairas-cell {
    text-align: center;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
}

/* Rendkívüli karbantartási lap – kompakt, egy oldalra, ne törjön 2 oldalra */
.log-page-rendkivuli { padding: 0.4rem; min-height: auto; page-break-inside: avoid; break-inside: avoid; }
.log-page-rendkivuli .naplo-header-compact { margin-bottom: 0.4rem; padding-bottom: 0.25rem; }
.log-page-rendkivuli .naplo-header-compact h1 { font-size: 1rem; }
.log-page-rendkivuli .naplo-logo-compact { height: 32px; }
.section-compact { margin-bottom: 0.4rem; }
.log-page-rendkivuli .section-compact { border: none; }
.log-page-rendkivuli .section-header-compact { border-bottom: none; }
.section-header-compact { padding: 0.25rem; }
.section-header-compact h2 { font-size: 0.8rem; }
.info-grid-compact .info-item label, .info-grid-compact .info-item .value { font-size: 0.7rem; padding: 0.2rem 0.35rem; }
/* Rendkívüli felső táblázat – nyomtatásra optimalizált */
.log-table-rendkivuli-top { width: 100%; border-collapse: collapse; font-size: 0.75rem; }
.log-table-rendkivuli-top th, .log-table-rendkivuli-top td { border: 1px solid #333; padding: 0.35rem 0.5rem; vertical-align: middle; }
.log-table-rendkivuli-top thead th { background: #f0f0f0; font-weight: bold; text-align: center; }
.rendkivuli-th-left { width: 55%; }
.rendkivuli-th-right { width: 45%; }
.rendkivuli-td-label { width: 28%; font-weight: bold; background: #f8f8f8; }
.rendkivuli-td-value { width: 27%; }
.rendkivuli-td-checkboxes { width: 45%; vertical-align: top; padding: 0.25rem 0.35rem; text-align: left !important; }
.value-dotted-inline { display: block; border-bottom: 1px dotted #333; min-height: 1.4rem; }
.rendkivuli-reasons-pdf { width: 100%; border-collapse: collapse; }
.rendkivuli-reason-line { font-size: 0.65rem; font-weight: normal; padding: 0.15rem 0.35rem 0.25rem 0.35rem; border-bottom: 1px dotted #333; height: 1.35rem; vertical-align: middle; text-align: left !important; }
/* .log-table td center felülírása a beágyazott ok-listán */
.log-table.log-table-rendkivuli-top td.rendkivuli-td-checkboxes,
.log-table.log-table-rendkivuli-top .rendkivuli-reasons-pdf td,
.log-table.log-table-rendkivuli-top td.rendkivuli-reason-line {
    text-align: left !important;
}
.checkbox-box-sm { width: 1rem; height: 1rem; }
.rendkivuli-writing-block { width: 100%; border-collapse: collapse; margin: 0.2rem 0 0.25rem 0; }
.rendkivuli-writing-line { border-bottom: 1px dotted #333; min-height: 1.5rem; height: 1.5rem; padding: 0 0.35rem 0.15rem 0.35rem; vertical-align: bottom; }
/* TÉVES JELZÉSEK: keretek nélkül, csak szaggatott vonal; magasabb cellák */
.log-page-rendkivuli .log-table-rendkivuli { border: none; }
.log-page-rendkivuli .log-table-rendkivuli th,
.log-page-rendkivuli .log-table-rendkivuli td { border: none; border-bottom: 1px dotted #333; }
.log-page-rendkivuli .log-table-rendkivuli .megjegyzes-cell-rendkivuli { min-height: 1.3rem; vertical-align: top; }
.log-table-rendkivuli-compact { font-size: 0.6rem; }
.log-table-rendkivuli-compact th, .log-table-rendkivuli-compact td { padding: 0.2rem 0.25rem; font-size: 0.6rem; min-height: 1.2rem; }
.log-page-rendkivuli .log-table-rendkivuli-compact tbody td { min-height: 1.3rem; height: 1.3rem; vertical-align: top; }
.rendkivuli-signatures-pdf { width: 100%; border-collapse: collapse; margin-top: 0.5rem; }
.rendkivuli-sig-cell { width: 50%; text-align: center; vertical-align: top; padding: 0.25rem 0.75rem; }
.rendkivuli-sig-cell .sig-line { border-bottom: 1px dotted #333; min-height: 1.2rem; margin-bottom: 0.15rem; }
.rendkivuli-sig-cell span { font-size: 0.65rem; font-style: italic; }
.naplo-footer-compact { padding: 0.35rem; }
.naplo-footer { background: #f0f0f0; padding: 0.6rem; margin-top: auto; border-top: 1px solid #000; color: #000; }
.footer-legal { color: #000; }
.footer-legal p { font-weight: bold; margin-bottom: 0.4rem; font-size: 0.8rem; color: #000; }
.footer-legal ul { list-style: none; padding-left: 0; margin: 0; font-size: 0.75rem; color: #000; }
.footer-legal li { color: #000; }
.naplo-footer-credit { color: #000; }
@media print {
    .operation-print-inner { max-width: none; }
    body.operation-log-print-page,
    #operation-log-print-root,
    #operation-log-print-root .operation-log-content,
    #operation-log-print-root .log-page { background: white; color: #000; }
    /* Csatolt jegyzőkönyv: olvashatóbb szövegméret */
    .log-page-maintenance-attach { padding: 0; margin-top: 0; }
    .log-page-maintenance-attach .maintenance-document { max-width: none; padding: 0 0 20px 0; font-size: 12px; line-height: 1.3; }
    .log-page-maintenance-attach .document-header { margin-bottom: 6px; padding-bottom: 4px; }
    .log-page-maintenance-attach .document-title h2 { font-size: 16px; margin: 0 0 4px 0; }
    .log-page-maintenance-attach .company-logo { height: 53px; max-width: 165px; }
    .log-page-maintenance-attach .company-info p, .log-page-maintenance-attach .document-info,
    .log-page-maintenance-attach .document-info p, .log-page-maintenance-attach .regulation-ref { font-size: 10.5px; }
    .log-page-maintenance-attach .maintenance-info-container { gap: 6px; margin-bottom: 6px; }
    .log-page-maintenance-attach .maintenance-info-section { margin-bottom: 0; }
    .log-page-maintenance-attach .maintenance-info-table { font-size: 10.5px; }
    .log-page-maintenance-attach .maintenance-info-table th,
    .log-page-maintenance-attach .maintenance-info-table td { padding: 3px 6px; font-size: 10.5px; }
    .log-page-maintenance-attach .maintenance-time-footnote { font-size: 9px; color: #374151; }
    .log-page-maintenance-attach .section,
    .log-page-maintenance-attach .checklist-table-section { margin-bottom: 6px; }
    .log-page-maintenance-attach .section h3,
    .log-page-maintenance-attach .checklist-table-section h3 { font-size: 13px; margin: 0 0 6px 0; }
    .log-page-maintenance-attach .info-grid-compact { gap: 4px 10px; margin: 4px 0; }
    .log-page-maintenance-attach .info-grid-compact .info-item label,
    .log-page-maintenance-attach .info-grid-compact .info-item span { font-size: 11px; }
    /* Ellenőrzési pontok táblázat – olvashatóbb */
    .log-page-maintenance-attach .checklist-table-print-split { font-size: 11px; margin: 6px 0; }
    .log-page-maintenance-attach .checklist-table-print-split th,
    .log-page-maintenance-attach .checklist-table-print-split td { padding: 4px 6px; font-size: 11px; line-height: 1.3; }
    .log-page-maintenance-attach .checklist-table-print-split th { font-size: 11.5px; }
    .log-page-maintenance-attach .checklist-table { font-size: 10px; margin: 6px 0; }
    .log-page-maintenance-attach .checklist-table th, .log-page-maintenance-attach .checklist-table td { padding: 3px 5px; font-size: 10px; line-height: 1.25; }
    .log-page-maintenance-attach .notes-box { font-size: 10px; padding: 6px 8px; }
    .log-page-maintenance-attach .signature-table td { font-size: 11px; }
    .log-page-maintenance-attach .tapasztalatok-megjegyzesek-section h3 { font-size: 11px; }
    .log-page-maintenance-attach--error .operation-log-attach-error-msg {
        margin: 0.75rem 0 0 0;
        padding: 0.75rem 1rem;
        border: 1px solid #b91c1c;
        background: #fef2f2;
        color: #991b1b;
        font-size: 0.85rem;
        line-height: 1.4;
    }
    /* Csatolt jegyzőkönyv: ugyanúgy tagolva mint maintenance_view – OTSZ/tűzjelző 1. rész, majd 2. rész + tapasztalatok */
    .log-page-maintenance-attach .checklist-table-part-1 { page-break-after: always; break-after: page; }
    .log-page-maintenance-attach .maintenance-doc-fire .tapasztalatok-megjegyzesek-section,
    .log-page-maintenance-attach .maintenance-doc-suppression .tapasztalatok-megjegyzesek-section { page-break-before: auto; break-before: auto; margin-top: 4px; }
    /* Csak a főoldal header/nav/footer – NE a napló header! */
    body.operation-log-print-page .no-print,
    body.operation-log-print-page .operation-print-toolbar,
    body.operation-log-print-page > header,
    body.operation-log-print-page > nav,
    body.operation-log-print-page > footer,
    body.operation-log-print-page .user-menu { display: none; }
    body.operation-log-print-page main { padding: 0; margin: 0; max-width: none; }
    .operation-print-content { padding: 0; }
    .log-page { page-break-after: always; min-height: auto; padding: 0.4rem; }
    .log-page:last-child { page-break-after: auto; }
    /* A4 nyomtatási terület ≈ 277mm magas (@page 1cm margó); borító kitölti */
    .log-page-cover {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        min-height: 277mm;
        height: 277mm;
        max-height: 277mm;
        padding: 0 !important;
        margin-bottom: 0 !important;
        box-sizing: border-box;
    }
    .log-page-cover-frame {
        min-height: 265mm;
        height: 265mm;
        padding: 16mm 12mm 18mm;
        border: 2px solid #000;
    }
    .log-page-cover-brand { margin-bottom: 14mm; }
    .log-page-cover-logo {
        height: 28mm;
        max-width: 85mm;
    }
    .log-page-cover-company {
        margin-top: 4mm;
        font-size: 13pt;
    }
    .log-page-cover-title { font-size: 16pt; margin-bottom: 12mm; }
    .log-page-cover-location { font-size: 11pt; margin-bottom: 14mm; }
    .log-page-cover-meta { font-size: 10pt; }
    .log-page-cover-row-lezaras th,
    .log-page-cover-row-lezaras td { padding-top: 1.2em; }
    .naplo-header { flex-shrink: 0; }
    .table-note { font-size: 0.55rem; color: #000; }
.naplo-header, .naplo-header h1, .naplo-header p, .section-header, .section-header h2, .section-subtitle,
    .info-item label, .info-item .value, .system-header h3, .equipment-item,
    .log-table th, .log-table td, .log-table-rendkivuli-top th, .log-table-rendkivuli-top td, .naplo-footer, .footer-legal, .footer-legal p, .footer-legal ul, .footer-legal li,
    .naplo-credit, .naplo-footer-credit, .jelszo-warning, .personnel-table-title { color: #000; }
    .naplo-footer { background: #f0f0f0; -webkit-print-color-adjust: exact; print-color-adjust: exact; flex-shrink: 0; }
    #operation-log-print-root .log-page .naplo-footer { margin-top: 0.75rem; }
    @page { size: A4; margin: 1cm; }
    * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    /* A4-re illesztés: kompaktabb méretek */
    .naplo-header { margin-bottom: 0.4rem; padding-bottom: 0.3rem; }
    .naplo-header h1 { font-size: 1rem; }
    .naplo-header p { font-size: 0.65rem; margin: 0 0 0.1rem 0; }
    .naplo-logo { height: 36px; }
    .section { margin-bottom: 0.5rem; }
    .section-header { padding: 0.3rem; }
    .section-header h2 { font-size: 0.8rem; }
    .section-subtitle { font-size: 0.6rem; margin-top: 0.1rem; }
    .info-item label, .info-item .value { font-size: 0.65rem; padding: 0.25rem 0.35rem; }
    #operation-log-print-root .systems-grid { display: block; width: 100%; border-radius: 0; }
    #operation-log-print-root .system-card { width: 100%; max-width: none; border-radius: 0; }
    #operation-log-print-root .section,
    #operation-log-print-root .section-header,
    #operation-log-print-root .system-header,
    #operation-log-print-root .equipment-grid { border-radius: 0; }
    .system-header h3 { font-size: 0.65rem; }
    .equipment-grid { font-size: 0.55rem; gap: 0.1rem 0.5rem; grid-template-columns: repeat(3, 1fr); }
    #operation-log-print-root .equipment-item { padding: 0.1rem 0 0.1rem 0.5rem; border-left: none; border-radius: 0; background: transparent; }
    .equipment-item .eq-detail { font-size: 0.5rem; }
    .equipment-item-manual { min-height: 9mm; }
    .equipment-item-empty { min-height: 11mm; }
    .log-table-container { padding: 0.25rem; }
    .log-table { font-size: 0.6rem; }
    .log-table th { font-size: 0.55rem; padding: 0.15rem 0.1rem; line-height: 1.2; }
    .log-table td { font-size: 0.55rem; padding: 0.15rem 0.1rem; line-height: 1.2; }
    /* Kézírásra: nagyobb cellák nyomtatáskor is (A4-en van hely) */
    .log-table-writeable th { font-size: 0.75rem; padding: 0.4rem 0.35rem; }
    .log-table-writeable td { font-size: 0.75rem; padding: 0.5rem 0.4rem; min-height: 8mm; height: 8mm; }
    .log-table-personnel th { font-size: 0.65rem; }
    .log-table-personnel td { font-size: 0.7rem; min-height: 6mm; }
    .personnel-table-title { font-size: 0.85rem; }
    .checkbox-box { width: 1rem; height: 1rem; }
    .quarterly-otsz-checklist-intro { font-size: 0.5rem; margin-bottom: 0.15rem; }
    .quarterly-otsz-checklist-cols { gap: 4mm; }
    .quarterly-otsz-checklist-ul { font-size: 0.48rem; padding-left: 3.5mm; line-height: 1.28; }
    .quarterly-otsz-checklist-ul li { margin-bottom: 0.06rem; }
    .log-table-quarterly th, .log-table-quarterly td { font-size: 0.5rem; padding: 0.15rem 0.1rem; }
    .log-table-quarterly .megjegyzes-cell { min-height: 32mm; height: auto; padding: 0.25rem 0.35rem; }
    .quarterly-fill-value-cell { min-height: 6mm; height: 6mm; }
    .quarterly-fill-value-cell--signature { min-height: 9mm; height: 9mm; }
    .log-table-rwa-quarterly th, .log-table-rwa-quarterly td { font-size: 0.5rem; padding: 0.15rem 0.1rem; }
    .rwa-quarterly-line { min-height: 6mm; }
    .rwa-quarterly-sig-line { min-height: 10mm; }
    #operation-log-print-root .log-page-fsm-monthly-form .section-fsm-monthly-form {
        padding: 2mm 2.5mm 3mm 4mm !important;
    }
    #operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-megallapitas,
    #operation-log-print-root .log-page-fsm-monthly-form .rwa-quarterly-signatures,
    #operation-log-print-root .log-page-fsm-monthly-form .fsm-monthly-form-header {
        padding-left: 2.5mm !important;
        padding-right: 1.5mm !important;
    }
    /* Heti ellenőrzés: kompakt nyomtatás – 3 blokk egy oldalra (középút) */
    .log-page-suppression-weekly { padding: 0.3rem; }
    .log-page-suppression-weekly .naplo-header-compact { margin-bottom: 0.25rem; padding-bottom: 0.2rem; }
    .log-page-suppression-weekly .section-suppression-weekly { margin-bottom: 0.2rem; }
    .log-page-suppression-weekly .suppression-weekly-block { padding: 0.35rem; margin-bottom: 0.4rem; }
    .log-page-suppression-weekly .suppression-weekly-header { padding: 0.3rem 0.35rem; }
    .log-page-suppression-weekly .suppression-weekly-field label { font-size: 0.7rem; }
    .log-page-suppression-weekly .suppression-weekly-field .value-dotted { min-height: 1rem; }
    .log-page-suppression-weekly .suppression-weekly-questions { padding: 0.25rem 0; }
    .log-page-suppression-weekly .suppression-weekly-row { margin-bottom: 0.28rem; }
    .log-page-suppression-weekly .suppression-weekly-q label { font-size: 0.68rem; margin-bottom: 0.12rem; }
    .log-page-suppression-weekly .suppression-weekly-megjegyzes { margin-top: 0.28rem; }
    .log-page-suppression-weekly .suppression-weekly-megjegyzes label { font-size: 0.65rem; margin-bottom: 0.12rem; }
    .suppression-weekly-line { min-height: 5mm; margin-bottom: 0.12rem; }
    .log-page-suppression-weekly .suppression-weekly-sig { margin-top: 0.3rem; padding-top: 0.2rem; }
    .log-page-suppression-weekly .suppression-weekly-sig label { font-size: 0.65rem; margin-bottom: 0.12rem; }
    .suppression-weekly-sig-line { min-height: 8mm; }
    .suppression-monthly-line { min-height: 6mm; }
    .suppression-monthly-sig-line { min-height: 10mm; }
    /* Havi: 2 blokk egy oldalra – kompakt */
    .log-page-suppression-monthly { padding: 0.3rem; }
    .log-page-suppression-monthly .suppression-monthly-block { padding: 0.35rem; margin-bottom: 0.4rem; }
    .log-page-suppression-monthly .suppression-monthly-block:last-child { margin-bottom: 0; }
    .log-page-suppression-monthly .suppression-monthly-header { padding: 0.25rem 0.3rem; }
    .log-page-suppression-monthly .suppression-monthly-grid { padding: 0.2rem 0; }
    .log-page-suppression-monthly .suppression-monthly-row { margin-bottom: 0.25rem; }
    .log-page-suppression-monthly .suppression-monthly-q label { font-size: 0.6rem; }
    .log-page-suppression-monthly .suppression-monthly-megjegyzes { margin-top: 0.3rem; }
    .log-page-suppression-monthly .suppression-monthly-line { min-height: 4mm; margin-bottom: 0.1rem; }
    .log-page-suppression-monthly .suppression-monthly-sig { margin-top: 0.3rem; padding-top: 0.15rem; }
    .log-page-suppression-monthly .suppression-monthly-sig-line { min-height: 7mm; }
    .log-page-suppression-checksheet { padding: 0.32rem; }
    .log-page-suppression-checksheet .section-suppression-checksheet { margin-bottom: 0.2rem; }
    .log-page-suppression-checksheet .suppression-checksheet-meta th,
    .log-page-suppression-checksheet .suppression-checksheet-meta td { font-size: 0.62rem; padding: 0.12rem 0.22rem; }
    .log-page-suppression-checksheet .suppression-checksheet-title-row { font-size: 0.64rem; margin: 0.2rem 0 0.14rem 0; }
    .log-page-suppression-checksheet .suppression-checksheet-intro { font-size: 0.56rem; line-height: 1.22; margin-bottom: 0.16rem; }
    .log-page-suppression-checksheet-weekly .suppression-checksheet-title-row { font-size: 0.83rem; }
    .log-page-suppression-checksheet-weekly .suppression-checksheet-intro { font-size: 0.73rem; line-height: 1.26; }
    .log-page-suppression-checksheet-monthly .suppression-checksheet-title-row { font-size: 0.83rem; }
    .log-page-suppression-checksheet-monthly .suppression-checksheet-intro { font-size: 0.73rem; line-height: 1.26; }
    .log-page-suppression-checksheet .log-table-suppression-checksheet th,
    .log-page-suppression-checksheet .log-table-suppression-checksheet td { font-size: 0.54rem; padding: 0.08rem 0.1rem; }
    .log-page-suppression-checksheet .log-table-suppression-checksheet td { height: 0.9rem; }
    .log-page-suppression-checksheet .log-table-suppression-checksheet-weekly td { height: 1.8rem; }
    .log-page-suppression-checksheet .log-table-suppression-checksheet-monthly td { height: 1.8rem; }
    .training-brief-grid { gap: 0.35rem; margin-bottom: 0.3rem; }
    .training-brief-col { padding: 0.2rem 0.3rem; }
    .training-brief-title { font-size: 0.62rem; margin-bottom: 0.12rem; }
    .training-brief-col h4 { font-size: 0.62rem; margin-bottom: 0.12rem; }
    .training-brief-col li,
    .training-brief-list li { font-size: 0.54rem; line-height: 1.18; margin-bottom: 0.06rem; }
    .log-table-oktatas-detailed th { font-size: 0.58rem; font-weight: bold; }
    .log-table-oktatas-detailed th .sub-th { font-size: 0.58rem; font-weight: bold; margin-top: 0; }
    #operation-log-print-root .log-table.log-table-oktatas-detailed {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    #operation-log-print-root .log-table.log-table-writeable.log-table-oktatas-detailed tbody tr { min-height: 0; height: auto; }
    #operation-log-print-root .log-table.log-table-writeable.log-table-oktatas-detailed tbody td {
        height: 1.82rem;
        min-height: 1.82rem;
        padding-top: 0.18rem;
        padding-bottom: 0.18rem;
    }
    #operation-log-print-root .log-table.log-table-writeable.log-table-oktatas-detailed tbody td[rowspan="2"] {
        height: 3.64rem;
        min-height: 3.64rem;
        vertical-align: middle;
    }
    #operation-log-print-root .log-table-oktatas-detailed td.signature-cell {
        padding: 0.12rem 0.18rem !important;
        overflow: hidden;
    }
    #operation-log-print-root .log-table-oktatas-detailed .training-sig-img {
        max-height: 3.1rem;
        width: 100%;
        box-sizing: border-box;
    }
    .log-page-suppression-checksheet .suppression-checksheet-tvm { font-size: 0.56rem; margin-top: 0.12rem; }
    /* Napi ellenőrzések – nyomtatás: kompakt, egy oldalra */
    .log-page-daily-checks { padding: 0.15rem; }
    .log-page-daily-checks .naplo-header-compact { margin-bottom: 0.25rem; padding-bottom: 0.15rem; }
    .section-daily-checks { margin-bottom: 0.15rem; }
    .section-daily-checks > .section-header { margin-bottom: 0.2rem; padding: 0.2rem 0.35rem; }
    .section-daily-checks > .daily-checks-two-col,
    .section-daily-checks > table.daily-checks-two-col-pdf { margin-top: 0.15rem; }
    .daily-checks-two-col { gap: 0.4rem; }
    .daily-month-block { padding: 0.25rem 0.25rem 0.2rem; }
    .daily-month-title { font-size: 0.75rem; margin-bottom: 0.2rem; }
    .log-table-daily-checks { font-size: 0.52rem; }
    .log-table-daily-checks th,
    .log-table-daily-checks tbody td { padding: 0.05rem 0.1rem; }
    .log-table-daily-checks tbody tr {
        height: 5mm;
        max-height: 5mm;
    }
    .log-table-daily-checks tbody td {
        vertical-align: middle;
        line-height: 1.05;
    }
    .log-table-daily-checks .daily-megfelel-cell .checkbox-box--empty {
        width: 2.6mm;
        height: 2.6mm;
    }
    .log-table-daily-checks .daily-megfelel-cell .checkbox-box__mark {
        font-size: 7pt;
    }
    .log-table-daily-checks .daily-signature-img {
        max-height: 3.8mm;
        max-width: 28mm;
        width: auto;
    }
    .daily-sig-line { font-size: 0.5rem; margin-bottom: 0.05rem; }
    .daily-sig-dotted { min-height: 4mm; }
    .log-page-rendkivuli { padding: 0.2rem; }
    .log-page-rendkivuli .section-compact { margin-bottom: 0.25rem; }
    .log-page-rendkivuli .section-header-compact { padding: 0.15rem; }
    .log-page-rendkivuli .section-header-compact h2 { font-size: 0.65rem; }
    .log-table-rendkivuli-top th, .log-table-rendkivuli-top td { padding: 0.25rem 0.35rem; font-size: 0.7rem; }
    .log-table.log-table-rendkivuli-top td.rendkivuli-td-checkboxes,
    .log-table.log-table-rendkivuli-top .rendkivuli-reasons-pdf td,
    .log-table.log-table-rendkivuli-top td.rendkivuli-reason-line {
        text-align: left !important;
    }
    .log-page-rendkivuli .value-dotted-inline { min-height: 6mm; }
    .log-page-rendkivuli .rendkivuli-writing-line { min-height: 7mm; height: 7mm; padding: 0 1.5mm 0.8mm 1.5mm; }
    .log-page-rendkivuli .log-table-rendkivuli-compact th, .log-page-rendkivuli .log-table-rendkivuli-compact td { font-size: 0.5rem; padding: 0.15rem 0.2rem; min-height: 6mm; }
    .log-page-rendkivuli .log-table-rendkivuli-compact tbody td { min-height: 6mm; height: 6mm; }
    .log-page-rendkivuli .megjegyzes-cell-rendkivuli { min-height: 6mm; }
    .log-page-rendkivuli .rendkivuli-sig-cell .sig-line { min-height: 8mm; }
    .log-page-rendkivuli .section-compact { margin-bottom: 0.15rem; }
    .log-page-rendkivuli { page-break-inside: avoid; }
    .yn-cell { font-size: 0.5rem; }
    .naplo-footer { padding: 0.35rem; }
    .footer-legal p, .footer-legal ul { font-size: 0.6rem; margin-bottom: 0.2rem; }
}

/* Csatolt oltórendszer Karbantartási Jegyzőkönyv (maintenance_view beágyazva): keskeny „Állapot” – ez a blokk legyen utolsó a kaskádban.
   A main.css / korábbi @media print szabályok közül néhol van width !important; a normál inline width ezért nem elég.
   Csak a suppression-status-fixed-table táblákra; !important kizárólag width/min/max/col. */
#operation-log-print-root .log-page-maintenance-attach table.checklist-table.suppression-status-fixed-table {
    table-layout: fixed !important;
    width: 100% !important;
}
#operation-log-print-root .log-page-maintenance-attach table.checklist-table.suppression-status-fixed-table col:first-child {
    width: calc(100% - 34px) !important;
}
#operation-log-print-root .log-page-maintenance-attach table.checklist-table.suppression-status-fixed-table col:nth-child(2) {
    width: 34px !important;
}
#operation-log-print-root .log-page-maintenance-attach table.checklist-table.suppression-status-fixed-table th:nth-child(2),
#operation-log-print-root .log-page-maintenance-attach table.checklist-table.suppression-status-fixed-table td:nth-child(2),
#operation-log-print-root .log-page-maintenance-attach table.checklist-table.suppression-status-fixed-table td.checklist-table-td-data {
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    box-sizing: border-box;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}


/* ========== tig.css ========== */

.tig-form {
    margin-top: 0;
}

.tig-form-section-title {
    margin: 1.35rem 0 0.85rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid #e2e8f0;
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 700;
}

.tig-form-section-title:first-of-type {
    margin-top: 0.35rem;
}

.tig-task-meta {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 14px;
    margin: 0 0 1.1rem;
}

.tig-task-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px 14px;
}

.tig-meta-item {
    font-size: 13px;
    line-height: 1.4;
    color: #0f172a;
}

.tig-meta-label {
    color: #6b7280;
    font-weight: 600;
    display: block;
    margin-bottom: 2px;
}

.tig-form-block {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}

.tig-form-block > .form-group {
    margin-bottom: 1rem;
}

.tig-grid-main {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.tig-grid-single {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.tig-full-width {
    grid-column: 1 / -1;
}

.tig-full-select {
    width: 100%;
}

.tig-help {
    color: #6b7280;
    font-size: 0.78rem;
}

.tig-amount-preview {
    color: #374151;
    font-size: 0.82rem;
    font-weight: 600;
    margin-top: 4px;
}

.tig-section-spacer {
    margin-top: 14px;
}

.tig-form-actions {
    margin-top: 14px;
}

.tig-delete-modal-content {
    max-width: 450px;
}

.tig-delete-modal-body p {
    margin-bottom: 12px;
}

.tig-delete-modal-body .tig-delete-target {
    margin-bottom: 16px;
    font-weight: 500;
}

.tig-delete-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.tig-delete-confirm {
    background: #dc2626;
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
}

.tig-delete-cancel {
    padding: 10px 20px;
}

.tig-email-modal-content {
    max-width: 520px;
}

.tig-email-field {
    margin-bottom: 14px;
}

.tig-email-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 8px;
}

.tig-email-target {
    margin-bottom: 14px;
}

.tig-col-toggle {
    width: 44px;
}

.tig-row-toggle {
    border: none;
    background: #f1f5f9;
    border-radius: 8px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #475569;
    padding: 0;
}

.tig-row-toggle:hover {
    background: #e2e8f0;
}

.tig-row-toggle[aria-expanded="true"] .material-symbols-outlined {
    transform: rotate(180deg);
}

.tig-row-toggle .material-symbols-outlined {
    transition: transform 0.2s ease;
    font-size: 22px;
}

.tig-row-extra td {
    background: #f8fafc;
    padding: 14px 16px !important;
    font-size: 0.9rem;
    color: #475569;
    border-bottom: 1px solid #e2e8f0;
    vertical-align: top;
}

.tig-extra-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.tig-extra-section h4 {
    margin: 0 0 8px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    font-weight: 700;
}

.tig-extra-fields {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px 20px;
    align-items: start;
}

.tig-extra-item strong {
    display: block;
    color: #334155;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 4px;
}

.tig-extra-item {
    font-size: 0.88rem;
    line-height: 1.4;
}

.tig-extra-block {
    grid-column: 1 / -1;
}

.tig-extra-text {
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 180px;
    overflow-y: auto;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.85rem;
    line-height: 1.45;
    margin-top: 2px;
}

.tig-mobile-details {
    margin-top: 10px;
    border-top: 1px solid #e2e8f0;
    padding-top: 10px;
}

.tig-mobile-details > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748b;
}

.tig-mobile-details > summary::-webkit-details-marker {
    display: none;
}

.tig-mobile-details[open] > summary .tig-chevron-sm {
    transform: rotate(180deg);
}

.tig-mobile-details .tig-chevron-sm {
    transition: transform 0.2s ease;
    font-size: 20px;
}

.tig-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.6rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 700;
    margin-top: 4px;
}

.tig-status-draft {
    background: #f3f4f6;
    color: #374151;
}

.tig-status-sent {
    background: rgba(245, 158, 11, 0.16);
    color: #92400e;
}

.tig-status-signed {
    background: rgba(16, 185, 129, 0.15);
    color: #065f46;
}

/* TIG űrlap: kereshető ügyfél/helyszín (Safari / iOS: keresőmező ne kapjon felesleges autoformatálást) */
.tig-field-label {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
    color: #334155;
}

.tig-sublabel {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 6px;
}

.tig-custom-manual-wrap {
    margin-top: 8px;
}

.tig-form .searchable-select-search {
    -webkit-appearance: none;
    appearance: none;
    font-size: 16px; /* iOS zoom elkerülése fókusznál */
}


/* ========== kiszervezve: pages/quote_documents.php ========== */
.quote-filters-collapsible { margin-bottom: 1rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
    .quote-filters-collapsible > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px; padding:12px 14px; font-weight:600; color:#334155; user-select:none; }
    .quote-filters-collapsible > summary::-webkit-details-marker { display:none; }
    .quote-filters-collapsible > summary .quote-chevron { transition: transform .2s ease; color:#64748b; font-size:22px; }
    .quote-filters-collapsible[open] > summary .quote-chevron { transform: rotate(180deg); }
    .quote-filters-collapsible-body { padding:0 14px 14px; border-top:1px solid #f1f5f9; }
    .quote-status-badge {
        display: inline-flex;
        align-items: center;
        padding: 0.22rem 0.6rem;
        border-radius: 999px;
        font-size: 0.74rem;
        font-weight: 700;
        margin-top: 4px;
    }
    .quote-status-draft { background: #f3f4f6; color: #374151; }
    .quote-status-sent { background: rgba(245, 158, 11, 0.16); color: #92400e; }
    .quote-status-notified { background: rgba(59, 130, 246, 0.14); color: #1d4ed8; }
    .quote-status-ordered { background: rgba(16, 185, 129, 0.16); color: #047857; }
    .mobile-card-view { display: none; }
    @media (max-width: 768px) {
        .desktop-table-view { display: none; }
        .mobile-card-view { display: grid; }
    }
    .quote-view-modal-content { max-width: 880px; }
    .quote-view-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; margin-bottom: 14px; }
    .quote-view-meta .qv-row { display: flex; flex-direction: column; gap: 2px; }
    .quote-view-meta .qv-label { font-size: 0.75rem; font-weight: 600; color: #64748b; text-transform: uppercase; letter-spacing: 0.02em; }
    .quote-view-meta .qv-value { font-size: 0.95rem; color: #0f172a; word-break: break-word; }
    .quote-view-note { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 10px 12px; margin-bottom: 14px; white-space: pre-wrap; color: #334155; }
    .quote-view-lines { width: 100%; border-collapse: collapse; margin-bottom: 12px; }
    .quote-view-lines th, .quote-view-lines td { padding: 8px 10px; border-bottom: 1px solid #e2e8f0; font-size: 0.9rem; }
    .quote-view-lines thead th { background: #f1f5f9; font-weight: 600; color: #334155; text-align: left; }
    .quote-view-lines td.qv-num, .quote-view-lines th.qv-num { text-align: right; white-space: nowrap; }
    .quote-view-totals { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; margin-top: 6px; }
    .quote-view-totals .qv-total-row { display: flex; gap: 14px; min-width: 280px; justify-content: space-between; font-size: 0.92rem; color: #334155; }
    .quote-view-totals .qv-total-row.qv-grand { font-size: 1.05rem; font-weight: 700; color: #0f172a; border-top: 1px solid #e2e8f0; padding-top: 6px; margin-top: 4px; }
    .quote-view-empty-lines { color: #94a3b8; font-style: italic; padding: 12px 4px; }
    .quote-notified-via-options { display: flex; flex-wrap: wrap; gap: 14px 20px; margin-top: 6px; }
    .quote-notified-via-options label { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; color: #334155; cursor: pointer; }
    .quote-notified-via-options input { width: 18px; height: 18px; }
    @media (max-width: 640px) {
        .quote-view-meta { grid-template-columns: 1fr; }
        .quote-view-lines th, .quote-view-lines td { padding: 6px 6px; font-size: 0.85rem; }
    }


/* ========== kiszervezve: pages/tig_documents.php ========== */
.tig-page-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 1rem;
}
.tig-page-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #475569;
    text-decoration: none;
    font-weight: 600;
    line-height: 1.2;
    box-sizing: border-box;
}
.tig-page-tab .material-symbols-outlined {
    font-size: 20px;
    line-height: 1;
}
.tig-page-tab:hover {
    border-color: #cbd5e1;
    color: #1e293b;
}
.tig-page-tab.is-active {
    background: #0f766e;
    border-color: #0f766e;
    color: #fff;
}
@media (max-width: 768px) {
    .tig-page-tabs {
        gap: 8px;
        flex-wrap: nowrap;
    }
    .tig-page-tab {
        flex: 1 1 0;
        min-width: 0;
        padding: 12px 8px;
        height: 48px;
        font-size: 14px;
        white-space: nowrap;
        overflow: hidden;
    }
}
.tig-quote-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
}
.tig-quote-badge-yes { background: #dbeafe; color: #1d4ed8; }
.tig-quote-badge-no { background: #fef3c7; color: #b45309; }
.tig-filters-collapsible { margin-bottom: 1rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.tig-filters-collapsible > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    font-weight: 600;
    color: #334155;
    user-select: none;
}
.tig-filters-collapsible > summary::-webkit-details-marker { display: none; }
.tig-filters-collapsible > summary .tig-chevron { transition: transform 0.2s ease; color: #64748b; font-size: 22px; }
.tig-filters-collapsible[open] > summary .tig-chevron { transform: rotate(180deg); }
.tig-filters-collapsible-body { padding: 0 14px 14px; border-top: 1px solid #f1f5f9; }

.tig-form-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1.25rem 0 1rem;
    padding: 0.4rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}
.tig-form-tab {
    flex: 1 1 140px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: 1px solid transparent;
    background: transparent;
    color: #64748b;
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.7rem 1rem;
    border-radius: 9px;
    cursor: pointer;
}
.tig-form-tab .material-symbols-outlined { font-size: 20px; }
.tig-form-tab:hover { color: #1d4ed8; background: #eff6ff; }
.tig-form-tab.is-active {
    color: #1e40af;
    background: #fff;
    border-color: #bfdbfe;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}
.tig-form-tab-hint {
    font-size: 0.75rem;
    font-weight: 500;
    color: #94a3b8;
}
.tig-form-tab.is-active .tig-form-tab-hint { color: #64748b; }
.tig-tab-panel[hidden] { display: none !important; }
.tig-tab-panel:not(.is-active) { display: none; }
.tig-protocol-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem 0.85rem;
    margin: 0 0 1rem;
    padding: 0.85rem 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}
.tig-protocol-summary-item {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}
.tig-protocol-summary-item span {
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 600;
}
.tig-protocol-summary-item strong {
    font-size: 0.92rem;
    color: #0f172a;
    font-weight: 600;
    overflow-wrap: anywhere;
}
.tig-protocol-summary-item--wide { grid-column: 1 / -1; }
@media (max-width: 768px) {
    .tig-protocol-summary { grid-template-columns: 1fr; }
}

.tig-protocol-collapsible { margin-top: 1.25rem; }
.tig-protocol-summary-hint {
    margin-left: auto;
    font-weight: 500;
    font-size: 0.8rem;
    color: #94a3b8;
}
.tig-protocol-lead { margin: 12px 0 14px; }
.tig-protocol-subtitle {
    margin: 1rem 0 0.55rem;
    font-size: 0.95rem;
    font-weight: 700;
    color: #334155;
}
.tig-protocol-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem 1rem;
}
.tig-protocol-grid .tig-full-width { grid-column: 1 / -1; }
.tig-protocol-finance-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
}
.tig-protocol-finance-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 520px;
    font-size: 0.9rem;
}
.tig-protocol-finance-table th,
.tig-protocol-finance-table td {
    border-bottom: 1px solid #e2e8f0;
    padding: 0.45rem 0.5rem;
    vertical-align: middle;
}
.tig-protocol-finance-table thead th {
    background: #eef2ff;
    color: #334155;
    font-weight: 700;
    text-align: left;
}
.tig-protocol-finance-table tbody th {
    font-weight: 600;
    color: #475569;
    width: 55%;
    text-align: left;
}
.tig-protocol-finance-table .form-input {
    width: 100%;
    min-width: 0;
}
.tig-protocol-finance-toolbar {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 0.5rem;
}
.tig-protocol-finance-toolbar .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.tig-protocol-finance-toolbar .material-symbols-outlined { font-size: 18px; }
.tig-protocol-col-actions {
    width: 44px;
    text-align: center;
}
.tig-protocol-row-del {
    border: 0;
    background: transparent;
    color: #b91c1c;
    cursor: pointer;
    padding: 4px;
    border-radius: 6px;
    line-height: 1;
}
.tig-protocol-row-del:hover { background: #fee2e2; }
.tig-protocol-row-del .material-symbols-outlined { font-size: 20px; }
#protocol_payable_gross[readonly],
.tig-protocol-finance-table .tig-protocol-amt[readonly] {
    background: #f1f5f9;
    color: #0f172a;
    font-weight: 600;
}
.tig-protocol-finance-row.is-computed .tig-protocol-row-label {
    color: #475569;
}
.tig-protocol-finance-row[data-row-key="final_invoice"] .tig-protocol-row-label,
.tig-protocol-finance-row[data-row-key="final_invoice"] .tig-protocol-amt {
    font-weight: 700;
    color: #0f172a;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
@media (max-width: 768px) {
    .tig-protocol-grid { grid-template-columns: 1fr; }
    .tig-protocol-summary-hint { display: none; }
}

/* Nézet váltás: desktopon táblázat, mobilon kártyák */
.desktop-table-view { display: block; }
.mobile-card-view { display: none; }
@media (max-width: 768px) {
    .desktop-table-view { display: none; }
    .mobile-card-view { display: grid; }
}


/* ========== kiszervezve: pages/tig_sign.php ========== */
body.tig-sign-page {
    font-family: Arial, sans-serif;
    max-width: 900px;
    margin: 0 auto;
    padding: 20px;
    background: #f5f5f5;
}
body.tig-sign-page .tig-sign-container {
    background: #fff;
    padding: 28px;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}
body.tig-sign-page .tig-sign-header {
    margin-bottom: 20px;
    border-bottom: 2px solid #dc2626;
    padding-bottom: 14px;
}
body.tig-sign-page .tig-sign-header h1 {
    margin: 0;
    color: #dc2626;
}
body.tig-sign-page .info-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 12px;
    margin-top: 10px;
}
body.tig-sign-page .info-item label {
    font-weight: bold;
    color: #4b5563;
    display: block;
    margin-bottom: 4px;
}
body.tig-sign-page .signature-canvas-container {
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    padding: 10px;
    background: #fff;
}
body.tig-sign-page .signature-canvas {
    width: 100%;
    height: 200px;
    border: 1px solid #d1d5db;
    display: block;
    cursor: crosshair;
}
body.tig-sign-page .form-group {
    margin-bottom: 14px;
}
body.tig-sign-page .form-group label {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
}
body.tig-sign-page .form-input {
    width: 100%;
    max-width: 420px;
    padding: 10px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
}
body.tig-sign-page .actions {
    margin-top: 16px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
body.tig-sign-page .success-box {
    background: #d1fae5;
    color: #065f46;
    padding: 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}
@media (max-width: 768px) {
    body.tig-sign-page { padding: 10px; }
    body.tig-sign-page .tig-sign-container { padding: 16px; }
    body.tig-sign-page .info-grid { grid-template-columns: 1fr; }
}


/* ========== theme-primary.css ========== */

/**
 * Egységes primary gombok – ugyanaz a piros, mint a profil/user-menu-toggle gomb.
 */
.btn-primary,
a.btn-primary,
button.btn-primary,
input.btn-primary,
.action-btn.btn-primary,
a.action-btn.btn-primary,
button.action-btn.btn-primary {
    background: var(--menu-primary);
    color: #fff;
    box-shadow: 0 4px 6px -1px rgb(220 38 38 / 0.25);
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover,
input.btn-primary:hover,
.action-btn.btn-primary:hover,
a.action-btn.btn-primary:hover,
button.action-btn.btn-primary:hover {
    background: var(--menu-primary-hover);
    color: #fff;
}

.btn-primary .material-symbols-outlined,
.btn-primary svg {
    color: inherit;
}