/* ============================================================
   KASSA26 — тема v2 (поверх kassa26-theme.css)
   Подключать ПОСЛЕ kassa26-theme.css. Логику не меняет.
   ============================================================ */

:root{
  /* палитра */
  --bg:#fbfaf7;
  --ink:#0f1b2b;
  --brand-primary:#132e50;   /* тёмно-синий: кнопки, ссылки, логотип */
  --brand-accent:#249c74;    /* изумруд: выгоды, «рекомендуем», иконки */
  --brand-accent-soft:#e7f4ee;
  --card:#ffffff;
  --soft:#f1f5f9;
  --muted:#62748e;
  --line:#e3e1da;
  --line-strong:#cfd8e3;

  /* форма */
  --r-sm:8px;
  --r-md:12px;
  --r-lg:16px;
  --r-xl:22px;
  --r-pill:999px;
  --shadow:0 1px 2px rgba(15,27,43,.04), 0 12px 32px -12px rgba(15,27,43,.14);
  --shadow-hover:0 2px 4px rgba(15,27,43,.05), 0 20px 44px -16px rgba(15,27,43,.20);
}

/* ---------- база ---------- */

body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Manrope","Segoe UI",Arial,sans-serif;
  font-weight:500;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,.brand,.catalog-main h1,.catalog-group-title,.price-main{
  font-family:"Unbounded","Manrope","Segoe UI",sans-serif;
  letter-spacing:-.01em;
}

a{color:var(--brand-primary)}

/* ---------- шапка ---------- */

header{
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(10px);
  border-top:0;                     /* убрать синюю полосу сверху */
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 rgba(15,27,43,.02);
}

.brand{
  color:var(--brand-primary);
  font-family:"Unbounded","Manrope",sans-serif;
  font-weight:600;
  letter-spacing:-.01em;
}

.brand-sub{color:var(--muted);letter-spacing:0;font-weight:500}

.head-search input{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--r-pill);
  color:var(--ink);
  box-shadow:none;
  padding:9px 16px;
}

.head-search input:focus{outline:2px solid rgba(19,46,80,.25);outline-offset:1px}
.search-icon{color:var(--muted)}

.login-btn{
  background:#fff;
  color:var(--brand-primary);
  border:1px solid var(--line);
  border-radius:var(--r-pill);
  font-weight:700;
  font-family:"Manrope",sans-serif;
}

.login-btn:hover{background:var(--soft);border-color:var(--line-strong)}

/* ---------- карточки и панели ---------- */

.benefits-card,.card,.empty,.side-card,.box{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow);
}

.card{transition:box-shadow .18s ease,border-color .18s ease,transform .18s ease}
.card:hover{box-shadow:var(--shadow-hover);border-color:var(--line-strong);transform:translateY(-2px)}
.card h3{font-family:"Manrope",sans-serif;font-weight:700;color:var(--ink)}

.side-title{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* ---------- фильтры каталога ---------- */

.catalog-level button{
  border-radius:var(--r-md);
  background:transparent;
  color:#26313e;
  font-weight:600;
  font-family:"Manrope",sans-serif;
}
.catalog-level button:hover{background:var(--soft)}
.catalog-level button.on{background:var(--brand-primary);color:#fff}

.view-switch{background:#fff;border:1px solid var(--line);border-radius:var(--r-md)}
.view-switch button{border-radius:var(--r-sm);font-weight:600}
.view-switch button.on{background:var(--brand-primary);color:#fff}

/* ---------- иконки преимуществ ---------- */

.benefit{padding:12px 6px}
.benefit+.benefit{border-top:1px solid var(--line)}
.benefit-icon{
  background:var(--brand-accent-soft);
  color:var(--brand-accent);
  border-radius:10px;
}

/* ---------- цены, кнопки покупки, «рекомендуем» ---------- */

.price-main{color:var(--ink);font-weight:700}

.buy{
  background:var(--brand-primary);
  color:#fff;
  border:0;
  border-radius:var(--r-pill);
  font-weight:700;
  font-family:"Manrope",sans-serif;
  padding:10px 18px;
}
.buy:hover{background:#0d2340;filter:none;opacity:1}

.waitbtn{
  background:#fff;
  color:var(--brand-accent);
  border:1px solid var(--brand-accent);
  border-radius:var(--r-pill);
  font-weight:700;
}
.waitbtn:hover{background:var(--brand-accent-soft)}

.recommended-badge{
  background:var(--brand-accent-soft);
  color:var(--brand-accent);
  border-radius:var(--r-pill);
  font-weight:700;
}

.compare-best{outline:1px solid rgba(36,156,116,.45);background:var(--brand-accent-soft)}
.compare-recommended td:first-child{font-weight:700;color:var(--brand-primary)}
.compare-table th{color:var(--muted);font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.06em}
.compare-price-link{color:var(--brand-primary);font-weight:700}

.ofd-compare-banner{
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  background:var(--brand-accent-soft);
  color:var(--ink);
}

/* ---------- подвал ---------- */

.site-footer{
  background:transparent;
  border-top:1px solid var(--line);
  color:var(--muted);
}
.footer-columns h3{color:var(--ink);font-family:"Manrope",sans-serif;font-weight:700}
.footer-columns a{color:var(--muted);text-decoration:none}
.footer-columns a:hover{color:var(--brand-primary)}
.footer-bottom{border-top:1px solid var(--line);color:var(--muted)}
.payment-logos img{opacity:.75}

/* ---------- фокус и выделения ---------- */

:focus-visible{outline:2px solid rgba(19,46,80,.35);outline-offset:2px}
::selection{background:var(--brand-accent-soft)}

/* ============================================================
   Адаптер темы v2 к фактической разметке kassa26.ru.
   Только оформление; HTML, JS, API и бизнес-логика не меняются.
   ============================================================ */

html,body{max-width:100%;overflow-x:clip}
body{overflow-wrap:break-word}
img,svg,video{max-width:100%}
button,input,select,textarea{font-family:"Manrope","Segoe UI",Arial,sans-serif}
h1,h2,h3{overflow-wrap:anywhere}

/* Фактическая шапка сайта создаётся компонентом site-header.js. */
html body site-header .site112-header{
  background:rgba(255,255,255,.92)!important;
  color:var(--ink)!important;
  border-bottom:1px solid var(--line)!important;
  box-shadow:0 1px 0 rgba(15,27,43,.03)!important;
  backdrop-filter:blur(12px)!important;
  font-family:"Manrope","Segoe UI",Arial,sans-serif!important;
}
html body site-header .site112-inner{
  width:min(1180px,calc(100% - 32px))!important;
  min-height:82px!important;
}
html body site-header .site112-logo{
  width:230px!important;
  color:var(--brand-primary)!important;
}
html body site-header .site112-logo img{
  content:url("/assets/brand/autor-logo.png")!important;
  width:170px!important;
  max-height:48px!important;
  object-fit:contain!important;
}
html body site-header .site112-search input{
  height:42px!important;
  padding:0 18px 0 40px!important;
  border:1px solid var(--line)!important;
  border-radius:var(--r-pill)!important;
  background:#fff!important;
  color:var(--ink)!important;
  font:500 13px/42px "Manrope","Segoe UI",Arial,sans-serif!important;
}
html body site-header .site112-searchbox,
html body site-header .site112-search{height:42px!important}
html body site-header .site112-searchbox::before{color:var(--muted)!important}
html body site-header .site112-actions{height:42px!important}
html body site-header .site112-action{
  height:42px!important;
  padding:0 16px!important;
  border:1px solid var(--line)!important;
  border-radius:var(--r-pill)!important;
  background:#fff!important;
  color:var(--brand-primary)!important;
  font:700 12px/40px "Manrope","Segoe UI",Arial,sans-serif!important;
}
html body site-header .site112-action:hover{
  background:var(--soft)!important;
  border-color:var(--line-strong)!important;
}
html body site-header .site112-action[href="/remote.html"]{
  background:var(--brand-accent)!important;
  border-color:var(--brand-accent)!important;
  color:#fff!important;
}
html body site-header .site112-action[href="/remote.html"]:hover{background:#1d8663!important}

/* Основная навигация и общие поверхности. */
#projectMainNav{
  background:rgba(255,255,255,.92)!important;
  border-color:var(--line)!important;
  box-shadow:none!important;
  font-family:"Manrope","Segoe UI",Arial,sans-serif!important;
}
#projectMainNav a{color:var(--muted)!important}
#projectMainNav a:hover{color:var(--brand-primary)!important;background:var(--soft)!important}
main{color:var(--ink)}
.panel,.info-card,.content-card,.article,.article-shell .article,.remote-card,.support-card{
  border-color:var(--line)!important;
  border-radius:var(--r-lg)!important;
}
input,select,textarea{
  border-color:var(--line);
  border-radius:var(--r-md);
}
button,.btn,.support-btn,.download{
  font-family:"Manrope","Segoe UI",Arial,sans-serif;
}

/* Статьи и длинные юридические страницы. */
.article-body,.article-body p,.article-body li,
.info-content,.legal-content,.content{
  overflow-wrap:anywhere;
  word-break:normal;
}
.article-body img{height:auto}

/* Мобильный каталог: разделы плитками, товары в две колонки. */
@media(max-width:650px){
  html body site-header .site112-inner{
    width:calc(100% - 28px)!important;
    grid-template-columns:1fr auto!important;
    gap:10px!important;
    padding:12px 0!important;
  }
  html body site-header .site112-logo{
    width:auto!important;
    height:44px!important;
    justify-self:start!important;
  }
  html body site-header .site112-logo img{width:142px!important;max-height:42px!important}
  html body site-header .site112-actions{
    justify-content:flex-end!important;
    flex-wrap:wrap!important;
  }
  html body site-header .site112-action{padding:0 12px!important}
  html body site-header .site112-action[href="/support.html"],
  html body site-header .site112-action[href="/admin.html"]{display:none!important}
  html body site-header .site112-search{
    grid-column:1/-1!important;
    order:3!important;
  }

  .catalog-shell{grid-template-columns:minmax(0,1fr)!important;gap:16px!important}
  .sidebar{display:block!important}
  .sidebar .benefits-card{display:none!important}
  .side-card{padding:10px!important;box-shadow:none!important}
  .side-title{margin:2px 2px 9px!important}
  .catalog-tree{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important}
  .catalog-all{grid-column:1/-1}
  .catalog-parent,.catalog-all button{
    min-height:44px!important;
    padding:9px 10px!important;
    border:1px solid var(--line)!important;
    text-align:center!important;
    font-size:12px!important;
  }
  .catalog-branch.open{padding:0!important;background:transparent!important}
  .catalog-branch .depth-2{grid-column:1/-1;margin:5px 0!important}

  .grid,.grid.list-view{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .grid .card,.grid.list-view .card{
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
    min-height:100%!important;
    margin:0!important;
    padding:10px!important;
  }
  .grid .product-visual,.grid.list-view .product-visual{
    width:100%!important;
    height:auto!important;
    aspect-ratio:1/1!important;
  }
  .grid .product-body,.grid.list-view .product-body{display:flex!important;min-width:0!important;height:100%!important}
  .grid .card h3,.grid.list-view .card h3{font-size:13px!important;overflow-wrap:anywhere}
  .grid .desc,.grid.list-view .desc{font-size:11px!important}
  .grid .price-block,.grid.list-view .price-block{margin-top:auto!important;height:auto!important;display:block!important}
  .grid .price-main,.grid.list-view .price-main{font-size:17px!important}
  .grid .stock-slot,.grid.list-view .stock-slot{min-height:18px!important}
  .grid .buy,.grid.list-view .buy{width:100%!important;min-height:40px!important;margin-top:7px!important}

  .compare-panel{overflow:visible!important}
  .compare-table{min-width:0!important;table-layout:fixed!important}
  .compare-table th,.compare-table td{padding:12px 8px!important}
  .compare-table th:nth-child(2),.compare-table td:nth-child(2),
  .compare-table th:nth-child(3),.compare-table td:nth-child(3),
  .compare-table th:nth-child(5),.compare-table td:nth-child(5),
  .compare-table th:nth-child(6),.compare-table td:nth-child(6){display:none!important}
  .compare-operator-cell{min-width:0!important}
  .compare-operator-logo{width:34px!important;height:34px!important;flex-basis:34px!important}
  .compare-price-link{font-size:15px!important;padding:6px!important}

  .footer-columns{grid-template-columns:1fr 1fr!important}
  .footer-bottom{flex-wrap:wrap!important}
}

@media(max-width:390px){
  .grid,.grid.list-view{gap:8px!important}
  .grid .card,.grid.list-view .card{padding:8px!important}
  .footer-columns{grid-template-columns:1fr!important}
}


/* KASSA26 LOVABLE MOBILE NAV FIX START */
@media(max-width:650px){
  #projectMainNav{
    width:calc(100% - 20px)!important;
    overflow:visible!important;
  }
  #projectMainNav .project-main-nav-inner{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    overflow:visible!important;
    gap:0!important;
  }
  #projectMainNav a{
    min-width:0!important;
    min-height:44px!important;
    padding:9px 8px!important;
    white-space:normal!important;
    font:700 12px/1.25 "Manrope","Segoe UI",Arial,sans-serif!important;
  }
  #projectMainNav a:last-child:nth-child(odd){grid-column:1/-1}
}
/* KASSA26 LOVABLE MOBILE NAV FIX END */
