/* buntwelt events 2026 – Version 1.1.1 */

/* Login */
* { box-sizing: border-box; }
        body {
            margin: 0;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            font-family: Arial, sans-serif;
            background: #f4f6ef;
            color: #263000;
        }
        .login-card {
            width: min(420px, calc(100% - 32px));
            background: #fff;
            padding: 34px;
            border-radius: 16px;
            box-shadow: 0 12px 35px rgba(0,0,0,.12);
        }
        .login-card h1 {
            margin: 0 0 8px;
            font-size: 25px;
        }
        .login-card p {
            color: #66705b;
            margin: 0 0 24px;
        }
        .login-card label {
            display: block;
            margin: 14px 0 6px;
            font-weight: 600;
        }
        .login-card input {
            width: 100%;
            padding: 12px 14px;
            border: 1px solid #cfd5c4;
            border-radius: 8px;
            font-size: 16px;
        }
        .login-card button {
            width: 100%;
            margin-top: 22px;
            padding: 12px;
            border: 0;
            border-radius: 8px;
            background: #a8c400;
            color: #fff;
            font-size: 16px;
            font-weight: 700;
            cursor: pointer;
        }
        .login-error {
            padding: 10px 12px;
            margin-bottom: 15px;
            border-radius: 8px;
            background: #ffe7e7;
            color: #9a1b1b;
        }

        .password-modal {
            display: none !important;
            position: fixed !important;
            inset: 0 !important;
            width: 100vw !important;
            height: 100vh !important;
            height: 100dvh !important;
            margin: 0 !important;
            box-sizing: border-box !important;
            background: rgba(0,0,0,.58) !important;
            z-index: 2147483647 !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 20px !important;
            overflow: auto !important;
        }

        .password-modal-content {
            position: relative !important;
            display: block !important;
            flex: 0 1 460px !important;
            width: min(100%, 460px) !important;
            max-width: 460px !important;
            margin: auto !important;
            box-sizing: border-box !important;
            background: #fff !important;
            border-radius: 12px !important;
            padding: 24px !important;
            box-shadow: 0 18px 60px rgba(0,0,0,.35) !important;
        }

        .password-modal-content input {
            width: 100%;
            padding: 10px 12px;
            margin-top: 6px;
            border: 1px solid var(--border-color);
            border-radius: var(--radius);
        }

        .password-modal-actions {
            display: flex;
            gap: 10px;
            justify-content: flex-end;
            margin-top: 20px;
        }

/* Anwendung */
:root {
            --brand-lime: #99B023;
            --brand-lime-light: #f1f6d9;
            --brand-lime-hover: #869b1e;
            --brand-gray: #a3a7ab;
            --brand-dark: #111111;
            
            --bg-color: #f8f9fa;
            --card-bg: #ffffff;
            --text-main: #111111;
            --text-muted: #555555;
            --border-color: #d1d5db;
            --border-focus: #99B023;
            --accent-soft: #f4f5f6;
            --radius: 8px;
        }

        * { box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
        
        html {
            scroll-behavior: smooth;
            scroll-snap-type: none;
            scroll-padding-top: 12px;
        }

        body { 
            background-color: var(--bg-color); 
            color: var(--text-main); 
            display: flex; 
            justify-content: center; 
            padding: 40px 15px; 
            margin: 0; 
        }

        .card { 
            background: var(--card-bg); 
            padding: 35px; 
            border-radius: 12px; 
            border: 1px solid var(--border-color); 
            box-shadow: 0 4px 20px rgba(0,0,0,0.04); 
            width: 100%; 
            max-width: 850px; 
        }
        
        h1 { margin-top: 0; color: var(--brand-dark); font-size: 24px; font-weight: 600; text-align: center; margin-bottom: 25px; letter-spacing: -0.3px; }
        .form-group { margin-bottom: 16px; }
        .form-row { display: flex; gap: 16px; flex-wrap: wrap; }
        .form-row .form-group { flex: 1; min-width: 140px; }
        
        label { display: block; margin-bottom: 6px; font-weight: 600; color: var(--text-main); font-size: 13px; letter-spacing: 0.1px; }
        input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], input[type="time"], select, textarea {
            width: 100%; padding: 9px 12px; border: 1px solid var(--border-color); border-radius: var(--radius); font-size: 14px; color: var(--text-main); background-color: #fff; transition: all 0.15s ease;
        }
        input:focus, select:focus, textarea:focus { border-color: var(--border-focus); outline: none; box-shadow: 0 0 0 3px rgba(153, 176, 35, 0.3); }
        textarea { resize: vertical; height: 85px; }

        /* Dreizeiliges Lime Banner */
        .summary-banner {
            background-color: var(--brand-lime-light);
            color: var(--brand-dark);
            border: 1.5px solid var(--brand-lime);
            padding: 18px;
            border-radius: var(--radius);
            margin:20px 0;
            text-align:center;
        }
        .summary-banner .line-1{font-size:1.9rem;font-weight:700;line-height:1.2;}
        .summary-banner .line-2{margin-top:8px;font-size:1.3rem;font-weight:600;color:#435203;}
        .summary-banner .line-3{margin-top:10px;font-size:1.05rem;font-weight:500;color:#333;}

        .maps-box {
            background-color: var(--accent-soft);
            border: 1px solid var(--border-color);
            border-radius: var(--radius);
            padding: 12px 15px;
            margin-top: 15px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
            gap: 12px;
        }
        .maps-buttons { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
        
        .btn-outline {
            background-color: #ffffff;
            color: var(--brand-dark);
            border: 1px solid var(--brand-lime);
            padding: 8px 14px;
            border-radius: var(--radius);
            text-decoration: none !important;
            font-size: 13px;
            font-weight: 600;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
            transition: all 0.15s ease;
        }
        .btn-outline:hover {
            border-color: var(--brand-lime);
            color: var(--brand-dark);
            background-color: var(--brand-lime-light);
        }

        .btn-outline-danger {
            background-color: transparent;
            color: #b91c1c;
            border: 1px solid #fca5a5;
        }
        .btn-outline-danger:hover {
            background-color: #fef2f2;
            border-color: #ef4444;
            color: #991b1b;
        }

        .btn-outline-primary {
            background-color: var(--brand-lime);
            color: #ffffff;
            border: 1.5px solid var(--brand-lime);
            font-weight: 600;
        }
        .btn-outline-primary:hover {
            background-color: var(--brand-lime-hover);
            border-color: var(--brand-lime-hover);
            color: #ffffff;
        }

        .maps-info-text {
            font-size: 13px;
            font-weight: 500;
            color: var(--text-main);
            background: #ffffff;
            padding: 5px 10px;
            border-radius: 6px;
            border: 1px solid var(--border-color);
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }

        .sub-group-card {
            background-color: #ffffff;
            border: 1px solid var(--border-color);
            border-left: 3px solid var(--brand-lime);
            border-radius: var(--radius);
            padding: 16px;
            margin-bottom: 15px;
        }
        .sub-group-title {
            font-size: 12px;
            font-weight: 700;
            color: var(--text-muted);
            margin-top: 0;
            margin-bottom: 12px;
            text-transform: uppercase;
            letter-spacing: 0.6px;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        details.collapsible-section {
            margin-bottom: 16px;
            border: 1px solid var(--border-color);
            border-left: 5px solid var(--brand-lime);
            border-radius: var(--radius);
            background-color: #ffffff;
            overflow: hidden;
            scroll-snap-align: none;
            scroll-margin-top: 20px;
            transition: border-color 0.2s ease, box-shadow 0.2s ease;
        }
        details.collapsible-section[open] {
            box-shadow: 0 3px 12px rgba(153, 176, 35, 0.12);
        }
        details.collapsible-section summary {
            font-size: 15px;
            font-weight: 600;
            color: var(--brand-dark);
            padding: 14px 18px;
            cursor: pointer;
            user-select: none;
            background-color: #ffffff;
            transition: background 0.15s;
        }
        details.collapsible-section summary:hover { background-color: var(--brand-lime-light); }
        details.collapsible-section[open] summary { 
            border-bottom: 1px solid var(--border-color); 
            background-color: var(--brand-lime-light); 
        }
        .collapsible-content { padding: 20px; }

        .toggle-all-container { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 15px; margin-top: 15px; }
        .toggle-all-actions { display: flex; gap: 8px; margin-left: auto; }
        .btn-google-calendar { display: inline-flex; align-items: center; gap: 7px; }

        .timeline-row {
            display: flex;
            gap: 10px;
            align-items: center;
            margin-bottom: 10px;
            background-color: var(--accent-soft);
            border: 1px solid var(--border-color);
            padding: 8px 10px;
            border-radius: var(--radius);
        }
        .timeline-row input[type="time"] { width: 120px; flex-shrink: 0; }
        .timeline-row input[type="text"] { flex: 1; }

        .timeline-drag-handle {
            width: 34px;
            height: 34px;
            flex: 0 0 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid var(--border-color);
            border-radius: var(--radius);
            background: #fff;
            color: var(--brand-gray);
            cursor: grab;
            touch-action: none;
            user-select: none;
            -webkit-user-drag: none;
        }
        .timeline-drag-handle:active { cursor: grabbing; }
        .timeline-drag-handle svg { width: 18px; height: 18px; }
        .timeline-row.is-dragging {
            opacity: 0.72;
            box-shadow: 0 8px 22px rgba(0,0,0,0.16);
            border-color: var(--brand-lime);
            z-index: 10;
        }
        .timeline-row.drag-over {
            border-top: 3px solid var(--brand-lime);
        }
        .timeline-drag-help {
            display: block;
            margin: 4px 0 10px;
            color: var(--brand-gray);
            font-size: 12px;
        }
        .btn-remove-row {
            background-color: transparent;
            color: var(--brand-gray);
            border: 1px solid var(--border-color);
            width: 34px; height: 34px;
            border-radius: var(--radius);
            cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0;
            transition: all 0.15s;
        }
        .btn-remove-row:hover { background-color: #fef2f2; color: #b91c1c; border-color: #fca5a5; }

        .btn-group { display: flex; gap: 10px; margin-top: 25px; }
        .btn-action { width: 100%; justify-content: center; padding: 11px 18px; font-size: 14px; }

        .alert { padding: 12px 15px; border-radius: var(--radius); margin-bottom: 20px; font-size: 14px; }
        .alert.success { background-color: var(--brand-lime-light); color: #364205; border: 1.5px solid var(--brand-lime); }
        .alert.error { background-color: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
        
        .selector-box { 
            background: var(--accent-soft); 
            padding: 16px; 
            border-radius: var(--radius); 
            border: 1px solid var(--border-color); 
            margin-bottom: 25px; 
            scroll-snap-align: none;
            display: flex;
            align-items: flex-end;
            gap: 15px;
            flex-wrap: wrap;
        }

        .btn-floating-save {
            position: fixed;
            top: 50%;
            right: 25px;
            transform: translateY(-50%);
            background-color: var(--brand-lime);
            color: #ffffff;
            border: none;
            width: 48px;
            height: 48px;
            border-radius: 50%;
            box-shadow: 0 4px 14px rgba(153, 176, 35, 0.4);
            cursor: pointer;
            z-index: 1000;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.15s ease-in-out;
        }
        .btn-floating-save:hover {
            background-color: var(--brand-lime-hover);
            transform: translateY(-50%) scale(1.08);
            box-shadow: 0 6px 18px rgba(153, 176, 35, 0.5);
        }
        .btn-floating-save svg { stroke: #ffffff; }

        /* Modal für Historie */
        .modal {
            display: none;
            position: fixed;
            top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0,0,0,0.5);
            z-index: 2000;
            align-items: center;
            justify-content: center;
        }
        .modal-content {
            background: #fff;
            padding: 25px;
            border-radius: 12px;
            width: 90%;
            max-width: 500px;
            box-shadow: 0 10px 25px rgba(0,0,0,0.2);
        }
        .modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
            font-weight: 600;
            font-size: 16px;
        }
        .history-list {
            list-style: none;
            padding: 0;
            margin: 0;
            max-height: 300px;
            overflow-y: auto;
        }
        .history-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 10px;
            border-bottom: 1px solid var(--border-color);
            font-size: 13px;
        }
        .history-item:last-child { border-bottom: none; }

        .icon { width: 16px; height: 16px; stroke: var(--brand-dark); stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
        .icon-accent { stroke: var(--brand-lime); }

        .field-label-with-button {
            display: flex;
            align-items: center;
            gap: 7px;
            margin-bottom: 6px;
        }

        .field-label-with-button label {
            margin-bottom: 0;
        }

        .btn-manage-event-types {
            width: 24px;
            height: 24px;
            padding: 0;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 13px;
            line-height: 1;
        }

        .event-types-modal {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0,0,0,0.5);
            z-index: 3000;
            align-items: center;
            justify-content: center;
            padding: 20px;
        }

        .event-types-modal-content {
            background: #fff;
            padding: 25px;
            border-radius: 12px;
            width: 100%;
            max-width: 520px;
            max-height: 85vh;
            overflow-y: auto;
            box-shadow: 0 10px 25px rgba(0,0,0,0.2);
        }

        .event-types-list {
            display: flex;
            flex-direction: column;
            gap: 8px;
            margin: 15px 0;
        }

        .event-type-edit-row {
            display: flex;
            gap: 8px;
            align-items: center;
        }

        .event-type-edit-row input {
            flex: 1;
        }

        .event-types-actions {
            display: flex;
            gap: 10px;
            justify-content: flex-end;
            margin-top: 20px;
        }

        .event-type-help {
            font-size: 12px;
            color: var(--text-muted);
            margin-top: 5px;
        }

        .custom-event-type-field {
            display: none;
            margin-top: 12px;
            padding: 12px;
            background: var(--brand-lime-light);
            border: 1px solid var(--brand-lime);
            border-radius: var(--radius);
        }
    
        /* Links einfahrendes Benutzermenü */
        .account-drawer-toggle {
            position: fixed !important;
            top: 16px !important;
            left: 0 !important;
            z-index: 3201 !important;
            width: 40px !important;
            height: 44px !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 !important;
            border: 1px solid var(--border-color) !important;
            border-left: 0 !important;
            border-radius: 0 9px 9px 0 !important;
            background: #fff !important;
            color: var(--brand-dark) !important;
            box-shadow: 0 4px 16px rgba(0,0,0,.14) !important;
            cursor: pointer !important;
            transition: left .28s ease, background-color .18s ease !important;
        }

        .account-drawer-toggle:hover {
            background: var(--brand-lime-light) !important;
        }

        .account-drawer-toggle svg {
            width: 20px !important;
            height: 20px !important;
            pointer-events: none;
        }

        .account-drawer-toggle.is-open {
            left: min(340px, calc(100vw - 50px)) !important;
        }

        .account-drawer-overlay {
            position: fixed !important;
            inset: 0 !important;
            z-index: 3199 !important;
            display: block !important;
            visibility: hidden !important;
            opacity: 0 !important;
            pointer-events: none !important;
            background: rgba(0,0,0,.46) !important;
            transition: opacity .28s ease, visibility 0s linear .28s !important;
        }

        .account-drawer-overlay.is-open {
            visibility: visible !important;
            opacity: 1 !important;
            pointer-events: auto !important;
            transition-delay: 0s !important;
        }

        .account-drawer {
            position: fixed !important;
            top: 0 !important;
            bottom: 0 !important;
            left: 0 !important;
            z-index: 3200 !important;
            width: min(340px, calc(100vw - 50px)) !important;
            height: 100vh !important;
            height: 100dvh !important;
            display: block !important;
            margin: 0 !important;
            padding: 24px 20px !important;
            box-sizing: border-box !important;
            background: #fff !important;
            color: var(--text-main) !important;
            box-shadow: 12px 0 34px rgba(0,0,0,.22) !important;
            overflow-y: auto !important;
            transform: translate3d(-105%, 0, 0) !important;
            transition: transform .28s ease !important;
        }

        .account-drawer.is-open {
            transform: translate3d(0, 0, 0) !important;
        }

        .account-drawer-header {
            display: flex !important;
            align-items: flex-start !important;
            justify-content: space-between !important;
            gap: 12px !important;
            margin: 0 0 24px !important;
            padding: 0 0 18px !important;
            border-bottom: 1px solid var(--border-color) !important;
        }

        .account-drawer-user { min-width: 0; }

        .account-drawer-user-label {
            display: block;
            margin-bottom: 4px;
            color: var(--text-muted);
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .06em;
        }

        .account-drawer-username {
            display: block;
            overflow-wrap: anywhere;
            color: var(--brand-dark);
            font-size: 20px;
            font-weight: 700;
        }

        .account-drawer-role {
            display: block;
            margin-top: 3px;
            color: var(--text-muted);
            font-size: 13px;
        }

        .account-drawer-close {
            width: 34px !important;
            height: 34px !important;
            min-width: 34px !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 !important;
            border: 1px solid var(--border-color) !important;
            border-radius: var(--radius) !important;
            background: #fff !important;
            color: var(--brand-dark) !important;
            cursor: pointer !important;
            font-size: 17px !important;
        }

        .account-drawer-actions {
            display: grid !important;
            gap: 10px !important;
        }

        .account-drawer-actions button,
        .account-drawer-actions a {
            width: 100% !important;
            min-height: 44px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: flex-start !important;
            box-sizing: border-box !important;
            margin: 0 !important;
            padding: 10px 13px !important;
            border: 1px solid var(--brand-lime) !important;
            border-radius: var(--radius) !important;
            background: #fff !important;
            color: var(--brand-dark) !important;
            text-align: left !important;
            text-decoration: none !important;
            font-size: 13px !important;
            font-weight: 600 !important;
            cursor: pointer !important;
        }

        .account-drawer-actions button:hover,
        .account-drawer-actions a:hover {
            background: var(--brand-lime-light) !important;
        }

        .account-drawer-actions .logout-link {
            margin-top: 8px !important;
            border-color: #fca5a5 !important;
            color: #b91c1c !important;
        }

        /* Kleiner Seitenanfang-Button, rechts korrespondierend zum Speichern-Button */
        .scroll-to-top-button {
            position: fixed !important;
            top: calc(50% + 62px) !important;
            right: 29px !important;
            bottom: auto !important;
            z-index: 1000 !important;
            width: 40px !important;
            min-width: 40px !important;
            height: 40px !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            padding: 0 !important;
            border: 1px solid var(--brand-lime) !important;
            border-radius: 50% !important;
            background: #fff !important;
            color: var(--brand-dark) !important;
            box-shadow: 0 4px 14px rgba(0,0,0,.16) !important;
            cursor: pointer !important;
            opacity: 0;
            visibility: hidden;
            transform: translateY(-50%) scale(.92);
            transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s !important;
        }

        .scroll-to-top-button.is-visible {
            opacity: 1;
            visibility: visible;
            transform: translateY(-50%) scale(1);
            transition-delay: 0s !important;
        }

        .scroll-to-top-button:hover {
            background: var(--brand-lime-light) !important;
            transform: translateY(-50%) scale(1.06);
        }

        .scroll-to-top-button svg {
            width: 17px !important;
            height: 17px !important;
        }

        .scroll-to-top-button span { display: none !important; }

        

        [hidden] {
            display: none !important;
        }

        .password-modal[hidden] {
            display: none !important;
        }

        .password-modal.is-open:not([hidden]) {
            display: flex !important;
            position: fixed !important;
            inset: 0 !important;
        }

        .password-modal-content {
            position: relative;
            max-height: calc(100vh - 32px);
            overflow-y: auto;
        }

        .conditional-inline-field {
            min-width: 0;
        }

        .form-version-info {
            margin-top: 18px;
            padding-top: 10px;
            border-top: 1px dashed var(--border-color);
            color: var(--brand-gray);
            font-family: Consolas, Monaco, "Courier New", monospace;
            font-size: 11px;
            text-align: right;
        }

        /* Vollständig responsives Smartphone-Layout */
        

        

    
        .readonly-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
        .readonly-fieldset:disabled { opacity: 1; }
        .readonly-fieldset:disabled input,
        .readonly-fieldset:disabled select,
        .readonly-fieldset:disabled textarea { color: #30352b; background: #f7f8f4; -webkit-text-fill-color: #30352b; opacity: 1; }
        .role-help { padding: 12px; margin-bottom: 16px; border-radius: 8px; background: var(--accent-soft); line-height: 1.55; font-size: 13px; }
        .user-modal-content { max-width: 760px; }
        .user-create-form { display: grid; grid-template-columns: 1fr 1.3fr 1fr auto; gap: 8px; align-items: end; margin-bottom: 22px; }
        .user-create-form input, .user-create-form select, .user-row input, .user-row select { min-height: 42px; }
        .users-list { display: grid; gap: 10px; }
        .user-row { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 8px; align-items: center; padding: 10px; border: 1px solid var(--border-color); border-radius: 8px; }
        .user-row-actions { display: flex; gap: 6px; }

/* Beteiligte Personen – dynamische Felder */
.involved-persons-row textarea { min-height: 132px; }
#contact_person { min-height: 110px; }


/* Version 1.0.16: Aktionsbuttons an Kontakt- und Linkfeldern */
.field-action-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 7px;
}
.field-action-button {
    padding: 6px 10px;
    font-size: 12px;
}
.field-whatsapp-button {
    font-weight: 700;
}

/* Aufbauzeit als besonders wichtige Angabe hervorheben */
.setup-time-highlight {
    background: var(--brand-lime-light);
    border: 2px solid var(--brand-lime);
    border-radius: var(--radius);
    padding: 10px;
    box-shadow: 0 2px 8px rgba(89, 104, 8, 0.12);
}
.setup-time-highlight label {
    color: var(--brand-dark);
    font-size: 14px;
}
.setup-time-highlight input {
    border-color: var(--brand-lime);
    font-weight: 700;
}


/* Dynamische Infofelder – Version 1.0.17 */
.dynamic-info-header { margin-bottom: 8px; }
.other-info-row { display:flex; align-items:flex-start; gap:10px; margin-bottom:10px; }
.other-info-row textarea { flex:1; min-height:72px; }
.other-info-drag-handle { cursor:grab; border:0; background:transparent; font-size:24px; line-height:1; padding:10px 4px; color:var(--text-muted, #666); touch-action:none; }
.other-info-row.is-dragging { opacity:.72; }
.other-info-row .field-action-buttons { align-self:center; }


/* Dynamische Kontaktzeilen – Version 1.0.18 */
.dynamic-contact-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.contact-item-row { display:grid; grid-template-columns:auto minmax(150px,1.2fr) minmax(145px,1fr) minmax(180px,1.2fr) auto; gap:10px; align-items:start; margin-bottom:10px; }
.contact-item-row.company-contact-row { grid-template-columns:auto minmax(140px,1.1fr) minmax(130px,1fr) minmax(145px,1fr) minmax(180px,1.2fr) auto; }
.company-position-field[hidden] { display:none !important; }
.company-invoice-info { margin-top:18px; }
.contact-item-row input { width:100%; min-width:0; }
.contact-item-drag-handle { cursor:grab; border:0; background:transparent; font-size:24px; line-height:1; padding:9px 4px; color:var(--text-muted, #666); touch-action:none; }
.contact-item-row.is-dragging { opacity:.72; }
.contact-item-row .field-action-buttons { grid-column:2 / -2; }
@media (max-width: 760px) {
    .contact-item-row { grid-template-columns:auto 1fr auto; }
    .contact-item-row input { grid-column:2; }
    .contact-item-row .btn-remove-row { grid-column:3; grid-row:1; }
    .contact-item-row .field-action-buttons { grid-column:2 / 4; }
}

/* Kompakte Aktions-Icons – Version 1.0.19 */
.field-action-inline {
    display: flex;
    align-items: stretch;
    gap: 6px;
    width: 100%;
    min-width: 0;
}
.field-action-inline > input,
.field-action-inline > textarea {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}
.field-action-inline.field-action-textarea {
    align-items: flex-start;
}
.field-action-inline > .field-action-buttons {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
}
.field-action-inline.field-action-textarea > .field-action-buttons {
    padding-top: 2px;
}
.field-action-button.icon-only {
    width: 36px;
    min-width: 36px;
    height: 36px;
    padding: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.field-action-button.icon-only svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
    pointer-events: none;
}
.contact-item-row > .field-action-inline {
    min-width: 0;
}
.contact-item-row .field-action-buttons {
    grid-column: auto;
}
@media (max-width: 760px) {
    .contact-item-row > .field-action-inline {
        grid-column: 2;
    }
    .contact-item-row .field-action-buttons {
        grid-column: auto;
    }
}


/* Druckansicht – Version 1.0.20 */
.btn-print-view { white-space: nowrap; }
@media (max-width: 760px) {
    .toggle-all-container { flex-wrap: wrap; }
    .btn-google-calendar, .btn-print-view { flex: 1 1 220px; }
}

/* Druckansicht ohne Pop-up – Version 1.0.22 */
body.print-preview-open { overflow: hidden; }
#print-preview-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    overflow: auto;
    padding: 24px;
    background: rgba(25, 29, 23, .72);
}
.print-preview-shell {
    width: min(100%, 210mm);
    margin: 0 auto;
    padding: 14mm;
    background: #fff;
    color: #252a22;
    box-shadow: 0 16px 50px rgba(0, 0, 0, .28);
}
.print-preview-actions {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: -6px 0 16px;
    padding: 8px 0;
    background: #fff;
    border-bottom: 1px solid #d8ddd1;
}
.print-document { font-family: Arial, Helvetica, sans-serif; font-size: 10.5pt; line-height: 1.38; }
.print-document header { border-bottom: 1px solid #000; padding-bottom: 6px; margin-bottom: 10px; background: transparent; }
.print-document h1 { margin: 0 0 2px; font-size: 18pt; }
.print-document .subtitle { font-size: 11pt; font-weight: 700; }
.print-document .meta { margin-top: 3px; color: #000; }
.print-document section { break-inside: avoid; margin: 0 0 9px; background: transparent; }
.print-document h2 { font-size: 12pt; margin: 0 0 5px; padding: 2px 0 3px; background: transparent; border: 0; border-bottom: 1px solid #000; }
.print-document h3 { font-size: 10.5pt; margin: 7px 0 4px; }
.print-document .print-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 10px; }
.print-document .print-field { border-bottom: 1px solid #bbb; padding: 2px 1px 3px; min-width: 0; background: transparent; }
.print-document .print-field.important { background: transparent; border: 1.5px solid #000; padding: 4px 5px; font-weight: 700; }
.print-document .print-label { font-size: 8pt; color: #000; font-weight: 700; text-transform: uppercase; letter-spacing: .01em; }
.print-document .print-value { white-space: normal; overflow-wrap: anywhere; }
.print-document table { width: 100%; border-collapse: collapse; margin-top: 8px; }
.print-document th, .print-document td { border: 1px solid #777; padding: 3px 5px; text-align: left; vertical-align: top; overflow-wrap: anywhere; background: transparent; }
.print-document th { background: transparent; font-size: 8.5pt; }
.print-document .time-col { width: 22%; white-space: nowrap; }
.print-document .info-list { margin: 5px 0 0; padding-left: 22px; }
.print-document .info-list li { margin-bottom: 3px; }
.print-document footer { margin-top: 10px; padding-top: 4px; border-top: 1px solid #000; color: #000; font-size: 8pt; }
@media (max-width: 650px) {
    #print-preview-overlay { padding: 0; }
    .print-preview-shell { min-height: 100%; padding: 18px 14px; }
    .print-document .print-grid { grid-template-columns: 1fr; }
}
@media print {
    @page { size: A4; margin: 14mm; }
    body.print-preview-open > *:not(#print-preview-overlay) { display: none !important; }
    body.print-preview-open { overflow: visible !important; background: #fff !important; }
    #print-preview-overlay { position: static !important; inset: auto !important; overflow: visible !important; padding: 0 !important; background: #fff !important; }
    .print-preview-shell { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; }
    .print-preview-actions { display: none !important; }
    .print-document, .print-document * { color: #000 !important; background: transparent !important; background-image: none !important; box-shadow: none !important; text-shadow: none !important; print-color-adjust: economy !important; -webkit-print-color-adjust: economy !important; }
}

/* Portal- und Übersichtsseiten ab Version 1.0.23 */
.portal-page { margin: 0; background: #f5f7fa; color: #1f2933; }
.portal-shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto 48px; }
.portal-header { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px 0; border-bottom:1px solid #d8dee6; }
.portal-brand { color:inherit; text-decoration:none; font-weight:800; font-size:1.05rem; display:flex; flex-direction:column; align-items:flex-start; line-height:1.2; }
.portal-brand small { margin-top:3px; font-size:.68rem; font-weight:600; color:var(--text-muted); letter-spacing:.04em; }
.portal-nav { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.portal-nav a, .drawer-nav-link { color:inherit; text-decoration:none; padding:9px 12px; border-radius:8px; font-weight:600; }
.portal-nav a:hover, .drawer-nav-link:hover { background:#e9edf2; }
.portal-title-row { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; padding:34px 0 22px; }
.portal-title-row h1 { margin:3px 0 0; }
.portal-eyebrow { margin:0; font-size:.9rem; color:#66717e; }
.portal-home-button { text-decoration:none; white-space:nowrap; }
.dashboard-intro { margin-bottom:18px; }
.dashboard-intro h2 { margin-bottom:6px; }
.dashboard-intro p { margin:0; color:#66717e; }
.dashboard-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.dashboard-card { min-height:150px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:18px; padding:24px; border:1px solid #d7dde5; border-radius:16px; background:#fff; color:inherit; text-decoration:none; box-shadow:0 5px 18px rgba(31,41,51,.06); transition:transform .15s ease, box-shadow .15s ease; }
a.dashboard-card:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(31,41,51,.1); }
.dashboard-card-icon { font-size:2rem; }
.dashboard-card-content { display:flex; flex-direction:column; gap:7px; }
.dashboard-card-content strong { font-size:1.2rem; }
.dashboard-card-content small { color:#66717e; line-height:1.5; font-size:.95rem; }
.dashboard-card-arrow { font-size:1.3rem; font-weight:700; }
.dashboard-card-disabled, .dashboard-card-future { opacity:.72; }
.event-list-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; padding:16px 18px; background:#fff; border:1px solid #d7dde5; border-radius:12px; }
.event-overview-list { display:flex; flex-direction:column; gap:10px; }
.event-overview-row { display:grid; grid-template-columns:190px minmax(0,1fr) 110px 110px; align-items:center; gap:18px; padding:16px 18px; background:#fff; border:1px solid #d7dde5; border-radius:12px; color:inherit; text-decoration:none; }
.event-overview-row:hover { border-color:#9aa7b5; box-shadow:0 4px 14px rgba(31,41,51,.07); }
.event-date-block, .event-list-main { display:flex; flex-direction:column; gap:4px; }
.event-date-block span, .event-list-main strong { font-weight:750; }
.event-date-block small, .event-list-main small { color:#66717e; }
.event-date-block small { font-size:.78rem; }
.event-list-time, .event-list-action { text-align:right; white-space:nowrap; }
.event-list-action { font-weight:700; }
.event-past { opacity:.68; }
.portal-empty { padding:40px; text-align:center; background:#fff; border:1px dashed #bcc6d1; border-radius:14px; }
.user-admin-section { margin-bottom:24px; padding:22px; background:#fff; border:1px solid #d7dde5; border-radius:14px; }
.user-admin-section h2 { margin-top:0; }
.user-admin-form { display:grid; grid-template-columns:1.2fr 1fr 1.2fr auto; gap:14px; align-items:end; }
.user-admin-form > div:not(.user-row-actions) { display:flex; flex-direction:column; gap:6px; }
.user-admin-list { display:flex; flex-direction:column; gap:12px; }
.user-existing-row { padding-top:12px; border-top:1px solid #e2e7ed; }
.user-existing-row:first-child { padding-top:0; border-top:0; }
.user-row-actions { display:flex; gap:8px; }
.event-page-home-links { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.event-page-home-links a { text-decoration:none; }

@media (max-width: 800px) {
  .portal-shell { width:min(100% - 20px, 1180px); }
  .portal-header, .portal-title-row, .event-list-toolbar { align-items:flex-start; flex-direction:column; }
  .dashboard-grid { grid-template-columns:1fr; }
  .event-overview-row { grid-template-columns:1fr; gap:8px; }
  .event-list-time, .event-list-action { text-align:left; }
  .user-admin-form { grid-template-columns:1fr; }
}


/* Meilenstein Seitenstruktur 1.0.24 */
.portal-page { background:#fff; }
.portal-shell { margin-top:0; }
.portal-header { padding-top:12px; }
.portal-title-row { padding-top:18px; }
.dashboard-card { border-radius:8px; box-shadow:none; min-height:115px; padding:18px; }
.dashboard-card:hover { box-shadow:none !important; border-color:#888; }
.event-overview-row-actions { display:flex; align-items:center; gap:12px; }
.event-row-link { flex:1; min-width:0; display:grid; grid-template-columns:190px minmax(0,1fr) 110px; align-items:center; gap:18px; color:inherit; text-decoration:none; }
.event-row-buttons { display:flex; gap:8px; flex-wrap:wrap; }
.event-row-buttons form { margin:0; }
.btn-outline.danger { border-color:#9b1c1c; color:#9b1c1c; }
.admin-log { max-height:420px; overflow:auto; white-space:pre-wrap; background:#fff; border:1px solid #cfd5dc; padding:14px; font:13px/1.5 monospace; }
@media(max-width:800px){.event-overview-row-actions{align-items:stretch;flex-direction:column}.event-row-link{grid-template-columns:1fr;width:100%}.event-row-buttons{width:100%}.event-row-buttons form,.event-row-buttons button{flex:1}}


/* Konsistentes Portal-Layout – Version 1.0.26 */
body.portal-page {
    display: block;
    min-height: 100vh;
    padding: 0 16px 40px;
    margin: 0;
    background: var(--bg-color);
    color: var(--text-main);
}
body.portal-page .portal-shell {
    width: 100%;
    max-width: 850px;
    margin: 0 auto;
}
body.portal-page .portal-header {
    padding: 14px 0;
    border-bottom: 1px solid var(--border-color);
}
body.portal-page .portal-brand {
    font-size: 1rem;
    font-weight: 700;
    color: var(--brand-dark);
}
body.portal-page .portal-nav a {
    border-radius: var(--radius);
    color: var(--text-main);
    font-size: 13px;
}
body.portal-page .portal-nav a:hover {
    background: var(--brand-lime-light);
}
body.portal-page .portal-title-row {
    align-items: flex-start;
    padding: 22px 0 18px;
}
body.portal-page .portal-title-row h1 {
    margin: 3px 0 0;
    text-align: left;
    font-size: 24px;
    font-weight: 600;
}
body.portal-page main {
    width: 100%;
}
body.portal-page .dashboard-intro {
    margin: 0 0 14px;
}
body.portal-page .dashboard-intro h2 {
    margin: 0 0 6px;
    font-size: 17px;
    font-weight: 600;
}
body.portal-page .dashboard-grid {
    grid-template-columns: 1fr;
    gap: 12px;
}
body.portal-page .dashboard-card {
    min-height: 0;
    grid-template-columns: 38px minmax(0,1fr) auto;
    gap: 14px;
    padding: 16px 18px;
    border: 1px solid var(--border-color);
    border-left: 5px solid var(--brand-lime);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: none;
}
body.portal-page a.dashboard-card:hover {
    transform: none;
    border-color: var(--brand-lime);
    background: #fff;
}
body.portal-page .dashboard-card-icon {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--brand-dark);
    border-radius: 50%;
    color: var(--brand-dark);
    background: transparent;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}
body.portal-page .dashboard-card-content strong {
    font-size: 15px;
    font-weight: 700;
}
body.portal-page .dashboard-card-content small {
    font-size: 13px;
    line-height: 1.45;
    color: var(--text-muted);
}
body.portal-page .dashboard-card-arrow {
    color: var(--brand-dark);
    font-size: 18px;
}
body.portal-page .dashboard-card-disabled,
body.portal-page .dashboard-card-future {
    opacity: .55;
}
body.portal-page .event-list-toolbar,
body.portal-page .event-overview-row,
body.portal-page .user-admin-section,
body.portal-page .portal-empty {
    border-radius: var(--radius);
    box-shadow: none;
}
@media (max-width: 800px) {
    body.portal-page { padding: 0 10px 28px; }
    body.portal-page .portal-shell { width: 100%; }
}


/* Einheitliche Versionsinformation – Version 1.0.27 */
.app-footer {
    width: 100%;
    margin: 28px auto 8px;
    padding: 14px 8px 4px;
    border-top: 1px solid rgba(32, 45, 36, .18);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    color: var(--text-muted, #68726b);
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
}
.portal-shell > .app-footer {
    margin-top: 34px;
}
body:not(.portal-page) > .app-footer {
    max-width: 1180px;
}
@media print {
    .app-footer { display: none !important; }
}


/* Eventdetailseite – Version 1.0.28 */
body.event-detail-page {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 100vh;
}
body.event-detail-page > .card {
    flex: 0 0 auto;
}
body.event-detail-page > .app-footer {
    flex: 0 0 auto;
    width: min(850px, 100%);
    max-width: 850px;
    margin-top: 28px;
}

/* Benutzer-Menü, Eventfilter und Verwaltungsansichten – Version 1.0.29 */
.user-menu { position: relative; }
.user-menu > summary { list-style:none; cursor:pointer; padding:9px 12px; border-radius:var(--radius); font-weight:600; font-size:13px; }
.user-menu > summary::-webkit-details-marker { display:none; }
.user-menu > summary::after { content:' ▾'; font-size:10px; }
.user-menu[open] > summary, .user-menu > summary:hover { background:var(--brand-lime-light); }
.user-menu-panel { position:absolute; z-index:1000; right:0; top:calc(100% + 8px); width:min(340px,calc(100vw - 24px)); padding:14px; background:#fff; border:1px solid var(--border-color); border-radius:var(--radius); box-shadow:0 10px 30px rgba(0,0,0,.12); display:grid; gap:10px; }
.user-menu-status { display:flex; flex-direction:column; border-bottom:1px solid var(--border-color); padding-bottom:9px; }
.user-menu-status small { color:var(--text-muted); }
.user-menu-panel a { display:block; padding:9px 10px; border:1px solid var(--border-color); border-radius:var(--radius); text-decoration:none; color:inherit; font-weight:600; }
.user-menu-panel form { margin:0; }
.password-menu > summary { cursor:pointer; font-weight:600; padding:8px 0; }
.compact-account-form { display:grid; gap:8px; padding-top:8px; }
.compact-account-form input { width:100%; }
.compact-account-form button { width:100%; }
.simulation-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.simulation-actions button, .simulation-end { width:100%; }
.account-flash { padding:8px 10px; border:1px solid var(--border-color); border-radius:var(--radius); font-size:12px; }
.account-flash.error { border-color:#9b1c1c; color:#7b1515; }
.logout-link { border-color:#9b1c1c !important; color:#7b1515 !important; }
.event-page-home-links .user-menu { margin-left:auto; }
.event-page-home-links .user-menu > summary { border:1px solid var(--border-color); }

.event-search-section { margin-bottom:12px; padding:14px; border:1px solid var(--border-color); border-radius:var(--radius); background:#fff; }
.event-search-section label { display:block; margin-bottom:6px; font-weight:700; }
.event-search-section input { width:100%; }
.event-filter { margin-bottom:14px; border:1px solid var(--border-color); border-radius:var(--radius); background:#fff; }
.event-filter > summary { cursor:pointer; padding:12px 14px; font-weight:700; }
.event-filter-content { padding:0 14px 14px; }
.event-filter-options { display:flex; flex-wrap:wrap; gap:10px 18px; margin:10px 0 12px; }
.event-filter-options label { display:flex; align-items:center; gap:6px; }
.event-filter-options input { width:auto; }
.event-overview-row[hidden] { display:none !important; }
.event-overview-row.event-type-wedding { background:#f1f8f1; border-left:5px solid #729b72; }
.event-overview-row.event-type-birthday { background:#fff8ea; border-left:5px solid #c99a3d; }
.event-overview-row.event-type-company { background:#eef5fa; border-left:5px solid #6d94ad; }
.event-overview-row.event-type-other { background:#f6f3f8; border-left:5px solid #91799d; }
.event-row-buttons > a { text-decoration:none; display:inline-flex; align-items:center; justify-content:center; }
.admin-collapsible { padding:0 !important; }
.admin-collapsible > summary { cursor:pointer; display:flex; justify-content:space-between; align-items:center; padding:20px 22px; font-size:1.15rem; font-weight:700; }
.admin-collapsible > summary small { color:var(--text-muted); font-size:12px; }
.admin-collapsible-content { padding:0 22px 22px; }
@media(max-width:800px){.user-menu-panel{position:fixed;right:12px;top:70px}.simulation-actions{grid-template-columns:1fr}.event-page-home-links .user-menu{margin-left:0}.event-filter-options{flex-direction:column;gap:8px}}

/* Zentrales Theme und Admin-Bereiche – Version 1.0.30 */
:root {
    --theme-primary: #263000;
    --theme-secondary: #66705b;
    --theme-accent: #a8c400;
    --theme-background: #f4f6ef;
    --theme-surface: #ffffff;
    --theme-text-1: #263000;
    --theme-text-2: #66705b;
}
body { background: var(--theme-background); color: var(--theme-primary); }
body.portal-page { background: var(--theme-background); color: var(--theme-primary); }
body.portal-page .portal-brand,
body.portal-page .dashboard-card-arrow { color: var(--theme-primary); }
body.portal-page .portal-eyebrow,
body.portal-page .dashboard-card-content small,
.section-help { color: var(--theme-secondary); }
body.portal-page .dashboard-card,
body.portal-page .user-admin-section,
.event-search-section,
.event-filter,
.user-menu-panel { background: var(--theme-surface); }
body.portal-page .dashboard-card { border-left-color: var(--theme-accent); }
body.portal-page a.dashboard-card:hover { border-color: var(--theme-accent); }
body.portal-page .dashboard-card-icon { border-color: var(--theme-primary); color: var(--theme-primary); }
button:not(.btn-outline), .login-card button { background: var(--theme-accent); color: var(--theme-primary); }
input:focus, textarea:focus, select:focus { border-color: var(--theme-accent) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-accent) 22%, transparent); }
.home-logo-wrap { display:flex; justify-content:center; margin:2px 0 24px; }
.home-logo { width:min(150px,32vw); aspect-ratio:9/16; object-fit:contain; display:block; }
.admin-link-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:24px; }
.admin-link-grid .dashboard-card { min-height:110px; }
.admin-collapsible > summary { list-style:none; }
.admin-collapsible > summary::-webkit-details-marker { display:none; }
.collapsible-title { display:flex; align-items:baseline; gap:10px; }
.collapsible-title small { font-size:12px; font-weight:600; color:var(--theme-secondary); }
.collapse-icon { width:12px; height:12px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); transition:transform .18s ease; margin-right:4px; }
.admin-collapsible[open] .collapse-icon { transform:rotate(225deg); }
.section-title-actions { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:14px; }
.section-title-actions h2 { margin:0 0 4px; }
.section-help { margin:0; font-size:13px; }
.log-actions { display:flex; gap:8px; flex-wrap:wrap; }
.log-actions form { margin:0; }
.archived-log-select { display:grid; gap:6px; margin-bottom:12px; font-weight:600; }
.archived-log-select select { max-width:460px; }
.user-management-grid { display:grid; grid-template-columns:1.15fr .9fr 1.15fr 1fr; gap:14px; align-items:end; }
.user-existing-card { padding:16px 0; border-top:1px solid var(--border-color); }
.user-existing-card:first-child { border-top:0; padding-top:0; }
.field-group { display:flex; flex-direction:column; gap:6px; min-width:0; }
.field-group label, .user-status-toggle { font-size:13px; font-weight:700; }
.user-management-grid input:not([type=checkbox]), .user-management-grid select,
.design-form input[type=file], .archived-log-select select { width:100%; min-height:42px; padding:9px 11px; border:1px solid var(--border-color); border-radius:var(--radius); background:var(--theme-surface); color:var(--theme-primary); }
.user-status-toggle { display:flex; align-items:center; gap:8px; min-height:42px; }
.user-status-toggle input { width:auto; }
.user-account-state { align-self:center; font-size:12px; font-weight:700; color:#2f6b3a; }
.user-account-state.is-disabled { color:#8c2020; }
.user-row-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; grid-column:1/-1; }
.design-form { display:grid; gap:24px; }
.theme-color-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.color-field { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px; border:1px solid var(--border-color); border-radius:var(--radius); font-weight:700; }
.color-control { display:flex; align-items:center; gap:8px; }
.color-control input[type=color] { width:48px; height:36px; padding:2px; border:1px solid var(--border-color); background:transparent; }
.color-control code { font-size:12px; color:var(--theme-secondary); }
.logo-management { display:grid; grid-template-columns:1fr 180px; gap:24px; align-items:start; padding-top:18px; border-top:1px solid var(--border-color); }
.logo-management h3 { margin-top:0; }
.logo-preview { display:flex; justify-content:center; }
.logo-preview img { width:140px; aspect-ratio:9/16; object-fit:contain; border:1px solid var(--border-color); background:#fff; }
@media(max-width:800px){.admin-link-grid,.theme-color-grid,.logo-management{grid-template-columns:1fr}.user-management-grid{grid-template-columns:1fr}.section-title-actions{flex-direction:column}.home-logo{width:120px}}
:root {
    --brand-lime: var(--theme-accent);
    --brand-lime-hover: var(--theme-accent);
    --brand-lime-light: color-mix(in srgb, var(--theme-accent) 14%, var(--theme-surface));
    --brand-dark: var(--theme-primary);
    --brand-gray: var(--theme-secondary);
    --bg-color: var(--theme-background);
    --card-bg: var(--theme-surface);
    --text-main: var(--theme-primary);
    --text-muted: var(--theme-secondary);
}


/* Version 1.0.31 – Startseite, Themes und Benutzerstatus */
.home-page .portal-shell { padding-top: 0; }
.home-logo-wrap { margin: 0 0 14px; padding-top: 10px; }
.home-logo { width: min(520px, 92vw); aspect-ratio: 16 / 9; object-fit: contain; }
.home-title-block { margin:0 0 18px; text-align:center; }
.home-title { margin:0; text-align:center; font-size:clamp(1.45rem, 3vw, 2.15rem); }
.app-version { margin-top:4px; font-size:.72rem; font-weight:600; color:var(--text-muted); letter-spacing:.05em; }
.home-navigation { justify-content: center; padding: 10px 0 20px; }
.home-navigation .portal-nav { justify-content: center; }
.app-footer { flex-wrap: wrap; }
.alert.notice { background: var(--theme-notice); color: var(--theme-primary); border: 1px solid var(--theme-secondary); }
.design-section { border-left: 5px solid var(--theme-accent); border-radius: var(--radius); }
.theme-picker { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.theme-picker select { min-width: 280px; min-height:42px; padding:9px 11px; border:1px solid var(--border-color); border-radius:var(--radius); background:var(--theme-surface); color:var(--theme-primary); }
.theme-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:18px; padding-top:18px; border-top:1px solid var(--border-color); }
.inline-tool-form { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.inline-tool-form input:not([type=file]) { flex:1; min-width:180px; min-height:42px; padding:9px 11px; border:1px solid var(--border-color); border-radius:var(--radius); }
.design-action-row { display:flex; gap:12px; flex-wrap:wrap; }
.logo-management { grid-template-columns:1fr minmax(260px,420px); }
.logo-preview img { width:100%; max-width:420px; aspect-ratio:16/9; object-fit:contain; }
.user-existing-card.user-warning-card { background: var(--theme-warning); border-color: var(--theme-secondary); }
.user-account-state.is-warning { color: var(--theme-primary); }
@media(max-width:800px){.theme-tools{grid-template-columns:1fr}.theme-picker select{min-width:100%}.logo-management{grid-template-columns:1fr}.home-logo{width:100%}}

/* Version 1.0.32 – einheitliche Formularfelder, Buttons und Passwortanzeige */
:root {
    --control-height: 42px;
    --control-padding-x: 12px;
    --control-border: var(--border-color, #cfd5c4);
    --control-bg: var(--theme-surface, #fff);
    --control-text: var(--theme-primary, #263000);
    --control-disabled-bg: color-mix(in srgb, var(--theme-secondary, #66705b) 8%, var(--theme-surface, #fff));
}

/* Alle klassischen Eingabefelder erhalten dieselbe Grundform. */
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
select,
textarea {
    width: 100%;
    min-width: 0;
    min-height: var(--control-height);
    padding: 9px var(--control-padding-x);
    border: 1px solid var(--control-border);
    border-radius: var(--radius, 8px);
    background: var(--control-bg);
    color: var(--control-text);
    font: inherit;
    font-size: 14px;
    line-height: 1.35;
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
textarea {
    min-height: 88px;
    height: auto;
    resize: vertical;
}
select {
    cursor: pointer;
}
input::placeholder,
textarea::placeholder {
    color: color-mix(in srgb, var(--theme-secondary, #66705b) 78%, transparent);
    opacity: 1;
}
input:disabled,
select:disabled,
textarea:disabled,
input[readonly],
textarea[readonly] {
    background: var(--control-disabled-bg);
    color: var(--theme-secondary, #66705b);
    cursor: not-allowed;
    opacity: 1;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--theme-accent, #a8c400) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-accent, #a8c400) 22%, transparent) !important;
}
input[type="file"] {
    width: 100%;
    min-height: var(--control-height);
    padding: 6px;
    border: 1px solid var(--control-border);
    border-radius: var(--radius, 8px);
    background: var(--control-bg);
    color: var(--control-text);
}
input[type="file"]::file-selector-button {
    min-height: 30px;
    margin-right: 10px;
    padding: 5px 11px;
    border: 1px solid var(--control-border);
    border-radius: calc(var(--radius, 8px) - 2px);
    background: var(--theme-surface, #fff);
    color: var(--theme-primary, #263000);
    font: inherit;
    font-weight: 650;
    cursor: pointer;
}

/* Einheitliche Schaltflächen – bestehende Bedeutungsfarben bleiben erhalten. */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.btn-outline,
a.btn-outline {
    min-height: 38px;
    padding: 8px 14px;
    border-radius: var(--radius, 8px);
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .05s ease, box-shadow .15s ease;
}
button:not(.btn-outline):not(.password-visibility-toggle):not(.field-action-icon):not(.btn-remove-row):not(.contact-item-drag-handle):not(.other-info-drag-handle),
input[type="submit"],
input[type="button"],
input[type="reset"] {
    border: 1px solid var(--theme-accent, #a8c400);
    background: var(--theme-accent, #a8c400);
    color: var(--theme-primary, #263000);
}
button:hover:not(:disabled),
input[type="submit"]:hover:not(:disabled),
input[type="button"]:hover:not(:disabled),
input[type="reset"]:hover:not(:disabled),
.btn-outline:hover,
a.btn-outline:hover {
    filter: brightness(.97);
}
button:active:not(:disabled),
input[type="submit"]:active:not(:disabled),
input[type="button"]:active:not(:disabled),
input[type="reset"]:active:not(:disabled),
.btn-outline:active,
a.btn-outline:active {
    transform: translateY(1px);
}
button:focus-visible,
input[type="submit"]:focus-visible,
input[type="button"]:focus-visible,
input[type="reset"]:focus-visible,
.btn-outline:focus-visible,
a.btn-outline:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-accent, #a8c400) 28%, transparent);
}
button:disabled,
input[type="submit"]:disabled,
input[type="button"]:disabled,
input[type="reset"]:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}

/* Auge steht im Feld; das Passwortfeld wird automatisch um dessen Breite gekürzt. */
.password-field-wrap {
    position: relative;
    display: block;
    width: 100%;
    min-width: 0;
}
.password-field-wrap > input {
    width: 100% !important;
    padding-right: 46px !important;
    margin-left: 0;
    margin-right: 0;
}
.password-visibility-toggle {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 4px;
    width: 36px;
    min-width: 36px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    margin: 0;
    transform: translateY(-50%);
    border: 0 !important;
    border-radius: 6px;
    background: transparent !important;
    color: var(--theme-secondary, #66705b) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none !important;
}
.password-visibility-toggle:hover {
    background: color-mix(in srgb, var(--theme-accent, #a8c400) 13%, transparent) !important;
    color: var(--theme-primary, #263000) !important;
    filter: none !important;
}
.password-visibility-toggle:active {
    transform: translateY(-50%) !important;
}
.password-visibility-toggle svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Alte, seitenbezogene Sonderregeln dürfen die einheitliche Höhe nicht übersteuern. */
.login-card input,
.password-modal-content input,
.user-management-grid input:not([type="checkbox"]),
.user-management-grid select,
.compact-account-form input,
.inline-tool-form input:not([type="file"]),
.theme-picker select,
.archived-log-select select {
    min-height: var(--control-height);
    padding: 9px var(--control-padding-x);
    border: 1px solid var(--control-border);
    border-radius: var(--radius, 8px);
    background: var(--control-bg);
    color: var(--control-text);
}
.login-card .password-field-wrap,
.compact-account-form .password-field-wrap,
.user-management-grid .password-field-wrap,
.password-modal-content .password-field-wrap {
    width: 100%;
}

@media (max-width: 600px) {
    button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"],
    .btn-outline,
    a.btn-outline {
        min-height: 42px;
    }
}

/* Version 1.1.0 – vollständiger UI-Feinschliff */
:root {
    --control-height: 44px;
    --button-height: 40px;
    --ui-gap: 10px;
}

/* Labels und Feldgruppen */
.field-group,
.form-group {
    min-width: 0;
}
.field-group > label,
.form-group > label,
.login-card label,
.password-modal-content label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
}

/* Einheitliche Feldhöhe und vertikale Ausrichtung */
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):not([type="hidden"]),
select {
    height: var(--control-height);
    min-height: var(--control-height);
    padding-top: 0;
    padding-bottom: 0;
}
textarea {
    min-height: 96px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/* Buttons in der gesamten Anwendung */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.btn-outline,
a.btn-outline {
    min-height: var(--button-height);
    padding: 9px 14px;
    display: inline-flex;
    gap: 7px;
    white-space: normal;
    text-align: center;
}

/* Passwortfeld: Das Auge bleibt garantiert rechts und überdeckt nie den Text. */
.password-field-wrap {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
}
.password-field-wrap > input {
    display: block !important;
    width: 100% !important;
    height: var(--control-height) !important;
    padding-right: 48px !important;
}
.password-field-wrap > .password-visibility-toggle,
.compact-account-form .password-field-wrap > .password-visibility-toggle,
.login-card .password-field-wrap > .password-visibility-toggle,
.user-management-grid .password-field-wrap > .password-visibility-toggle,
.password-modal-content .password-field-wrap > .password-visibility-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 5px !important;
    left: auto !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
    line-height: 1 !important;
}
.password-field-wrap > .password-visibility-toggle:hover,
.password-field-wrap > .password-visibility-toggle:active {
    transform: translateY(-50%) !important;
}

/* Benutzer-Menü ruhiger, breiter und sauber gegliedert */
.user-menu-panel {
    width: min(380px, calc(100vw - 24px));
    padding: 16px;
    gap: 12px;
}
.user-menu-status {
    padding-bottom: 11px;
}
.password-menu {
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    padding: 2px 0 10px;
}
.password-menu > summary {
    padding: 10px 2px;
    line-height: 1.3;
}
.compact-account-form {
    gap: 9px;
    padding-top: 4px;
}
.compact-account-form > button[type="submit"] {
    width: 100%;
    margin-top: 1px;
}
.simulation-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}
.simulation-actions form,
.simulation-actions button {
    width: 100%;
}
.simulation-actions button {
    min-height: 44px;
    padding-left: 8px;
    padding-right: 8px;
    line-height: 1.15;
}
.logout-link {
    margin-top: 2px;
    min-height: var(--button-height);
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Karten, Werkzeugleisten und Aktionsbereiche */
.user-row-actions,
.design-action-row,
.event-row-buttons,
.password-modal-actions,
.section-title-actions,
.inline-tool-form {
    gap: var(--ui-gap);
}
.user-row-actions button,
.event-row-buttons button,
.event-row-buttons a,
.password-modal-actions button {
    min-height: var(--button-height);
}

/* Fokus und Hover ohne springende Abmessungen */
button:hover:not(:disabled),
.btn-outline:hover,
a.btn-outline:hover {
    transform: none;
}
button:active:not(:disabled),
.btn-outline:active,
a.btn-outline:active {
    transform: translateY(1px);
}

@media (max-width: 800px) {
    .user-menu-panel {
        width: min(380px, calc(100vw - 24px));
    }
}
@media (max-width: 420px) {
    .simulation-actions {
        grid-template-columns: 1fr;
    }
}


/* Stabilisierung und UI-Feinschliff – Version 1.1.1 */
:root {
    --ui-control-height: 44px;
    --ui-control-radius: 9px;
    --ui-space-1: 4px;
    --ui-space-2: 8px;
    --ui-space-3: 12px;
    --ui-space-4: 16px;
    --ui-space-5: 24px;
}

/* Login immer exakt im sichtbaren Bereich zentrieren */
body.login-page {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    display: grid !important;
    place-items: center !important;
    padding: 20px !important;
}
body.login-page .login-card {
    margin: 0 !important;
    align-self: center !important;
    justify-self: center !important;
}

/* Einheitliches Grundraster für Formulare */
.event-detail-page input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.event-detail-page select,
.event-detail-page button,
.event-detail-page .btn-outline {
    min-height: var(--ui-control-height);
}
.event-detail-page input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.event-detail-page select,
.event-detail-page textarea {
    border-radius: var(--ui-control-radius);
}
.event-detail-page .form-row {
    gap: var(--ui-space-4);
}
.event-detail-page .form-group {
    min-width: 0;
}
.event-detail-page .form-group > label,
.event-detail-page .field-label-with-button {
    margin-bottom: 7px;
}

/* Akkordeons durchgehend identisch */
.event-detail-page .collapsible-section {
    border: 1px solid var(--border-color) !important;
    border-left: 4px solid var(--theme-accent, var(--brand-lime)) !important;
    border-radius: 9px !important;
    overflow: clip;
}
.event-detail-page .collapsible-section > summary {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 11px 16px !important;
    border: 0 !important;
    background: var(--card-bg, #fff);
}
.event-detail-page .collapsible-section[open] > summary {
    background: var(--accent-soft, var(--brand-lime-light));
    border-bottom: 1px solid var(--border-color) !important;
}
.event-detail-page .collapsible-content {
    padding: 20px !important;
}

/* Aktionsleisten und Buttons sauber ausrichten */
.event-page-home-links,
.toggle-all-container,
.toggle-all-actions,
.maps-buttons,
.btn-group {
    align-items: center !important;
}
.event-page-home-links,
.toggle-all-container {
    gap: 10px !important;
    flex-wrap: wrap;
}
.event-page-home-links > *,
.toggle-all-container > button,
.toggle-all-actions > button,
.maps-buttons > * {
    margin: 0 !important;
    vertical-align: middle;
}
.btn-outline,
button,
a.btn-outline {
    line-height: 1.2 !important;
}
.btn-manage-event-types {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
}
.field-label-with-button {
    min-height: 40px;
    align-items: center !important;
}

/* Speichern bleibt beim Hover vollständig an derselben Position */
.btn-floating-save,
.btn-floating-save:hover,
.btn-floating-save:focus-visible,
.btn-floating-save:active {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    border: 1px solid transparent !important;
    transform: translateY(-50%) !important;
}
.btn-floating-save:hover {
    background-color: var(--brand-lime-hover) !important;
    box-shadow: 0 6px 18px rgba(153,176,35,.42) !important;
}
.btn-floating-save:active {
    transform: translateY(-50%) !important;
}
.btn-floating-save .icon {
    width: 21px !important;
    height: 21px !important;
}

/* Seitenanfang-Button sichtbar und dimensionsstabil */
.scroll-to-top-button,
.scroll-to-top-button:hover,
.scroll-to-top-button:active,
.scroll-to-top-button:focus-visible {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
}
.scroll-to-top-button:hover,
.scroll-to-top-button:active {
    transform: translateY(-50%) scale(1) !important;
}

/* Kompakte, klar erkennbare Drag-and-Drop-Zeilen */
.timeline-row,
.contact-item-row,
.other-info-row {
    position: relative;
    min-height: 58px;
    gap: 10px !important;
    padding: 7px 9px !important;
    margin-bottom: 8px !important;
    background: var(--card-bg, #fff) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 9px !important;
    transition: border-color .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.timeline-row input,
.contact-item-row input {
    margin: 0 !important;
}
.timeline-row input[type="time"] {
    width: 118px !important;
    flex: 0 0 118px !important;
}
.timeline-row input[type="text"] {
    min-width: 140px;
}
.timeline-drag-handle,
.contact-item-drag-handle,
.other-info-drag-handle {
    width: 36px !important;
    min-width: 36px !important;
    flex: 0 0 36px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    border: 1px solid var(--theme-accent, var(--brand-lime)) !important;
    border-radius: 8px !important;
    background: var(--theme-accent, var(--brand-lime)) !important;
    color: var(--theme-primary, #fff) !important;
    font-size: 0 !important;
    cursor: grab !important;
    touch-action: none !important;
    user-select: none !important;
}
.timeline-drag-handle::before,
.contact-item-drag-handle::before,
.other-info-drag-handle::before {
    content: "⠿";
    font-size: 21px;
    line-height: 1;
    color: currentColor;
}
.timeline-drag-handle svg { display: none !important; }
.timeline-drag-handle:active,
.contact-item-drag-handle:active,
.other-info-drag-handle:active { cursor: grabbing !important; }
.timeline-row.is-dragging,
.contact-item-row.is-dragging,
.other-info-row.is-dragging {
    opacity: .72;
    border-color: var(--theme-accent, var(--brand-lime)) !important;
    box-shadow: 0 9px 24px rgba(0,0,0,.16);
    z-index: 20;
}
.timeline-row.drag-over,
.contact-item-row.drag-over,
.other-info-row.drag-over {
    box-shadow: inset 0 3px 0 var(--theme-accent, var(--brand-lime));
}
.btn-remove-row {
    width: 36px !important;
    min-width: 36px !important;
    flex: 0 0 36px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
}
.timeline-drag-help {
    margin: 2px 0 9px !important;
}

/* Hinzufügen-Buttons bündig mit den Zeileninhalten */
#timeline-container + .btn-outline,
#contact-items-container + .btn-outline,
#other-info-container + .btn-outline {
    margin-top: 4px;
}

@media (max-width: 760px) {
    .timeline-row {
        display: grid !important;
        grid-template-columns: 36px minmax(100px, .55fr) minmax(140px, 1.45fr) 36px;
    }
    .timeline-row input[type="time"] {
        width: 100% !important;
        min-width: 0 !important;
        flex: initial !important;
    }
}

/* Theme editor 1.1.2 */
body, body.portal-page { color: var(--theme-text-1, var(--theme-primary)); }
.section-help, .app-footer, .field-help, small { color: var(--theme-text-2, var(--theme-secondary)); }
input, textarea, select { color: var(--theme-text-1, var(--theme-primary)); }
input::placeholder, textarea::placeholder { color: color-mix(in srgb, var(--theme-text-2, var(--theme-secondary)) 78%, transparent); }
.design-section h2, .design-section label, .design-section code { color: var(--theme-text-1, var(--theme-primary)); }
.theme-library { margin-top: 22px; }
.design-action-row { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; align-items:center; }
.design-action-row button { min-width:150px; }
.design-action-row button:disabled { opacity:.45; cursor:not-allowed; }
.theme-tools { grid-template-columns:repeat(3,minmax(0,1fr)); }
.inline-tool-form { display:flex; flex-direction:column; gap:10px; align-items:stretch; }
.inline-tool-form select { width:100%; }
@media(max-width:1000px){.theme-tools{grid-template-columns:1fr}.design-action-row button{flex:1 1 180px}}


/* Version 1.1.3 – konsistente Klappindikatoren, Grunddaten und Upload-Dialog */
details > summary { list-style:none; }
details > summary::-webkit-details-marker { display:none; }
details > summary.has-collapse-indicator { display:flex; align-items:center; gap:10px; }
details > summary.has-collapse-indicator::after { content:""; width:9px; height:9px; flex:0 0 9px; margin-left:auto; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); transition:transform .18s ease; }
details[open] > summary.has-collapse-indicator::after { transform:rotate(225deg); }
.admin-collapsible .collapse-icon { display:none !important; }
.user-menu > summary.has-collapse-indicator::after,.password-menu > summary.has-collapse-indicator::after { width:7px;height:7px;flex-basis:7px; }
.event-detail-page .collapsible-section > summary.has-collapse-indicator::after { margin-right:3px; }

.event-detail-page .basic-event-row { align-items:flex-start; }
.event-detail-page .basic-event-row > .form-group { display:flex; flex-direction:column; }
.event-detail-page .basic-event-row > .form-group > label { min-height:20px; display:flex; align-items:center; margin-bottom:7px; }
.event-type-control-row { display:flex; align-items:stretch; gap:8px; min-height:var(--ui-control-height,40px); }
.event-type-control-row select { flex:1; min-width:0; margin:0 !important; }
.event-type-control-row .btn-manage-event-types { flex:0 0 40px; }

.design-heading-row { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.design-heading-row h2 { margin:0; }
.current-theme-badge { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:7px 10px; border:1px solid var(--border-color); border-radius:8px; background:var(--theme-surface,#fff); color:var(--theme-text-2); }
.btn-current-theme-save { background:var(--theme-warning)!important; color:var(--theme-text-1)!important; border-color:var(--theme-primary)!important; box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-warning) 45%,transparent); }
.theme-library { margin-top:20px; }

.native-file-input { position:absolute!important; width:1px!important; height:1px!important; opacity:0!important; pointer-events:none!important; }
.file-upload-trigger { margin-right:8px; }
.selected-file-name { display:inline-block; max-width:320px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; color:var(--theme-text-2); font-size:14px; }
.file-upload-modal { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:20px; background:rgba(0,0,0,.52); }
.file-upload-modal[hidden] { display:none!important; }
.file-upload-dialog { position:relative; width:min(520px,100%); background:var(--theme-surface,#fff); color:var(--theme-text-1); border:1px solid var(--border-color); border-radius:12px; box-shadow:0 24px 70px rgba(0,0,0,.28); padding:24px; }
.file-upload-dialog h2 { margin:0 40px 18px 0; }
.file-upload-close { position:absolute; right:14px; top:12px; width:36px!important; min-width:36px!important; height:36px!important; min-height:36px!important; padding:0!important; background:transparent!important; color:var(--theme-text-1)!important; border:0!important; font-size:27px; }
.file-drop-zone { min-height:220px; border:2px dashed var(--theme-secondary); border-radius:10px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:8px; text-align:center; padding:28px; cursor:pointer; background:color-mix(in srgb,var(--theme-notice) 18%,var(--theme-surface)); transition:.18s ease; }
.file-drop-zone:hover,.file-drop-zone:focus,.file-drop-zone.is-dragover { border-color:var(--theme-primary); background:color-mix(in srgb,var(--theme-notice) 36%,var(--theme-surface)); outline:none; }
.file-drop-zone svg { width:48px; height:48px; fill:none; stroke:currentColor; stroke-width:1.7; }
.file-drop-zone span,.file-upload-name { color:var(--theme-text-2); }
.file-upload-name { margin-top:12px; min-height:22px; overflow-wrap:anywhere; }
.file-upload-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
body.modal-open { overflow:hidden; }
/* Formularbaukasten */
.form-builder-page{display:grid;gap:20px}.builder-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.builder-elements{display:grid;gap:10px;margin-bottom:16px}.builder-element{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid var(--border-color,#d6ddd9);border-radius:10px;background:var(--surface-color,#fff)}.builder-handle{font-size:20px;cursor:grab;padding-top:25px}.builder-element-main{flex:1}.builder-field-grid{display:grid;grid-template-columns:2fr 1fr 1fr 2fr;gap:12px}.saved-template-list{display:grid;gap:10px}.saved-template-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border:1px solid var(--border-color,#d6ddd9);border-radius:10px}.saved-template-row small{display:block;opacity:.7}.custom-template-section[hidden]{display:none}.custom-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.custom-form-field.width-1{grid-column:span 1}.custom-form-field.width-2{grid-column:span 2}.custom-form-field.width-3{grid-column:span 3}.custom-form-field.width-4,.custom-form-section-title{grid-column:1/-1}.custom-form-section-title{margin:10px 0 0;padding-bottom:6px;border-bottom:1px solid var(--border-color,#d6ddd9)}
@media(max-width:800px){.builder-field-grid,.custom-form-grid{grid-template-columns:1fr}.custom-form-field[class*="width-"]{grid-column:1}.builder-element{align-items:stretch}.builder-handle{display:none}}
.builder-element.is-dragging{opacity:.45}.builder-element[draggable="true"] .builder-handle{user-select:none}

/* Formularbaukasten: Live-Vorschau und gespeicherte Vorlagen */
.builder-preview-panel{margin:18px 0;padding:18px;border:2px solid var(--primary-color,#176b4d);border-radius:12px;background:var(--surface-color,#fff)}
.builder-preview-panel[hidden],.builder-modal[hidden]{display:none!important}
.builder-preview-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}
.builder-preview-head h2,.builder-preview-head h3{margin:0}
.builder-preview-head span{font-size:.85rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--primary-color,#176b4d)}
.builder-preview-empty{grid-column:1/-1;margin:0;opacity:.7}
.saved-template-actions{display:flex;align-items:center;gap:8px}.saved-template-actions form{margin:0}
.builder-modal{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:24px;background:rgba(0,0,0,.55)}
.builder-modal-card{width:min(1000px,100%);max-height:90vh;overflow:auto;padding:22px;border-radius:14px;background:var(--surface-color,#fff);box-shadow:0 24px 70px rgba(0,0,0,.28)}
body.modal-open{overflow:hidden}

/* Formularbaukasten 1.1.7 */
.builder-fixed-section{position:relative;border:2px solid var(--accent-color,#8d5b38);border-radius:14px;padding:18px;margin:18px 0;background:rgba(127,127,127,.06)}
.builder-fixed-section h3{margin:0 0 12px}.builder-fixed-badge{position:absolute;right:14px;top:12px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;opacity:.75}
.builder-fixed-section small{display:block;margin-top:8px;opacity:.75}.custom-template-section[hidden],.standard-event-section[hidden],.standard-location-fields[hidden]{display:none!important}
.custom-template-section>.collapsible-section{margin-bottom:14px}

/* Formularbaukasten 1.1.8 – direkte Formularbearbeitung */
.wysiwyg-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:16px 0}.new-element-tool{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:8px;min-width:178px;padding:10px 14px;border:2px dashed var(--primary-color,#176b4d);border-radius:12px;background:rgba(23,107,77,.06);cursor:grab;user-select:none}.new-element-tool:active{cursor:grabbing}.new-element-tool.dragging{opacity:.55}.new-element-tool .new-element-plus{grid-row:1/3;font-size:1.9rem;line-height:1;color:var(--primary-color,#176b4d)}.new-element-tool strong{line-height:1.1}.new-element-tool small{opacity:.7}.builder-canvas{padding:16px;border:1px solid var(--border-color,#d6ddd9);border-radius:14px;background:rgba(127,127,127,.035);margin-bottom:18px}.builder-elements-wysiwyg{display:grid;gap:12px}.builder-live-section{position:relative}.builder-live-section[draggable="true"]>summary{cursor:grab}.builder-live-section.dragging,.builder-live-field.dragging{opacity:.38}.builder-live-section summary{display:flex;align-items:center;justify-content:space-between;gap:12px}.builder-live-section summary::marker{content:""}.builder-edit-icon{display:inline-grid;place-items:center;flex:0 0 auto;width:30px;height:30px;padding:0;border:1px solid var(--border-color,#cdd6d1);border-radius:50%;background:var(--surface-color,#fff);color:var(--primary-color,#176b4d);font-size:1rem;line-height:1;cursor:pointer}.builder-edit-icon:hover{transform:scale(1.06);border-color:var(--primary-color,#176b4d)}.builder-live-field{position:relative;padding:8px;border:1px dashed transparent;border-radius:9px;cursor:grab}.builder-live-field:hover{border-color:var(--border-color,#cdd6d1);background:rgba(127,127,127,.035)}.builder-live-field label{display:flex;align-items:center;justify-content:space-between;gap:8px}.builder-live-field .builder-edit-icon{width:26px;height:26px;font-size:.9rem}.builder-drop-zone{grid-column:1/-1;height:8px;border:2px dashed transparent;border-radius:8px;transition:.15s;position:relative}.builder-drop-zone span{display:none}.builder-drop-zone.active{height:48px;border-color:var(--primary-color,#176b4d);background:rgba(23,107,77,.08)}.builder-drop-zone.active span{display:grid;place-items:center;height:100%;font-size:.82rem;font-weight:700;color:var(--primary-color,#176b4d)}.builder-drop-zone-section{margin:2px 0}.builder-editor-card{width:min(560px,100%)}.builder-editor-actions{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;margin-top:18px}.builder-editor-actions .danger{color:#9a2424;border-color:#c98f8f}.icon-close-modal{border:0;background:transparent;font-size:2rem;line-height:1;cursor:pointer}.builder-fixed-section{margin:0 0 12px}.builder-fixed-section summary{display:flex;justify-content:space-between;align-items:center}.builder-fixed-badge{position:static;margin-left:auto}.saved-template-actions{display:flex;align-items:center;gap:8px}.saved-template-actions form{margin:0}
@media(max-width:700px){.builder-editor-actions{grid-template-columns:1fr 1fr}.builder-editor-actions span{display:none}.builder-editor-actions button{width:100%}.new-element-tool{width:100%}.builder-live-field{cursor:default}}


/* Version 1.1.9 */
.login-card-version{margin-top:16px;padding-top:12px;border-top:1px solid var(--theme-border,#d8dde3);font-size:12px;opacity:.7;text-align:center}
.event-period-section{margin:18px 0;border:1px solid var(--theme-border,#d8dde3);border-radius:14px;background:var(--theme-card,#fff);overflow:hidden}
.event-period-section>summary{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;font-weight:700;cursor:pointer;background:rgba(0,0,0,.025)}
.event-period-section>summary small{font-weight:400;opacity:.7}.event-period-section .event-overview-list{padding:10px}
.event-log-modal-content{max-width:880px}.event-log-timeline{max-height:70vh;overflow:auto;padding-right:4px}.event-log-entry{border-left:4px solid var(--theme-primary,#555);padding:12px 14px;margin:0 0 14px;background:rgba(0,0,0,.025);border-radius:8px}.event-log-entry header{display:flex;justify-content:space-between;gap:16px;margin-bottom:8px}.event-log-entry header small{opacity:.7}.log-change{margin-top:10px;padding:10px;border-radius:8px;background:#fff}.log-change.log-added{border-left:4px solid #2e8b57}.log-change.log-changed{border-left:4px solid #d98c00}.log-change.log-deleted{border-left:4px solid #b33}.log-change>div{display:grid;grid-template-columns:42px 1fr;gap:8px;margin-top:6px}.log-change pre{white-space:pre-wrap;margin:0;font:inherit;overflow-wrap:anywhere}
.company-person-grid{display:grid!important;grid-template-columns:1fr 1fr auto;gap:18px 12px;align-items:end;position:relative;padding-top:22px}.company-person-grid .contact-item-drag-handle{grid-row:1/3}.company-person-grid input[name="contact_item_name[]"]{grid-column:2}.company-person-grid .company-position-field{grid-column:3}.company-person-grid input[name="contact_item_phone[]"]{grid-column:2;grid-row:2}.company-person-grid input[name="contact_item_email[]"]{grid-column:3;grid-row:2}.company-person-grid .btn-remove-row{grid-column:4;grid-row:1/3}.contact-field-label{position:absolute;font-size:12px;font-weight:600;opacity:.75}.name-label{left:52px;top:0}.position-label{left:calc(50% + 34px);top:0}.phone-label{left:52px;top:76px}.email-label{left:calc(50% + 34px);top:76px}


/* Stabilisierung der Übersichten und Formulare – Version 1.1.10 */

/* Eventkarten: feste Spalten, keine Überlappungen, kompakte Höhe */
.event-overview-row.event-overview-row-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(210px, auto);
    align-items: center !important;
    gap: 12px !important;
    min-height: 0;
    padding: 10px 12px !important;
}
.event-row-link {
    display: grid !important;
    grid-template-columns: 145px minmax(0, 1fr) 96px !important;
    align-items: center;
    gap: 14px !important;
    min-width: 0;
}
.event-date-block {
    min-width: 0;
}
.event-date-block span,
.event-date-block small {
    display: block;
    white-space: nowrap;
}
.event-date-block small {
    overflow: hidden;
    text-overflow: ellipsis;
}
.event-list-main {
    display: grid;
    gap: 2px;
    min-width: 0;
}
.event-list-main strong,
.event-list-main small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.event-list-time {
    min-width: 96px;
    white-space: nowrap;
    text-align: right;
    align-self: center;
}
.event-row-buttons {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(96px, 1fr));
    gap: 6px !important;
    align-items: stretch;
    width: 100%;
    max-width: 250px;
}
.event-row-buttons > *,
.event-row-buttons form,
.event-row-buttons button,
.event-row-buttons a {
    min-width: 0;
    width: 100%;
    margin: 0;
}
.event-row-buttons button,
.event-row-buttons a {
    min-height: 38px !important;
    padding: 7px 10px !important;
    line-height: 1.15;
    justify-content: center;
}

/* Kontakt-/Personenzeilen: stabile beschriftete Spalten */
.contact-item-row.company-person-grid {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) minmax(0, 1fr) 36px;
    grid-template-areas:
        "drag name position remove"
        "drag phone email remove";
    gap: 10px 12px;
    align-items: end;
    padding: 12px !important;
    position: relative;
}
.contact-item-drag-handle { grid-area: drag; align-self: stretch; min-height: 44px; }
.contact-field { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.contact-field label { margin: 0; min-height: 18px; }
.contact-field input { min-width: 0; width: 100%; }
.contact-field-name { grid-area: name; }
.contact-field-position { grid-area: position; }
.contact-field-phone { grid-area: phone; }
.contact-field-email { grid-area: email; }
.contact-remove-button { grid-area: remove; align-self: stretch; min-height: 44px; }
.contact-field-label { display: none !important; }

/* Nicht-Firmenevents: Name oben über volle Breite, Telefon/E-Mail darunter */
.contact-item-row.company-person-grid:not(.company-contact-row) {
    grid-template-areas:
        "drag name name remove"
        "drag phone email remove";
}

/* Echte Zeilenumbrüche in allen mehrzeiligen Eingaben sichtbar halten */
textarea {
    white-space: pre-wrap;
    overflow-wrap: break-word;
    line-height: 1.45;
}
.event-log-entry pre,
.print-value,
.field-display-value {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    .event-overview-row.event-overview-row-actions {
        grid-template-columns: 1fr;
        align-items: stretch !important;
    }
    .event-row-buttons {
        max-width: none;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (max-width: 700px) {
    .event-row-link {
        grid-template-columns: 1fr auto !important;
        gap: 7px 10px !important;
    }
    .event-date-block { grid-column: 1; }
    .event-list-main { grid-column: 1 / -1; grid-row: 2; }
    .event-list-time { grid-column: 2; grid-row: 1; }
    .event-row-buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .event-list-main strong,
    .event-list-main small {
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .contact-item-row.company-person-grid,
    .contact-item-row.company-person-grid:not(.company-contact-row) {
        grid-template-columns: 36px minmax(0, 1fr) 36px;
        grid-template-areas:
            "drag name remove"
            "drag position remove"
            "drag phone remove"
            "drag email remove";
    }
}


.copy-event-modal-content {
    max-width: 480px;
}

.copy-event-modal-content .form-group {
    margin-top: 18px;
}

.btn-copy-event {
    white-space: nowrap;
}


/* Version 1.1.14: Event-Wiederherstellung und Zusatzfelder */
.location-contact-row {
    margin-top: 14px;
    align-items: stretch;
}

.location-contact-row .form-group {
    display: flex;
    flex-direction: column;
}

.location-contact-row textarea {
    flex: 1;
    min-height: 88px;
}

.wedding-person-info textarea {
    min-height: 76px;
}

.event-log-entry > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.event-log-entry > header > div {
    min-width: 0;
}

.event-log-restore-form {
    flex: 0 0 auto;
    margin: 0;
}

.btn-log-restore {
    min-height: 34px !important;
    padding: 6px 10px !important;
    white-space: nowrap;
}

.event-log-no-snapshot {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 11px;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .event-log-entry > header {
        flex-direction: column;
    }

    .event-log-restore-form,
    .btn-log-restore {
        width: 100%;
    }
}


/* Version 1.1.16: echte Eventsuche */
.event-search-section {
    position: relative;
}

.event-search-hint {
    margin: 6px 0 0;
    color: var(--text-muted);
    font-size: 12px;
}

.event-search-results {
    margin-top: 8px;
    border: 1px solid var(--border-color);
    border-radius: var(--radius);
    background: var(--surface-color);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
    overflow: hidden;
    position: relative;
    z-index: 20;
}

.event-search-result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 13px;
    border-bottom: 1px solid var(--border-color);
    color: var(--text-color);
    text-decoration: none;
}

.event-search-result:last-child {
    border-bottom: 0;
}

.event-search-result:hover,
.event-search-result:focus-visible {
    background: color-mix(
        in srgb,
        var(--accent-color) 10%,
        var(--surface-color)
    );
}

.event-search-result-main {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.event-search-result-main strong,
.event-search-result-main small {
    overflow-wrap: anywhere;
}

.event-search-result-main small {
    color: var(--text-muted);
}

.event-search-status {
    flex: 0 0 auto;
    padding: 4px 8px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
}

.event-search-result-active .event-search-status {
    color: var(--primary-color);
}

.event-search-result-archive .event-search-status {
    color: var(--notice-color);
}

.event-search-result-trash .event-search-status {
    color: var(--warning-color);
}

.event-search-empty {
    padding: 13px;
    color: var(--text-muted);
}

.admin-search-target:target {
    outline: 3px solid var(--notice-color);
    outline-offset: 3px;
}

@media (max-width: 600px) {
    .event-search-result {
        align-items: flex-start;
    }
}

/* Version 1.1.18 */
.event-action-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:16px 0;flex-wrap:wrap}.event-actions-menu{position:relative;z-index:30}.event-actions-menu>summary{list-style:none;min-width:190px;justify-content:center}.event-actions-menu>summary::-webkit-details-marker{display:none}.event-actions-menu>summary::after{content:'▾';margin-left:auto}.event-actions-menu[open]>summary::after{content:'▴'}.event-actions-dropdown{position:absolute;top:calc(100% + 6px);left:0;min-width:270px;padding:8px;display:grid;gap:6px;background:var(--card-bg);border:1px solid var(--border-color);border-radius:var(--radius);box-shadow:0 12px 28px rgba(0,0,0,.16)}.event-actions-dropdown .btn-outline{width:100%;min-height:44px;justify-content:flex-start}.section-toggle-group{display:flex}.section-toggle-group .btn-outline{min-height:44px;border-radius:0}.section-toggle-group .btn-outline:first-child{border-radius:var(--radius) 0 0 var(--radius)}.section-toggle-group .btn-outline:last-child{border-radius:0 var(--radius) var(--radius) 0;margin-left:-1px}.field-with-inline-actions{display:flex;gap:8px;align-items:center}.field-with-inline-actions input{flex:1;min-width:0}.icon-only{width:44px;min-width:44px;padding:0;justify-content:center}.location-admin-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:20px}.portal-panel{background:var(--card-bg);border:1px solid var(--border-color);border-left:4px solid var(--brand-lime);border-radius:12px;padding:22px}.location-list{display:grid;gap:10px}.location-card{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border:1px solid var(--border-color);border-radius:var(--radius)}.location-card strong,.location-card small{display:block}.location-card small{margin-top:4px;color:var(--text-muted)}@media(max-width:760px){.location-admin-grid{grid-template-columns:1fr}.event-actions-dropdown{position:fixed;left:12px;right:12px;top:auto;min-width:0}.event-action-toolbar,.section-toggle-group{width:100%}.event-actions-menu,.event-actions-menu>summary{width:100%}.section-toggle-group .btn-outline{flex:1}}


/* Version 1.1.19 */
select.yes-selected{background:var(--theme-positive)!important;border-color:color-mix(in srgb,var(--theme-positive) 65%,#39733b)!important}select.no-selected{background:var(--theme-negative)!important;border-color:color-mix(in srgb,var(--theme-negative) 65%,#8b3030)!important}.today-events-panel{margin-bottom:22px}.today-event-list{display:grid;gap:10px}.today-event-card{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:14px;border:1px solid var(--border-color);border-left:4px solid var(--theme-accent);border-radius:var(--radius);text-decoration:none;color:var(--theme-text-1);background:var(--theme-surface)}.today-event-card span{color:var(--theme-text-2)}.today-event-card b{grid-column:2;grid-row:1/3;align-self:center}.location-admin-grid{display:block}.location-admin-grid>.portal-panel+ .portal-panel,.portal-panel+.portal-panel{margin-top:20px}.location-image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-top:18px}.location-image-gallery figure{margin:0;border:1px solid var(--border-color);border-radius:var(--radius);padding:8px}.location-image-gallery img,.location-modal-image{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px}.location-info-grid{display:grid;gap:12px}.location-info-grid>div{display:grid;gap:4px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.location-info-grid strong{font-size:12px;color:var(--theme-text-2)}.location-info-modal-content{max-width:760px}.event-period-section[hidden]{display:none!important}@media(max-width:600px){.today-event-card{grid-template-columns:1fr}.today-event-card b{grid-column:auto;grid-row:auto}}


/* Live-Modus */
.btn-live-mode { gap: 7px; }
.live-mode-button-count { min-width: 22px; height: 22px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:var(--theme-primary); color:var(--theme-surface); font-size:11px; font-weight:800; }
.live-mode-backdrop { position:fixed; inset:0; z-index:4190; background:rgba(0,0,0,.42); backdrop-filter:blur(2px); }
.live-mode-panel { position:fixed; z-index:4200; top:0; right:0; width:min(410px,100vw); height:100dvh; padding:20px; background:var(--theme-surface,#fff); color:var(--theme-text-1,#111); box-shadow:-18px 0 50px rgba(0,0,0,.22); overflow:auto; transform:translateX(105%); transition:transform .25s ease; }
.live-mode-panel.is-open { transform:translateX(0); }
body.live-mode-open { overflow:hidden; }
.live-mode-header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding-bottom:14px; border-bottom:1px solid var(--border-color); }
.live-mode-header h2 { margin:3px 0 3px; text-align:left; font-size:20px; }
.live-mode-header p { margin:0; color:var(--theme-text-2); font-size:13px; }
.live-mode-kicker { font-size:11px; font-weight:900; letter-spacing:.12em; color:var(--theme-primary); }
.live-mode-clock { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:18px 0; padding:16px; border:1px solid var(--border-color); border-radius:12px; }
.live-mode-clock span { font-variant-numeric:tabular-nums; font-size:34px; line-height:1; font-weight:800; }
.live-mode-clock small { text-align:right; color:var(--theme-text-2); }
.live-mode-current { padding:18px; border:2px solid var(--theme-primary); border-radius:12px; background:color-mix(in srgb,var(--theme-primary) 8%,var(--theme-surface)); }
.live-mode-current-label { display:block; margin-bottom:6px; color:var(--theme-primary); font-size:11px; font-weight:900; letter-spacing:.1em; }
.live-mode-current-label.live-now { color:var(--theme-negative,#b42318); }
.live-mode-current strong { display:block; font-size:21px; }
.live-mode-current p { margin:6px 0 0; color:var(--theme-text-2); }
.live-mode-toolbar { display:flex; gap:8px; margin:14px 0 20px; }
.live-mode-toolbar .btn-outline { flex:1; font-size:12px; }
.live-mode-schedule h3 { margin:0 0 10px; font-size:15px; }
.live-schedule-item { display:grid; grid-template-columns:58px 1fr auto; align-items:center; gap:10px; padding:12px 8px; border-top:1px solid var(--border-color); }
.live-schedule-item time { font-variant-numeric:tabular-nums; font-weight:800; }
.live-schedule-item strong,.live-schedule-item small { display:block; }
.live-schedule-item small { margin-top:2px; color:var(--theme-text-2); font-size:11px; }
.live-schedule-item.is-next { border-left:4px solid var(--theme-primary); padding-left:10px; background:color-mix(in srgb,var(--theme-primary) 6%,transparent); }
.live-schedule-item.is-now { border-left:4px solid var(--theme-negative,#b42318); padding-left:10px; }
.live-schedule-item.is-done { opacity:.48; }
.live-schedule-item.is-done strong { text-decoration:line-through; }
.live-icon-button { width:34px; height:34px; border:1px solid var(--border-color); border-radius:8px; background:var(--theme-surface); color:var(--theme-text-1); cursor:pointer; font-weight:800; }
.live-reminder-stack { position:fixed; z-index:5000; right:18px; bottom:18px; display:grid; gap:12px; width:min(360px,calc(100vw - 36px)); }
.live-reminder-card { position:relative; padding:18px; border:2px solid var(--theme-primary); border-radius:14px; background:var(--theme-surface,#fff); color:var(--theme-text-1,#111); box-shadow:0 18px 50px rgba(0,0,0,.28); animation:liveReminderIn .22s ease-out; }
.live-reminder-card > span { display:block; color:var(--theme-primary); font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; }
.live-reminder-card > strong { display:block; margin-top:5px; font-size:20px; }
.live-reminder-card > p { margin:5px 0 14px; }
.live-reminder-card > div { display:flex; justify-content:flex-end; gap:8px; }
.live-reminder-close { position:absolute; top:8px; right:8px; width:30px; height:30px; border:0; background:transparent; cursor:pointer; }
@keyframes liveReminderIn { from { opacity:0; transform:translateY(16px) scale(.97); } to { opacity:1; transform:none; } }
@media (max-width:650px) { .live-mode-panel { top:auto; bottom:0; width:100%; height:min(86dvh,760px); border-radius:18px 18px 0 0; transform:translateY(105%); } .live-mode-panel.is-open { transform:translateY(0); } .live-mode-clock span { font-size:29px; } .live-mode-toolbar { flex-direction:column; } }
@media (prefers-reduced-motion:reduce){.live-mode-panel,.live-reminder-card{transition:none;animation:none}}
