/* Lark216 landing page redesign. Loaded only on index.php (via $extra_css);
   scoped to body.landing so no other page is affected. */
html:has(body.landing), body.landing {
    background: radial-gradient(1400px 800px at 50% -10%, rgba(61,134,240,.16), transparent 60%), linear-gradient(180deg, #050813, #0a1020 60%, #070a14);
    background-attachment: fixed; background-color: #070a14;
}
body.landing .navbar { background: rgba(5,8,19,.88); border-bottom: 1px solid rgba(90,162,255,.2); }
body.landing .page.landing-page { max-width: 1200px; padding-top: 1.5rem; }

/* Hero */
.hero { position: relative; overflow: hidden; border-radius: 22px; border: 1px solid rgba(90,162,255,.25); background: #050813; min-height: 300px; display: flex; align-items: center; box-shadow: 0 20px 50px rgba(0,0,0,.5); }
.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,8,19,.92) 0%, rgba(5,8,19,.6) 50%, rgba(5,8,19,.15) 100%); }
.hero-inner { position: relative; z-index: 1; padding: 2.5rem 3rem; max-width: 680px; }
.hero-kicker { color: #7ec4ff; font-size: .8rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.hero h1 { margin: .5rem 0 .8rem; font-size: 4.2rem; line-height: 1; font-weight: 800; letter-spacing: -.02em; background: linear-gradient(180deg, #fff, #9fc6ff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.hero p { margin: 0; color: #c3cde0; font-size: 1.15rem; line-height: 1.55; }

/* Section headers */
.lsection { --accent: #5aa2ff; margin-top: 3.2rem; }
.s-blue { --accent: #5aa2ff; } .s-cyan { --accent: #38d0e0; } .s-gold { --accent: #d4a64a; } .s-violet { --accent: #8a7cff; }
.lhead { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.3rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.lbar { width: 6px; align-self: stretch; min-height: 48px; border-radius: 4px; background: var(--accent); box-shadow: 0 0 16px var(--accent); }
.lhead h2 { margin: 0; font-size: 2.1rem; font-weight: 800; letter-spacing: -.01em; }
.lhead p { margin: .15rem 0 0; color: var(--accent); font-size: .92rem; font-weight: 600; letter-spacing: .04em; }

/* Image-backed cards */
.lgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.1rem; }
.lgrid-2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.lcard { position: relative; display: flex; align-items: flex-end; min-height: 190px; padding: 1.3rem 1.4rem; border-radius: 18px; overflow: hidden; border: 1px solid rgba(90,162,255,.22); background: #070a14 var(--img) center / cover no-repeat; box-shadow: 0 10px 28px rgba(0,0,0,.4); transition: transform .18s, border-color .18s, box-shadow .18s; color: var(--text); isolation: isolate; }
.lcard::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5,8,19,.15) 0%, rgba(5,8,19,.78) 70%, rgba(5,8,19,.92) 100%); }
.lcard:hover { transform: translateY(-4px); border-color: rgba(126,196,255,.7); box-shadow: 0 16px 36px rgba(0,0,0,.5), 0 0 24px rgba(90,162,255,.2); text-decoration: none; }
.lcard-body { width: 100%; }
.lcard h3 { margin: 0 0 .35rem; font-size: 1.3rem; font-weight: 700; color: #fff; }
.lcard p { margin: 0; color: #c3cde0; font-size: .92rem; line-height: 1.45; }
.lcard-wide { grid-column: 1 / -1; min-height: 150px; align-items: center; justify-content: space-between; gap: 1.5rem; }
.lcard-wide .lcard-body { max-width: 720px; }
.lcard-go, .lcard-cta { color: #7ec4ff; font-weight: 700; white-space: nowrap; }
.lcard-cta { display: inline-block; margin-top: .7rem; }
.lcard-tall { min-height: 250px; }
.lcard-ext { position: absolute; top: 1rem; right: 1.2rem; color: #c3cde0; font-size: 1.1rem; }
.lcard-logo { display: block; height: 36px; width: auto; object-fit: contain; background: #fff; padding: .35rem .6rem; border-radius: 8px; margin-bottom: .8rem; }
.lcard-logo-square { height: 44px; width: 44px; object-fit: cover; padding: 0; background: none; border-radius: 10px; }

/* Private services */
.private-card { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 2rem 2.2rem; border-radius: 18px; border: 1px solid rgba(138,124,255,.35); background: #060914 var(--img) center / cover no-repeat; box-shadow: 0 10px 28px rgba(0,0,0,.4); position: relative; overflow: hidden; isolation: isolate; }
.private-card::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5,8,19,.9) 0%, rgba(5,8,19,.55) 100%); }
.private-text { display: flex; align-items: center; gap: 1.1rem; }
.private-text .lock { color: #a99dff; flex: none; }
.private-text h3 { margin: 0 0 .25rem; font-size: 1.4rem; color: #fff; }
.private-text p { margin: 0; color: #c3cde0; }
.signin-btn { flex: none; padding: .95rem 2rem; border-radius: 12px; font-size: 1.05rem; font-weight: 700; color: #fff; background: linear-gradient(135deg, #5aa2ff, #2f6bff); border: 1px solid rgba(126,196,255,.5); box-shadow: 0 8px 22px rgba(47,107,255,.35); white-space: nowrap; }
.signin-btn:hover { text-decoration: none; filter: brightness(1.1); transform: translateY(-1px); }

@media (max-width: 700px) {
    .hero { min-height: 240px; }
    .hero-inner { padding: 1.8rem 1.4rem; }
    .hero h1 { font-size: 3rem; }
    .hero p { font-size: 1rem; }
    .hero::after { background: rgba(5,8,19,.72); }
    .lsection { margin-top: 2.4rem; }
    .lhead h2 { font-size: 1.6rem; }
    .lcard { min-height: 160px; }
    .lcard-wide { flex-direction: column; align-items: flex-start; justify-content: center; gap: .8rem; }
    .private-card { flex-direction: column; align-items: stretch; padding: 1.5rem; text-align: left; }
    .signin-btn { text-align: center; }
}

/* Full-width layout */
body.landing .page.landing-page { max-width: none; padding-left: 2rem; padding-right: 2rem; }
.hero-inner { max-width: 760px; }
@media (max-width: 700px) { body.landing .page.landing-page { padding-left: 1rem; padding-right: 1rem; } }

/* IT Tools: four equal cards in one row */
.lgrid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .lgrid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .lgrid-4 { grid-template-columns: 1fr; } }

/* ===== Photo backgrounds, tighter headings ===== */
.lcard, .private-card { background-position: var(--pos, center); background-size: cover; background-repeat: no-repeat; }
.lcard::before { background: linear-gradient(180deg, rgba(5,8,19,.35) 0%, rgba(5,8,19,.72) 55%, rgba(5,8,19,.94) 100%), linear-gradient(90deg, rgba(5,8,19,.55) 0%, rgba(5,8,19,0) 75%); }
.private-card::before { background: linear-gradient(90deg, rgba(5,8,19,.92) 0%, rgba(5,8,19,.7) 45%, rgba(5,8,19,.35) 100%); }
.lcard h3, .lcard p, .private-text h3, .private-text p { text-shadow: 0 1px 8px rgba(0,0,0,.7); }

.lsection { margin-top: 2.2rem; }
.lhead { margin-bottom: .9rem; padding-bottom: .55rem; gap: .8rem; }
.lbar { width: 4px; min-height: 26px; border-radius: 3px; opacity: .65; box-shadow: none; }
.lhead > div { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 1rem; row-gap: .1rem; }
.lhead h2 { font-size: 1.55rem; font-weight: 700; }
.lhead p { margin: 0; font-size: .88rem; font-weight: 500; letter-spacing: .02em; opacity: .9; }
@media (max-width: 700px) {
    .lsection { margin-top: 1.8rem; }
    .lhead > div { flex-direction: column; }
    .lhead h2 { font-size: 1.35rem; }
}

/* Hero: lake sunset photo */
.hero { background: #050813 url(/assets/lake-image.webp) center 55% / cover no-repeat; min-height: 340px; }
.hero::after { background: linear-gradient(90deg, rgba(5,8,19,.88) 0%, rgba(5,8,19,.55) 42%, rgba(5,8,19,.05) 75%), linear-gradient(180deg, rgba(5,8,19,.25) 0%, rgba(5,8,19,0) 40%, rgba(5,8,19,.45) 100%); }
.hero h1, .hero p, .hero-kicker { text-shadow: 0 2px 14px rgba(0,0,0,.6); }
.hero h1 { -webkit-text-fill-color: #fff; background: none; }
@media (max-width: 700px) { .hero { min-height: 260px; background-position: 60% 55%; } .hero::after { background: rgba(5,8,19,.6); } }

/* Tighter section spacing */
.lsection { margin-top: 1.5rem; }
.lhead { margin-bottom: .7rem; padding-bottom: .4rem; }
.lgrid { gap: .9rem; }
body.landing .page.landing-page { padding-bottom: 2.5rem; }
@media (max-width: 700px) { .lsection { margin-top: 1.3rem; } }

/* ===== v3: compact layout closer to the approved mockup ===== */
body.landing .logo-216 { color: #3d86f0; }
body.landing .nav-links a { color: #3d86f0; font-weight: 600; padding: .5rem .2rem; border-bottom: 2px solid #3d86f0; }
body.landing .nav-links a:hover { text-decoration: none; filter: brightness(1.2); }
body.landing .page.landing-page { padding-top: 0; }

/* Hero: full-bleed photo, fading into the page, no frame */
.hero { margin: 0 -2rem; border: 0; border-radius: 0; box-shadow: none; min-height: 190px; align-items: flex-start; background-position: center 60%; }
.hero::after { background: linear-gradient(90deg, rgba(5,8,19,.8) 0%, rgba(5,8,19,.35) 50%, rgba(5,8,19,0) 80%), linear-gradient(180deg, rgba(5,8,19,.1) 0%, rgba(5,8,19,0) 45%, #070a14 100%); }
.hero-inner { padding: 1.1rem 2rem 1.6rem; max-width: 900px; }
.hero h1 { margin: 0 0 .1rem; font-size: 3.6rem; background: none; -webkit-text-fill-color: #fff; color: #fff; }
.hero h1 span { color: #2f7cf0; -webkit-text-fill-color: #2f7cf0; }
.hero-tagline { color: #b9d3ff; font-size: 1.45rem; font-weight: 600; text-shadow: 0 2px 12px rgba(0,0,0,.6); }
.hero p { margin-top: .6rem; font-size: 1rem; max-width: 560px; color: #d3dcec; }
@media (max-width: 700px) { .hero { margin: 0 -1rem; } .hero-inner { padding: 1rem 1rem 1.3rem; } .hero h1 { font-size: 2.8rem; } .hero-tagline { font-size: 1.1rem; } }

/* Section headers: uppercase, accent-colored, subtitle beside, rule to the right */
.s-gold-d { --accent: #e0a63a; }
.lsection { margin-top: 1rem; }
.lsection.s-blue { --accent: #e0a63a; } .lsection.s-cyan { --accent: #3d86f0; } .lsection.s-gold { --accent: #34c98a; }
.lhead { border-bottom: 0; padding: 0; margin: 0 0 .55rem; gap: .7rem; align-items: center; }
.lbar { width: 3px; min-height: 22px; align-self: center; height: 22px; opacity: .9; }
.lhead > div { flex: 1; align-items: center; flex-wrap: nowrap; gap: 1rem; }
.lhead > div::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--accent), transparent 90%); opacity: .45; order: 3; }
.lhead h2 { font-size: 1.2rem; text-transform: uppercase; letter-spacing: .2em; color: var(--accent); font-weight: 700; white-space: nowrap; }
.lhead p { color: #c3cde0; font-size: .82rem; font-weight: 400; white-space: nowrap; }
@media (max-width: 700px) { .lhead > div { flex-wrap: wrap; } .lhead > div::after { display: none; } .lhead p { white-space: normal; } }

/* Compact cards with a circular arrow button */
.lgrid { gap: .8rem; }
.lcard { min-height: 118px; align-items: center; padding: .9rem 4rem .9rem 1.3rem; border-radius: 12px; }
.lcard::before { background: linear-gradient(90deg, rgba(5,8,19,.88) 0%, rgba(5,8,19,.62) 55%, rgba(5,8,19,.25) 100%); }
.lcard-tall { min-height: 118px; }
.lcard h3 { font-size: 1.2rem; margin-bottom: .25rem; }
.lcard p { font-size: .86rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lcard::after { content: ''; position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.8); background: rgba(5,8,19,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E") center / 18px no-repeat; transition: background-color .15s, border-color .15s; }
.lcard:hover::after { background-color: rgba(61,134,240,.55); border-color: #fff; }
.lcard-ext, .lcard-cta, .lcard-logo { display: none; }
.lgrid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 600px) { .lgrid-2 { grid-template-columns: 1fr; } }

/* Private Services: slim full-width card, Sign In stays on the far right */
.private-card { padding: 1rem 1.4rem; border-radius: 12px; min-height: 96px; }
.private-card::before { background: linear-gradient(90deg, rgba(5,8,19,.9) 0%, rgba(5,8,19,.6) 50%, rgba(5,8,19,.3) 100%); }
.private-text h3 { font-size: 1.2rem; }
.private-text .lock { width: 26px; height: 26px; }
.signin-btn { padding: .7rem 1.6rem; font-size: 1rem; }

/* IT Tools: three across, PowerShell Toolkit full-width underneath */
.lgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lcard-wide { grid-column: 1 / -1; min-height: 96px; }
.lcard-wide p { -webkit-line-clamp: 2; max-width: 900px; }
@media (max-width: 900px) { .lgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .lgrid { grid-template-columns: 1fr; } }
.lgrid.lgrid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 600px) { .lgrid.lgrid-2 { grid-template-columns: 1fr; } }

/* Brighter images: lighter overlays (dark only where the text sits) */
.lcard::before { background: linear-gradient(90deg, rgba(5,8,19,.72) 0%, rgba(5,8,19,.38) 45%, rgba(5,8,19,.05) 85%); }
.lcard:hover::before { background: linear-gradient(90deg, rgba(5,8,19,.66) 0%, rgba(5,8,19,.3) 45%, rgba(5,8,19,0) 85%); }
.lcard h3, .lcard p { text-shadow: 0 1px 3px rgba(0,0,0,.85), 0 2px 12px rgba(0,0,0,.7); }
.lcard p { color: #e2e8f4; }
.private-card::before { background: linear-gradient(90deg, rgba(5,8,19,.75) 0%, rgba(5,8,19,.4) 50%, rgba(5,8,19,.08) 100%); }
.hero::after { background: linear-gradient(90deg, rgba(5,8,19,.62) 0%, rgba(5,8,19,.22) 50%, rgba(5,8,19,0) 80%), linear-gradient(180deg, rgba(5,8,19,0) 0%, rgba(5,8,19,0) 55%, #070a14 100%); }

/* Private services page */
.hero-private { background-image: url(/assets/private-hero.webp), url(/assets/lake-image.webp); background-size: cover, cover; background-position: center 55%, center 55%; background-repeat: no-repeat; }
.hero-private .hero-tagline { color: #b9a9ff; }
.private-notice { margin-top: .9rem; padding: 1rem 1.3rem; border-radius: 12px; border: 1px solid rgba(138,124,255,.35); background: rgba(138,124,255,.08); color: #d3dcec; }
.private-notice p { margin: 0; }
.signout-row { margin-top: 1.5rem; display: flex; justify-content: flex-end; }
.btn-outline-link { display: inline-block; padding: .65rem 1.4rem; border-radius: 10px; border: 1px solid rgba(90,162,255,.4); background: rgba(90,162,255,.07); color: #e9eef7; font-weight: 600; }
.btn-outline-link:hover { text-decoration: none; border-color: #7ec4ff; background: rgba(90,162,255,.15); }
/* Longhands so --img can hold an image plus a gradient fallback (multi-layer) */
.lcard, .private-card { background-color: #070a14; background-image: var(--img); }

/* Private services: text lower-left, arrow lower-right, art-forward cards */
.lcard-low { align-items: flex-end; min-height: 210px; padding: 1rem 4.2rem 1.1rem 1.3rem; }
.lcard-low::before { background: linear-gradient(180deg, rgba(5,8,19,0) 25%, rgba(5,8,19,.55) 62%, rgba(5,8,19,.9) 100%), linear-gradient(90deg, rgba(5,8,19,.35) 0%, rgba(5,8,19,0) 60%); }
.lcard-low:hover::before { background: linear-gradient(180deg, rgba(5,8,19,0) 30%, rgba(5,8,19,.5) 62%, rgba(5,8,19,.86) 100%); }
.lcard-low::after { top: auto; bottom: 1.1rem; transform: none; }
.lcard-low h3 { font-size: 1.35rem; }
@media (max-width: 600px) { .lcard-low { min-height: 170px; } }

/* Hero: welcome line + Sign Out on the right */
.hero-private { justify-content: space-between; }
.hero-private .hero-welcome strong { color: #fff; }
.hero-signout { position: absolute; right: 2rem; bottom: 1.4rem; z-index: 1; padding: .6rem 1.4rem; border-radius: 10px; border: 1px solid rgba(126,196,255,.55); background: rgba(5,8,19,.55); color: #e9eef7; font-weight: 600; backdrop-filter: blur(6px); }
.hero-signout:hover { text-decoration: none; background: rgba(61,134,240,.4); border-color: #fff; }
@media (max-width: 700px) { .hero-signout { right: 1rem; bottom: 1rem; padding: .5rem 1.1rem; } .hero-private .hero-inner { padding-bottom: 3.6rem; } }

/* Private cards: solid dark edge along the bottom so no image seam can show */
.lcard-low::before { background: linear-gradient(180deg, rgba(5,8,19,0) calc(100% - 10px), #070a14 calc(100% - 2px)), linear-gradient(180deg, rgba(5,8,19,0) 25%, rgba(5,8,19,.55) 62%, rgba(5,8,19,.9) 100%), linear-gradient(90deg, rgba(5,8,19,.35) 0%, rgba(5,8,19,0) 60%); }
.lcard-low:hover::before { background: linear-gradient(180deg, rgba(5,8,19,0) calc(100% - 10px), #070a14 calc(100% - 2px)), linear-gradient(180deg, rgba(5,8,19,0) 30%, rgba(5,8,19,.5) 62%, rgba(5,8,19,.86) 100%); }

/* Card edge: the border used to be translucent, so the artwork showed through
   it as a thin sliver. Opaque border + art clipped to the padding box + a dark
   ring around the outside. */
.lcard, .private-card { border: 1px solid #1c2f55; background-clip: padding-box; box-shadow: 0 0 0 1px rgba(5,8,19,.9), 0 10px 28px rgba(0,0,0,.4); }
.lcard:hover { border-color: #5aa2ff; box-shadow: 0 0 0 1px rgba(5,8,19,.9), 0 16px 36px rgba(0,0,0,.5), 0 0 24px rgba(90,162,255,.22); }
.private-card { border-color: #2f2a66; }

/* Taller hero (+~30%) */
.hero { min-height: 250px; }
.hero-inner { padding-top: 1.8rem; }
@media (max-width: 700px) { .hero { min-height: 220px; } .hero-inner { padding-top: 1.3rem; } }

/* Hero +20% more */
.hero { min-height: 300px; }
.hero-inner { padding-top: 2.2rem; }
@media (max-width: 700px) { .hero { min-height: 250px; } .hero-inner { padding-top: 1.5rem; } }

/* ===== Admin page ===== */
.hero-admin { min-height: 170px; }
.hero-admin .hero-tagline { color: #e0b24a; }
.admin-banner { margin: 1rem 0 0; padding: .85rem 1.2rem; border-radius: 12px; border: 1px solid; font-weight: 500; }
.admin-banner-ok { color: #6ee7b0; background: rgba(47,191,113,.1); border-color: rgba(47,191,113,.5); }
.admin-banner-err { color: #ffb4b4; background: rgba(255,107,107,.1); border-color: rgba(255,107,107,.5); }

body.admin-body .admin-card { margin: 0; padding: 1.2rem 1.4rem; border-radius: 16px; border: 1px solid #1c2f55; background: linear-gradient(135deg, #0d1730 0%, #080c16 75%); box-shadow: 0 0 0 1px rgba(5,8,19,.9), 0 10px 28px rgba(0,0,0,.4); }
body.admin-body .kpis { grid-template-columns: repeat(auto-fit, minmax(180px, 260px)); }
body.admin-body .kpi { background: rgba(90,162,255,.06); border: 1px solid rgba(90,162,255,.25); border-radius: 12px; padding: .8rem 1rem; }
body.admin-body .kpi .value { color: #fff; }

/* Users table */
body.admin-body table { border-collapse: separate; border-spacing: 0; }
body.admin-body th { color: #7ec4ff; font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; border-bottom: 1px solid rgba(90,162,255,.3); padding: .6rem .8rem; }
body.admin-body td { padding: .65rem .8rem; border-bottom: 1px solid rgba(255,255,255,.07); }
body.admin-body tbody tr:hover td { background: rgba(90,162,255,.05); }
body.admin-body .sticky-col { background: #0a1224; }
body.admin-body tbody tr:hover .sticky-col { background: #0f1b36; }
body.admin-body td:first-child { font-weight: 600; color: #fff; }

/* Badges + buttons */
body.admin-body .badge { font-size: .72rem; letter-spacing: .04em; padding: .22rem .65rem; }
body.admin-body .badge-ok { background: rgba(47,191,113,.18); color: #6ee7b0; border: 1px solid rgba(47,191,113,.5); }
body.admin-body .badge-fail { background: rgba(255,107,107,.15); color: #ffb4b4; border: 1px solid rgba(255,107,107,.5); }
body.admin-body .badge-info { background: rgba(90,162,255,.15); color: #8fc2ff; border: 1px solid rgba(90,162,255,.5); }
body.admin-body .badge-warn { background: rgba(224,178,74,.12); color: #e0b24a; border: 1px solid rgba(224,178,74,.45); }
body.admin-body button.btn-secondary { background: rgba(90,162,255,.07); border: 1px solid rgba(90,162,255,.3); }
body.admin-body button.btn-secondary:hover { border-color: #7ec4ff; background: rgba(90,162,255,.16); }
body.admin-body button.btn-secondary:disabled { opacity: .45; cursor: not-allowed; }
body.admin-body button:not(.btn-secondary) { background: linear-gradient(135deg, #5aa2ff, #2f6bff); border: 1px solid rgba(126,196,255,.5); }

/* Inputs */
body.admin-body input, body.admin-body select { background: #0a1020; border: 1px solid rgba(90,162,255,.28); }
body.admin-body input:focus { border-color: #e0b24a; box-shadow: 0 0 0 3px rgba(224,178,74,.15); }
body.admin-body input[type="checkbox"] { accent-color: #5aa2ff; }
body.admin-body .form-group label { color: #aab6cc; }

@media (max-width: 700px) {
    body.admin-body .admin-card { padding: 1rem; }
    body.admin-body form > div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
    body.admin-body form > div[style*="grid-template-columns"] > * { grid-column: 1 !important; grid-row: auto !important; }
    body.admin-body .hero-admin { min-height: 150px; }
}

/* Users table: everything but Username and Email is centered in its column */
body.admin-body th:nth-child(n+3), body.admin-body td:nth-child(n+3) { text-align: center; }
body.admin-body td:nth-child(n+3) form { justify-content: center; }

/* Admin hero: same height/padding as the other pages (the shorter one clipped the title) */
.hero.hero-admin { min-height: 300px; }
@media (max-width: 700px) { .hero.hero-admin, body.admin-body .hero-admin { min-height: 250px; } }

/* Inside (left) + Create User (right), equal height */
.admin-top { display: grid; grid-template-columns: minmax(240px, 1fr) 2.2fr; gap: 0 1.2rem; align-items: stretch; }
.admin-top .lsection { display: flex; flex-direction: column; }
.admin-top .lsection > .admin-card { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.cu-form { display: flex; flex-direction: column; justify-content: center; gap: .7rem; }
.cu-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.cu-fields .form-group { margin: 0; }
.cu-fields input { padding: .55rem .7rem; }
.cu-options { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; }
.cu-opt { display: inline-flex; align-items: center; gap: .4rem; font-size: .88rem; color: var(--text); cursor: pointer; }
.cu-opt-admin { padding-right: .9rem; border-right: 1px solid rgba(90,162,255,.3); color: #e0b24a; }
.cu-submit { margin-left: auto; padding: .55rem 1.4rem; }
@media (max-width: 1000px) { .admin-top { grid-template-columns: 1fr; } .cu-fields { grid-template-columns: 1fr; } }