/* PRICE HUB «Космос» — the app (cabinet, sign-in, owner panel).
   Recolours the existing markup only: no class, form or script changes.
   Loaded after each template's own <style>; selectors start with `html body`
   so they win over the page styles without touching the markup.            */

html body{
  --bg:#060814;--panel:rgba(255,255,255,.055);--panel-2:rgba(255,255,255,.04);--line:rgba(255,255,255,.12);--line-2:rgba(255,255,255,.18);
  --text:#F1F5FB;--ink:#F1F5FB;--muted:#9AA6BC;--accent:#7FF3FF;--accent-2:rgba(127,243,255,.12);--paper:transparent;
  --success:#4ADE9B;--warn:#FFC86B;--shadow:0 18px 50px rgba(0,0,0,.35);
  color-scheme:dark;
  background:radial-gradient(ellipse 120% 60% at 50% -10%,#1A1550 0%,#0B0D24 45%,#060814 85%) fixed;
  color:var(--sp-ink);font-family:var(--sp-body);
}
html body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.7;
  background-image:radial-gradient(1.2px 1.2px at 20px 30px,#fff,rgba(255,255,255,0)),radial-gradient(1px 1px at 140px 90px,#CFE9FF,rgba(255,255,255,0)),radial-gradient(1.4px 1.4px at 220px 170px,#fff,rgba(255,255,255,0)),radial-gradient(1px 1px at 300px 40px,#E6DAFF,rgba(255,255,255,0));
  background-size:340px 240px;animation:sp-twinkle 4s ease-in-out infinite}
html body::after{content:"";position:fixed;right:-260px;top:-200px;width:720px;height:620px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,rgba(167,139,255,.22),rgba(167,139,255,0) 68%)}
html body > *{position:relative;z-index:1}
html body a{color:var(--sp-accent)}
html body a:hover{color:#C2FAFF}
html body ::selection{background:rgba(127,243,255,.35)}
html body h1,html body h2,html body .page-title,html body .head{font-family:var(--sp-display);letter-spacing:-.6px}
html body small,html body .muted,html body .helper,html body .sub,html body .page-sub,html body .small{color:var(--sp-mute)}
html body code{background:rgba(255,255,255,.08);color:#D4FBFF}
html body hr{border-top-color:var(--line)}

/* ---- buttons ---- */
html body button,html body .btn,html body button.logout{
  background:linear-gradient(135deg,var(--sp-accent),#B9F7FF);border:1px solid transparent;color:#060814;font-weight:700;
  border-radius:12px;box-shadow:0 0 26px rgba(127,243,255,.28);transition:transform .15s ease,box-shadow .15s ease}
html body button:hover,html body .btn:hover{color:#060814;opacity:1;transform:translateY(-1px);box-shadow:0 10px 34px rgba(127,243,255,.45);text-decoration:none}
html body button.secondary,html body .btn.secondary,html body button.logout.secondary,html body .btn.light{
  background:rgba(255,255,255,.06);color:var(--sp-ink);border:1px solid var(--line-2);box-shadow:none}
html body button.secondary:hover,html body .btn.secondary:hover,html body .btn.light:hover{background:rgba(255,255,255,.12);color:#fff;box-shadow:none}
html body button.danger,html body .btn.danger{background:rgba(255,92,120,.1);color:#FF9BB0;border:1px solid rgba(255,120,145,.45);box-shadow:none}
html body button.danger:hover{background:rgba(255,92,120,.2);color:#FFC2CF}
html body button:disabled{opacity:.5;transform:none;cursor:not-allowed}
html body button:focus-visible,html body .btn:focus-visible,html body a:focus-visible{outline:2px solid var(--sp-accent);outline-offset:2px}

/* ---- forms ---- */
html body label{color:#D6DEEC}
html body input,html body textarea,html body select{
  background:rgba(8,11,30,.7);color:var(--sp-ink);border:1px solid var(--line-2);border-radius:12px}
html body input::placeholder,html body textarea::placeholder{color:#6F7B92}
html body input:focus,html body textarea:focus,html body select:focus{outline:none;border-color:rgba(127,243,255,.7);box-shadow:0 0 0 3px rgba(127,243,255,.18)}
html body input[type=checkbox],html body input[type=radio]{accent-color:var(--sp-accent);width:auto;box-shadow:none}
html body select option{background:#0B0D24;color:var(--sp-ink)}

/* ---- surfaces shared by all pages ---- */
html body .card,html body .panel,html body .hero-aside,html body .status-side,html body .shop-card{
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 18px 50px rgba(0,0,0,.3);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--sp-ink)}
html body .list-item,html body .shop,html body .info-strip{background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--sp-ink)}
html body .empty{background:rgba(255,255,255,.03);border:1px dashed var(--line-2);color:var(--sp-mute)}
html body .msg{background:rgba(74,222,155,.1);border:1px solid rgba(74,222,155,.4);color:#BDF5D9}
html body .msg.error{background:rgba(255,92,120,.1);border-color:rgba(255,120,145,.45);color:#FFC2CF}
html body .msg a{color:#fff;text-decoration:underline}
html body .notice,html body .warning{background:rgba(255,200,107,.08);border:1px solid rgba(255,200,107,.35);border-left:4px solid #FFC86B;color:#FFE2B0}
html body .notice b,html body .notice strong{color:#FFF1D6}
html body .pill,html body .badge,html body .eyebrow{background:rgba(127,243,255,.1);border:1px solid rgba(127,243,255,.3);color:#D4FBFF}
html body table th{color:var(--sp-mute);border-bottom-color:var(--line)}
html body table td{border-bottom-color:rgba(255,255,255,.08)}
html body .tablewrap{scrollbar-color:rgba(255,255,255,.2) transparent}

/* inline-coloured notices in page templates (success / info boxes) */
html body [style*="#eefaf3"]{background:rgba(74,222,155,.1)!important;border-color:rgba(74,222,155,.4)!important;color:#BDF5D9!important}
html body [style*="#f3f7ff"]{background:rgba(127,243,255,.08)!important;border-color:rgba(127,243,255,.35)!important;color:#D4FBFF!important}
html body [style*="color:#9a6312"]{color:#FFD48A!important}
html body [style*="color:#82827d"],html body [style*="color:#999"]{color:var(--sp-mute)!important}
html body [style*="background:#e5e5e1"]{background:rgba(255,255,255,.1)!important}

/* ---- client cabinet (shop_shell) ---- */
html body .shell{background:transparent;box-shadow:none}
html body .sidebar{background:rgba(9,12,32,.72);border-right:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html body .brand-mark{background:linear-gradient(135deg,var(--sp-accent),var(--sp-violet));border-radius:12px;width:34px;height:34px;box-shadow:0 0 22px rgba(127,243,255,.5)}
html body .brand-mark i,html body .brand-mark::before,html body .brand-mark::after{display:none}
html body .brand-title{font-family:var(--sp-display);font-size:18px;letter-spacing:.4px;color:var(--sp-ink)}
html body .brand-title span{color:var(--sp-accent)}
html body .brand-note,html body .shop-card .label,html body .shop-card .sub{color:var(--sp-mute)}
html body .nav a{color:#B7C2D6}
html body .nav a:hover{background:rgba(255,255,255,.06);color:#fff}
html body .nav a.current{background:linear-gradient(135deg,rgba(127,243,255,.16),rgba(167,139,255,.12));color:#fff;border-color:rgba(127,243,255,.4);box-shadow:0 0 24px rgba(127,243,255,.12)}
html body .nav a.current svg{stroke:var(--sp-accent)}
html body .side-box{background:rgba(255,200,107,.08);border-color:rgba(255,200,107,.3)}
html body .side-box .title{color:#FFE2B0}html body .side-box .copy{color:#E9D3A9}
html body .side-tail{color:var(--sp-mute)}
html body .topbar{background:rgba(9,12,32,.6);border-bottom:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html body .crumb{background:rgba(255,255,255,.05);border-color:var(--line);color:#D6DEEC}
html body .live-dot{background:var(--sp-accent);box-shadow:0 0 0 4px rgba(127,243,255,.18),0 0 14px var(--sp-accent)}
html body .userline{color:var(--sp-soft)}
html body .user-badge{background:linear-gradient(135deg,var(--sp-accent),var(--sp-violet));color:#060814}
html body .outline-link{background:rgba(255,255,255,.05);border-color:var(--line-2);color:var(--sp-ink)}
html body .outline-link:hover{background:rgba(255,255,255,.1);border-color:rgba(127,243,255,.5);color:#fff}
html body .page-title{font-weight:800;font-size:40px;text-shadow:0 0 34px rgba(167,139,255,.3)}
html body .hero-aside .mini{color:var(--sp-mute)}html body .hero-aside .big{font-family:var(--sp-display);color:#fff}
html body .card h2{font-family:var(--sp-display);font-size:20px;letter-spacing:-.3px}
html body .metric .num{font-family:var(--sp-display);color:#fff;text-shadow:0 0 24px rgba(127,243,255,.35)}
html body .metric .icon{background:rgba(127,243,255,.12);color:var(--sp-accent)}
html body .status-ring{background:radial-gradient(circle,rgba(127,243,255,.5) 30%,rgba(127,243,255,.12) 62%,rgba(127,243,255,0) 70%);border-color:rgba(127,243,255,.4)}
html body .status-side{color:#D6DEEC}

/* catalogue table */
html body .catalog-group-row td{background:rgba(255,255,255,.05);border-top:1px solid var(--line);border-bottom:1px solid rgba(255,255,255,.06)}
html body .catalog-group-row:hover td{background:rgba(127,243,255,.07)}
html body .catalog-group-row.open td{background:rgba(127,243,255,.09)}
html body .catalog-group-meta{color:var(--sp-mute)}
html body .catalog-arrow{color:var(--sp-accent)}
html body .safe-note{background:rgba(127,243,255,.06);border-color:rgba(127,243,255,.25);color:#C3CDE0}

/* ---- owner / account pages (base.html) ---- */
html body > header{background:rgba(9,12,32,.6);border-bottom:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html body > header .logo{font-family:var(--sp-display);font-size:18px;letter-spacing:.4px;color:var(--sp-ink)}
html body > header .logo span{color:var(--sp-accent)}
html body > header nav .muted{color:var(--sp-mute)}

/* ---- shop list (shops.html) ---- */
html body .frame{background:transparent;box-shadow:none}
html body .top{border-bottom:1px solid var(--line);background:rgba(9,12,32,.6);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html body .top .brand{font-family:var(--sp-display);font-size:18px;letter-spacing:.4px}
html body .top .brand span{color:var(--sp-accent)}
html body .top-right,html body .top-right a{color:var(--sp-soft)}
html body .head{text-shadow:0 0 34px rgba(167,139,255,.3)}
html body .shop .name{color:#fff}
html body .frame .status{background:rgba(127,243,255,.06);border-color:rgba(127,243,255,.25);color:#C3CDE0}
html body .frame .dot{background:var(--sp-accent);box-shadow:0 0 10px var(--sp-accent)}

/* ---- sign-in pages (auth_base.html) ---- */
html body .auth-shell{background:rgba(9,12,32,.55);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 40px 120px rgba(0,0,0,.5);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
html body .auth-brand{background:radial-gradient(ellipse 90% 70% at 30% 20%,rgba(167,139,255,.35),rgba(167,139,255,0) 70%),radial-gradient(ellipse 80% 60% at 80% 90%,rgba(127,243,255,.25),rgba(127,243,255,0) 70%)}
html body .auth-brand .logo{font-family:var(--sp-display);color:#fff}html body .auth-brand .hub{color:var(--sp-accent)}
html body .auth-brand .kicker{background:rgba(127,243,255,.1);border:1px solid rgba(127,243,255,.35);color:#D4FBFF}
html body .auth-brand .hero{font-family:var(--sp-display);color:#fff;text-shadow:0 0 40px rgba(167,139,255,.35)}
html body .auth-brand .copy{color:var(--sp-soft)}
html body .auth-brand .wave{background-image:radial-gradient(rgba(127,243,255,.9) 1px,transparent 1.2px);opacity:.35}
html body .auth-side{background:rgba(255,255,255,.03);border-left:1px solid var(--line)}
html body .auth-side .panel{background:transparent;border:0;box-shadow:none;backdrop-filter:none}
html body .panel h1{color:#fff}
html body .auth-side .msg{background:rgba(255,92,120,.1);border-color:rgba(255,120,145,.45);color:#FFC2CF}
html body .auth-side .msg.success{background:rgba(74,222,155,.1);border-color:rgba(74,222,155,.4);color:#BDF5D9}
html body .error{background:rgba(255,92,120,.1);border-color:rgba(255,120,145,.45);color:#FFC2CF}
html body .info{background:rgba(127,243,255,.07);border-color:rgba(127,243,255,.3);color:#D4FBFF}
html body .info a{color:#fff}
html body .owner-tag{background:linear-gradient(135deg,var(--sp-accent),var(--sp-violet));color:#060814;font-weight:800}
html body .fine,html body .switch{color:var(--sp-mute)}
html body .switch a,html body .under-field a{color:var(--sp-accent)}
html body .back-home{display:inline-flex;align-items:center;gap:6px;margin-bottom:22px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-2);background:rgba(255,255,255,.05);color:var(--sp-soft);font-size:13px;font-weight:600;text-decoration:none}
html body .back-home:hover{background:rgba(255,255,255,.1);border-color:rgba(127,243,255,.5);color:#fff;text-decoration:none}
html body .input{background:rgba(8,11,30,.7);color:var(--sp-ink);border-color:var(--line-2)}

@media (prefers-reduced-motion:reduce){html body::before{animation:none}html body button,html body .btn{transition:none}}
