/*
Theme Name: PozitivPrint
Theme URI: https://printpozitiv.ru/
Description: Магазинная тема под миграцию printpozitiv.ru. Дизайн-система снята с оригинального шаблона (protostar/refactor): акцент #f44934, Arial, белый каталог-сайдбар с серыми заглавными пунктами, карточки с красной плашкой названия, тёмный футер.
Author: migration
Version: 2.0
Requires at least: 6.0
Tested up to: 7.0
Text Domain: pozitivprint
*/

/* === ДИЗАЙН-ТОКЕНЫ (из CSS оригинала) ============================== */
:root{
  --accent:#f44934;      /* основной коралл: полоса шапки, плашки, ховеры, кнопки */
  --accent-2:#f55b48;    /* вторичный коралл */
  --link:#fd0808;        /* ссылки в контенте */
  --btn:#c6232c;         /* кнопки .sk-btn */
  --btn-hover:#e65058;
  --dark-hover:#760d00;  /* тёмно-красный ховер кнопок */
  --ink:#333;
  --head:#424242;
  --muted:#747474;       /* базовый текст */
  --footer-bg:#3a3a3a;
  --footer-text:#b5b5b5;
  --line:#e3e3e3;
  --bg:#f4f4f4;
  --maxw:1180px;
}

*{box-sizing:border-box}
body{margin:0;font:14px/1.55 Arial,Helvetica,sans-serif;color:var(--muted);background:var(--bg)}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--accent);text-decoration:underline}
img{max-width:100%;height:auto;border:0}
h1,h2,h3{color:#2b2b2b;line-height:1.25;font-weight:700}
h1{font-size:24px;margin:.2em 0 .6em;color:#333}
h2{font-size:19px;margin:1.1em 0 .5em}
h3{font-size:16px}
.content p{color:var(--ink)}
.container{max-width:var(--maxw);margin:0 auto;padding:0 14px}

/* === ШАПКА ========================================================= */
.site-header{background:#fff;border-top:4px solid var(--accent)}      /* фирменная коралловая полоса сверху */
.header-top{display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:14px 0;border-bottom:1px solid rgba(77,77,79,.4)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{height:46px;display:block}
.brand .brand-text{font-size:26px;font-weight:800;color:#2b2b2b}
.brand .brand-text b{color:var(--accent);font-weight:800}
.header-contacts{display:flex;align-items:flex-start;gap:26px;font-size:12px}
.header-links{margin-bottom:6px;text-align:right}
.header-links a{color:#555;margin-left:14px}
.header-phones{text-align:right}
.header-phones .phone{font-size:17px;font-weight:700;color:var(--accent);white-space:nowrap}
.header-phones .mail{color:#555}
.btn-order{display:inline-block;background:var(--accent);color:#fff;font-weight:700;
  padding:8px 16px;border-radius:3px;margin-top:6px}
.btn-order:hover{background:var(--dark-hover);color:#fff;text-decoration:none}

/* === РАСКЛАДКА ====================================================== */
.layout{display:flex;gap:20px;align-items:flex-start;max-width:var(--maxw);margin:18px auto;padding:0 14px}
.sidebar{flex:0 0 220px;width:220px}
.content{flex:1 1 auto;min-width:0;background:#fff;border:1px solid var(--line);padding:22px 26px}

/* === КАТАЛОГ-САЙДБАР (белый, серые ЗАГЛАВНЫЕ пункты — как в оригинале) === */
.catalog{margin-bottom:18px}
.catalog .cat-head{color:var(--accent);font-weight:700;text-transform:uppercase;font-size:15px;
  letter-spacing:.5px;padding:0 0 7px;border-bottom:2px solid var(--accent);margin-bottom:6px}
.catalog ul{list-style:none;margin:0;padding:0}
.catalog li{border-bottom:1px dotted #d6d6d6}
.catalog a{display:block;color:var(--muted);padding:7px 4px;font-size:12px;text-transform:uppercase;letter-spacing:.2px}
.catalog a:hover{color:var(--accent);text-decoration:none}
.catalog .children a{padding-left:16px;font-size:11px;color:#9a9a9a;text-transform:none}
.sidebar-box{background:#fff;border:1px solid var(--line);padding:14px;margin-top:8px;font-size:13px}
.sidebar-box .btn-order{display:block;text-align:center}

/* === КОНТЕНТ ======================================================= */
.breadcrumb,.woocommerce-breadcrumb{font-size:12px;color:var(--muted);margin-bottom:14px}
.content ul,.content ol{padding-left:22px}
.content a{color:var(--link)}
.entry img{margin:6px 0}
.post-list-item{border-bottom:1px solid var(--line);padding:14px 0}
.post-list-item h2{margin:.1em 0 .3em;font-size:18px}
.post-list-item h2 a{color:var(--head)}
.post-meta{color:var(--muted);font-size:12px;margin-bottom:6px}
.section-title{font-size:19px;color:var(--head);border-left:4px solid var(--accent);padding-left:10px;margin:20px 0 14px}
.section-title:first-letter{color:var(--accent)}

/* === WooCommerce: карточки с КРАСНОЙ ПЛАШКОЙ названия (как .printItem) === */
.woocommerce ul.products{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;list-style:none;margin:0;padding:0}
/* WooCommerce вешает clearfix ::before/::after на ul.products — в CSS Grid они
   становятся пустыми ячейками (первая ячейка пустует). Убираем. */
.woocommerce ul.products::before,.woocommerce ul.products::after{content:none !important;display:none !important}
.woocommerce ul.products li.product{border:1px solid var(--line);border-radius:3px;padding:0;overflow:hidden;
  text-align:center;background:#fff;transition:box-shadow .15s;display:flex;flex-direction:column;
  width:auto !important;float:none !important;margin:0 !important}   /* перебиваем WooCommerce 30.75%+float */
.woocommerce ul.products li.product:hover{box-shadow:0 8px 20px rgba(0,0,0,.14)}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{display:block}
.woocommerce ul.products li.product img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#fff;
  display:block;margin:0}
/* красная плашка названия */
.woocommerce ul.products li.product .woocommerce-loop-product__title{background:var(--accent);color:#fff;
  font-size:13px;font-weight:600;padding:9px 10px;line-height:1.3;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:50px}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title{background:var(--dark-hover)}
.woocommerce ul.products li.product .price{color:var(--accent);font-weight:700;font-size:14px;display:block;margin:8px 0 0}
.woocommerce ul.products li.product .button{margin:8px 10px 12px;display:block}

/* кнопки (с .alt и !important — перебиваем фиолетовый дефолт WooCommerce) */
.woocommerce a.button,.woocommerce button.button,.woocommerce a.button.alt,.woocommerce button.button.alt,
.woocommerce .single_add_to_cart_button,.woocommerce #respond input#submit,.button{
  display:inline-block;background:var(--btn) !important;color:#fff !important;border:0;border-radius:3px;
  padding:8px 16px;font-weight:700;font-size:13px;cursor:pointer;text-transform:none}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce a.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,.button:hover{background:var(--btn-hover) !important;text-decoration:none}
.woocommerce .onsale{background:var(--accent);color:#fff}

/* одиночный товар */
.woocommerce div.product{overflow:hidden}
.woocommerce div.product .product_title{font-size:24px;color:#333}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--accent);font-size:20px;font-weight:700}
.woocommerce div.product div.images{float:left;width:46%}
.woocommerce div.product div.summary{float:right;width:50%}
.posted_in{font-size:12px;color:var(--muted)}
.woocommerce-tabs .tabs li a{color:var(--head)}
.woocommerce-tabs .tabs li.active a{color:var(--accent)}

/* === Рубрикатор категорий на главной (плитка с красной подписью) === */
.rubricator{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:4px 0 26px}
.rub-tile{display:block;border:1px solid var(--line);border-radius:3px;overflow:hidden;background:#fff;color:var(--ink)}
.rub-tile img,.rub-noimg{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.rub-noimg{background:linear-gradient(135deg,var(--accent),var(--dark-hover))}
.rub-name{display:block;background:var(--accent);color:#fff;padding:8px 10px;font-weight:700;font-size:13px}
.rub-count{display:block;padding:6px 10px;font-size:11px;color:var(--muted)}
.rub-tile:hover{box-shadow:0 8px 18px rgba(0,0,0,.14);text-decoration:none}
.rub-tile:hover .rub-name{background:var(--dark-hover)}

/* === Чистка перенесённого из Joomla контента ====================== */
img[src*="mark.svg"]{width:18px !important;height:18px !important;display:inline-block;vertical-align:middle;margin:0}
.ag_preim,.ag_left_dott,.ag_right_dott,.ag_dott{display:flex;align-items:flex-start;gap:10px;margin:7px 0;text-align:left}
.ag_preim>div,.ag_left_dott>div,.ag_right_dott>div{min-width:0}
.ag_preim>div:first-child,.ag_left_dott>div:first-child,.ag_right_dott>div:first-child{flex:0 0 auto;margin-top:2px}
.ag_preim>div:last-child,.ag_left_dott>div:last-child,.ag_right_dott>div:last-child{flex:1 1 auto}
.entry img,.woocommerce-Tabs-panel img,.woocommerce div.product .woocommerce-tabs img{height:auto;max-width:100%}

/* === ФУТЕР (тёмный, текст #b5b5b5, акцент-плашка #f44934) ========== */
.site-footer{background:var(--footer-bg);color:var(--footer-text);margin-top:30px;font-size:13px}
.footer-cols{display:flex;gap:30px;flex-wrap:wrap;padding:28px 0}
.footer-cols .col{flex:1 1 200px;min-width:180px}
.site-footer img.flogo{height:42px;margin-bottom:10px;filter:brightness(0) invert(1);opacity:.92}
.site-footer h4{color:#fff;font-size:14px;margin:0 0 10px;text-transform:uppercase;letter-spacing:.3px}
.site-footer a{color:var(--footer-text)}
.site-footer a:hover{color:#fff}
.site-footer .phone{color:var(--accent);font-weight:700;font-size:16px;white-space:nowrap}
.footer-bottom{background:var(--accent);color:#fec7c0;padding:12px 0;font-size:12px}
.footer-bottom a{color:#fff}

/* === АДАПТИВ ======================================================= */
@media(max-width:1050px){ .rubricator{grid-template-columns:repeat(3,1fr)} }
@media(max-width:900px){
  .layout{flex-direction:column}
  .sidebar{width:100%;flex-basis:auto}
  .header-top{flex-direction:column;align-items:flex-start;gap:10px}
  .header-contacts{align-items:flex-start}
  .header-links,.header-phones{text-align:left}
}
@media(max-width:640px){ .woocommerce ul.products,.rubricator{grid-template-columns:repeat(2,1fr)} }
@media(max-width:420px){
  .woocommerce ul.products,.rubricator{grid-template-columns:1fr}
  .woocommerce div.product div.images,.woocommerce div.product div.summary{float:none;width:100%}
}
