/*!
 * UA Раритет — шар редизайну
 * Етап 1. Тільки зовнішній вигляд: логіка сайту не змінюється.
 *
 * Джерело: assets/design/handoff/ua/project/UA Раритет.dc.html
 * Принцип: перевизначення CSS-змінних Bootstrap 5 (--bs-*) + власні
 * компоненти з префіксом .ua-. Батьківську тему Bootscore не чіпаємо.
 *
 * Підключається останнім, після bootstrap.min.css — див. functions.php
 */

:root{
  --brand-brown:#8B5A2E; --brand-brown-dark:#74491F; --brand-gold:#A9762F;
  --accent-orange:#E8892B; --beige:#F5EBDD; --surface:#F0F0F0; --border:#E5E5E5;
  --text:#3C3C3C; --text-muted:#8A8A8A; --success:#2E7D4F; --danger:#C0392B;
  --bs-primary:#8B5A2E; --bs-primary-rgb:139,90,46;
  --bs-body-color:#3C3C3C; --bs-body-bg:#FFFFFF; --bs-secondary-color:#8A8A8A;
  --bs-border-color:#E5E5E5; --bs-border-radius:12px; --bs-border-radius-sm:10px;
  --bs-border-radius-lg:14px; --bs-border-radius-xl:16px;
  --bs-font-sans-serif:'Montserrat',system-ui,-apple-system,sans-serif;
  --bs-body-font-family:'Montserrat',system-ui,-apple-system,sans-serif;
  --bs-link-color:#A9762F; --bs-link-hover-color:#8B5A2E; --bs-link-color-rgb:169,118,47;
  --bs-focus-ring-color:rgba(139,90,46,.25);
  /* контури для масок: серце порожнє та залите */
  --ua-heart:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7-4.4-7-9.3A4.2 4.2 0 0 1 12 8a4.2 4.2 0 0 1 7 2.7C19 15.6 12 20 12 20z'/%3E%3C/svg%3E");
  --ua-heart-full:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M12 20s-7-4.4-7-9.3A4.2 4.2 0 0 1 12 8a4.2 4.2 0 0 1 7 2.7C19 15.6 12 20 12 20z'/%3E%3C/svg%3E");
}
body{background:#fff;color:var(--text);font-family:var(--bs-font-sans-serif);-webkit-font-smoothing:antialiased;margin:0}
a{color:var(--brand-gold);text-decoration:none}
a:hover{color:var(--brand-brown)}
img,svg{max-width:100%}
h1,h2,h3,h4{font-weight:700;color:var(--text)}
.btn{--bs-btn-font-weight:600;--bs-btn-font-size:16px;--bs-btn-border-radius:12px;--bs-btn-padding-y:.75rem;--bs-btn-padding-x:1.25rem}
/* style.css теми жорстко фарбує .btn-primary у чорний, тому самої змінної
   --bs-primary мало: перевизначаємо і сам клас, інакше головні кнопки
   (оформлення замовлення, оплата) лишаються чорними з чужої палітри */
.btn-primary{background-color:var(--brand-brown);border-color:var(--brand-brown);color:#fff}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active{
  background-color:var(--brand-brown-dark);border-color:var(--brand-brown-dark);color:#fff}
/* посилання всередині повідомлень: тема робить їх білими, а тло тут світле */
.alert a,.woocommerce-info a,.woocommerce-message a{color:var(--brand-brown);font-weight:600;text-decoration:underline}
.alert a:hover,.woocommerce-info a:hover{color:var(--brand-brown-dark)}
.btn-outline-primary{color:var(--brand-brown);border-color:var(--brand-brown)}
.btn-outline-primary:hover{background-color:var(--beige);color:var(--brand-brown-dark);border-color:var(--brand-brown)}
.btn-primary{--bs-btn-bg:var(--brand-brown);--bs-btn-border-color:var(--brand-brown);--bs-btn-hover-bg:var(--brand-brown-dark);--bs-btn-hover-border-color:var(--brand-brown-dark);--bs-btn-active-bg:var(--brand-brown-dark);--bs-btn-active-border-color:var(--brand-brown-dark);--bs-btn-disabled-bg:var(--brand-brown);--bs-btn-disabled-border-color:var(--brand-brown);--bs-btn-disabled-opacity:.4}
.btn-outline-primary{--bs-btn-color:var(--brand-brown);--bs-btn-border-color:var(--brand-brown);--bs-btn-bg:#fff;--bs-btn-hover-bg:var(--beige);--bs-btn-hover-color:var(--brand-brown-dark);--bs-btn-hover-border-color:var(--brand-brown);--bs-btn-active-bg:var(--beige);--bs-btn-active-color:var(--brand-brown-dark);border-width:1.5px}
.btn-outline-primary:hover{border-width:1.5px}
.btn-cta{width:100%;min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:10px}
.btn-sm{--bs-btn-font-size:14px;--bs-btn-padding-y:.4rem;--bs-btn-padding-x:.9rem;--bs-btn-border-radius:10px;min-height:44px}
.form-control,.form-select{min-height:52px;border-radius:12px;border-color:var(--border);font-size:15px;color:var(--text)}
.form-control::placeholder{color:var(--text-muted)}
.form-control:focus,.form-select:focus{border-color:var(--brand-brown);box-shadow:0 0 0 .2rem rgba(139,90,46,.15)}
.form-label{font-size:13px;font-weight:600;color:var(--text-muted);margin-bottom:6px}
.form-check-input{width:22px;height:22px;margin-top:.1rem;border-color:#CFCFCF}
.form-check-input:checked{background-color:var(--brand-brown);border-color:var(--brand-brown)}
.form-check-label{font-size:15px;padding-left:6px;padding-top:1px}
.input-group>.form-control{border-left:0;padding-left:0}
.input-group-text{background:#fff;border-color:var(--border);border-right:0;border-radius:12px 0 0 12px;color:var(--text-muted)}
.ua-search{height:52px;border:0;background:var(--surface);border-radius:50rem;padding:0 20px 0 48px;width:100%;font-size:15px;color:var(--text)}
.ua-search::placeholder{color:var(--text-muted)}
.ua-search-wrap{position:relative}
.ua-search-wrap svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--text-muted)}
/* Значення один в один з макета — не міняти без макета */
.ua-icon-btn{width:48px;height:48px;border-radius:50%;background:var(--surface);border:0;display:inline-flex;align-items:center;justify-content:center;color:var(--text-muted);position:relative;flex:0 0 auto;transition:color .15s}
.ua-icon-btn:hover,.ua-icon-btn:focus-visible{color:var(--brand-brown)}
.ua-icon-btn .badge{position:absolute;top:-2px;right:-2px;background:var(--danger);font-size:11px;font-weight:700;border-radius:50rem;min-width:20px;height:20px;display:flex;align-items:center;justify-content:center;padding:0 5px;border:2px solid #fff}
/* порожній значок лишається в розмітці заради фрагмента, але не видно */
.ua-icon-btn .badge.is-empty{display:none}
.ua-balance{height:44px;border-radius:50rem;background:var(--beige);display:inline-flex;align-items:center;gap:8px;padding:0 16px;color:var(--brand-brown);flex:0 0 auto}
.ua-balance b{font-size:17px;font-weight:700;color:var(--brand-brown)}
.ua-seg{display:flex;background:var(--surface);border-radius:50rem;padding:4px;gap:4px}
.ua-seg button{flex:1 1 0;min-height:44px;border:0;background:transparent;color:var(--text-muted);font-size:15px;font-weight:600;border-radius:10px}
.ua-seg button[aria-selected="true"]{background:var(--brand-brown);color:#fff}
.ua-sec{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}
.ua-sec h2{font-size:22px;font-weight:700;margin:0;letter-spacing:-.01em}
.ua-see{font-size:15px;font-weight:600;color:var(--brand-gold);display:inline-flex;align-items:center;gap:4px;white-space:nowrap;min-height:44px}
@media (min-width:992px){.ua-sec h2{font-size:28px}
}
.ua-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:10px;height:100%;display:flex;flex-direction:column}
.ua-thumb{position:relative;background:var(--surface);border-radius:10px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;margin:0 0 10px}
.ua-thumb span{font-size:11px;font-weight:700;letter-spacing:.06em;color:#B0B0B0;text-transform:uppercase}
.ua-thumb-inset{position:absolute;inset:8px;background:#E9E9E9;border-radius:8px}
.ua-fav{position:absolute;top:8px;right:8px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.82);border:0;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}
.ua-fav.is-active{color:var(--brand-brown)}
.ua-name{font-size:15px;font-weight:600;line-height:1.35;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:40px;margin-bottom:6px;text-wrap:pretty}
.ua-stock{font-size:13px;color:var(--success)}
.ua-stock.is-out{color:var(--text-muted)}
.ua-meta{font-size:12px;color:var(--text-muted);margin-top:2px}
.ua-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto;padding-top:10px}
.ua-price{font-size:20px;font-weight:700;color:var(--text);line-height:1.1;white-space:nowrap}
.ua-cash{font-size:12px;color:var(--accent-orange);font-weight:600;margin-top:2px}
.ua-cart{width:48px;height:48px;border-radius:12px;background:var(--brand-brown);border:0;color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.ua-cart:hover{background:var(--brand-brown-dark)}
.ua-bid-label{font-size:12px;color:var(--text-muted)}
.ua-bid-old{font-size:12px;color:var(--text-muted);text-decoration:line-through}
.ua-row-mini{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);margin-top:6px}
.ua-row-mini.is-urgent{color:var(--danger);font-weight:600}
.ua-card--ended{opacity:.55}
.ua-badge{border-radius:50rem;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:5px 10px;display:inline-flex;align-items:center;gap:4px}
.ua-badge-abs{position:absolute;top:8px;left:8px;z-index:2}
.b-cash{background:var(--accent-orange);color:#fff}
.b-new{background:var(--beige);color:var(--brand-brown)}
.b-auc{background:var(--brand-brown);color:#fff}
.b-sold{background:var(--surface);color:var(--text-muted)}
.b-stock{background:rgba(46,125,79,.12);color:var(--success)}
.ua-cat{display:block;text-align:center}
.ua-cat-img{background:var(--surface);border-radius:14px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#B0B0B0;letter-spacing:.06em}
.ua-cat-name{font-size:14px;font-weight:600;color:var(--text);margin-top:8px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;min-height:36px}
.ua-banner{border-radius:16px;overflow:hidden;position:relative;aspect-ratio:16/9;background:#141210;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px}
.ua-banner h3{color:#D8B063;font-size:22px;margin:0 0 6px;letter-spacing:.02em}
.ua-banner p{color:#8E857A;margin:0}
.ua-dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;align-items:center}
.ua-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);display:block}
.ua-dots i.on{width:9px;height:9px;background:#fff}
.ua-tabbar{height:64px;background:#fff;border-top:1px solid var(--border);display:flex;align-items:center;padding-bottom:env(safe-area-inset-bottom)}
.ua-tabbar button{flex:1 1 0;min-height:56px;border:0;background:transparent;color:var(--text-muted);display:flex;align-items:center;justify-content:center}
.ua-tabbar button.on{color:var(--brand-brown)}
.breadcrumb{--bs-breadcrumb-divider:'›';font-size:13px;margin:0}
.breadcrumb-item+.breadcrumb-item::before{color:var(--text-muted)}
.breadcrumb-item a{color:var(--text-muted)}
.breadcrumb-item.active{color:var(--text);font-weight:600}
.page-link{border-radius:12px;margin:0 3px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;border-color:var(--border);color:var(--text);font-weight:600}
.page-item.active .page-link{background:var(--brand-brown);border-color:var(--brand-brown)}
.ua-qty{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:12px;overflow:hidden;height:52px}
.ua-qty button{width:48px;height:100%;border:0;background:#fff;color:var(--brand-brown);font-size:20px;font-weight:600}
.ua-qty span{width:52px;text-align:center;font-weight:600;font-size:16px}
.ua-swatch{height:64px;border-radius:12px;border:1px solid var(--border)}
.ua-phone{width:390px;flex:0 0 390px;border:1px solid var(--border);border-radius:20px;overflow:hidden;background:#fff;max-height:860px;overflow-y:auto;position:relative}
.ua-footer{background:#F7F7F7;border-top:1px solid var(--border)}
.ua-footer h4{font-size:14px;font-weight:700;margin-bottom:12px}
.ua-footer a,.ua-footer p{font-size:13px;color:var(--text-muted);display:block;margin:0 0 8px}
.ua-empty{border:1px dashed var(--border);border-radius:14px;padding:40px 20px;text-align:center}
.ua-gal{position:relative;background:var(--surface);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.ua-gal-inset{position:absolute;inset:28px;background:#E9E9E9;border-radius:10px}
.ua-gal>span:not(.ua-badge){position:relative;font-size:11px;font-weight:700;letter-spacing:.06em;color:#B0B0B0;text-transform:uppercase}
.ua-gal .ua-badge-abs{position:absolute;top:12px;left:12px;font-size:11px}
.ua-gal .ua-badge.b-auc{color:#fff}
.ua-gal-zoom{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.85);border:0;display:flex;align-items:center;justify-content:center;color:var(--text)}
.ua-gal-fav{position:absolute;bottom:12px;right:12px;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.85);border:0;display:flex;align-items:center;justify-content:center;color:var(--text-muted)}
.ua-gal-fav.is-active{color:var(--brand-brown)}
.ua-gal .ua-dots i{background:rgba(60,60,60,.3)}
.ua-gal .ua-dots i.on{background:var(--brand-brown)}
.ua-specs{width:100%;font-size:14px;border-collapse:collapse}
.ua-specs th,.ua-specs td{padding:12px 0;border-bottom:1px solid var(--border);vertical-align:top}
.ua-specs th{text-align:left;font-weight:400;color:var(--text-muted);width:44%}
.ua-specs td{font-weight:600;color:var(--text)}
.ua-specs tr:last-child th,.ua-specs tr:last-child td{border-bottom:0}
.ua-thumbs{display:flex;gap:8px;overflow-x:auto;padding:12px 0 0}
.ua-thumbs button{flex:0 0 auto;width:64px;height:64px;border-radius:10px;background:var(--surface);border:1px solid var(--border);color:#B0B0B0;font-size:10px;font-weight:700}
.ua-thumbs button[aria-current="true"]{border-color:var(--brand-brown);border-width:1.5px}
.ua-price-lg{font-size:28px;font-weight:700;line-height:1.1}
.ua-desc{font-size:15px;line-height:1.6;color:var(--text);text-wrap:pretty}
.ua-bidbox{background:var(--beige);border-radius:14px;padding:16px}
.ua-timer{display:inline-flex;align-items:center;gap:8px;background:#fff;border-radius:50rem;padding:8px 16px;font-size:17px;font-weight:700;color:var(--text)}
.ua-timer.is-urgent{color:var(--danger)}
.ua-bid-hint{font-size:12px;color:var(--text-muted);margin-top:6px}
.ua-hist{width:100%;font-size:14px;border-collapse:collapse}
.ua-hist th{text-align:left;font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;padding:0 0 10px}
.ua-hist td{padding:12px 0;border-top:1px solid var(--border);color:var(--text)}
.ua-hist td:nth-child(2){font-weight:700;white-space:nowrap}
.ua-hist td:last-child{color:var(--text-muted);font-size:13px;text-align:right;white-space:nowrap}
.ua-hist tr.is-lead td:nth-child(2){color:var(--success)}
.ua-terms{border:1px solid var(--border);border-radius:14px;padding:16px;background:#fff}
.ua-terms div{display:flex;gap:10px;font-size:14px;line-height:1.5;color:var(--text);padding:8px 0}
.ua-terms svg{flex:0 0 auto;color:var(--brand-brown);margin-top:2px}
.ua-filter-btn{height:52px;border-radius:12px;border:1.5px solid var(--brand-brown);background:#fff;color:var(--brand-brown);font-size:16px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 18px}
.ua-oc{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:16px 16px 0 0;border-top:1px solid var(--border);max-height:88%;overflow-y:auto;z-index:5;padding:16px}
.ua-oc-backdrop{position:absolute;inset:0;background:rgba(20,18,16,.4);z-index:4}
.ua-oc-grip{width:44px;height:4px;border-radius:2px;background:var(--border);margin:0 auto 14px}
.ua-oc h3{font-size:18px;font-weight:700;margin:0}
.ua-chip{border:1px solid var(--border);background:#fff;border-radius:50rem;padding:0 16px;min-height:44px;font-size:14px;font-weight:600;color:var(--text);display:inline-flex;align-items:center}
.ua-chip[aria-pressed="true"]{border-color:var(--brand-brown);border-width:1.5px;color:var(--brand-brown);background:var(--beige)}
.ua-fgroup{border-bottom:1px solid var(--border);padding:16px 0}
.ua-fgroup:last-child{border-bottom:0}
.ua-count{font-size:14px;color:var(--text-muted)}
.ua-line{display:flex;gap:12px;border:1px solid var(--border);border-radius:14px;padding:10px;background:#fff}
.ua-line-img{flex:0 0 auto;width:88px;height:88px;border-radius:10px;background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#B0B0B0;letter-spacing:.06em}
.ua-line-body{flex:1 1 auto;min-width:0}
.ua-line-title{font-size:15px;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ua-del{width:44px;height:44px;border-radius:50%;background:transparent;border:0;color:var(--text-muted);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.ua-del:hover{color:var(--danger);background:var(--surface)}
.ua-qty.ua-qty-sm{height:44px}
.ua-qty.ua-qty-sm button{width:40px;font-size:18px}
.ua-qty.ua-qty-sm span{width:44px;font-size:15px}
.ua-sum{border:1px solid var(--border);border-radius:14px;padding:16px;background:#fff}
.ua-sum-row{display:flex;justify-content:space-between;gap:12px;font-size:15px;padding:8px 0;color:var(--text)}
.ua-sum-row span:first-child{color:var(--text-muted)}
.ua-sum-total{display:flex;justify-content:space-between;gap:12px;align-items:baseline;border-top:1px solid var(--border);margin-top:8px;padding-top:14px}
.ua-sum-total b{font-size:24px;font-weight:700}
.ua-sum-total strong{font-size:17px;font-weight:700}
.ua-block{border:1px solid var(--border);border-radius:14px;padding:16px;background:#fff}
.ua-block-h{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.ua-block-h h2{font-size:18px;font-weight:700;margin:0}
.ua-step{width:28px;height:28px;border-radius:50%;background:var(--beige);color:var(--brand-brown);font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.ua-pay{display:flex;gap:12px;border:1px solid var(--border);border-radius:12px;padding:14px;cursor:pointer;align-items:flex-start;min-height:56px}
.ua-pay.is-checked{border-color:var(--brand-brown);border-width:1.5px;background:var(--beige)}
.ua-pay .form-check-input{flex:0 0 auto}
.ua-pay-name{font-size:15px;font-weight:600;line-height:1.3}
.ua-pay-note{font-size:13px;color:var(--text-muted);line-height:1.4;margin-top:2px}
.ua-mini{display:flex;gap:10px;align-items:center;padding:8px 0}
.ua-mini-img{width:48px;height:48px;border-radius:10px;background:var(--surface);flex:0 0 auto}
.ua-mini-t{font-size:13px;font-weight:600;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ua-mini-p{font-size:14px;font-weight:700;white-space:nowrap}

/* ====================================================================
   ШАПКА САЙТУ
   Розкладка з макета (Частина 2): рядок 1 — баланс ліворуч, логотип
   по центру, дії праворуч; рядок 2 — пошук і перемикач типу.
   ==================================================================== */

.ua-header{background:#fff;border-bottom:1px solid var(--border)}
.ua-header .container{padding-top:16px;padding-bottom:16px}

/* --- Рядок 1 --- */
.ua-hdr-row{display:flex;align-items:center;gap:12px}

/* Бічні колонки однакової ваги — саме це тримає логотип рівно посередині,
   незалежно від ширини балансу та кількості іконок */
.ua-hdr-side{flex:1 1 0;min-width:0;display:flex;align-items:center}
.ua-hdr-side--end{justify-content:flex-end}

.ua-logo{flex:0 0 auto;display:flex;align-items:center}
.ua-logo img{height:44px;width:auto;display:block}

.ua-hdr-actions{display:flex;align-items:center;gap:8px}

.ua-balance--empty{background:#FBE9E7;color:var(--danger)}
.ua-balance--empty b{color:var(--danger)}
/* гість: та сама пігулка, лише напис дрібніший за суму */
.ua-balance--guest b{font-size:15px}

/* --- Рядок 2: пошук + перемикач --- */
.ua-hdr-bar{display:flex;flex-direction:column;gap:12px;margin-top:12px}

.ua-hdr-search{position:relative;min-width:0}
.ua-hdr-search > svg{
  position:absolute;left:18px;top:50%;transform:translateY(-50%);
  color:var(--text-muted);pointer-events:none;z-index:2
}
/* форма — рідна searchform.php теми; input-group розпускаємо в блок */
.ua-hdr-search form{margin:0;display:block;width:100%}
.ua-hdr-search form input[type="search"],
.ua-hdr-search form input[type="text"]{
  /* min-height обов'язковий: глобальне .form-control ставить 52px,
     а min-height перебиває height незалежно від специфічності */
  display:block;width:100%;height:52px;min-height:52px;
  border:0;background:var(--surface);
  padding:0 20px 0 48px;font-size:15px;color:var(--text);
  box-shadow:none;outline:0;
  /* !important тут виправданий: форма має клас .input-group, і правило
     Bootstrap для «не останнього» елемента зрізає праві кути. Ланцюжок
     із чотирьох :not() дає йому специфічність, яку інакше не перебити. */
  border-radius:50rem !important
}
.ua-hdr-search form input[type="search"]:focus,
.ua-hdr-search form input[type="text"]:focus{
  background:#fff;box-shadow:0 0 0 2px var(--brand-brown) inset
}
.ua-hdr-search input::placeholder{color:var(--text-muted)}

/* У макеті кнопки немає — шукаємо по Enter. Кнопку не видаляємо,
   а ховаємо так, щоб вона лишалась досяжною з клавіатури. */
.ua-hdr-search form button[type="submit"],
.ua-hdr-search form input[type="submit"]{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0
}
.ua-hdr-search form button[type="submit"]:focus{
  width:auto;height:40px;clip:auto;overflow:visible;margin:0;
  right:6px;top:50%;transform:translateY(-50%);
  padding:0 18px;border-radius:50rem;
  background:var(--brand-brown);color:#fff;font-size:14px;font-weight:600
}
.ua-hdr-search .widget-title,
.ua-hdr-search .widget_search h2{display:none}

/* Шапка більше не fixed-top, тому компенсаційний відступ не потрібен */
body{padding-top:0}

@media (min-width:992px){
  /* на десктопі пошук і перемикач стають в один рядок, 2:1 як у макеті */
  .ua-hdr-bar{flex-direction:row;align-items:center;gap:16px}
  .ua-hdr-search{flex:2 1 0}
  .ua-hdr-bar .ua-seg{flex:1 1 0;min-width:320px}
}

/* Дуже вузькі екрани */
@media (max-width:359px){
  .ua-logo img{height:36px}
  .ua-hdr-actions{gap:4px}
}

/* ====================================================================
   НИЖНЄ МОБІЛЬНЕ МЕНЮ
   Порядок: Головна, Замовлення, Чати, Оповіщення, Налаштування.
   Тільки іконки, без підписів — як у застосунку.
   ==================================================================== */

.ua-bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:1030;
  display:flex;align-items:stretch;
  background:#fff;border-top:1px solid var(--border);
  height:64px;padding-bottom:env(safe-area-inset-bottom)
}
.ua-bnav-item{
  flex:1 1 0;display:flex;align-items:center;justify-content:center;
  color:var(--text-muted);text-decoration:none;position:relative;
  -webkit-tap-highlight-color:transparent
}
.ua-bnav-item svg{width:26px;height:26px}
.ua-bnav-item:hover{color:var(--brand-brown)}
.ua-bnav-item.is-active{color:var(--brand-brown)}
.ua-bnav-item.is-active svg{stroke-width:2.1}

/* лічильник непрочитаних із BP Better Messages, якщо він з'явиться всередині */
.ua-bnav-item .count,
.ua-bnav-item .bpbm-unread-count{
  position:absolute;top:10px;right:50%;margin-right:-22px;
  background:var(--danger);color:#fff;font-size:11px;font-weight:700;
  min-width:18px;height:18px;border-radius:50rem;
  display:flex;align-items:center;justify-content:center;padding:0 5px
}

/* Контент не має ховатись під меню */
@media (max-width:991.98px){
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  /* кнопку «вгору» піднімаємо, щоб не налазила на меню */
  .top-button{bottom:calc(78px + env(safe-area-inset-bottom)) !important}
  /* віджет чату Tawk.to теж */
  #tawkchat-container,
  .widget-visible iframe{bottom:calc(70px + env(safe-area-inset-bottom)) !important}
}

/* ====================================================================
   ГОЛОВНА СТОРІНКА
   Класи навмисно з префіксом ua-h*, щоб не перетинатися з класами
   макета: там .ua-sec це заголовок секції, а .ua-banner — заглушка.
   ==================================================================== */

.ua-hsec{margin:28px 0;display:block}
.ua-hbanner-sec{margin:16px 0 28px}

/* Заголовок секції: беремо рідний .ua-sec з макета, додаємо посилання */
.ua-sec{flex-wrap:nowrap}
.ua-sec h2{flex:1 1 auto;min-width:0;color:var(--text)}
.ua-sec-more{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;
  font-size:15px;font-weight:600;color:var(--brand-gold);white-space:nowrap;text-decoration:none}
.ua-sec-more:hover{color:var(--brand-brown)}

/* Банер-карусель */
.ua-hbanner{border-radius:16px;overflow:hidden}
.ua-hbanner .carousel-item img{width:100%;height:auto;display:block}
.ua-hbanner .carousel-item .widget,
.ua-hbanner .carousel-item .widget_media_image{margin:0}
/* Стрілки видно завжди: на дотику наведення немає, а ховати керування
   за hover означає, що на телефоні його не існує. */
.ua-hbanner .carousel-control-prev,
.ua-hbanner .carousel-control-next{
  width:auto;top:50%;bottom:auto;transform:translateY(-50%);
  opacity:1;padding:0
}
.ua-hbanner .carousel-control-prev{left:16px}
.ua-hbanner .carousel-control-next{right:16px}
.ua-hbanner .carousel-control-prev-icon,
.ua-hbanner .carousel-control-next-icon{
  width:46px;height:46px;border-radius:50%;
  background-color:rgba(20,17,16,.55);background-size:17px 17px;
  border:1px solid rgba(255,255,255,.28);
  transition:background-color .15s,border-color .15s
}
.ua-hbanner .carousel-control-prev:hover .carousel-control-prev-icon,
.ua-hbanner .carousel-control-next:hover .carousel-control-next-icon,
.ua-hbanner .carousel-control-prev:focus-visible .carousel-control-prev-icon,
.ua-hbanner .carousel-control-next:focus-visible .carousel-control-next-icon{
  background-color:rgba(20,17,16,.85);border-color:rgba(255,255,255,.6)
}
.ua-hbanner .carousel-item a{display:block}

@media (max-width:575.98px){
  .ua-hbanner .carousel-control-prev{left:8px}
  .ua-hbanner .carousel-control-next{right:8px}
  .ua-hbanner .carousel-control-prev-icon,
  .ua-hbanner .carousel-control-next-icon{width:38px;height:38px;background-size:14px 14px}
}

/* Крапки-індикатори, як у макеті: світлі, активна — брунатна */
.ua-hbanner .carousel-indicators{margin-bottom:14px;gap:8px}
.ua-hbanner .carousel-indicators [data-bs-target]{
  width:8px;height:8px;border-radius:50%;border:0;margin:0;
  background:rgba(255,255,255,.55);opacity:1;text-indent:0
}
.ua-hbanner .carousel-indicators .active{background:var(--brand-gold)}

/* Висота банера тримається пропорцією самої картинки: 16:9 на вузьких
   екранах і 1600x420 на десктопі — обидва кадри віддає <picture>,
   тому обрізати нічого не треба. */
.ua-hbanner picture{display:block}

/* Категорії: зображення поверх заглушки з макета */
.ua-cat{text-decoration:none}
/* display:flex лишаємо з макета — ним центрується значок-заглушка.
   Межа не з макета: там плитка сіра й видно її саму, а в житті це фото
   товару на білому тлі, яке без межі зливається зі сторінкою. */
.ua-cat-img{overflow:hidden;margin-bottom:0;border:1px solid var(--border)}
.ua-cat-img img{width:100%;height:100%;object-fit:cover;display:block}
.ua-cat-ph{color:#C4C4C4}
.ua-cat:hover .ua-cat-name{color:var(--brand-brown)}
.ua-cat-img img{transition:transform .25s}
.ua-cat:hover .ua-cat-img img{transform:scale(1.04)}

/* Новини */
.ua-news{display:flex;gap:12px;align-items:center;text-decoration:none;
  border:1px solid var(--border);border-radius:14px;padding:10px;height:100%}
.ua-news:hover{border-color:var(--brand-brown)}
.ua-news-img{flex:0 0 96px}
.ua-news-img img{width:96px;height:96px;object-fit:cover;border-radius:10px;display:block}
.ua-news-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.ua-news-title{font-weight:600;font-size:15px;color:var(--text);line-height:1.3}
.ua-news-date{font-size:12px;color:var(--text-muted)}

/* Сітка товарів WooCommerce у блоках головної.
   Перебиваємо флоати WooCommerce, інакше картки розповзаються. */
.ua-hsec ul.products{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;list-style:none;margin:0 !important;padding:0;width:100%;float:none !important}
.ua-hsec ul.products::before,
.ua-hsec ul.products::after{display:none !important;content:none !important}
.ua-hsec ul.products li.product{width:auto !important;min-width:0;max-width:100%;margin:0 !important;
  float:none !important;clear:none !important}
@media (min-width:768px){.ua-hsec ul.products{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:992px){.ua-hsec ul.products{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Батьківська тема віддає цикл товарів як Bootstrap-рядок
   (<div class="row" slider_cls="products">) з колонками col-md-6 col-lg-*,
   тобто на мобільному одна картка в ряд. Приводимо до сітки з макета:
   2 колонки на телефоні, 3 на планшеті, 4 на десктопі. */
/* Префікс .site-main обов'язковий: нижче є правило каталогу з такою самою
   специфічністю, і воно перемагало на головній просто тому, що йде далі.
   Тут потрібна вища специфічність, а не порядок. */
.site-main .ua-hsec .row[slider_cls="products"]{--bs-gutter-x:12px;--bs-gutter-y:12px;margin-left:-6px;margin-right:-6px}
.site-main .ua-hsec .row[slider_cls="products"] > [class*="col-"]{
  flex:0 0 auto;width:50%;max-width:50%;min-width:0;padding-left:6px;padding-right:6px
}
@media (min-width:768px){
  .site-main .ua-hsec .row[slider_cls="products"] > [class*="col-"]{width:33.3333%;max-width:33.3333%}
}
@media (min-width:992px){
  .site-main .ua-hsec .row[slider_cls="products"] > [class*="col-"]{width:25%;max-width:25%}
}
.ua-hsec .row{max-width:100%}

/* Шапка на телефоні. Розміри елементів ті самі, що в макеті —
   стискаємо лише проміжки, а довгий баланс обрізаємо трикрапкою. */
@media (max-width:575.98px){
  .ua-hdr-row{gap:8px}
  .ua-hdr-actions{gap:6px}
  .ua-balance{padding:0 12px;max-width:130px;overflow:hidden}
  .ua-balance b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ua-balance svg{flex:0 0 auto}
}

/* ====================================================================
   КАРТКА ТОВАРУ В СПИСКУ
   Розмітку віддають хуки WooCommerce і Simple Auctions — тут лише вигляд.
   ==================================================================== */

.ua-pcard{background:#fff;border:1px solid var(--border);border-radius:14px;
  padding:10px;overflow:hidden;text-align:left;height:100%;
  display:flex;flex-direction:column}
.ua-pcard:hover{border-color:#D8CBBA}

/* Фото */
.ua-pcard-media{position:relative;border-radius:10px;overflow:hidden;
  background:var(--surface);margin-bottom:10px}
.ua-pcard-media .feature-slider,
.ua-pcard-media .slick-list,
.ua-pcard-media .slick-track{height:100%}
.ua-pcard-media img{width:100%;aspect-ratio:1/1;object-fit:contain;display:block;background:#fff}
/* стрілки галереї — дрібні й ненав'язливі */
.ua-pcard-media .slick-prev,
.ua-pcard-media .slick-next{width:28px;height:28px;z-index:2;opacity:0;transition:opacity .15s}
.ua-pcard:hover .slick-prev,
.ua-pcard:hover .slick-next{opacity:.75}

/* Обране */
.ua-pcard-fav{position:absolute;top:8px;right:8px;z-index:3}
.ua-pcard-media .wsawl-link a{display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.9);
  border:1px solid var(--border);color:var(--text-muted)}

.ua-pcard-body{padding:0;display:flex;flex-direction:column;flex:1 1 auto}

/* Назва: рівно два рядки */
.ua-pcard .woocommerce-loop-product__title{
  font-size:15px;font-weight:600;line-height:1.3;color:var(--text);margin:0 0 6px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:39px}
.ua-pcard a.woocommerce-LoopProduct-link{text-decoration:none;display:block}
.ua-pcard a.woocommerce-LoopProduct-link:hover .woocommerce-loop-product__title{color:var(--brand-brown)}

/* Наявність, артикул, перегляди */
.ua-pcard-meta{margin-bottom:8px}
.ua-pcard-stock{display:block;font-size:13px;color:var(--success);font-weight:500}
.ua-pcard-stock.is-out{color:var(--text-muted)}
.ua-pcard-sub{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-muted);margin-top:2px}
.ua-pcard-views{display:inline-flex;align-items:center;gap:3px}

/* Ціни */
.ua-pcard .price{margin:0 0 4px;font-size:19px;font-weight:700;color:var(--text);text-align:left}
.ua-pcard .price .woocommerce-Price-currencySymbol{font-size:.72em;font-weight:600;margin-left:2px}
.ua-pcard .buy_now_price .price{font-size:15px;font-weight:600;color:var(--text-muted)}
.ua-pcard .auction-price .current.auction{display:block;font-size:12px;font-weight:500;
  color:var(--text-muted);margin-bottom:2px}
.ua-pcard .price small{font-size:12px;font-weight:500;color:var(--text-muted)}

/* Кешбек */
.ua-pcard .on-woo-wallet-cashback{font-size:12px;font-weight:700;color:var(--accent-orange)}

/* Кнопка дії */
.ua-pcard .add-to-cart-container{margin-top:auto;padding-top:10px}
.ua-pcard .add-to-cart-container .btn{width:100%;border-radius:12px;font-size:15px;
  font-weight:600;padding:.65rem 1rem;background:var(--brand-brown);
  border-color:var(--brand-brown);color:#fff}
.ua-pcard .add-to-cart-container .btn:hover{background:var(--brand-brown-dark);
  border-color:var(--brand-brown-dark)}
.ua-pcard .added_to_cart{display:none}

/* Завершений лот — приглушено */
.ua-pcard.outofstock .ua-pcard-media{opacity:.6}

/* --- Перекриття старих стилів картки ------------------------------- */

/* «Купити зараз» був темною смугою на всю ширину — робимо рядком тексту */
.ua-pcard .buy_now_price{background:transparent;color:var(--text-muted);
  margin-left:0;margin-right:0;font-size:13px}
.ua-pcard .buy_now_price .price,
.ua-pcard .card .buy_now_price .price .woocommerce-Price-amount.amount{
  color:var(--text-muted);font-size:13px;font-weight:600}

/* Фото мало фіксовану висоту 310px і сірий фон — робимо квадрат */
.ua-pcard .woocommerce-loop-product__link,
.woocommerce .ua-pcard.card > .woocommerce-loop-product__link{
  height:auto;background:transparent;display:block}
.ua-pcard-media{background:transparent}
.ua-pcard-media .slick-slide img{aspect-ratio:1/1;object-fit:contain;
  width:100%;height:auto;background:#fff}
.ua-pcard-media .slick-list{border-radius:10px}

/* Обране: іконку малює плагін через ::before, нам треба лише кружечок */
.ua-pcard .wsawl-link{position:absolute;top:8px;right:8px;z-index:3;background:transparent;border-radius:0;margin:0}
.ua-pcard-media .wsawl-link a{padding:0;font-size:16px;line-height:1}
.ua-pcard-media .wsawl-link a::before{margin:0;color:inherit}
.ua-pcard-media .wsawl-link a:hover{color:var(--brand-brown);border-color:var(--brand-brown)}

/* Лічильник переглядів від плагіна не дублюємо — свій уже є в мета-рядку */
.ua-pcard .post-views{display:none}

/* Сума «Купити зараз» лишалась білою від старого правила .card .buy_now_price */
.ua-pcard .buy_now_price .price .woocommerce-Price-amount.amount,
.ua-pcard .buy_now_price .woocommerce-Price-amount,
.ua-pcard .buy_now_price bdi{color:var(--text-muted) !important;font-weight:600}
.ua-pcard .buy_now_price .price{display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}

/* Обране на картці. Плагін іконку не малює — ставимо свою, у білому
   кружечку з макета: без підкладки сердечко губилось на світлих фото.
   Порожнє — не в списку, залите — вже додано (клас remove-wsawl від
   плагіна), щоб стан читався з одного погляду. */
.ua-pcard-media .wsawl-link a{
  position:relative;font-size:0;
  width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.9);color:var(--text-muted);
  box-shadow:0 1px 3px rgba(0,0,0,.12);
  transition:color .15s,background .15s}
.ua-pcard-media .wsawl-link a::after{
  content:'';display:block;width:20px;height:20px;
  background-color:currentColor;
  -webkit-mask:var(--ua-heart) no-repeat center/contain;
          mask:var(--ua-heart) no-repeat center/contain}
.ua-pcard-media .wsawl-link a:hover{background:#fff;color:var(--brand-brown)}
/* Селектор навмисно тієї самої форми, що й базовий (.wsawl-link a), інакше
   базове правило виявляється специфічнішим і стан «вже в обраному» не
   вмикається — саме на цьому сердечко лишалось сірим. */
.ua-pcard-media .wsawl-link a.remove-wsawl{color:var(--brand-brown);background:#fff}
.ua-pcard-media .wsawl-link a.remove-wsawl::after{
  -webkit-mask:var(--ua-heart-full) no-repeat center/contain;
          mask:var(--ua-heart-full) no-repeat center/contain}

/* Лічильник переглядів над фото дублює наш — ховаємо */
.ua-pcard-media .post-views,
.ua-pcard-media .pvc_stats,
.ua-pcard .card-body > .post-views{display:none !important}

/* ====================================================================
   СТОРІНКА КАТЕГОРІЇ / КАТАЛОГ
   ==================================================================== */

.ua-crumbs{font-size:13px;color:var(--text-muted);margin:14px 0 10px}
.ua-crumbs a{color:var(--text-muted)}
.ua-crumbs a:hover{color:var(--brand-brown)}

.ua-cat-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ua-cat-title{font-size:24px;font-weight:700;color:var(--text);margin:0}
.ua-cat-count{font-size:13px;color:var(--text-muted)}
@media (min-width:992px){.ua-cat-title{font-size:30px}}

/* Перемикач Усі / Товари / Аукціони */
.ua-seg{display:flex;background:var(--surface);border-radius:50rem;padding:4px;gap:4px;
  margin-bottom:14px}
/* дзеркалить .ua-seg button з макета: 44px, радіус 10px */
.ua-seg-item{flex:1 1 0;display:flex;align-items:center;justify-content:center;
  min-height:44px;padding:0 8px;border-radius:10px;
  font-size:15px;font-weight:600;color:var(--text-muted);text-decoration:none;
  white-space:nowrap;transition:background .15s,color .15s}
.ua-seg-item:hover{color:var(--brand-brown)}
.ua-seg-item.is-active{background:var(--brand-brown);color:#fff}
.ua-seg-item.is-active:hover{color:#fff}

/* Панель інструментів: перемикач типу і кнопка фільтрів в одному рядку */
.ua-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.ua-toolbar .ua-seg{flex:1 1 auto;min-width:0;margin-bottom:0;max-width:460px}
.ua-filter-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;
  height:52px;padding:0 18px;
  border:1.5px solid var(--brand-brown);background:#fff;border-radius:12px;
  font-size:15px;font-weight:600;color:var(--brand-brown)}
.ua-filter-btn:hover{background:var(--beige)}
.ua-filter-count{min-width:22px;height:22px;border-radius:50rem;padding:0 6px;
  background:var(--brand-brown);color:#fff;font-size:12px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center}
@media (max-width:575.98px){
  .ua-toolbar{flex-wrap:wrap}
  .ua-toolbar .ua-seg{flex:1 1 100%;max-width:none}
  .ua-filter-btn{flex:1 1 100%;justify-content:center}
}

/* Застосовані фільтри */
.ua-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
.ua-chips .ua-chip{gap:6px;min-height:38px;padding:0 12px;font-size:13px;text-decoration:none}
.ua-chips .ua-chip.is-on{border-color:var(--brand-brown);border-width:1.5px;
  color:var(--brand-brown);background:var(--beige)}
.ua-chips .ua-chip svg{opacity:.7}
.ua-chips .ua-chip:hover svg{opacity:1}
.ua-chips-reset{font-size:14px;font-weight:600;color:var(--brand-gold);
  min-height:38px;display:inline-flex;align-items:center;text-decoration:none}
.ua-chips-reset:hover{color:var(--brand-brown)}


/* Сортування WooCommerce */
.woocommerce-ordering select,
.ua-toolbar select{height:44px;border:1px solid var(--border);border-radius:50rem;
  padding:0 36px 0 16px;font-size:15px;color:var(--text);background-color:#fff}
.woocommerce-result-count{font-size:13px;color:var(--text-muted)}

/* Фільтри */
.ua-filters .offcanvas-header{border-bottom:1px solid var(--border);background:#fff}
/* колір обов'язковий: у теми заголовки offcanvas білі, а тло тут світле */
.ua-filters .offcanvas-title{font-weight:700;font-size:18px;color:var(--text)}
.ua-filters .btn-close{filter:none;opacity:.6}
/* банер із бічної колонки в панелі фільтрів недоречний */
.ua-filters .widget_media_image{display:none}
.ua-filters{width:min(88vw,360px)}
.ua-filters .offcanvas-body{padding-bottom:12px;overflow-y:auto}

/* Липка кнопка «Показати N товарів» унизу панелі */
.ua-filters-foot{flex:0 0 auto;padding:12px 16px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--border);background:#fff}

/* Групи фільтрів */
.ua-filters .ua-fgroup{border-bottom:1px solid var(--border);padding:16px 0;margin:0}
.ua-filters .ua-fgroup:last-child{border-bottom:0}
.ua-filters .ua-ds-label{font-size:13px;font-weight:700;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:.04em;margin:0 0 10px}

/* Списки значень атрибутів від WooCommerce */
.ua-filters .woocommerce-widget-layered-nav-list{list-style:none;margin:0;padding:0;
  max-height:260px;overflow-y:auto}
.ua-filters .woocommerce-widget-layered-nav-list li{border:0;padding:0;margin:0}
.ua-filters .woocommerce-widget-layered-nav-list li a{display:inline-flex;align-items:center;
  min-height:40px;padding:0;font-size:15px;color:var(--text);text-decoration:none}
.ua-filters .woocommerce-widget-layered-nav-list li a:hover{color:var(--brand-brown)}
.ua-filters .woocommerce-widget-layered-nav-list li.chosen a{color:var(--brand-brown);font-weight:700}
.ua-filters .woocommerce-widget-layered-nav-list .count{color:var(--text-muted);
  font-size:13px;font-weight:400;margin-left:6px}

/* Повзунок ціни */
.ua-filters .price_slider_wrapper{padding-top:6px}
.ua-filters .ui-slider{position:relative;height:4px;background:var(--surface);
  border:0;border-radius:50rem;margin:10px 6px 18px}
.ua-filters .ui-slider .ui-slider-range{position:absolute;height:100%;
  background:var(--brand-brown);border-radius:50rem}
.ua-filters .ui-slider .ui-slider-handle{position:absolute;top:50%;width:20px;height:20px;
  margin-left:-10px;transform:translateY(-50%);border-radius:50%;
  background:#fff;border:2px solid var(--brand-brown);cursor:grab}
.ua-filters .price_slider_amount{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ua-filters .price_slider_amount .price_label{font-size:14px;color:var(--text);order:1;flex:1 1 100%}
.ua-filters .price_slider_amount button[type="submit"]{order:2;height:40px;padding:0 16px;
  border:0;border-radius:50rem;background:var(--brand-brown);color:#fff;
  font-size:14px;font-weight:600}
.ua-filters .price_slider_amount .clear{order:3;font-size:14px;color:var(--brand-gold)}
/* віджети фільтрів усередині панелі */
.ua-filters .widget{margin-bottom:18px}
.ua-filters .widget-title,.ua-filters .widget h2{font-size:15px;font-weight:700;
  color:var(--text);margin:0 0 8px}
.ua-filters img{max-width:100%;height:auto}

/* Сітка товарів у каталозі — та сама, що на головній */
.woocommerce .products .row,
.site-main .row[slider_cls="products"]{--bs-gutter-x:12px;--bs-gutter-y:12px}
.site-main .row[slider_cls="products"] > [class*="col-"]{
  flex:0 0 auto;width:50%;max-width:50%;min-width:0}
@media (min-width:768px){
  .site-main .row[slider_cls="products"] > [class*="col-"]{width:33.3333%;max-width:33.3333%}
}
@media (min-width:1200px){
  .site-main .row[slider_cls="products"] > [class*="col-"]{width:33.3333%;max-width:33.3333%}
}

/* Пагінація */
.pagination ul.page-numbers,
.woocommerce-pagination ul.page-numbers{display:flex;gap:6px;justify-content:center;
  border:0;padding:0;margin:20px 0}
.pagination li,
.woocommerce-pagination li{border:0;margin:0}
.pagination .page-numbers,
.woocommerce-pagination .page-numbers{min-width:40px;height:40px;display:inline-flex;
  align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--border);
  color:var(--text);font-weight:600;text-decoration:none}
.pagination .page-numbers.current,
.woocommerce-pagination .page-numbers.current{background:var(--brand-brown);
  border-color:var(--brand-brown);color:#fff}

/* Дубль заголовка від WooCommerce — свій уже вивели вище */
.site-main h1.page-title{display:none}

/* Порожній результат. Тема віддає його як .alert.alert-info — синю смугу
   Bootstrap. Робимо стан із макета: пунктирна рамка, текст по центру.
   Тільки на сторінках каталогу: тим самим класом виводяться підказки
   в кошику й на чекауті («Вже замовляли у нас?»), і там пунктирна
   рамка з центрованим текстом виглядала недоречно. */
.woocommerce-shop .site-main .alert.alert-info,
.tax-product_cat .site-main .alert.alert-info,
.post-type-archive-product .site-main .alert.alert-info,
.search-results .site-main .alert.alert-info{
  border:1px dashed var(--border);border-radius:14px;padding:40px 20px;
  text-align:center;background:#fff;color:var(--text-muted);
  font-size:15px;margin:8px 0 24px}

/* Наявні фільтри сайту (Бліц ціна, Завершені, Рекомендовані тощо).
   Логіку не чіпаємо — лише приводимо вигляд до нового стилю. */
.filter_badges__status,
.filter_badges__sort{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.filter_badges__status .badge,
.filter_badges__sort .badge{
  background:#fff !important;color:var(--text-muted) !important;
  border:1px solid var(--border);border-radius:50rem;
  padding:8px 14px;font-size:13px;font-weight:600;line-height:1.2}
.filter_badges__status .badge:hover,
.filter_badges__sort .badge:hover{border-color:var(--brand-brown);color:var(--brand-brown) !important}
.filter_badges__status .badge.active,
.filter_badges__sort .badge.active{
  background:var(--brand-brown) !important;border-color:var(--brand-brown);color:#fff !important}

/* Перші три чипси дублюють сегментований перемикач — ховаємо їх */
.filter_badges__status a[href*="filter=active_all"],
.filter_badges__status a[href*="filter=active"]:not([href*="active_all"]),
.filter_badges__status a[href*="filter=fix_price"]{display:none}

/* ====================================================================
   СТОРІНКА ТОВАРУ / АУКЦІОННОГО ЛОТУ
   ==================================================================== */

.ua-single{padding-bottom:24px}
.ua-single-top{--bs-gutter-x:24px}
@media (min-width:992px){.ua-single-gallery{position:sticky;top:130px;align-self:flex-start}}

/* Галерея */
.ua-single .woocommerce-product-gallery{border-radius:14px;overflow:hidden;margin-bottom:14px;
  position:relative}

/* Кнопка «Збільшити» з макета. overflow:hidden вище не заважає — кнопка
   всередині рамки. Курсор на самому фото теж показуємо як лупу. */
.ua-gal-zoom{position:absolute;top:12px;right:12px;z-index:3;
  width:44px;height:44px;border-radius:50%;border:0;
  background:rgba(255,255,255,.85);color:var(--text);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 1px 4px rgba(0,0,0,.15);transition:background .15s,color .15s}
.ua-gal-zoom:hover{background:#fff;color:var(--brand-brown)}
.ua-single .woocommerce-product-gallery__image a{cursor:zoom-in}

/* Кнопка «в обране» від Simple Auctions.
   Плагін віддає порожній <a> — без іконки й без підпису, тому під
   заголовком висіла безлика пігулка. Малюємо серце, як у макеті:
   порожнє — не в списку, залите — вже додано (клас remove-wsawl). */
.ua-single .wsawl-link{margin:0 0 14px}
.ua-single .wsawl-link a{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;
  border:1px solid var(--border);background:#fff;color:var(--text-muted);
  text-decoration:none;transition:color .15s,border-color .15s}
.ua-single .wsawl-link a::before{
  /* flex і min-width обов'язкові: як елемент flex-контейнера псевдоелемент
     стискався до нульової ширини, і серця не було видно зовсім */
  content:'';flex:0 0 22px;width:22px;min-width:22px;height:22px;
  background:currentColor;
  -webkit-mask:var(--ua-heart) center/contain no-repeat;
          mask:var(--ua-heart) center/contain no-repeat}
.ua-single .wsawl-link a:hover{color:var(--brand-brown);border-color:var(--brand-brown)}
.ua-single .wsawl-link a.remove-wsawl{color:var(--brand-brown);border-color:var(--brand-brown)}
.ua-single .wsawl-link a.remove-wsawl::before{-webkit-mask:var(--ua-heart-full) center/contain no-repeat;
          mask:var(--ua-heart-full) center/contain no-repeat}

/* Лайтбокс: підганяємо під палітру, решту лишає PhotoSwipe */
.pswp__bg{background:#1A1512}
.pswp__caption__center{text-align:center;font-size:14px}
.pswp__button{transition:opacity .15s}
.ua-single .woocommerce-product-gallery__image img{width:100%;height:auto;display:block;
  border-radius:14px;background:#fff}
.ua-single .flex-control-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  list-style:none;margin:10px 0 0;padding:0}
.ua-single .flex-control-thumbs li{width:auto !important;margin:0 !important;float:none !important}
.ua-single .flex-control-thumbs img{width:100%;aspect-ratio:1/1;object-fit:cover;
  border-radius:10px;border:1px solid var(--border);opacity:.75;cursor:pointer}
.ua-single .flex-control-thumbs img.flex-active,
.ua-single .flex-control-thumbs img:hover{opacity:1;border-color:var(--brand-brown)}

/* Мініатюра відео: прев'ю немає, тому малюємо трикутник відтворення */
.ua-single .flex-control-thumbs li.ua-thumb-video{position:relative;aspect-ratio:1/1;
  background:var(--surface);border:1px solid var(--border);border-radius:10px;cursor:pointer}
.ua-single .flex-control-thumbs li.ua-thumb-video img{display:none}
.ua-single .flex-control-thumbs li.ua-thumb-video::after{content:'';position:absolute;
  top:50%;left:50%;transform:translate(-50%,-50%);
  border-style:solid;border-width:9px 0 9px 15px;
  border-color:transparent transparent transparent var(--text-muted)}
@media (min-width:576px){.ua-single .flex-control-thumbs{grid-template-columns:repeat(5,1fr)}}

/* Назва й ціни */
.ua-single .product_title{font-size:24px;font-weight:700;line-height:1.25;
  color:var(--text);margin:0 0 10px}
@media (min-width:992px){.ua-single .product_title{font-size:30px}}

.ua-single .price{font-size:28px;font-weight:700;color:var(--text);margin:0 0 12px;display:block}
.ua-single .price .woocommerce-Price-currencySymbol{font-size:.68em;font-weight:600;margin-left:3px}
.ua-single .price del{font-size:.6em;font-weight:500;color:var(--text-muted)}
.ua-single .auction-price .current.auction,
.ua-single .price small{display:block;font-size:13px;font-weight:500;color:var(--text-muted);
  margin-bottom:2px}

/* Кешбек */
.ua-single .on-woo-wallet-cashback{display:inline-block;font-size:13px;font-weight:700;
  color:var(--accent-orange);margin-bottom:10px}

/* Час до завершення */
.ua-single .time-left,
.ua-single #countdown{background:var(--beige);border-radius:12px;padding:12px 14px;
  margin-bottom:14px;color:var(--brand-brown);font-weight:600}

/* Блок ставки */
.ua-single form.cart,
.ua-single .auction-form,
.ua-single .wc-sa-bid-form{background:#fff;border:1px solid var(--border);border-radius:14px;
  padding:14px;margin-bottom:14px}
.ua-single .quantity input,
.ua-single input[type="number"],
.ua-single input[type="text"]{height:48px;border:1px solid var(--border);border-radius:10px;
  padding:0 12px;font-size:16px;font-weight:600;color:var(--text)}
.ua-single .quantity .minus,
.ua-single .quantity .plus{width:44px;height:48px;border:1px solid var(--border);
  border-radius:10px;background:#fff;color:var(--text);font-size:20px;line-height:1}
.ua-single label{font-size:13px;font-weight:600;color:var(--text-muted);margin-bottom:6px}

/* Кнопки */
.ua-single .single_add_to_cart_button,
.ua-single .button,
.ua-single .btn-primary{width:100%;min-height:54px;border-radius:12px;font-size:17px;
  font-weight:600;background:var(--brand-brown);border-color:var(--brand-brown);color:#fff;
  display:inline-flex;align-items:center;justify-content:center}
.ua-single .single_add_to_cart_button:hover,
.ua-single .btn-primary:hover{background:var(--brand-brown-dark);border-color:var(--brand-brown-dark)}
.ua-single .btn-outline-secondary,
.ua-single .buy_now_offcanvas_true .btn-outline-secondary{width:100%;min-height:54px;
  border-radius:12px;font-size:17px;font-weight:600;background:#fff;
  border:1.5px solid var(--brand-brown);color:var(--brand-brown)}
.ua-single .btn-outline-secondary:hover{background:var(--beige);color:var(--brand-brown-dark)}
/* «Купити швидко» стоїть одразу під «Додати в кошик» у тій самій формі */
.ua-single .ua-quick-order{margin-top:10px}

/* Кількість: «−» поле «+». Кнопки додає ua-qty.js — у розмітці теми їх немає */
.quantity.ua-qty{display:inline-flex;align-items:stretch;gap:6px}
.quantity.ua-qty .ua-qty-btn{width:44px;min-width:44px;height:48px;flex:0 0 auto;
  border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text);
  font-size:20px;line-height:1;padding:0;display:inline-flex;align-items:center;
  justify-content:center;-webkit-user-select:none;user-select:none}
.quantity.ua-qty .ua-qty-btn:hover{background:var(--beige);border-color:var(--brand-brown)}
/* Кнопка, якій нема куди рухатись. На цьому сайті «+» у кошику гасне
   майже завжди: лоти унікальні, запас дорівнює одиниці. Жива на вигляд
   кнопка, що на кожне натискання не робить нічого, читається як поломка. */
.quantity.ua-qty .ua-qty-btn.is-off{opacity:.4;cursor:default;background:#fff}
.quantity.ua-qty .ua-qty-btn.is-off:hover{background:#fff;border-color:var(--border)}
.quantity.ua-qty input.qty{margin:0 !important;text-align:center;min-width:64px}
/* Рідні стрілки браузера тепер зайві — вони дублюють кнопки й тиснуть число */
.quantity.ua-qty input[type=number]{-moz-appearance:textfield}
.quantity.ua-qty input[type=number]::-webkit-outer-spin-button,
.quantity.ua-qty input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* Мета: продавець, артикул, категорії, перегляди */
.ua-single .product_meta{font-size:14px;color:var(--text-muted);border-top:1px solid var(--border);
  padding-top:14px;margin-top:16px;line-height:1.9}
.ua-single .product_meta a{color:var(--brand-gold)}
.ua-single .product_meta a:hover{color:var(--brand-brown)}

/* Обране */
.ua-single .wsawl-link{margin-bottom:12px}
.ua-single .wsawl-link a{display:inline-flex;align-items:center;gap:8px;height:44px;
  padding:0 18px;border:1px solid var(--border);border-radius:50rem;
  color:var(--text-muted);font-size:15px;font-weight:600;text-decoration:none}
.ua-single .wsawl-link a:hover{border-color:var(--brand-brown);color:var(--brand-brown)}
.ua-single .remove-wsawl{color:var(--brand-brown);border-color:var(--brand-brown)}

/* Вкладки */
.ua-single .woocommerce-tabs{margin-top:28px}
.ua-single .woocommerce-tabs ul.tabs{display:flex;gap:6px;flex-wrap:wrap;list-style:none;
  margin:0 0 16px;padding:0;border:0}
.ua-single .woocommerce-tabs ul.tabs::before,
.ua-single .woocommerce-tabs ul.tabs::after{display:none}
.ua-single .woocommerce-tabs ul.tabs li{margin:0;padding:0;border:0;background:transparent}
.ua-single .woocommerce-tabs ul.tabs li a{display:inline-block;padding:10px 18px;
  border:1px solid var(--border);border-radius:50rem;font-size:14px;font-weight:600;
  color:var(--text-muted);text-decoration:none}
.ua-single .woocommerce-tabs ul.tabs li.active a{background:var(--brand-brown);
  border-color:var(--brand-brown);color:#fff}
.ua-single .woocommerce-tabs .panel{padding:0}
.ua-single .woocommerce-tabs h2{font-size:18px;font-weight:700;margin:0 0 10px}

/* Характеристики */
.ua-single table.shop_attributes{width:100%;border:1px solid var(--border);
  border-radius:12px;border-collapse:separate;border-spacing:0;overflow:hidden;margin-bottom:16px}
.ua-single table.shop_attributes th,
.ua-single table.shop_attributes td{padding:10px 14px;font-size:14px;
  border-bottom:1px solid var(--border);text-align:left}
.ua-single table.shop_attributes tr:last-child th,
.ua-single table.shop_attributes tr:last-child td{border-bottom:0}
.ua-single table.shop_attributes th{font-weight:600;color:var(--text-muted);width:45%;background:#FAFAFA}

/* Історія ставок */
.ua-single table.auction-history,
.ua-single .simle_auction_history table{width:100%;font-size:14px}
.ua-single table.auction-history th{font-weight:600;color:var(--text-muted);font-size:13px}

/* Схожі товари */
.ua-single .related > h2,
.ua-single .up-sells > h2{font-size:22px;font-weight:700;color:var(--text);margin:28px 0 14px}

/* Стандартні таби WooCommerce малюють «вушка» псевдоелементами — прибираємо */
.ua-single .woocommerce-tabs ul.tabs li::before,
.ua-single .woocommerce-tabs ul.tabs li::after,
.ua-single .woocommerce-tabs ul.tabs li a::before,
.ua-single .woocommerce-tabs ul.tabs li a::after{display:none !important;content:none !important;
  border:0 !important;box-shadow:none !important}
.ua-single .woocommerce-tabs ul.tabs li{border-radius:0 !important;box-shadow:none !important}
.ua-single .woocommerce-tabs ul.tabs li a{white-space:nowrap;width:auto;min-width:0;
  border-radius:50rem !important;box-shadow:none !important}
.ua-single .woocommerce-tabs ul.tabs li.active{background:transparent !important}

/* Характеристики: рівні колонки */
.ua-single table.shop_attributes th{width:40%}
.ua-single table.shop_attributes p{margin:0}

/* Лічильник переглядів під назвою — рядком, а не кружечком */
.ua-single .post-views{display:inline-flex;align-items:center;gap:6px;height:auto;
  padding:0;border:0;background:transparent;font-size:14px;color:var(--text-muted);
  border-radius:0;margin-bottom:10px}

/* Порожній блок «До закінчення» ховаємо, поки таймер не заповнить */
.ua-single .time-left:empty,
.ua-single #countdown:empty{display:none}

/* WooCommerce розкладає товар власними флоатами (images 48% / summary 48%).
   Ми використовуємо колонки Bootstrap, тому флоати знімаємо. */
.ua-single .woocommerce-product-gallery,
.ua-single div.images,
.woocommerce .ua-single div.images{width:100% !important;float:none !important;margin:0 0 12px}
.ua-single .summary,
.woocommerce .ua-single .summary{width:100% !important;float:none !important;margin:0}
.ua-single .woocommerce-tabs,
.ua-single .related,
.ua-single .up-sells{width:100% !important;float:none !important;clear:both}
.ua-single::after{content:'';display:block;clear:both}

/* Галерея на всю ширину колонки */
.ua-single .woocommerce-product-gallery__wrapper{width:100%}
.ua-single .woocommerce-product-gallery img,
.ua-single .woocommerce-product-gallery video,
.ua-single .wp-video,
.ua-single .mejs-container{width:100% !important;max-width:100% !important;height:auto}
.ua-single .mejs-container{border-radius:14px;overflow:hidden}

/* Повний скид оформлення табів WooCommerce — вони малюють «вушка»
   псевдоелементами й тінями, які лишались поверх нових пігулок */
.ua-single .woocommerce-tabs ul.tabs{border-bottom:0 !important;box-shadow:none !important}
.ua-single .woocommerce-tabs ul.tabs li,
.ua-single .woocommerce-tabs ul.tabs li.active{
  background:transparent !important;background-image:none !important;
  border:0 !important;border-radius:0 !important;box-shadow:none !important;
  padding:0 !important;margin:0 !important;display:inline-block !important}
.ua-single .woocommerce-tabs ul.tabs li a{
  display:inline-flex !important;align-items:center;justify-content:center;
  min-height:40px;padding:0 18px !important;font-size:14px !important;
  background:#fff !important;border:1px solid var(--border) !important;
  border-radius:50rem !important;color:var(--text-muted) !important;
  box-shadow:none !important;text-shadow:none !important;font-weight:600}
.ua-single .woocommerce-tabs ul.tabs li.active a{
  background:var(--brand-brown) !important;border-color:var(--brand-brown) !important;
  color:#fff !important}

/* ====================================================================
   КОШИК
   ==================================================================== */

/* .ua-cart тут не використовуємо — це кнопка з макета, див. рядок 79 */
.ua-cart-form{margin-bottom:20px}

/* Товари ліворуч, підсумки праворуч і липкі. Без цього підсумки падали
   під список і лишали половину екрана порожньою. */
@media (min-width:992px){
  .woocommerce-cart .woocommerce{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start}
  /* усе інше (повідомлення, крос-сел) лишається на всю ширину */
  .woocommerce-cart .woocommerce > *{flex:1 1 100%}
  .woocommerce-cart .woocommerce > .ua-cart-form{flex:1 1 0;min-width:0;margin-bottom:0}
  .woocommerce-cart .woocommerce > .cart-collaterals{flex:0 0 380px;position:sticky;top:20px}
}
.ua-cart-items{display:flex;flex-direction:column;gap:10px}

.ua-cart-row{position:relative;display:flex;gap:12px;align-items:flex-start;
  border:1px solid var(--border);border-radius:14px;padding:12px;background:#fff}

.ua-cart-thumb{flex:0 0 84px}
.ua-cart-thumb img{width:84px;height:84px;object-fit:contain;border-radius:10px;
  background:var(--surface);display:block}

.ua-cart-info{flex:1 1 auto;min-width:0;padding-right:28px}

.ua-cart-title{font-size:15px;font-weight:600;line-height:1.3;margin-bottom:4px}
.ua-cart-title a{color:var(--text);text-decoration:none}
.ua-cart-title a:hover{color:var(--brand-brown)}
.ua-cart-title dl.variation{margin:4px 0 0;font-size:12px;color:var(--text-muted)}
.ua-cart-title dl.variation dt,
.ua-cart-title dl.variation dd{display:inline;margin:0;font-weight:400}
.ua-cart-title dl.variation dd::after{content:'';display:block}

.ua-cart-stock{font-size:13px;color:var(--success);margin-bottom:6px}

.ua-cart-prices{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.ua-cart-sum{font-size:18px;font-weight:700;color:var(--text)}
.ua-cart-unit{font-size:13px;color:var(--text-muted)}
.ua-cart-prices .woocommerce-Price-currencySymbol{font-size:.75em;margin-left:2px}

/* Степер кількості */
.ua-cart-qty .quantity{display:inline-flex;align-items:center;gap:8px}
.ua-cart-qty .quantity input[type="number"],
.ua-cart-qty .quantity .qty{width:64px;height:44px;text-align:center;
  border:1px solid var(--border);border-radius:10px;font-size:16px;font-weight:600;
  color:var(--text);-moz-appearance:textfield}
.ua-cart-qty .quantity input::-webkit-outer-spin-button,
.ua-cart-qty .quantity input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ua-cart-qty .quantity .minus,
.ua-cart-qty .quantity .plus{width:40px;height:44px;border:1px solid var(--border);
  border-radius:10px;background:#fff;color:var(--text);font-size:20px;line-height:1;
  display:inline-flex;align-items:center;justify-content:center}
.ua-cart-qty .quantity .minus:hover,
.ua-cart-qty .quantity .plus:hover{border-color:var(--brand-brown);color:var(--brand-brown)}

/* Видалити */
.ua-cart-remove{position:absolute;top:10px;right:10px}
.ua-cart-del{display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;color:var(--text-muted);text-decoration:none}
.ua-cart-del:hover{background:#FBE9E7;color:var(--danger)}

/* Купон і оновлення */
.ua-cart-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.ua-cart-coupon{display:flex;gap:8px;flex:1 1 260px;min-width:0}
.ua-cart-coupon input{flex:1 1 auto;min-width:0;height:46px;border:1px solid var(--border);
  border-radius:50rem;padding:0 18px;font-size:15px}
.ua-cart-coupon-btn,
.ua-cart-update{height:46px;padding:0 20px;border-radius:50rem;font-size:15px;font-weight:600;
  background:#fff;border:1px solid var(--border);color:var(--text)}
.ua-cart-coupon-btn:hover,
.ua-cart-update:hover{border-color:var(--brand-brown);color:var(--brand-brown)}

/* Підсумки */
.ua-cart-collaterals .cart_totals{border:1px solid var(--border);border-radius:14px;
  padding:16px;background:#fff}
.ua-cart-collaterals .cart_totals h2{font-size:18px;font-weight:700;margin:0 0 12px}
.ua-cart-collaterals table.shop_table{width:100%;border:0;margin:0}
.ua-cart-collaterals table.shop_table th,
.ua-cart-collaterals table.shop_table td{padding:10px 0;border:0;
  border-bottom:1px solid var(--border);font-size:15px;text-align:left}
.ua-cart-collaterals table.shop_table td{text-align:right}
/* але не варіанти доставки — це список із перемикачами, він читається зліва */
.ua-cart-collaterals td[data-title="Доставка"],
.ua-cart-collaterals .woocommerce-shipping-totals td{text-align:left}
.ua-cart-collaterals #shipping_method{list-style:none;margin:0;padding:0}
.ua-cart-collaterals #shipping_method li{display:flex;align-items:center;gap:8px;
  margin:0 0 6px;padding:0}
.ua-cart-collaterals #shipping_method input[type="radio"]{width:18px;height:18px;
  accent-color:var(--brand-brown);flex:0 0 auto;margin:0}
.ua-cart-collaterals #shipping_method label{margin:0;font-size:15px;color:var(--text)}
.ua-cart-collaterals .woocommerce-shipping-destination,
.ua-cart-collaterals p{font-size:13px;color:var(--text-muted);text-align:left}
.ua-cart-collaterals table.shop_table th{color:var(--text-muted);font-weight:500}
.ua-cart-collaterals .order-total th,
.ua-cart-collaterals .order-total td{border-bottom:0;font-size:19px;font-weight:700;
  color:var(--text);padding-top:14px}
.ua-cart-collaterals .wc-proceed-to-checkout{padding:14px 0 0}
.ua-cart-collaterals .checkout-button{width:100%;min-height:54px;border-radius:12px;
  font-size:17px;font-weight:600;background:var(--brand-brown);border-color:var(--brand-brown);
  color:#fff;display:inline-flex;align-items:center;justify-content:center}
.ua-cart-collaterals .checkout-button:hover{background:var(--brand-brown-dark)}

/* Порожній кошик */
.cart-empty,
.wc-empty-cart-message{text-align:center;padding:36px 16px;font-size:16px;color:var(--text-muted)}
.return-to-shop{text-align:center;padding-bottom:24px}
.return-to-shop .button{min-height:54px;padding:0 28px;border-radius:12px;font-weight:600;
  background:var(--brand-brown);border-color:var(--brand-brown);color:#fff;
  display:inline-flex;align-items:center;justify-content:center}

@media (min-width:992px){
  .ua-cart-collaterals{max-width:420px;margin-left:auto}
  .ua-cart-thumb{flex:0 0 100px}
  .ua-cart-thumb img{width:100px;height:100px}
}

/* ====================================================================
   ОФОРМЛЕННЯ ЗАМОВЛЕННЯ
   ==================================================================== */

.ua-checkout{margin-bottom:24px}
.ua-co-card{border:1px solid var(--border);border-radius:14px;padding:16px;background:#fff;
  margin-bottom:16px}
.ua-co-review{border:1px solid var(--border);border-radius:14px;padding:16px;background:#fff}
@media (min-width:992px){
  .ua-co-review{position:sticky;top:130px}
}

/* Заголовки секцій */
.ua-checkout h3,
.ua-co-title,
.ua-checkout .woocommerce-billing-fields > h3,
.ua-checkout .woocommerce-shipping-fields > h3,
.ua-checkout .woocommerce-additional-fields > h3{
  font-size:18px;font-weight:700;color:var(--text);margin:0 0 14px;padding:0;border:0}
.ua-checkout .woocommerce-billing-fields,
.ua-checkout .woocommerce-shipping-fields,
.ua-checkout .woocommerce-additional-fields{margin-bottom:18px}

/* Поля */
.ua-checkout .form-row{margin-bottom:14px;padding:0}
.ua-checkout label{display:block;font-size:13px;font-weight:600;color:var(--text-muted);
  margin-bottom:6px}
.ua-checkout .required{color:var(--danger);text-decoration:none;border:0}
.ua-checkout input[type="text"],
.ua-checkout input[type="email"],
.ua-checkout input[type="tel"],
.ua-checkout input[type="password"],
.ua-checkout input[type="number"],
.ua-checkout select,
.ua-checkout .select2-container .select2-selection--single,
.ua-checkout textarea{
  width:100%;min-height:50px;border:1px solid var(--border);border-radius:12px;
  padding:12px 14px;font-size:15px;color:var(--text);background:#fff;box-shadow:none}
.ua-checkout textarea{min-height:96px;resize:vertical}
.ua-checkout input:focus,
.ua-checkout select:focus,
.ua-checkout textarea:focus{border-color:var(--brand-brown);outline:0;
  box-shadow:0 0 0 3px rgba(139,90,46,.12)}
.ua-checkout .select2-container .select2-selection--single{display:flex;align-items:center}
.ua-checkout .select2-container--default .select2-selection--single .select2-selection__arrow{height:48px}
.ua-checkout .woocommerce-input-wrapper{display:block;width:100%}

/* Підсумок замовлення */
.ua-co-review table.shop_table{width:100%;border:0;margin:0 0 14px}
.ua-co-review table.shop_table th,
.ua-co-review table.shop_table td{padding:10px 0;border:0;border-bottom:1px solid var(--border);
  font-size:14px;text-align:left;vertical-align:top}
/* праворуч лише суми, а не назви товарів */
.ua-co-review table.shop_table td.product-total,
.ua-co-review table.shop_table td:last-child{text-align:right;white-space:nowrap}
.ua-co-review table.shop_table td.product-name{text-align:left;padding-right:12px}
.ua-co-review table.shop_table thead th{font-size:12px;text-transform:uppercase;
  letter-spacing:.04em;color:var(--text-muted);font-weight:700}
.ua-co-review .product-name{font-weight:600;color:var(--text)}
.ua-co-review .product-quantity{color:var(--text-muted);font-weight:500}
.ua-co-review .order-total th,
.ua-co-review .order-total td{border-bottom:0;font-size:19px;font-weight:700;color:var(--text);
  padding-top:14px}

/* Способи оплати */
.ua-checkout .wc_payment_methods{list-style:none;margin:0 0 16px;padding:0;
  display:flex;flex-direction:column;gap:10px}
.ua-checkout .wc_payment_method{border:1px solid var(--border);border-radius:12px;
  padding:14px;background:#fff;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.ua-checkout .wc_payment_method:has(input:checked){border-color:var(--brand-brown);
  background:var(--beige)}
.ua-checkout .wc_payment_method label{flex:1 1 auto;min-width:0;display:flex;align-items:center;
  gap:10px;font-size:15px;font-weight:600;color:var(--text);margin:0;cursor:pointer}
.ua-checkout .wc_payment_method input[type="radio"]{width:20px;height:20px;accent-color:var(--brand-brown);
  margin:0;flex:0 0 auto}
.ua-checkout .wc_payment_method img{max-height:28px;width:auto;margin-left:auto}
.ua-checkout .payment_box{flex:1 1 100%;margin:4px 0 0;padding:12px;background:#FAFAFA;border-radius:10px;
  font-size:13px;color:var(--text-muted)}
.ua-checkout .payment_box p:last-child{margin-bottom:0}

/* Способи доставки */
.ua-checkout #shipping_method{list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:8px}
.ua-checkout #shipping_method li{display:flex;align-items:center;gap:10px}
.ua-checkout #shipping_method input[type="radio"]{width:20px;height:20px;accent-color:var(--brand-brown)}
.ua-checkout #shipping_method label{margin:0;font-size:15px;font-weight:500;color:var(--text)}

/* Згода з правилами */
.ua-checkout .woocommerce-terms-and-conditions-wrapper{margin:14px 0}
.ua-checkout .woocommerce-form__label-for-checkbox{display:flex;align-items:flex-start;gap:10px;
  font-size:14px;font-weight:500;color:var(--text)}
.ua-checkout .woocommerce-form__input-checkbox{width:20px;height:20px;margin:0;flex:0 0 auto;
  accent-color:var(--brand-brown)}

/* Кнопка */
.ua-checkout #place_order,
.ua-checkout .button.alt{width:100%;min-height:56px;border-radius:12px;font-size:17px;
  font-weight:600;background:var(--brand-brown);border-color:var(--brand-brown);color:#fff;
  display:inline-flex;align-items:center;justify-content:center}
.ua-checkout #place_order:hover{background:var(--brand-brown-dark)}

/* Купон і повідомлення */
.woocommerce-form-coupon-toggle,
.checkout_coupon{margin-bottom:16px}
.checkout_coupon{border:1px solid var(--border);border-radius:12px;padding:14px}
.woocommerce-info,
.woocommerce-message,
.woocommerce-error{border:1px solid var(--border);border-radius:12px;padding:14px 16px;
  background:var(--beige);color:var(--text);font-size:14px;list-style:none;margin-bottom:16px}
.woocommerce-error{background:#FBE9E7;border-color:#F3C4BC;color:var(--danger)}

/* ====================================================================
   ОСОБИСТИЙ КАБІНЕТ
   ==================================================================== */

.ua-acc-nav{margin-bottom:20px}

.ua-acc-cta{display:flex;align-items:center;justify-content:center;gap:8px;
  min-height:52px;border-radius:12px;background:var(--brand-brown);color:#fff;
  font-size:16px;font-weight:600;text-decoration:none;margin-bottom:16px}
.ua-acc-cta:hover{background:var(--brand-brown-dark);color:#fff}
.ua-acc-cta--alt{background:#fff;color:var(--brand-brown);border:1.5px solid var(--brand-brown)}
.ua-acc-cta--alt:hover{background:var(--beige);color:var(--brand-brown-dark)}

.ua-acc-group{border:1px solid var(--border);border-radius:14px;overflow:hidden;
  background:#fff;margin-bottom:14px}
.ua-acc-head{padding:12px 16px;font-size:12px;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;color:var(--text-muted);background:#FAFAFA;
  border-bottom:1px solid var(--border)}

.ua-acc-item{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px;font-size:15px;font-weight:500;color:var(--text);
  text-decoration:none;border-bottom:1px solid var(--border)}
.ua-acc-item:last-child{border-bottom:0}
.ua-acc-item svg{color:var(--text-muted);flex:0 0 auto}
.ua-acc-item:hover{background:#FAFAFA;color:var(--brand-brown)}
.ua-acc-item.is-active{background:var(--beige);color:var(--brand-brown);font-weight:600}
.ua-acc-item.is-active svg{color:var(--brand-brown)}
.ua-acc-item--exit{color:var(--danger)}
.ua-acc-item--exit svg{color:var(--danger)}
.ua-acc-item--exit:hover{background:#FBE9E7;color:var(--danger)}

/* Довгі назви пунктів («Список спостереження») мають переноситись усередині
   рядка, а не налазити на сусідній.
   word-break:normal — бо успадкований break-word рвав слово посеред себе:
   в меню стояло «Список спостереже / ння». Переносимо по пробілах, а слово
   ламаємо лише тоді, коли воно й справді не влазить. */
.ua-acc-item span{flex:1 1 auto;min-width:0;line-height:1.3;
  word-break:normal;overflow-wrap:break-word}

/* Штатні сторінки кабінету WooCommerce (Замовлення, Адреси, Реквізити).
   Там меню лежить у .col-2 батьківської теми — це 186 пікселів, у які
   «Список спостереження» не вміщається: слово ламалось посеред себе й
   пункт розповзався на три рядки. Ширину задаємо в пікселях, бо потрібна
   саме та, у яку влазить найдовший пункт, а не частка від екрана.
   Свої сторінки кабінету («Мої продажі», «Мої покупки») сюди не входять —
   у них своя колонка .ua-acc-side нижче. */
@media (min-width:992px){
  .woocommerce-account .woocommerce .row > .col-2{flex:0 0 auto;width:250px;max-width:250px}
  .woocommerce-account .woocommerce .row > .col-md-10{flex:1 1 auto;width:auto;
    max-width:calc(100% - 250px)}
}

/* ============================================================
   Форма виставлення лота: кроки, нижня смуга, помилки.
   Розмітку малює ua-lot-form.js — у самій формі цих класів немає.
   ============================================================ */

.ua-step-hidden{display:none !important}

.ua-steps{display:flex;gap:8px;overflow-x:auto;padding:4px 0 14px;margin-bottom:8px;
  border-bottom:1px solid var(--border);-webkit-overflow-scrolling:touch}
.ua-steps::-webkit-scrollbar{height:0}
.ua-step-tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;
  padding:9px 14px;border:1px solid var(--border);border-radius:50rem;background:#fff;
  color:var(--text-muted);font-size:14px;font-weight:600;white-space:nowrap}
.ua-step-tab:hover{border-color:var(--brand-brown);color:var(--brand-brown)}
.ua-step-tab.is-active{background:var(--brand-brown);border-color:var(--brand-brown);color:#fff}
.ua-step-num{display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:50%;background:var(--beige);
  color:var(--brand-brown);font-size:12px;font-weight:700}
.ua-step-tab.is-active .ua-step-num{background:rgba(255,255,255,.25);color:#fff}

/* Кнопка «Створити лот» стояла в самому низу двох з половиною тисяч
   пікселів форми. Тепер вона завжди на екрані. */
.ua-form-bar{position:fixed;left:0;right:0;bottom:0;z-index:1030;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 16px;background:#fff;border-top:1px solid var(--border);
  box-shadow:0 -6px 18px rgba(0,0,0,.06)}
/* Зліва внизу висить кружечок чату — відступ, щоб напис не ліз під нього */
.ua-form-bar{padding-left:86px}
.ua-form-bar__where{font-size:14px;font-weight:600;color:var(--text-muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ua-form-bar__btns{display:flex;gap:8px;flex:0 0 auto}
.ua-form-bar .btn{min-height:44px;border-radius:10px;font-weight:600;padding:0 16px;
  display:inline-flex;align-items:center}
.ua-form-bar .btn-primary{background:var(--brand-brown);border-color:var(--brand-brown)}
.ua-form-bar .btn-outline-secondary{background:#fff;border:1px solid var(--border);
  color:var(--text)}
.ua-form-bar .btn:disabled{opacity:.4}
body.has-ua-form-bar{padding-bottom:76px}
/* Стара кнопка створення стояла в середині форми й дублювала ту, що
   в смузі. Ховаємо тільки коли смуга справді з'явилась: якщо скрипт не
   відпрацював, атрибута немає й кнопка на місці. */
body.has-ua-form-bar [data-ua-actions]{display:none}

/* Смужка поступу вздовж верхнього краю смуги. */
.ua-form-bar__track{position:absolute;left:0;right:0;top:0;height:3px;
  background:var(--line);border-radius:3px;overflow:hidden}
.ua-form-bar__fill{display:block;height:100%;width:20%;
  background:var(--brand-brown);transition:width .25s ease}

@media (max-width:991.98px){
  /* Нижче lg знизу вже стоїть мобільне меню — сідаємо над ним. */
  .ua-form-bar{bottom:64px;padding-left:70px}
  body.has-ua-form-bar{padding-bottom:140px}
  .ua-form-bar__where{display:none}
  .ua-form-bar__btns{width:100%;gap:10px}

  /* Одна головна кнопка на екрані замість трьох дрібних.
     Доки кроки не закінчились — це «Далі», на останньому кроці вона
     стає «Створити лот». Так лот виставляється великим пальцем, не
     цілячись у кружечки вгорі сторінки. */
  .ua-form-bar .ua-step-prev{flex:0 0 auto;padding:0 18px}
  .ua-form-bar .ua-step-next{flex:1 1 auto;justify-content:center;
    background:var(--brand-brown);border-color:var(--brand-brown);color:#fff}
  .ua-form-bar .ua-step-next:disabled{opacity:1}
  .ua-form-bar .ua-form-bar__go{display:none;flex:1 1 auto;justify-content:center}

  /* На першому кроці повертатись нікуди, на останньому — нема куди далі. */
  .ua-form-bar.is-first .ua-step-prev{display:none}
  .ua-form-bar.is-last .ua-step-next{display:none}
  .ua-form-bar.is-last .ua-form-bar__go{display:inline-flex}

  /* Кроки вгорі лишаються, але як орієнтир, а не єдиний спосіб рухатись. */
  .ua-steps{margin:0 -12px 10px;padding:4px 12px 12px}
  .ua-step-tab{padding:8px 14px;font-size:14px}
  .ua-step-name{display:none}
  .ua-step-tab.is-active .ua-step-name{display:inline}
}

/* Поле, через яке форма не відправилась */
.ua-invalid,
.ua-invalid.form-control,
.ua-invalid.form-select{border-color:var(--danger) !important;
  box-shadow:0 0 0 3px rgba(211,47,47,.12)}
.checkbox-group.ua-invalid{border:1px solid var(--danger);border-radius:12px;padding:10px}

/* ============================================================
   Строк відправлення
   ============================================================ */
.ua-ship-opt{display:flex;align-items:flex-start;gap:9px;margin:0 0 8px;
  font-size:14px;line-height:1.4;cursor:pointer}
.ua-ship-opt input{margin-top:3px;flex:0 0 auto}
/* Поле дати має сенс лише разом із другим варіантом — ховаємо, поки
   його не обрали. :has підтримують усі поточні браузери; якщо ні —
   поле просто лишиться видимим, і форма все одно працює. */
.ua-ship-date{max-width:220px;height:42px;border-radius:10px;margin-top:2px}
.ua-ship-terms:has(input[value="default"]:checked) .ua-ship-date{display:none}

/* Строк на сторінці лота */
.ua-ship-note{display:flex;align-items:center;gap:8px;margin:10px 0 14px;
  padding:10px 12px;border:1px solid var(--border);border-radius:12px;
  background:#FAFAFA;font-size:14px;font-weight:600;color:var(--text)}
.ua-ship-note svg{width:20px;height:20px;flex:0 0 auto;color:var(--brand-brown)}

/* ============================================================
   Поділитись лотом
   ============================================================ */
.ua-share{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
.ua-share-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;
  padding:0 16px;border:1px solid var(--border);border-radius:50rem;background:#fff;
  color:var(--text-muted);font-size:14px;font-weight:600;text-decoration:none;
  cursor:pointer;white-space:nowrap}
.ua-share-btn svg{width:16px;height:16px;flex:0 0 auto}
.ua-share-btn:hover{border-color:var(--brand-brown);color:var(--brand-brown)}
.ua-share-btn.is-done{border-color:var(--success);color:var(--success)}
/* Перша кнопка — у кольорі Facebook, щоб її впізнавали без підпису */
.ua-share-btn:first-child svg{color:#1877F2}

/* ============================================================
   Моя колекція
   ============================================================ */
.ua-col{max-width:1000px;padding-bottom:32px}
.ua-req{color:var(--danger)}

/* Розподіл за категоріями — смужки замість діаграми: читається з одного
   погляду й не тягне за собою бібліотеку графіків */
.ua-col-bars{display:flex;flex-direction:column;gap:10px;margin:4px 0 8px}
.ua-col-bar{display:block;text-decoration:none;color:inherit}
.ua-col-bar__head{display:flex;justify-content:space-between;gap:12px;
  font-size:13px;font-weight:600;margin-bottom:4px}
.ua-col-bar__track{display:block;height:8px;border-radius:50rem;background:#EFEDE9;overflow:hidden}
.ua-col-bar__fill{display:block;height:100%;background:var(--brand-brown);border-radius:50rem}
.ua-col-bar:hover .ua-col-bar__fill{background:var(--brand-gold)}

/* Форма предмета */
.ua-col-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:767.98px){ .ua-col-form{grid-template-columns:1fr} }
.ua-col-form label{display:flex;flex-direction:column;gap:5px;font-size:13px;
  font-weight:600;color:var(--text-muted);margin:0}
.ua-col-form .form-control{height:42px;border-radius:10px;width:100%;
  font-size:15px;font-weight:500;color:var(--text)}
.ua-col-form textarea.form-control{height:auto;min-height:60px}
.ua-col-wide{grid-column:1 / -1}
.ua-col-actions{grid-column:1 / -1;display:flex;align-items:center;gap:14px}
.ua-col-actions .btn{min-height:44px;border-radius:10px;padding:0 22px;font-weight:600;
  background:var(--brand-brown);border-color:var(--brand-brown);
  display:inline-flex;align-items:center}

/* Сітка предметів */
.ua-col-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.ua-col-card{border:1px solid var(--border);border-radius:14px;background:#fff;overflow:hidden;
  display:flex;flex-direction:column}
.ua-col-pic{aspect-ratio:4/3;background:#F5F3F0;display:flex;align-items:center;
  justify-content:center;overflow:hidden}
.ua-col-pic img{width:100%;height:100%;object-fit:cover}
.ua-col-body{padding:12px;display:flex;flex-direction:column;gap:4px}
.ua-col-price{font-size:16px;font-weight:700;color:var(--brand-brown)}
.ua-col-body .ua-lot-actions{margin-top:8px}

/* ============================================================
   Сповіщення
   ============================================================ */
.ua-notif-list{display:flex;flex-direction:column;gap:2px}
.ua-notif{display:flex;gap:10px;padding:12px 10px;border-radius:12px;
  text-decoration:none;color:var(--text);border-bottom:1px solid var(--border)}
.ua-notif:last-child{border-bottom:0}
.ua-notif:hover{background:#FAFAFA}
.ua-notif.is-new{background:var(--beige)}
.ua-notif.is-new:hover{background:#F4E9D8}
.ua-notif-dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;margin-top:7px;
  background:transparent}
.ua-notif.is-new .ua-notif-dot{background:var(--brand-brown)}
.ua-notif-body{min-width:0;display:flex;flex-direction:column;gap:2px}
.ua-notif-title{font-size:14px;font-weight:700;line-height:1.3}
.ua-notif-text{font-size:13px;color:var(--text-muted);line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ua-notif-time{font-size:11px;color:var(--text-muted)}
.ua-notif-read-all{min-height:42px;border-radius:10px;font-weight:600;
  border:1px solid var(--border);background:#fff;color:var(--text)}
.ua-notif-read-all:disabled{opacity:.6}

/* ============================================================
   Шапка внутрішніх екранів (телефон)
   ============================================================ */
.ua-hdr-inner{display:flex;align-items:center;gap:10px;min-height:56px}
.ua-hdr-inner-title{flex:1 1 auto;min-width:0;text-align:center;font-size:17px;
  font-weight:700;color:var(--brand-brown);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.ua-hdr-back{flex:0 0 auto}
.ua-hdr-inner .ua-icon-btn{position:relative}
/* Назва вже стоїть у шапці — другий такий самий заголовок під нею зайвий.
   Ховаємо лише той, що йде зі стандартної обгортки сторінки; власні
   заголовки всередині вмісту лишаються. */
@media (max-width:991.98px){
  .ua-has-inner-header .entry-header > h1{display:none}
}

/* ============================================================
   Список налаштувань — рядки, як у застосунку
   ============================================================ */
.ua-settings{max-width:640px;padding-top:8px;padding-bottom:32px}
.ua-set-h1{font-size:26px;font-weight:800;margin:18px 0 18px}
.ua-set-group{background:#fff;border:1px solid var(--border);border-radius:16px;
  overflow:hidden;margin-bottom:16px}
.ua-set-head{padding:12px 16px 8px;font-size:12px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-muted);background:#FAFAFA;
  border-bottom:1px solid var(--border)}
.ua-set-row{display:flex;align-items:center;gap:12px;padding:14px 16px;
  color:var(--text);text-decoration:none;border-bottom:1px solid var(--border);font-size:15px}
.ua-set-row:last-child{border-bottom:0}
.ua-set-row:hover{background:#FAFAFA;color:var(--brand-brown)}
.ua-set-row.is-plain,
.ua-set-row.is-plain:hover{background:#fff;color:var(--text);cursor:default}
.ua-set-ico{flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:var(--beige);
  display:inline-flex;align-items:center;justify-content:center;color:var(--brand-brown)}
.ua-set-ico svg{width:19px;height:19px}
.ua-set-label{flex:1 1 auto;min-width:0;font-weight:500}
.ua-set-value{flex:0 0 auto;color:var(--text-muted);font-size:14px;font-weight:600}
.ua-set-chev{width:16px;height:16px;flex:0 0 auto;color:var(--text-muted)}
.ua-set-row--exit,
.ua-set-row--exit .ua-set-ico{color:var(--danger)}
.ua-set-row--exit .ua-set-ico{background:#FBE9E7}
.ua-set-row--exit:hover{background:#FBE9E7;color:var(--danger)}

/* ============================================================
   Порожні стани
   Ілюстрація по центру, заголовок, пояснення дрібним сірим —
   так, як на скріншотах застосунку. Малюнок сіро-графітовий,
   без кольору, щоб не сперечався з коричневою кнопкою.
   ============================================================ */
.ua-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:44px 20px;max-width:420px;margin:0 auto}
.ua-empty-art{width:120px;height:96px;color:#C9C5BE;margin-bottom:18px;flex:0 0 auto}
.ua-empty-title{font-size:18px;font-weight:700;color:var(--text)}
.ua-empty-text{margin-top:6px;font-size:14px;line-height:1.5;color:var(--text-muted)}
.ua-empty-cta{margin-top:18px;min-height:46px;border-radius:12px;padding:0 22px;
  display:inline-flex;align-items:center;background:var(--brand-brown);
  border-color:var(--brand-brown);font-weight:600}
.ua-empty-cta:hover{background:var(--brand-brown-dark);border-color:var(--brand-brown-dark)}
/* У вузькій панелі збоку (сповіщення) відступи менші */
.offcanvas .ua-empty-state{padding:28px 8px}
.offcanvas .ua-empty-art{width:96px;height:76px}

/* ============================================================
   Кабінет адміністратора
   ============================================================ */

/* Колонка вмісту в цьому кабінеті впирається в правий край вікна — сітка
   тут заповнена від краю до краю, тож поле треба задати самим */
@media (min-width:992px){ .ua-admin{padding-right:16px} }

.ua-acc-group--admin .ua-acc-head{color:var(--brand-brown)}
.ua-acc-note{padding:12px 14px;margin-bottom:16px;border:1px dashed var(--border);
  border-radius:12px;font-size:13px;color:var(--text-muted);background:#FAFAFA}

.ua-admin-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 0 16px;margin-bottom:4px;
  border-bottom:1px solid var(--border)}
.ua-admin-tab{flex:0 0 auto;padding:8px 16px;border-radius:50rem;background:#fff;
  border:1px solid var(--border);color:var(--text-muted);font-size:14px;font-weight:600;
  text-decoration:none;white-space:nowrap}
.ua-admin-tab:hover{border-color:var(--brand-brown);color:var(--brand-brown)}
.ua-admin-tab.is-active{background:var(--brand-brown);border-color:var(--brand-brown);color:#fff}

/* Плитки зведення */
.ua-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}
@media (max-width:991.98px){.ua-tiles{grid-template-columns:repeat(2,1fr)}}
.ua-tile{display:block;padding:16px;border:1px solid var(--border);border-radius:14px;
  background:#fff;text-decoration:none;color:inherit}
a.ua-tile:hover{border-color:var(--brand-brown);box-shadow:0 4px 14px rgba(0,0,0,.05)}
.ua-tile__value{font-size:28px;font-weight:700;color:var(--brand-brown);line-height:1.1}
.ua-tile__label{margin-top:4px;font-size:14px;font-weight:600;color:var(--text)}
.ua-tile__hint{margin-top:2px;font-size:12px;color:var(--text-muted)}

/* Фільтри й пошук */
.ua-admin-filters{display:flex;flex-wrap:wrap;gap:12px;align-items:center;
  justify-content:space-between;margin:18px 0 10px}
.ua-admin-chips{display:flex;gap:8px;flex-wrap:wrap}
.ua-chip{padding:6px 14px;border:1px solid var(--border);border-radius:50rem;background:#fff;
  color:var(--text-muted);font-size:13px;font-weight:600;text-decoration:none}
.ua-chip:hover{border-color:var(--brand-brown);color:var(--brand-brown)}
.ua-chip.is-active{background:var(--beige);border-color:var(--brand-brown);color:var(--brand-brown)}
.ua-admin-search{display:flex;gap:8px;min-width:280px}
.ua-admin-search .form-control{height:40px;border-radius:10px}
.ua-admin-search .btn{height:40px;border-radius:10px;padding:0 16px;
  background:var(--brand-brown);border-color:var(--brand-brown);white-space:nowrap}
.ua-admin-count{font-size:13px;color:var(--text-muted);margin:0 0 10px}

/* Таблиці */
.ua-admin-table{font-size:14px;vertical-align:middle}
.ua-admin-table thead th{background:#FAFAFA;border-bottom:1px solid var(--border);
  font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--text-muted);
  font-weight:700;white-space:nowrap}
.ua-admin-table td{border-bottom:1px solid var(--border)}
.ua-row-off td{background:#FFF6F5}
.ua-nowrap{white-space:nowrap}
.ua-small{font-size:12px}
.ua-muted{color:var(--text-muted)}
.ua-empty{padding:24px;border:1px dashed var(--border);border-radius:14px;
  color:var(--text-muted);text-align:center}
.ua-badge{display:inline-block;padding:1px 8px;border-radius:50rem;background:var(--beige);
  color:var(--brand-brown);font-size:11px;font-weight:700}
.ua-badge--off{background:#FBE9E7;color:var(--danger)}
/* Статуси замовлень: колір має читатись з одного погляду */
.ua-badge--pending{background:#FFF3E0;color:#B26A00}
.ua-badge--on-hold{background:#EDE7F6;color:#5E35B1}
.ua-badge--processing{background:#E3F2FD;color:#1565C0}
.ua-badge--completed{background:#E8F5E9;color:#1a7f37}
.ua-badge--cancelled,
.ua-badge--failed,
.ua-badge--refunded{background:#FBE9E7;color:var(--danger)}

/* Плитки в розділі ставок ідуть по дві — хай не розтягуються на весь рядок */
.ua-admin .ua-tiles:has(.ua-tile:nth-child(2):last-child){
  grid-template-columns:repeat(2,minmax(0,1fr));max-width:520px}

/* Кнопка-дія: окрема форма зі своїм ключем, тому не ламаємо рядок */
.ua-admin-inline{display:inline}
.ua-admin-pages{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}

/* Категорії */
.ua-cat-row{display:flex;align-items:center;gap:10px}
.ua-cat-thumb{width:44px;height:44px;flex:0 0 auto;border-radius:10px;object-fit:cover;
  border:1px solid var(--border)}
.ua-cat-thumb--empty{display:inline-flex;align-items:center;justify-content:center;
  background:#FAFAFA;color:var(--text-muted);font-size:14px}
/* Сітка, а не flex: у теми .form-control має width:100%, і у flex-рядку
   кожне поле лягало на власний рядок. Клітинки сітки задають ширину самі,
   і правила полів на це не впливають. */
.ua-cat-new{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto;
  gap:8px;align-items:center}
@media (max-width:575.98px){ .ua-cat-new{grid-template-columns:1fr} }
.ua-cat-new .form-control{height:40px;border-radius:10px;width:100%}
.ua-cat-new .btn{height:40px;border-radius:10px;padding:0 18px;
  background:var(--brand-brown);border-color:var(--brand-brown)}
.ua-cat-rename{display:inline-flex;gap:6px;align-items:center}
.ua-cat-rename .form-control{height:32px;width:150px;border-radius:8px;font-size:13px}
/* Вибір файлу ховаємо всередині підпису — інакше в рядку стоїть сіра
   кнопка «Огляд», яка ніяк не в'яжеться з рештою дій */
.ua-cat-upload label{cursor:pointer}

/* Банери */
.ua-banner-new{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) auto;
  gap:8px;align-items:center}
@media (max-width:767.98px){ .ua-banner-new{grid-template-columns:1fr} }
.ua-banner-new .form-control{height:40px;border-radius:10px;width:100%}
.ua-banner-new .btn{height:40px;border-radius:10px;padding:0 18px;
  background:var(--brand-brown);border-color:var(--brand-brown)}
.ua-banner-list{display:flex;flex-direction:column;gap:12px}
.ua-banner-item{display:flex;gap:14px;padding:12px;border:1px solid var(--border);
  border-radius:14px;background:#fff}
.ua-banner-item.is-off{opacity:.55;background:#FAFAFA}
.ua-banner-pic{flex:0 0 200px;height:70px;border-radius:10px;overflow:hidden;
  background:#F2F0EC;display:flex;align-items:center;justify-content:center}
.ua-banner-pic img{width:100%;height:100%;object-fit:cover}
.ua-banner-meta{min-width:0;flex:1 1 auto}
@media (max-width:575.98px){
  .ua-banner-item{flex-direction:column}
  .ua-banner-pic{flex:0 0 auto;width:100%;height:120px}
}

/* Нагадування: два поля в рядок */
.ua-rem-form{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.ua-rem-field{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:14px;
  font-weight:600;color:var(--text)}
.ua-rem-field .form-control{width:88px;height:40px;border-radius:10px;text-align:center}
.ua-rem-form .btn{height:40px;border-radius:10px;padding:0 18px;
  background:var(--brand-brown);border-color:var(--brand-brown)}

/* Налаштування */
.ua-admin-card{padding:16px;border:1px solid var(--border);border-radius:14px;background:#fff}
.ua-admin-form .ua-admin-card{margin-bottom:0}
.ua-switch{display:flex;gap:12px;align-items:flex-start;cursor:pointer;margin:0}
.ua-switch input{position:absolute;opacity:0;width:0;height:0}
.ua-switch__box{flex:0 0 auto;width:46px;height:26px;border-radius:50rem;background:#D8D5D0;
  position:relative;transition:background .15s}
.ua-switch__box::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;
  border-radius:50%;background:#fff;transition:transform .15s}
.ua-switch input:checked + .ua-switch__box{background:var(--brand-brown)}
.ua-switch input:checked + .ua-switch__box::after{transform:translateX(20px)}
.ua-switch input:focus-visible + .ua-switch__box{outline:2px solid var(--brand-brown);outline-offset:2px}

/* Дії над лотом у рядку списку «Мої продажі» */
.ua-lot-actions{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:6px}
.ua-lot-act{padding:0;border:0;background:none;font-size:13px;font-weight:600;
  color:var(--brand-gold);text-decoration:none;line-height:1.4}
.ua-lot-act:hover{color:var(--brand-brown);text-decoration:underline}
.ua-lot-del{color:var(--danger)}
.ua-lot-del:hover{color:var(--danger)}
.ua-lot-act.is-off{color:var(--text-muted);cursor:not-allowed;text-decoration:line-through}
.ua-lot-act.is-off:hover{color:var(--text-muted);text-decoration:line-through}

/* На телефоні ці дії були 18 пікселів заввишки — рядок тексту й не
   більше. Поруч стоять «Редагувати» і «Видалити», і промахнутись пальцем
   між ними легко, а одна з них видаляє. Тому на вузьких екранах
   збільшуємо саме зону дотику, не змінюючи вигляду: кегль і колір ті
   самі, просто навколо напису зʼявляється повітря.
   Гортання вертикальне, тож додаємо висоту, а не ширину. */
@media (max-width:767.98px){
  .ua-lot-act{padding:9px 2px;line-height:1.15}
  .ua-lot-actions{gap:0 16px;margin-top:2px}
}

/* Сторінки «Мої продажі», «Мої покупки», форми лота: меню зліва, вміст
   справа. Колонка меню була col-md-2 (~200px) — назви пунктів у неї не
   вміщались, «Список спостереження» ламався посеред слова. */
.ua-acc-side{margin-bottom:20px}
@media (min-width:992px){
  .ua-acc-side{position:sticky;top:20px;align-self:flex-start}
  /* Перебиваємо ширину, задану класом сітки на тій самій колонці, — і
     обов'язково сусідню теж. Інакше 250px + 83.33% дають більше за рядок,
     і меню лягає поверх форми. */
  .ua-acc-side.col-md-2{flex:0 0 auto;width:250px;max-width:250px}
  .ua-acc-side.col-md-2 + .col-md-10{flex:1 1 auto;width:auto;
    max-width:calc(100% - 250px)}
}

/* Таблиця лотів у кабінеті. Її будує DataTables, розмітку не чіпаємо —
   лише робимо читабельною: назва отримує місце, службові колонки не
   переносяться, службові стилі Bootstrap не рвуть сітку. */
.ua-acc-main{min-width:0}
.ua-acc-main .dataTables_wrapper{overflow-x:auto}
.ua-acc-main table.table{width:100%;font-size:14px;border-collapse:separate;border-spacing:0}
.ua-acc-main table.table thead th{background:#FAFAFA;border-bottom:1px solid var(--border);
  font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--text-muted);
  font-weight:700;padding:10px 12px;white-space:nowrap;vertical-align:middle}
.ua-acc-main table.table td{padding:12px;border-bottom:1px solid var(--border);
  vertical-align:middle;color:var(--text)}
.ua-acc-main table.table td.name{min-width:220px;line-height:1.35}
.ua-acc-main table.table td.name a{color:var(--text);font-weight:600;text-decoration:none}
.ua-acc-main table.table td.name a:hover{color:var(--brand-brown)}
.ua-acc-main table.table img{width:56px;height:56px;object-fit:contain;border-radius:8px;
  border:1px solid var(--border);background:#fff}
.ua-acc-main table.table tbody tr:hover{background:#FAFAFA}

/* Панель над таблицею: кількість, чипси, групові дії */
.ua-acc-main h2{font-size:26px;font-weight:700;margin:0 0 6px}
.ua-acc-main .cabinet_list_actions{display:flex;align-items:center;gap:10px;
  flex-wrap:wrap;margin:0 0 16px}
.ua-acc-main .dataTables_length,
.ua-acc-main .dataTables_filter{font-size:14px;color:var(--text-muted)}
.ua-acc-main .dataTables_filter input{height:40px;border:1px solid var(--border);
  border-radius:50rem;padding:0 16px;margin-left:8px}
.ua-acc-main select.form-control-sm,
.ua-acc-main .dataTables_length select{height:40px;border:1px solid var(--border);
  border-radius:10px;padding:0 30px 0 12px;font-size:14px;color:var(--text);background-color:#fff}

/* Вхід у кабінет. Форма розтягувалась на всю ширину сторінки, а кнопка
   входу була вузькою рамкою — головна дія має виглядати головною.
   Обмежуємо лише сторінкою кабінету: на чекауті цей самий блок
   показується всередині вужчої колонки й свої розміри вже має. */
/* Рамку малює картка теми (.card), тому звужуємо саме її — інакше поля
   стояли б у лівому кутку коробки на всю ширину сторінки */
.woocommerce-account .woocommerce > .card{
  max-width:480px;margin-left:auto;margin-right:auto;
  border:1px solid var(--border);border-radius:14px;background:#fff}
.woocommerce-account .woocommerce > .card > .card-body{padding:24px}
.woocommerce-account .woocommerce-form-login{max-width:none;margin:0}
.woocommerce-account .woocommerce-form-login .woocommerce-form-login__submit{
  width:100%;min-height:52px;margin:8px 0 0;
  background:var(--brand-brown);border-color:var(--brand-brown);color:#fff;
  font-weight:600;border-radius:12px}
.woocommerce-account .woocommerce-form-login .woocommerce-form-login__submit:hover{
  background:var(--brand-brown-dark);border-color:var(--brand-brown-dark);color:#fff}
.woocommerce-account .woocommerce-form-login .woocommerce-LostPassword{
  margin:12px 0 0;text-align:center}
.woocommerce-account .woocommerce-form-login label{font-size:14px;color:var(--text-muted);
  font-weight:600;margin-bottom:6px}
.woocommerce-account h2{font-size:22px;font-weight:700;margin:0 0 14px;text-align:center}

/* Вміст кабінету */
.woocommerce-MyAccount-content{border:1px solid var(--border);border-radius:14px;
  padding:16px;background:#fff}
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3{font-size:18px;font-weight:700;margin:0 0 12px}
.woocommerce-MyAccount-content p{font-size:15px}

/* Таблиця замовлень -> картки на телефоні */
.woocommerce-orders-table,
.woocommerce-MyAccount-content table.shop_table{width:100%;border:1px solid var(--border);
  border-radius:12px;border-collapse:separate;border-spacing:0;overflow:hidden}
.woocommerce-MyAccount-content table.shop_table th,
.woocommerce-MyAccount-content table.shop_table td{padding:12px 14px;border:0;
  border-bottom:1px solid var(--border);font-size:14px;text-align:left}
.woocommerce-MyAccount-content table.shop_table thead th{background:#FAFAFA;
  font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}
.woocommerce-MyAccount-content table.shop_table tr:last-child td{border-bottom:0}
.woocommerce-MyAccount-content .woocommerce-button{min-height:40px;padding:0 16px;
  border-radius:50rem;font-size:14px;font-weight:600;background:var(--brand-brown);
  border-color:var(--brand-brown);color:#fff;display:inline-flex;align-items:center}

@media (max-width:767.98px){
  .woocommerce-MyAccount-content table.shop_table thead{display:none}
  .woocommerce-MyAccount-content table.shop_table tr{display:block;
    border:1px solid var(--border);border-radius:12px;margin-bottom:10px;padding:6px 0}
  .woocommerce-MyAccount-content table.shop_table td{display:flex;justify-content:space-between;
    gap:12px;border-bottom:0;padding:8px 14px}
  .woocommerce-MyAccount-content table.shop_table td::before{
    content:attr(data-title);font-weight:600;color:var(--text-muted);font-size:13px}
}

/* Форми кабінету */
.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea{
  width:100%;min-height:50px;border:1px solid var(--border);border-radius:12px;
  padding:12px 14px;font-size:15px;color:var(--text)}
.woocommerce-MyAccount-content label{display:block;font-size:13px;font-weight:600;
  color:var(--text-muted);margin-bottom:6px}
.woocommerce-MyAccount-content button[type="submit"],
.woocommerce-MyAccount-content .button{min-height:52px;padding:0 24px;border-radius:12px;
  font-size:16px;font-weight:600;background:var(--brand-brown);border-color:var(--brand-brown);
  color:#fff;display:inline-flex;align-items:center;justify-content:center}

/* Гаманець */
.woo-wallet-balance,
.woocommerce-MyAccount-content .wallet-balance{background:var(--beige);border-radius:14px;
  padding:18px;text-align:center;margin-bottom:16px}
.woo-wallet-balance span{color:var(--brand-brown);font-weight:700}

/* ====================================================================
   ПІДВАЛ
   Був темно-синій #30475E зі старої теми — переводимо у світлий
   з графітовим текстом і коричневими акцентами, як решта сайту.
   ==================================================================== */

.bootscore-footer{background:#FAF8F5;border-top:1px solid var(--border);
  padding-top:32px;padding-bottom:8px}
.bootscore-info{background:#FAF8F5;border-top:1px solid var(--border)}

/* Заголовки колонок */
.bootscore-footer .widget-title,
.bootscore-footer .footer_widget h2,
.bootscore-footer h2{font-size:13px;font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;color:var(--text-muted);margin:0 0 12px}

/* Посилання */
.bootscore-footer .footer_widget ul{list-style:none;padding-left:0;margin:0}
.bootscore-footer .footer_widget ul li{margin-bottom:8px}
.bootscore-footer .footer_widget ul li a,
.bootscore-footer a{color:var(--text);font-size:15px;text-decoration:none}
.bootscore-footer .footer_widget ul li a:hover,
.bootscore-footer a:hover{color:var(--brand-brown)}
.bootscore-footer .widget{margin-bottom:24px}

/* Соцмережі */
.social-html-widget{padding-left:0;display:flex;gap:10px;align-items:center}
.social-html-widget a{display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--border)}
.social-html-widget a:hover{border-color:var(--brand-brown)}
.social-html-widget img{width:20px;height:20px;object-fit:contain;
  filter:grayscale(1) opacity(.65)}
.social-html-widget a:hover img{filter:none;opacity:1}

/* Копірайт і платіжні системи */
.bootscore-info{padding:14px 0}
.bootscore-info small,
.bootscore-info{color:var(--text-muted);font-size:13px}
.footer_pay{display:flex;justify-content:flex-end;align-items:center;gap:8px}
.footer_pay img{width:46px;height:auto;margin-left:0;
  filter:grayscale(1) opacity(.6)}

/* На телефоні підвал не має ховатись за нижнім меню */
@media (max-width:991.98px){
  .bootscore-footer{padding-top:24px}
  .footer_pay{justify-content:flex-start;margin-top:8px}
  .bootscore-info .row > div{width:100%;flex:0 0 100%;max-width:100%}
}

/* Заголовки колонок мали зайвий відступ від старих стилів */
.bootscore-footer .widget-title,
.bootscore-footer .footer_widget h2,
.bootscore-footer h2,
.bootscore-footer .widget_text h2{padding-left:0;margin-left:0}
.bootscore-footer .textwidget{padding-left:0}
.bootscore-footer .widget_nav_menu ul,
.bootscore-footer .menu{list-style:none;padding-left:0;margin:0}

/* ====================================================================
   БІЧНЕ МЕНЮ (віджет wpb-accordion-menu-or-category)
   Плагін малює чорні блоки — переводимо у світлі картки.
   Логіку акордеона й лічильники не чіпаємо.
   ==================================================================== */

#secondary .widget{background:#fff !important;border:1px solid var(--border) !important;
  border-radius:14px !important;padding:0 !important;overflow:hidden;margin-bottom:16px}
#secondary .widget_media_image{border:0 !important;background:transparent !important}
#secondary .widget_media_image img{border-radius:14px;width:100%;height:auto}

#secondary .widget-title{margin:0;padding:14px 16px;font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);
  background:#FAFAFA;border-bottom:1px solid var(--border) !important}

#secondary .textwidget{padding:0}

/* Список категорій */
.wpb_category_n_menu_accordion,
.wpb_category_n_menu_accordion_list{background:transparent !important;margin:0;padding:0;
  list-style:none;border:0 !important}
.wpb_category_n_menu_accordion_list li{list-style:none;background:transparent !important;
  border:0 !important;border-bottom:1px solid var(--border) !important;margin:0}
.wpb_category_n_menu_accordion_list > li:last-child{border-bottom:0 !important}

.wpb_category_n_menu_accordion_list li a{display:flex;align-items:center;gap:8px;
  padding:13px 16px !important;font-size:15px;font-weight:500;
  color:var(--text) !important;background:transparent !important;text-decoration:none;
  border:0 !important}
.wpb_category_n_menu_accordion_list li a:hover{background:#FAFAFA !important;
  color:var(--brand-brown) !important}

/* Лічильник товарів */
.wpb-wmca-cat-count{margin-left:auto;min-width:26px;height:22px;padding:0 7px;
  border-radius:50rem;background:var(--surface) !important;color:var(--text-muted) !important;
  font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;
  border:0 !important;line-height:1}
.wpb_category_n_menu_accordion_list li a:hover .wpb-wmca-cat-count{
  background:var(--beige) !important;color:var(--brand-brown) !important}

/* Вкладені підкатегорії */
.wpb_category_n_menu_accordion_list ul.children{margin:0;padding:0;background:#FCFBFA !important}
.wpb_category_n_menu_accordion_list ul.children li a{padding-left:32px !important;
  font-size:14px;color:var(--text-muted) !important}
.wpb_category_n_menu_accordion_list ul.children li a:hover{color:var(--brand-brown) !important}

/* Індикатор розгортання */
.wpb-submenu-indicator{color:var(--text-muted) !important;background:transparent !important;
  font-size:16px;line-height:1;width:24px;text-align:center;flex:0 0 auto;
  border:0 !important;margin-left:6px}
.cat-item-have-child > a:hover .wpb-submenu-indicator{color:var(--brand-brown) !important}

/* Активна категорія */
.wpb_category_n_menu_accordion_list li.current-cat > a,
.wpb_category_n_menu_accordion_list li.current-menu-item > a{
  background:var(--beige) !important;color:var(--brand-brown) !important;font-weight:600}

/* Плагін акордеона фарбує посилання в #f5f5f5 з !important і селектором
   з прямими нащадками. Перекриваємо тими самими селекторами. */
.wpb_category_n_menu_accordion > ul > li > a,
.wpb_category_n_menu_accordion ul > li li a{
  color:var(--text) !important;background:transparent !important;
  font-size:15px !important;line-height:1.3 !important;padding:13px 16px !important}
.wpb_category_n_menu_accordion > ul > li > a:hover,
.wpb_category_n_menu_accordion ul > li li a:hover{
  color:var(--brand-brown) !important;background:#FAFAFA !important}
.wpb_category_n_menu_accordion ul > li li{background:transparent !important}
.wpb_category_n_menu_accordion ul > li li a{
  padding-left:32px !important;font-size:14px !important;color:var(--text-muted) !important}
.wpb_category_n_menu_accordion ul > li li a:hover{color:var(--brand-brown) !important}
.wpb_category_n_menu_accordion > ul > li{background:transparent !important}

/* ====================================================================
   ТАЙМЕР: ОСТАННІ ГОДИНИ
   Пороги ставить ua-countdown.js. Колір — єдиний сигнал, розмір і
   розкладка не міняються, щоб картка не «стрибала» при перемиканні.
   ==================================================================== */
.auction-time-countdown.is-soon,
.auction-time-countdown.is-soon *{color:var(--accent-orange)}
.auction-time-countdown.is-urgent,
.auction-time-countdown.is-urgent *{color:var(--danger)}
.auction-time-countdown.is-urgent{font-weight:700}
/* у бежевій смузі на сторінці лота підсвічуємо ще й тло */
.ua-single .auction-time-countdown.is-urgent{background:#FBE9E7;border-radius:10px}

/* ====================================================================
   МОЯ КОЛЕКЦІЯ: ПЛАТНИЙ ДОСТУП
   Смуга стану, тарифи, закритий розділ.
   ==================================================================== */

/* Смуга стану. Три відтінки одного компонента: спокійний — пробний
   період, теплий — залишилось кілька днів, гарячий — доба до закриття.
   Замовник просив саме «червону полоску в самому розділі». */
.ua-col-bar-warn{display:block;padding:12px 16px;border-radius:12px;
  font-size:14px;line-height:1.45;margin:0 0 16px;
  background:#FFF4E5;border:1px solid #F5C77E;color:#7A4A00}
.ua-col-bar-warn.is-hot{background:#FBE9E7;border-color:#F0B3AC;color:#8C2C1E}
.ua-col-bar-warn.is-calm{background:var(--beige);border-color:#E4DACB;color:var(--text)}
.ua-col-bar-warn strong{font-weight:700}

/* Тарифи. Однакові картки в ряд; найдовший виділяємо рамкою, а не
   написом «популярний» — вигоду сайт рахує сам і пише цифрою. */
.ua-col-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;margin-top:12px}
.ua-col-plan{display:flex;flex-direction:column;gap:4px;text-align:center;
  padding:16px 14px;border:1px solid var(--line);border-radius:14px;background:#fff}
.ua-col-plan.is-best{border-color:var(--brand-brown);box-shadow:0 0 0 1px var(--brand-brown) inset}
.ua-col-plan__label{font-size:13px;color:var(--text-muted)}
.ua-col-plan__price{font-size:22px;font-weight:700;color:var(--text);line-height:1.2}
.ua-col-plan__note{font-size:12px;color:var(--success,#2E7D32);min-height:16px}
.ua-col-plan .btn{margin-top:8px;width:100%}

/* Закритий розділ. Той самий вигляд, що й у порожніх станів: людина не
   зробила нічого поганого, і сторінка не має виглядати як помилка. */
.ua-col-locked{max-width:640px;margin:24px auto;text-align:center}
.ua-col-locked svg{width:104px;height:84px;color:var(--line);margin-bottom:8px}
.ua-col-locked h2{font-size:20px;font-weight:700;margin:0 0 8px}
.ua-col-locked .ua-col-plans{text-align:center}

/* Ціни в кабінеті — ті самі поля, що й у нагадуваннях, тільки ширші:
   «12 000» у 88 пікселів не влазить. */
.ua-col-prices{display:flex;flex-wrap:wrap;gap:14px 24px}
.ua-col-prices .ua-rem-field .form-control{width:120px}

/* ====================================================================
   РЕЖИМ КЕРУВАННЯ САЙТОМ
   Замовник глянув на кабінет і сказав дві речі одразу: «незрозуміло, що
   це адмінпанель» і «одразу видно, що я купив і що вподобав». Обидва
   зауваження про одне — над адмінкою висіла звичайна магазинна шапка з
   особистими покупками того, хто зайшов.
   Тому в цьому режимі: замість гаманця — позначка, замість кошика й
   обраного — вихід у магазин, пошуку по товарах немає взагалі.
   ==================================================================== */

/* Позначка на місці гаманця. Не декор: це єдине, що з першого погляду
   каже, де ти опинився. */
.ua-admin-flag{display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:50rem;
  background:var(--brand-brown);color:#fff;
  font-size:13px;font-weight:700;letter-spacing:.2px;white-space:nowrap}
.ua-admin-flag svg{flex:0 0 auto}

/* Вихід назад у магазин — на місці, де в магазині стоїть кошик. */
.ua-admin-exit{display:inline-flex;align-items:center;gap:7px;
  padding:9px 16px;border-radius:50rem;border:1px solid var(--line);
  background:#fff;color:var(--text);text-decoration:none;
  font-size:14px;font-weight:600;white-space:nowrap}
.ua-admin-exit:hover{border-color:var(--brand-brown);color:var(--brand-brown);
  background:var(--beige)}

/* Смуга кольору бренду вздовж усієї шапки: помітно навіть боковим зором,
   і не залежить від того, чи прочитали напис. */
body.ua-admin-area .ua-header{border-top:3px solid var(--brand-brown)}

/* Пошуку немає — прибираємо й порожнє місце під ним, інакше шапка
   лишається високою, а під нею біла пляма. */
body.ua-admin-area .ua-hdr-row{padding-bottom:10px}

@media (max-width:575.98px){
  .ua-admin-flag{padding:7px 11px;font-size:12px}
  .ua-admin-flag svg{display:none}
  .ua-admin-exit{padding:8px 12px;font-size:13px}
}

/* ====================================================================
   АДМІНКА НА ТЕЛЕФОНІ
   Замовник сказав прямо: керувати сайтом він хоче з телефона, і саме
   виставляти лоти. А таблиці на вузькому екрані стискались до того, що
   назва лота розсипалась по одній літері в рядок: «лот вида лено».
   Тому на телефоні таблиці перестають бути таблицями: кожен рядок стає
   карткою, а заголовок стовпця переїжджає до самої клітинки.
   Розмітку не переставляємо — це той самий <table>, лише з підписами
   у data-label. Якщо стилі не завантажаться, лишиться звичайна таблиця.
   ==================================================================== */

@media (max-width:767.98px){

  /* Прокрутка більше не потрібна: картки самі вкладаються в ширину. */
  .ua-admin .table-responsive{overflow:visible}
  .ua-admin .ua-admin-table{display:block;font-size:14px}
  .ua-admin .ua-admin-table thead{display:none}
  .ua-admin .ua-admin-table tbody{display:block}

  .ua-admin .ua-admin-table tbody tr{
    display:block;background:#fff;border:1px solid var(--border);
    border-radius:14px;padding:12px 14px;margin-bottom:8px}
  .ua-admin .ua-admin-table tbody tr:hover{border-color:var(--brand-brown)}

  /* Звичайна клітинка: підпис ліворуч, значення праворуч — як у списку
     налаштувань, до якого людина вже звикла на цьому ж сайті. */
  .ua-admin .ua-admin-table td{
    display:flex;align-items:baseline;justify-content:space-between;gap:14px;
    width:auto;border:0 !important;padding:3px 0 !important;
    text-align:left !important}
  .ua-admin .ua-admin-table td::before{
    content:attr(data-label);flex:0 0 auto;
    color:var(--text-muted);font-size:12px;font-weight:600;
    text-transform:uppercase;letter-spacing:.3px}
  .ua-admin .ua-admin-table td:empty{display:none}

  /* Головна клітинка — назва лота, номер замовлення, ім'я. Вона в рядку
     найважливіша, тож іде окремим заголовком на всю ширину, без підпису. */
  .ua-admin .ua-admin-table td[data-cell="main"]{
    display:block;padding:0 0 7px !important;margin-bottom:5px;
    border-bottom:1px solid var(--line);font-size:15px;font-weight:600;
    line-height:1.3}
  .ua-admin .ua-admin-table td[data-cell="main"]::before{display:none}
  .ua-admin .ua-admin-table td[data-cell="main"] .ua-muted{font-weight:400}

  /* Дії — окремим рядом кнопок унизу картки, на всю ширину. */
  .ua-admin .ua-admin-table td[data-cell="act"]{
    display:flex;flex-wrap:wrap;gap:0 18px;
    padding:8px 0 0 !important;margin-top:5px;
    border-top:1px solid var(--line) !important}
  /* Підпис «Дії» на картці зайвий: під рискою внизу й так стоять самі
     дії. Порожній рядок над ними коштував би 24 пікселі на кожній
     картці — на двадцяти лотах це майже цілий екран гортання. */
  .ua-admin .ua-admin-table td[data-cell="act"]::before{display:none}

  /* Числа вирівнювались праворуч у таблиці — у картці це вже зайве:
     вони й так стоять праворуч від підпису. */
  .ua-admin .ua-admin-table td.text-end{text-align:right}
  .ua-admin .ua-admin-table .ua-nowrap{white-space:normal}

  /* Bootstrap малює лінії таблиці не рамкою, а внутрішньою тінню, тому
     border:0 їх не прибирає. У картці кожна така лінія ділить поле від
     поля — виходить сітка там, де потрібен простий список. */
  .ua-admin .ua-admin-table > :not(caption) > * > *{box-shadow:none}

  /* Перемикачі розділів: гортаються вбік, край підказує, що є ще. */
  .ua-admin-tabs{margin:0 -12px 14px;padding:2px 12px 14px;
    scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  .ua-admin-tabs::-webkit-scrollbar{display:none}
  .ua-admin-tab{scroll-snap-align:start;padding:9px 15px;font-size:14px}

  /* Пошук і фільтри — на всю ширину, а не втиснуті в рядок. */
  .ua-admin-filters{gap:10px}
  .ua-admin-search{min-width:0;width:100%}
  .ua-admin-search .form-control{flex:1 1 auto;min-width:0}
  .ua-admin-chips{width:100%;overflow-x:auto;flex-wrap:nowrap;
    padding-bottom:4px;scrollbar-width:none}
  .ua-admin-chips::-webkit-scrollbar{display:none}
  .ua-admin-chips .ua-chip{flex:0 0 auto}

  /* Плитки зі зведенням: дві в ряд, але без зайвого повітря. */
  .ua-admin .ua-tiles{grid-template-columns:1fr 1fr;gap:10px}
  .ua-admin .ua-tile{padding:14px 12px}
  .ua-admin .ua-tile__value{font-size:24px}
  .ua-admin .ua-tile__label{font-size:12px;line-height:1.25}

  /* Картки й форми розділів. */
  .ua-admin-card{padding:14px}
  .ua-admin-form .ua-rem-field,
  .ua-col-prices .ua-rem-field{width:100%;justify-content:space-between}
  .ua-col-prices{gap:10px}
  .ua-col-prices .ua-rem-field .form-control{width:110px}

  /* Заголовок розділу не має з'їдати перший екран. */
  .ua-admin h2{font-size:19px;margin-top:18px !important}
  .ua-admin-pages{gap:8px}
  .ua-admin-pages .ua-chip{min-width:40px;text-align:center;padding:9px 12px}
}

/* Підпис і значення лишаються в одному рядку навіть на 360 пікселях.
   Спроба ставити підпис над значенням зробила картку вчетверо вищою —
   на екран влазив один лот замість трьох, і гортати список ставало
   гірше, ніж було з таблицею. Довгий текст просто переноситься. */
@media (max-width:767.98px){
  .ua-admin .ua-admin-table td{min-width:0}
  .ua-admin .ua-admin-table td::before{max-width:45%}
}

/* ====================================================================
   ФОРМА ЛОТА НА ТЕЛЕФОНІ
   Замовник хоче виставляти лоти з телефона. Заважали не кроки, а
   розміри: підписи полів зроблені заголовками <h4> і на 390 пікселях
   читались як заголовки розділів — «Артикул» заввишки з кнопку. Разом
   із поясненням під полем одне поле займало пів екрана.
   ==================================================================== */
@media (max-width:767.98px){
  #form_add-auction h3,
  #form_add-auction h4,
  #form_add-auction h5{
    font-size:15px;font-weight:600;line-height:1.35;margin-bottom:6px}
  #form_add-auction .form-text{font-size:12.5px;line-height:1.4;margin-top:4px}
  #form_add-auction .form-control,
  #form_add-auction .form-select,
  #form_add-auction select{width:100%;min-height:46px}
  /* Каскад категорій малює свої списки вужчими за поле — на телефоні
     через це «Нічого не вибрано» обрізалось посеред слова. */
  #form_add-auction .dropdown,
  #form_add-auction .dropdown-toggle,
  #form_add-auction .btn-group{width:100%}
  #form_add-auction .dropdown-toggle{text-align:left;min-height:46px}
  #form_add-auction .row > [class*="col-"]{margin-bottom:2px}
  /* Заголовок сторінки з'їдав перший екран разом із кроками. */
  .page-template-page-add-auction h1,
  .page-template-page-edit-auction h1{font-size:22px;margin-bottom:12px}
}

/* ====================================================================
   «ВИСТАВИТИ ЛОТ» НА ТЕЛЕФОНІ
   Головна дія замовника, і до цього її на телефоні не було ніде: бічне
   меню кабінету ховається на всіх сторінках, у нижньому меню пʼять
   зафіксованих пунктів, а єдине посилання на форму стояло в порожньому
   стані «Мої продажі» — тобто зникало, щойно зʼявлявся перший лот.
   ==================================================================== */

/* На комп'ютері не показуємо: там кнопка стоїть угорі бічного меню. */
.ua-add-lot{display:none}

@media (max-width:991.98px){
  .ua-add-lot{
    position:fixed;left:50%;transform:translateX(-50%);
    /* Над нижнім меню, а не поверх нього. */
    bottom:calc(64px + env(safe-area-inset-bottom, 0px) + 12px);
    z-index:1035;
    display:inline-flex;align-items:center;gap:9px;
    min-height:48px;padding:0 22px;border-radius:50rem;
    background:var(--brand-brown);color:#fff;text-decoration:none;
    font-size:15px;font-weight:700;white-space:nowrap;
    box-shadow:0 6px 20px rgba(0,0,0,.22)}
  .ua-add-lot:hover,
  .ua-add-lot:focus{color:#fff;background:var(--brand-brown-dark, #6B4A2B)}
  .ua-add-lot:active{transform:translateX(-50%) scale(.97)}

  /* Щоб кнопка не закривала останній рядок списку. */
  body:has(.ua-add-lot){padding-bottom:132px}
}

/* Форма лота має власну смугу знизу — там ця кнопка була б другою
   такою ж і плуталася б із «Далі». Сховати мало: її там і не виводимо. */
body.has-ua-form-bar .ua-add-lot{display:none}

/* Порожній слот на місці кошика в шапці адміністрування: тримає ширину,
   щоб заголовок лишався точно по центру, як і на решті сторінок. */
.ua-hdr-slot{display:inline-block;width:40px;height:40px;flex:0 0 auto}