/* DAYO partneru portāls — base.css: tokeni (gaišs/tumšs), tipogrāfija, izkārtojums.
   Krāsas = DAYO zīmols (tās pašas, kas web/index.html dayo.lv). Tumšais režīms nāk
   TIKAI no prefers-color-scheme — portālam nav sava tēmas slēdža. */
:root{
  --brand:#EA0558; --brand-strong:#A10A3C; --brand-400:#FF4E8A; --brand-soft:#FFE0EA;
  --accent:#FF7A59;
  --bg:#FFF6F2; --surface:#FFFFFF; --surface-2:#FFEFF4; --surface-3:#FFE6EE;
  --text:#2A0A1A; --muted:#8A5A6A; --faint:#B28A98; --border:#F4D3DE; --border-strong:#E9B8C8;
  --ok:#14804A; --ok-bg:#E3F6EC; --warn:#A45A00; --warn-bg:#FFF1DC; --danger:#C2261D; --danger-bg:#FDE7E5;
  --on-brand:#FFFFFF;
  --shadow-sm:0 1px 2px rgba(74,14,40,.06), 0 2px 8px rgba(74,14,40,.05);
  --shadow-md:0 6px 18px rgba(74,14,40,.08);
  --shadow-lg:0 18px 40px rgba(74,14,40,.14);
  --r-sm:12px; --r:16px; --r-lg:22px; --r-xl:28px;
  --font-head:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"Space Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1120px; --gutter:16px;
  --focus:0 0 0 3px color-mix(in srgb,var(--brand) 35%,transparent);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root{
    --brand:#FF4E8A; --brand-strong:#FF7AA6; --brand-400:#FF7AA6; --brand-soft:#4A0E28;
    --bg:#1B0710; --surface:#2A0A16; --surface-2:#3A1220; --surface-3:#451629;
    --text:#FEEFF3; --muted:#C98EA0; --faint:#9C6C7C; --border:#4A2533; --border-strong:#633F4D;
    --ok:#5FD39A; --ok-bg:#12321F; --warn:#FFB54D; --warn-bg:#3A2708; --danger:#FF7A70; --danger-bg:#3D1210;
    --on-brand:#FFFFFF;
    --shadow-sm:none; --shadow-md:none; --shadow-lg:0 18px 40px rgba(0,0,0,.35);
    color-scheme:dark;
  }
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; min-height:100dvh; display:flex; flex-direction:column;
  background:var(--bg); color:var(--text);
  font-family:var(--font-body); font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{display:block; max-width:100%}
a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
h1,h2,h3,h4{font-family:var(--font-head); font-weight:800; line-height:1.12; margin:0; letter-spacing:-.01em}
h1{font-size:clamp(26px,5.2vw,40px)}
h2{font-size:clamp(21px,3.6vw,27px)}
h3{font-size:18px; font-weight:700}
h4{font-size:15px; font-weight:700}
p{margin:0}
button,input,select,textarea{font:inherit; color:inherit}
:focus-visible{outline:none; box-shadow:var(--focus); border-radius:10px}
.skip{position:absolute; left:-9999px; top:8px; z-index:100; background:var(--surface); padding:8px 12px; border-radius:10px}
.skip:focus{left:8px}
.noscript{padding:24px; text-align:center}
.sr{position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* --- topbar --- */
.topbar{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb,var(--bg) 86%,transparent);
  backdrop-filter:saturate(1.4) blur(12px); -webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid color-mix(in srgb,var(--border) 70%,transparent);
  padding-top:env(safe-area-inset-top);
}
.topbar-in{max-width:var(--wrap); margin:0 auto; padding:10px var(--gutter); display:flex; align-items:center; gap:14px; min-height:60px}
.brand{display:flex; align-items:center; gap:10px; color:var(--text); flex:none}
.brand:hover{text-decoration:none}
.logo{height:32px; width:auto}
.logo-d{display:none}
@media (prefers-color-scheme: dark){ .logo-l{display:none} .logo-d{display:block} }
.brand-tag{
  font-family:var(--font-head); font-weight:800; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--brand); background:var(--surface-2); border:1px solid var(--border); padding:3px 8px; border-radius:999px;
}
.topnav{display:none; gap:4px; margin-left:8px}
.topnav a{color:var(--muted); font-weight:500; padding:8px 12px; border-radius:12px; font-size:14px}
.topnav a:hover{color:var(--text); background:var(--surface-2); text-decoration:none}
.topnav a.on{color:var(--text); background:var(--surface); box-shadow:var(--shadow-sm)}
@media (min-width:860px){ .topnav{display:flex} }
.topbar-right{margin-left:auto; display:flex; align-items:center; gap:10px}
.lang{display:flex; background:var(--surface-2); border:1px solid var(--border); border-radius:999px; padding:3px}
.lang button{border:0; background:transparent; font-weight:700; font-size:12px; letter-spacing:.06em; padding:5px 10px; border-radius:999px; color:var(--muted); cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--surface); color:var(--text); box-shadow:var(--shadow-sm)}
.account{position:relative}

/* --- galvenais --- */
main{flex:1; width:100%; max-width:var(--wrap); margin:0 auto; padding:20px var(--gutter) 48px; outline:none}
main.wide{max-width:none; padding:0 0 48px}
.boot{display:grid; place-items:center; min-height:50vh}
.foot{border-top:1px solid var(--border); padding:22px var(--gutter) calc(22px + env(safe-area-inset-bottom)); color:var(--muted); font-size:13px}
.foot-in{max-width:var(--wrap); margin:0 auto; display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center}
.foot a{color:var(--muted)}
.foot a:hover{color:var(--brand)}
.foot .sp{flex:1}

.stack{display:flex; flex-direction:column; gap:16px}
.stack-sm{display:flex; flex-direction:column; gap:8px}
.row{display:flex; align-items:center; gap:10px}
.row-wrap{display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.grow{flex:1; min-width:0}
.muted{color:var(--muted)}
.faint{color:var(--faint)}
.small{font-size:13px}
.tiny{font-size:12px}
.center{text-align:center}
.nowrap{white-space:nowrap}
.ellipsis{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mt-0{margin-top:0}.mt-1{margin-top:6px}.mt-2{margin-top:12px}.mt-3{margin-top:20px}.mt-4{margin-top:32px}
.grid-2{display:grid; gap:16px; grid-template-columns:1fr}
.grid-3{display:grid; gap:16px; grid-template-columns:1fr}
@media (min-width:720px){ .grid-2{grid-template-columns:1fr 1fr} .grid-3{grid-template-columns:repeat(3,1fr)} }
.narrow{max-width:520px; margin-left:auto; margin-right:auto}
.medium{max-width:760px; margin-left:auto; margin-right:auto}
