/* ============================================================
Lean4Y – GPS STRICT TEMPLATE (CLEAN + iPhone/MS Darkmode FIX)
Goals:
– Hero + all content ALWAYS left-aligned
– Cards stay white with dark text (readable in MasterStudy iPhone dark mode)
– No logo inside lesson block
– Lists less indented (bullets/numbering closer to left)
============================================================ */

:root{
–maxw:960px;
–radius:12px;
–padX:18px;
–navy:#0f172a;
–blue:#1d4ed8;
–text:#111;
–bg:#f8fafc;
–card:#fff;
–line:#e2e8f0;
–sub:#f9fafb;
}

html,body{margin:0;padding:0;}
html{color-scheme:light;} /* verhindert iOS/Theme Auto-Dark-Inversion */
body{
font-family:system-ui,-apple-system,BlinkMacSystemFont,”Segoe UI”,sans-serif;
background:var(–bg);
color:var(–text);
}

/* Root */
section.l4y-root{
max-width:var(–maxw);
margin:0 auto;
padding:18px 16px 32px;
text-align:left;
}

/* HERO (always left) */
section.l4y-root header.hero{
background:linear-gradient(90deg,var(–navy),var(–blue));
color:#fff;
border-radius:var(–radius);
padding:18px 20px 16px;
margin:0 0 14px;
}
section.l4y-root header.hero .hero-row{
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
justify-content:flex-start !important;
gap:8px !important;
}
section.l4y-root header.hero .hero-text,
section.l4y-root header.hero h1,
section.l4y-root header.hero .meta{
width:100%;
text-align:left !important;
margin:0 !important;
}
section.l4y-root header.hero h1{
font-size:22px;
font-weight:700;
margin:0 0 4px !important;
}
section.l4y-root header.hero .meta{
font-size:13px;
opacity:.95;
font-weight:500;
}

/* OUTER ACCORDIONS */
section.l4y-root details.card{
border:1px solid var(–line);
border-radius:10px;
background:var(–card);
margin:10px 0;
text-align:left;
}
section.l4y-root details.card > summary{
cursor:pointer;
list-style:none;
padding:10px 14px;
margin:0;
font-weight:600;
display:flex;
align-items:center;
gap:8px;
text-align:left !important;
}
section.l4y-root details.card > summary::-webkit-details-marker{display:none;}
section.l4y-root details.card .content{
padding:16px var(–padX) 18px;
text-align:left !important;
}

/* SUB-ACCORDIONS */
section.l4y-root details.card.card-sub{
background:var(–sub);
margin:6px 0;
}

/* INNER BOXES (no inner frames) */
section.l4y-root .card{
border:none !important;
box-shadow:none !important;
border-radius:10px;
background:var(–sub);
color:var(–text);
padding:14px var(–padX);
}

/* Color variants (optional, bleiben lesbar) */
section.l4y-root .note-blue{background:#e0ecff;}
section.l4y-root .note-yellow{background:#fff7d6;}

/* CHECKLIST (whole accordion yellow) */
section.l4y-root details.card.card-yellow{background:#fff7d6;}

/* TEXT */
section.l4y-root details.card p{
margin:10px 0;
line-height:1.6;
}
section.l4y-root details.card h3{
margin:18px 0 6px;
font-size:16px;
font-weight:700;
}
section.l4y-root details.card h4{
margin:18px 0 6px;
font-size:15px;
font-weight:700;
}

/* Kill quote indentation (MasterStudy sometimes injects) */
section.l4y-root blockquote{margin:0 !important;padding:0 !important;border:0 !important;}

/* LISTS: closer to left, bullets outside */
section.l4y-root details.card ul,
section.l4y-root details.card ol{
margin:6px 0 12px 0 !important;
padding-left:1.1em !important;
list-style-position:outside !important;
}
section.l4y-root details.card li{
margin:4px 0 !important;
}

/* TABLES */
section.l4y-root table.l4y-table{
width:100%;
border-collapse:collapse;
margin:10px 0 14px;
font-size:13px;
}
section.l4y-root table.l4y-table th,
section.l4y-root table.l4y-table td{
border:1px solid var(–line);
padding:6px 8px;
text-align:left;
vertical-align:top;
}
section.l4y-root table.l4y-table thead th{
background:#e5edf9;
font-weight:600;
}

/* ============================================================
MASTERSTUDY / iPHONE DARK MODE FIX (OHNE Desktop zu zerstören)
– Nur Content-Karten fixieren: Hintergrund immer weiß, Text immer schwarz
– Hero bleibt weiß
– Nutzt -webkit-text-fill-color NUR in Cards (nicht global!)
============================================================ */

/* Cards: immer lesbar */
section.l4y-root details.card,
section.l4y-root details.card *{
color:#111 !important;
-webkit-text-fill-color:#111 !important;
text-align:left !important;
}
section.l4y-root details.card,
section.l4y-root details.card.card-sub,
section.l4y-root details.card.card-yellow,
section.l4y-root .card,
section.l4y-root .note-blue,
section.l4y-root .note-yellow{
background:#fff !important;
}

/* Hero: bleibt weiß */
section.l4y-root header.hero,
section.l4y-root header.hero *{
color:#fff !important;
-webkit-text-fill-color:#fff !important;
text-align:left !important;
}

.l4y-root .content{color:#111 !important;}
.l4y-root .content p,
.l4y-root .content li,
.l4y-root .content em,
.l4y-root .content strong,
.l4y-root .content span,
.l4y-root .content small,
.l4y-root .content code,
.l4y-root .content h2,
.l4y-root .content h3,
.l4y-root .content h4{color:#111 !important;}
.l4y-root .content a{color:#0b3a8a !important;}
.l4y-root audio{width:100% !important; max-width:100% !important; display:block !important;}
.l4y-root .audio-wrap,.l4y-root .l4y-audio{margin:12px 0 16px;}
.l4y-root ul.refs{margin:0; padding-left:18px;}
.l4y-root ul.refs li{margin:2px 0; line-height:1.25;}
.l4y-root ul.refs li p{margin:0;}