:root{--bg:#0b1020;--bg-soft:#131a2f;--card:#ffffff;--text:#121826;--muted:#667085;--line:#e6e8ee;--primary:#0076CB;--primary-dark:#005fA3;--success:#0f9f6e;--danger:#c62828;--shadow:0 24px 60px rgba(16,24,40,.10);--radius:20px}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(135deg,#eef1f4 0%,#e7ebef 45%,#dde3e8 100%);color:var(--text);color:var(--text)}a{color:inherit;text-decoration:none}.shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.sidebar{background:rgba(7,12,24,.72);color:#fff;padding:28px 20px;border-right:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px)}.brand{display:flex;gap:14px;align-items:center;margin-bottom:28px}.brand-badge{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),#ff6470);font-weight:800;font-size:1.25rem}.nav{display:grid;gap:8px;margin:24px 0}.nav a,.logout-form button{padding:12px 14px;border-radius:14px}.nav a:hover{background:rgba(255,255,255,.08)}.content{padding:32px;display:grid;gap:24px;background:#f4f5f7}.card{background:#f7f7f5;border:1px solid #e2e5e9;box-shadow:var(--shadow);border-radius:var(--radius);padding:24px}.page-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.eyebrow{color:var(--primary);text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;font-weight:700}h1,h2{margin:0 0 8px}.muted{color:var(--muted)}.stats-grid,.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.stat-card strong{font-size:2rem}.stack{display:grid;gap:16px}.stack-sm{display:grid;gap:12px}.field{display:grid;gap:8px}.field-full{grid-column:1 / -1}input,select,textarea{width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#f8fafc;font:inherit}input:focus,select:focus,textarea:focus{outline:2px solid rgba(0,118,203,.18);border-color:var(--primary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:14px;padding:12px 18px;background:var(--primary);color:#fff;font-weight:700;cursor:pointer}.btn:hover{background:var(--primary-dark)}.btn-secondary{background:#eef2f7;color:#111827}.btn-danger{background:var(--danger)}.actions{display:flex;gap:12px;flex-wrap:wrap}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:14px 12px;text-align:left;border-bottom:1px solid var(--line)}.badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:#eef6fd;color:var(--primary);border:1px solid #bfdcf5;font-size:.85rem;font-weight:700}.alert{padding:14px 16px;border-radius:14px}.alert-success{background:#ecfdf3;color:#067647;border:1px solid #abefc6}.alert-error{background:#eef6fd;color:#005fA3;border:1px solid #bfdcf5}.auth-wrap{min-height:calc(100vh - 64px);display:grid;place-items:center}.auth-card{width:min(480px,100%);padding:32px}.note{margin-top:16px;color:var(--muted);font-size:.95rem}.section-head,.list-item{display:flex;align-items:center;justify-content:space-between;gap:16px}.list{display:grid;gap:12px}.list-item{padding:16px;border:1px solid var(--line);border-radius:16px}.facts{display:grid;grid-template-columns:1fr 1fr;gap:14px 20px}.facts dt{color:var(--muted);font-size:.9rem}.facts dd{margin:4px 0 0;font-weight:700}@media (max-width:980px){.shell{grid-template-columns:1fr}.sidebar{padding-bottom:8px}.content{padding:20px}.page-header,.section-head,.list-item{flex-direction:column;align-items:flex-start}.stats-grid,.grid-2,.facts{grid-template-columns:1fr}}
.stats-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.badge-neutral{background:#eef2ff;color:#344054;border:1px solid #d0d5dd}.btn-sm{padding:8px 12px;font-size:.9rem}.nav-divider{margin-top:12px;padding:10px 14px 4px;color:rgba(255,255,255,.6);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}.sidebar-user{margin-top:20px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.04)}.muted-invert{color:rgba(255,255,255,.72)}.sidebar-logout{width:100%;margin-top:16px}@media (max-width:980px){.stats-grid-3{grid-template-columns:1fr}}

.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.compact-grid{align-items:end}.stats-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}@media (max-width:980px){.grid-3,.stats-grid-3{grid-template-columns:1fr}}

.card-dark{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);padding:14px;border-radius:16px;margin-bottom:16px}.filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}.filters input,.filters select{max-width:260px}.upload-grid{display:grid;gap:12px}.upload-row{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:12px}@media (max-width:980px){.upload-row{grid-template-columns:1fr}}.actions form{margin:0}.actions .btn{white-space:nowrap}.qr-grid{display:grid;grid-template-columns:320px 1fr;gap:24px;align-items:start}.qr-preview{display:flex;align-items:center;justify-content:center;padding:16px;border:1px dashed var(--line);border-radius:16px;background:#fcfcfa}.qr-image{width:100%;max-width:280px;height:auto;display:block}@media (max-width:980px){.qr-grid{grid-template-columns:1fr}}.inline-code{display:inline-block;padding:8px 12px;border-radius:12px;background:#111827;color:#fff;font-weight:700}.grid-3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px}.upload-row{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}@media (max-width:980px){.grid-3{grid-template-columns:1fr}}.copy-field{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.copy-input{flex:1 1 420px;background:#fcfcfa}.qr-preview{display:flex;justify-content:center;align-items:center}.qr-image{max-width:280px;width:100%;height:auto;border:1px solid var(--line);border-radius:16px;background:#fff;padding:16px}.brand{display:flex;align-items:center;justify-content:flex-start;margin-bottom:28px}.brand-logo{max-width:220px;width:100%;height:auto;display:block}
.compact-top-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}
.compact-access-grid{display:grid;grid-template-columns:280px 1fr;gap:20px;align-items:start}
.compact-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px}
.compact-facts{grid-template-columns:1fr 1fr}
.compact-list .list-item{padding:14px 16px}
@media (max-width:980px){
  .compact-top-grid,.compact-access-grid,.compact-info-grid,.compact-facts{grid-template-columns:1fr}
}

.timeline{display:flex;flex-direction:column;gap:16px;margin-top:10px}
.timeline-item{display:flex;gap:12px;align-items:flex-start}
.timeline-dot{width:10px;height:10px;border-radius:50%;background:#ef4444;margin-top:6px}
.timeline-content{background:#fcfcfa;border:1px solid #dfe3e8;padding:10px 14px;border-radius:10px;width:100%}

.distribution-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.distribution-tab{border:1px solid var(--line);background:#f8fafc;color:var(--text);padding:10px 14px;border-radius:12px;font:inherit;font-weight:700;cursor:pointer}
.distribution-tab.is-active{background:var(--primary);color:#fff;border-color:var(--primary)}
.distribution-tab-panel{display:none;gap:16px}
.distribution-tab-panel.is-active{display:grid}
.distribution-subcard{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}

.distribution-tabs{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:20px;
    padding-bottom:16px;
    border-bottom:1px solid var(--line);
}
.distribution-tab{
    width:100%;
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    white-space:nowrap;
}
.distribution-tab-panel{
    display:none;
    min-height:520px;
    align-content:start;
}
.distribution-tab-panel.is-active{
    display:grid;
}
@media (max-width:980px){
    .distribution-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .distribution-tab{
        white-space:normal;
    }
    .distribution-tab-panel{
        min-height:auto;
    }
}

.filters--compact input{max-width:320px}
.filters--compact select{max-width:180px}
.filters--compact .btn{min-height:40px;padding:0 14px}

.pagination-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:20px;padding-top:16px;border-top:1px solid #dfe3e8;flex-wrap:wrap}
.pagination-actions{display:flex;gap:8px;flex-wrap:wrap}


/* Layout-Stabilitaet / fixe Bereiche */
:root{
    --app-header-offset: 20px;
    --app-sidebar-top: 16px;
}

html{scroll-behavior:smooth}
body{overflow-y:scroll}

.shell{
    align-items:start;
    min-height:100vh;
}

.sidebar{
    position:sticky;
    top:var(--app-sidebar-top);
    align-self:start;
    max-height:calc(100vh - (var(--app-sidebar-top) * 2));
    overflow:auto;
}

.content{
    align-content:start;
    min-height:100vh;
}

.page-header{
    position:sticky;
    top:0;
    z-index:30;
    background:#f4f5f7;
    padding-top:8px;
    padding-bottom:12px;
    margin-bottom:20px;
    border-bottom:1px solid #dfe3e8;
}

.card,
.distribution-tab-panel,
.table-wrap,
.list,
.filters,
.stack,
.grid-2{
    scroll-margin-top:88px;
}

.distribution-tabs{
    position:sticky;
    top:72px;
    z-index:25;
    background:#f7f7f5;
    padding:10px 0 12px 0;
    margin-bottom:12px;
    border-bottom:1px solid #dfe3e8;
    min-height:56px;
}

.distribution-tab{
    min-height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.distribution-tab-panel{
    min-height:320px;
}

.card{
    min-width:0;
}

.list-item,
.table-wrap table tr{
    vertical-align:top;
}

.filters{
    align-items:end;
}

.filters input,
.filters select,
.filters .btn{
    min-height:42px;
}

.actions{
    align-items:center;
    flex-wrap:wrap;
}

.qr-preview{
    min-height:220px;
}

.copy-field{
    align-items:stretch;
}

.copy-input{
    min-height:42px;
}

@media (max-width: 960px){
    .sidebar{
        position:relative;
        top:auto;
        max-height:none;
        overflow:visible;
    }

    .page-header{
        position:relative;
        top:auto;
    }

    .distribution-tabs{
        position:relative;
        top:auto;
    }

    .distribution-tab-panel{
        min-height:auto;
    }
}



.sidebar{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.sidebar-footer{
    position:sticky;
    bottom:0;
    left:0;
    padding-top:14px;
    margin-top:auto;
    background:inherit;
}


@media (max-width: 960px){
    .sidebar-footer{
        position:relative;
        bottom:auto;
    }
}




/* Sidebar im Stil der Referenzdatei */
.shell{
    display:grid;
    grid-template-columns:280px 1fr;
    min-height:100vh;
}

.sidebar{
    background:rgba(7,12,24,.72);
    color:#fff;
    padding:28px 20px;
    border-right:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(18px);
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:20px;
}

.sidebar-main{
    display:grid;
    gap:16px;
    min-height:0;
}


.nav{
    display:grid;
    gap:8px;
    margin:24px 0 0;
}

.menu-link,
.nav a,

.menu-link,
.nav a{
    color:#fff;
    background:transparent;
    border:1px solid transparent;
}

.menu-link:hover,
.nav a:hover{
    background:rgba(255,255,255,.08);
    border-color:rgba(255,255,255,.08);
}

.sidebar-user{
    margin-top:20px;
    padding:14px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    background:rgba(255,255,255,.04);
}

.muted-invert{
    color:rgba(255,255,255,.72);
}

.nav-divider{
    margin-top:12px;
    padding:10px 14px 4px;
    color:rgba(255,255,255,.6);
    font-size:.8rem;
    text-transform:uppercase;
    letter-spacing:.08em;
}


.sidebar-footer{
    padding-top:0;
    margin-top:0;
    border-top:none;
}

.sidebar-footer-link{
    margin:0;
}

@media (max-width:980px){
    .shell{
        grid-template-columns:1fr;
    }

    .sidebar{
        padding-bottom:8px;
    }

    }


/* Globaler fixer Footer */
.content{
    min-height:100vh;
    display:grid;
    grid-template-rows:auto 1fr auto;
    gap:24px;
}

.site-footer{
    position:sticky;
    bottom:0;
    left:0;
    z-index:20;
    margin-top:8px;
    padding-top:8px;
    background:linear-gradient(180deg, rgba(244,245,247,0) 0%, rgba(244,245,247,.96) 18%, rgba(244,245,247,1) 100%);
}

.site-footer__inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
    padding:14px 18px;
    border:1px solid #e2e5e9;
    border-radius:16px;
    background:#f7f7f5;
    box-shadow:var(--shadow);
}

.site-footer__copy{
    color:var(--muted);
    font-size:.95rem;
}

.site-footer__nav{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
}

.site-footer__nav a{
    color:var(--primary);
    font-weight:700;
}

.site-footer__nav a:hover{
    text-decoration:underline;
}

@media (max-width:980px){
    .site-footer{
        position:relative;
        bottom:auto;
    }

    .site-footer__inner{
        align-items:flex-start;
    }
}





.sidebar-details{
    display:grid;
    gap:8px;
}

.sidebar-summary{
    list-style:none;
    cursor:pointer;
    user-select:none;
    position:relative;
    padding-right:40px;
}

.sidebar-summary::-webkit-details-marker{
    display:none;
}

.sidebar-summary::after{
    content:'▾';
    position:absolute;
    right:14px;
    top:50%;
    transform:translateY(-50%);
    font-size:.9rem;
    opacity:.8;
}

.sidebar-details:not([open]) .sidebar-summary::after{
    content:'▸';
}

.nav-submenu{
    display:grid;
    gap:8px;
    padding-left:8px;
    margin-top:2px;
}

.nav-submenu .menu-link{
    padding-left:18px;
    min-height:42px;
}

@media (max-width:980px){
    .nav-submenu{
        padding-left:0;
    }

    .nav-submenu .menu-link{
        padding-left:14px;
    }
}


/* Einstellungen-Hub mit Tabs */
.settings-tabs{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:20px;
    padding-bottom:16px;
    border-bottom:1px solid var(--line);
}

.settings-tab{
    width:100%;
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    white-space:nowrap;
    border:1px solid var(--line);
    background:#f8fafc;
    color:var(--text);
    padding:10px 14px;
    border-radius:12px;
    font:inherit;
    font-weight:700;
}

.settings-tab.is-active{
    background:var(--primary);
    color:#fff;
    border-color:var(--primary);
}

.settings-panel{
    display:grid;
    gap:16px;
    min-height:220px;
    align-content:start;
}

@media (max-width:980px){
    .settings-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .settings-tab{
        white-space:normal;
    }
}


/* Benutzereinstellungen / Zahnrad */
.sidebar-user-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.sidebar-gear{
    width:34px;
    height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    color:#fff;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.06);
    text-decoration:none;
}

.sidebar-gear:hover{
    background:rgba(255,255,255,.12);
}


/* Einstellungen-Reiter: feste Hoehe und ruhige Darstellung */
.settings-tabs-wrap{
    min-height:76px;
    margin-bottom:20px;
}

.settings-tabs{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    padding-bottom:16px;
    border-bottom:1px solid var(--line);
    align-items:stretch;
    min-height:76px;
}

.settings-tab{
    width:100%;
    min-height:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    white-space:nowrap;
    border:1px solid var(--line);
    background:#f8fafc;
    color:var(--text);
    padding:10px 14px;
    border-radius:12px;
    font:inherit;
    font-weight:700;
    box-sizing:border-box;
}

.settings-tab.is-active{
    background:var(--primary);
    color:#fff;
    border-color:var(--primary);
}

@media (max-width:980px){
    .settings-tabs-wrap{
        min-height:auto;
    }

    .settings-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr));
        min-height:auto;
    }

    .settings-tab{
        min-height:48px;
        height:auto;
        white-space:normal;
    }
}


/* Gastansicht ohne Sidebar, mobil optimiert */
.guest-body{
    margin:0;
    background:#f4f5f7;
    color:var(--text);
}

.guest-container{
    width:min(100%, 760px);
    margin:0 auto;
    padding:16px;
    display:grid;
    gap:16px;
}

.guest-flash{
    width:min(100%, 760px);
    margin:12px auto 0;
    padding:12px 14px;
    border-radius:12px;
}
.guest-flash-success{background:#ecfdf3;color:#067647;border:1px solid #abefc6}
.guest-flash-error{background:#eef6fd;color:#005fA3;border:1px solid #bfdcf5}

.guest-branding{
    display:grid;
    gap:12px;
}

.guest-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:16px;
    flex-wrap:wrap;
}

.guest-logo{
    max-height:56px;
    max-width:48%;
    width:auto;
    object-fit:contain;
    display:block;
}

.guest-facts{
    grid-template-columns:1fr 1fr;
}

.guest-grid-compact{
    grid-template-columns:1fr 1fr;
}

@media (max-width:700px){
    .guest-container{
        padding:12px;
    }

    .guest-header{
        align-items:flex-start;
    }

    .guest-logo{
        max-height:44px;
        max-width:100%;
    }

    .guest-facts,
    .guest-grid-compact{
        grid-template-columns:1fr;
    }

    .guest-container .card{
        padding:16px;
        border-radius:16px;
    }

    .guest-container .btn{
        width:100%;
    }

    .guest-container .list-item,
    .guest-container .section-head{
        flex-direction:column;
        align-items:flex-start;
    }
}


/* Gastansicht Branding/Technik Feinschliff */
.guest-brand-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}

.guest-brand-card{
    display:grid;
    grid-template-columns:88px 1fr;
    gap:14px;
    align-items:center;
    padding:14px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fcfcfa;
}

.guest-brand-logo-wrap{
    width:88px;
    height:56px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.guest-brand-logo{
    max-width:100%;
    max-height:56px;
    width:auto;
    object-fit:contain;
    display:block;
}

.guest-brand-label{
    color:var(--muted);
    font-size:.9rem;
    margin-bottom:4px;
}

.guest-branding.card{
    gap:8px;
}

.guest-facts dd{
    font-weight:600;
    line-height:1.4;
}

@media (max-width:700px){
    .guest-brand-grid{
        grid-template-columns:1fr;
    }

    .guest-brand-card{
        grid-template-columns:72px 1fr;
    }

    .guest-brand-logo-wrap{
        width:72px;
        height:48px;
    }
}


/* Gastseite Footer */
.guest-footer{
    margin-top:20px;
    padding:16px;
    background:#ffffff;
    border-top:1px solid var(--line);
}

.guest-footer-inner{
    max-width:760px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.guest-footer-logo{
    height:28px;
    width:auto;
    opacity:.8;
}

.guest-footer-right{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    font-size:0.85rem;
}

.guest-footer-right a{
    color:var(--primary);
    text-decoration:none;
}

/* bessere Darstellung von Zeilenumbrüchen */
.guest-brand-content{
    white-space:pre-line;
}


/* Gastseite eigener Header mit SplanX-Logo */
.guest-topbar{
    padding:12px 16px 0;
}

.guest-topbar-inner{
    width:min(100%, 760px);
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:flex-start;
}

.guest-topbar-brand{
    display:inline-flex;
    align-items:center;
}

.guest-topbar-logo{
    height:32px;
    width:auto;
    display:block;
    opacity:.92;
}

.guest-footer-left{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.guest-footer-copy{
    font-size:.85rem;
    color:var(--muted);
}


/* Gast-Header und Gast-Footer separat editierbar, dunkles Branding wie Sidebar */
.guest-topbar,
.guest-footer{
    background:rgba(7,12,24,.72);
    color:#fff;
    border-color:rgba(255,255,255,.08);
    backdrop-filter:blur(18px);
}

.guest-topbar{
    padding:12px 16px;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.guest-topbar-inner,
.guest-footer-inner{
    width:min(100%, 760px);
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.guest-topbar-brand{
    display:inline-flex;
    align-items:center;
}

.guest-topbar-logo{
    height:32px;
    width:auto;
    display:block;
    opacity:.95;
}

.guest-footer{
    margin-top:20px;
    padding:16px;
    border-top:1px solid rgba(255,255,255,.08);
}

.guest-footer-left{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.guest-footer-logo{
    height:24px;
    width:auto;
    display:block;
    opacity:.9;
}

.guest-footer-copy{
    font-size:.85rem;
    color:rgba(255,255,255,.72);
}

.guest-footer-right{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    font-size:.85rem;
}

.guest-footer-right a{
    color:#fff;
    text-decoration:none;
}

.guest-footer-right a:hover{
    text-decoration:underline;
}

@media (max-width:700px){
    .guest-topbar{
        padding:10px 12px;
    }

    .guest-footer{
        padding:14px 12px;
    }

    .guest-topbar-logo{
        height:28px;
    }

    .guest-footer-inner{
        align-items:flex-start;
    }
}


/* Gastseite Hersteller/Installateur oben ausgerichtet, Logos groß */
.guest-brand-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    align-items:start;
}

.guest-brand-card{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    align-items:start;
    padding:16px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fcfcfa;
    min-height:100%;
}

.guest-brand-logo-wrap.is-large{
    width:100%;
    min-height:92px;
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    padding-bottom:6px;
    border-bottom:1px solid var(--line);
}

.guest-brand-logo.is-large{
    width:100%;
    max-width:100%;
    max-height:92px;
    height:auto;
    object-fit:contain;
    object-position:left top;
    display:block;
}

.guest-brand-content{
    display:grid;
    gap:4px;
    align-content:start;
    white-space:pre-line;
}

.guest-brand-content strong{
    line-height:1.45;
}

@media (max-width:700px){
    .guest-brand-grid{
        grid-template-columns:1fr;
    }

    .guest-brand-logo-wrap.is-large{
        min-height:76px;
    }

    .guest-brand-logo.is-large{
        max-height:76px;
    }
}


.brand-link{
    display:inline-flex;
    align-items:center;
}
.brand-link:hover{
    opacity:.9;
}


.settings-hub-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.settings-hub-card{
    display:grid;
    gap:8px;
    padding:20px;
    border:1px solid var(--line);
    border-radius:16px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    box-shadow:0 6px 18px rgba(15,23,42,.04);
}

.settings-hub-card:hover{
    border-color:var(--primary);
    transform:translateY(-1px);
}

.settings-hub-card strong{
    font-size:1.05rem;
}

.settings-hub-card span{
    color:var(--muted);
    line-height:1.45;
}

@media (max-width:900px){
    .settings-hub-grid{
        grid-template-columns:1fr;
    }
}


/* Einstellungen-Reiter mit fixer Hoehe */
.settings-tabs-wrap{
    min-height:78px;
    margin-bottom:20px;
}

.settings-tabs{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    min-height:78px;
    align-items:stretch;
}

.settings-tab{
    min-height:52px;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    box-sizing:border-box;
}

@media (max-width:900px){
    .settings-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr));
        min-height:auto;
    }

    .settings-tab{
        height:auto;
        min-height:52px;
    }
}


/* Billing Design */
.billing-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.billing-panel{
    display:grid;
    gap:16px;
    align-content:start;
}

.toggle-card{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    padding:14px 16px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#f8fafc;
}

.toggle-card input[type="checkbox"]{
    margin-top:4px;
    width:20px;
    height:20px;
}

.billing-info-box{
    padding:14px 16px;
    border-radius:14px;
    background:#eef6fd;
    border:1px solid #bfdcf5;
}

.billing-logo-preview{
    display:grid;
    gap:10px;
    padding:14px 16px;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fcfcfa;
}

.billing-logo-preview img{
    max-width:120px;
    max-height:120px;
    border:1px solid #d9dee5;
    border-radius:10px;
    background:#fff;
    padding:6px;
}

.actions-wrap{
    flex-wrap:wrap;
}

/* Locked guest state */
.guest-locked-card{
    display:grid;
    gap:18px;
}

.guest-lock-hero{
    display:grid;
    grid-template-columns:72px 1fr;
    gap:16px;
    align-items:center;
}

.guest-lock-icon{
    width:72px;
    height:72px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:2rem;
    font-weight:800;
    color:#fff;
    background:#c62828;
}

.billing-lock-note{
    padding:14px 16px;
    border:1px solid #f1b4b4;
    background:#fff4f4;
    border-radius:14px;
}

@media (max-width:900px){
    .billing-form-grid{
        grid-template-columns:1fr;
    }

    .guest-lock-hero{
        grid-template-columns:1fr;
    }
}


/* Public pages */
.public-body{
    margin:0;
    background:linear-gradient(180deg,#f5f7fb 0%,#eef3f9 100%);
    color:#102033;
    min-height:100vh;
}

.public-header{
    position:sticky;
    top:0;
    z-index:30;
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(15,23,42,.08);
}

.public-header-inner,
.public-main,
.public-footer-inner,
.public-flash-wrap{
    width:min(1180px, calc(100% - 32px));
    margin:0 auto;
}

.public-header-inner{
    min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

.public-brand{
    display:inline-flex;
    align-items:center;
    gap:12px;
    color:inherit;
    text-decoration:none;
    font-weight:700;
}

.public-brand-logo{
    height:34px;
    width:auto;
    display:block;
}

.public-header-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.public-link{
    color:inherit;
    text-decoration:none;
    font-weight:600;
}

.public-login-form{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.public-login-form input{
    min-width:170px;
    padding:10px 12px;
    border:1px solid rgba(15,23,42,.12);
    border-radius:12px;
    background:#fff;
}

.public-main{
    padding:32px 0 40px;
}

.public-hero{
    padding:24px 0 10px;
}

.public-hero-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:28px;
    align-items:center;
}

.public-hero-copy h1{
    font-size:clamp(2rem,4vw,3.35rem);
    line-height:1.08;
    margin:0 0 16px;
}

.public-lead{
    font-size:1.08rem;
    line-height:1.65;
    color:#4b5563;
    max-width:62ch;
}

.public-hero-visual,
.public-section{
    margin-top:20px;
}

.public-feature-grid,
.public-graphics-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.public-feature-card,
.public-graphic-card{
    background:#fff;
    border:1px solid rgba(15,23,42,.08);
    border-radius:18px;
    padding:20px;
    box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.public-feature-card strong,
.public-graphic-card strong{
    display:block;
    margin-bottom:10px;
}

.graphic-placeholder{
    min-height:190px;
    border-radius:16px;
    border:2px dashed rgba(220,38,38,.24);
    background:linear-gradient(135deg,#fff5f5 0%,#f8fafc 100%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    color:#6b7280;
    text-align:center;
    padding:16px;
}

.graphic-lg{
    min-height:360px;
}

.public-form-wrap{
    width:min(860px, calc(100% - 32px));
    margin:26px auto 40px;
}

.public-form-card{
    padding:28px;
}

.public-footer{
    border-top:1px solid rgba(15,23,42,.08);
    background:#fff;
    margin-top:36px;
}

.public-footer-inner{
    min-height:70px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
}

.public-footer-links{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
}

.public-footer a{
    color:inherit;
    text-decoration:none;
}

.public-flash-wrap{
    padding-top:18px;
}

.registration-item{
    align-items:flex-start;
}

.registration-main{
    display:grid;
    gap:6px;
}

@media (max-width:980px){
    .public-hero-grid,
    .public-feature-grid,
    .public-graphics-grid{
        grid-template-columns:1fr;
    }

    .public-header-inner{
        padding:12px 0;
        align-items:flex-start;
    }

    .public-header-actions,
    .public-login-form{
        width:100%;
    }

    .public-login-form input{
        min-width:0;
        flex:1 1 180px;
    }
}


/* Public dark header/footer */
.public-header-dark,
.public-footer-dark{
    background:#0f172a;
    color:#f8fafc;
    border-color:rgba(255,255,255,.08);
}

.public-header-dark{
    backdrop-filter:none;
}

.public-brand-light,
.public-link-light,
.public-footer-dark a,
.public-footer-dark span{
    color:#f8fafc;
}

.public-link-light{
    text-decoration:none;
    font-weight:700;
}

.public-link-light:hover,
.public-footer-dark a:hover{
    opacity:.9;
}

.public-footer-dark{
    margin-top:36px;
}

/* Public login page */
.public-auth-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:24px;
    align-items:stretch;
}

.public-auth-info,
.auth-card{
    display:grid;
    gap:16px;
    align-content:start;
    min-height:100%;
}

.public-auth-benefits{
    display:grid;
    gap:12px;
}

.public-auth-benefit{
    padding:14px 16px;
    border:1px solid rgba(15,23,42,.08);
    border-radius:14px;
    background:#f8fafc;
    display:grid;
    gap:4px;
}

.public-auth-links{
    display:grid;
    gap:8px;
}

.public-auth-links a{
    text-decoration:none;
}

@media (max-width: 980px){
    .public-auth-grid{
        grid-template-columns:1fr;
    }
}

/* Settings tabs hard-fixed height */
.settings-tabs-wrap{
    min-height:72px !important;
    max-height:72px !important;
    height:72px !important;
    overflow:hidden !important;
    margin-bottom:20px;
}

.settings-tabs{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
    gap:10px !important;
    align-items:stretch !important;
    min-height:72px !important;
    max-height:72px !important;
    height:72px !important;
}

.settings-tab{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    min-height:48px !important;
    max-height:48px !important;
    height:48px !important;
    align-self:center !important;
    box-sizing:border-box !important;
    padding:0 14px !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
}

@media (max-width:900px){
    .settings-tabs-wrap{
        min-height:auto !important;
        max-height:none !important;
        height:auto !important;
        overflow:visible !important;
    }

    .settings-tabs{
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
        min-height:auto !important;
        max-height:none !important;
        height:auto !important;
    }

    .settings-tab{
        min-height:48px !important;
        max-height:none !important;
        height:auto !important;
        white-space:normal !important;
    }
}


/* =========================
   Mobile menu optimization
   ========================= */
.mobile-menu-toggle{
    display:none;
    position:fixed;
    top:14px;
    left:14px;
    z-index:1200;
    width:46px;
    height:46px;
    border:none;
    border-radius:12px;
    background:#0f172a;
    color:#fff;
    font-size:1.25rem;
    box-shadow:0 10px 24px rgba(15,23,42,.18);
}

.mobile-menu-backdrop{
    position:fixed;
    inset:0;
    z-index:1090;
    background:rgba(2,6,23,.45);
}

.public-menu-toggle{
    display:none;
    border:none;
    background:#1e293b;
    color:#fff;
    width:44px;
    height:44px;
    border-radius:12px;
    font-size:1.2rem;
    align-items:center;
    justify-content:center;
}

@media (max-width:980px){
    .mobile-menu-toggle{
        display:flex;
        align-items:center;
        justify-content:center;
    }

    .shell{
        display:block;
    }

    .sidebar{
        position:fixed;
        inset:0 auto 0 0;
        width:min(320px, 86vw);
        max-width:86vw;
        transform:translateX(-105%);
        transition:transform .22s ease;
        z-index:1100;
        overflow-y:auto;
        box-shadow:20px 0 40px rgba(15,23,42,.22);
    }

    body.mobile-menu-open .sidebar{
        transform:translateX(0);
    }

    .content{
        width:100%;
        padding-top:72px;
    }

    .public-menu-toggle{
        display:flex;
    }

    .public-header-inner{
        align-items:center;
    }

    .public-header-actions{
        display:none;
        width:100%;
        flex-direction:column;
        align-items:flex-start;
        gap:10px;
        padding-top:12px;
    }

    .public-header-actions.is-open{
        display:flex;
    }

    .public-header-inner{
        flex-wrap:wrap;
    }

    .public-link-light{
        width:100%;
        padding:12px 0;
        border-top:1px solid rgba(255,255,255,.08);
    }

    .public-main{
        padding-top:24px;
    }
}


.protocol-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.protocol-item{
    align-items:flex-start;
}

.protocol-meta-row{
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap;
    margin-top:8px;
}

.protocol-status-ok{background:#dff3e7;color:#166534;}
.protocol-status-maengel{background:#fff1d6;color:#b45309;}
.protocol-status-offen{background:#fee2e2;color:#b91c1c;}

@media (max-width:900px){
    .protocol-layout{
        grid-template-columns:1fr;
    }
}


.user-admin-tabs{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.user-admin-tab{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:46px;
    padding:0 16px;
    border:1px solid var(--line);
    border-radius:12px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    font-weight:600;
}

.user-admin-tab.is-active{
    background:#0f172a;
    color:#fff;
    border-color:#0f172a;
}


/* Public legal/contact pages */
.public-page-shell{
    width:min(1040px, calc(100% - 32px));
    margin:0 auto;
}

.public-page-hero{
    padding:18px 0 8px;
}

.public-page-stack{
    display:grid;
    gap:20px;
    padding-bottom:28px;
}

.public-page-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
}

.public-page-card{
    background:#fff;
    border:1px solid rgba(15,23,42,.08);
    border-radius:18px;
    padding:24px;
    box-shadow:0 10px 24px rgba(15,23,42,.05);
}

.public-page-card h2{
    margin:0 0 14px;
}

.public-page-lead{
    font-size:1.05rem;
    line-height:1.65;
    color:#4b5563;
    max-width:70ch;
}

.public-info-list{
    display:grid;
    gap:14px;
}

.public-info-list div{
    display:grid;
    gap:4px;
}

.public-info-list strong{
    font-size:.92rem;
    color:#111827;
}

@media (max-width:980px){
    .public-page-grid{
        grid-template-columns:1fr;
    }

    .public-page-card{
        padding:20px;
    }
}
