/* =========================================================
   Vet House — order.css
   Избранное, корзина, оформление заказа, «Заказ оформлен».
   Карточки, кнопки, поля, опции, количество и флажок — из components.css и base.css.
   ========================================================= */
.head-actions{display:flex;flex-wrap:wrap;gap:10px}
.head-actions .btn{height:44px;padding:0 18px;font-size:14px}
.muted{color:var(--muted)}

/* ---------- раскладка: список + итог ---------- */
.order-layout{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px;align-items:start}
.summary{position:sticky;top:96px}
.panel{padding:24px;border-radius:24px;background:var(--mist)}
.panel > h2{font-size:20px;font-weight:700;letter-spacing:-.01em;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.summary .panel{display:flex;flex-direction:column;gap:14px}
.summary .panel > h2{margin-bottom:0}
.sum-rows{display:flex;flex-direction:column;gap:10px;padding:14px 0;border-top:1px solid rgba(31,35,39,.08);border-bottom:1px solid rgba(31,35,39,.08)}
.sum-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:15px}
.sum-row .price{font-size:16px}
.sum-row .muted{font-size:14px;text-align:right}
.sum-total{display:flex;justify-content:space-between;align-items:baseline}
.sum-total span{font-size:16px;font-weight:600}
.sum-total .price{font-size:26px}

/* ---------- строка корзины ---------- */
.cart-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.cart-row{display:grid;grid-template-columns:96px minmax(0,1fr) auto 120px;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.cr-ph{width:96px;height:96px;border-radius:16px}
.cr-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.cr-name{font-size:17px;font-weight:600;line-height:1.3}
.cr-name:hover{color:var(--teal)}
.cr-meta{font-size:13.5px;color:var(--muted)}
.cr-actions{display:flex;gap:16px;margin-top:8px}
.cr-link{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--muted)}
.cr-link:hover{color:var(--ink)}
.cr-link[aria-pressed="true"]{color:var(--coral-ink)}
.cr-link[aria-pressed="true"] .i{font-weight:900}
.cart-row .qty{height:44px}
.cart-row .qty button{width:40px}
.cr-price{text-align:right;display:flex;flex-direction:column;gap:2px}
.cr-price .price{font-size:19px}
.cr-price small{font-size:12.5px;color:var(--muted)}
.cart-list + .summary{align-self:start}

/* ---------- пустое состояние ---------- */
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:56px 24px;border-radius:28px;background:var(--mist)}
.empty-ic{width:72px;height:72px;border-radius:50%;background:var(--paper);color:var(--teal);display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:6px}
.empty h2{font-size:24px;font-weight:700;letter-spacing:-.015em}
.empty p{color:var(--ink-2);max-width:46ch;line-height:1.55}
.empty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px}

/* ---------- оформление ---------- */
.co-steps{display:flex;flex-direction:column;gap:16px}
.co-n{width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.co-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 14px}
.co-wide{grid-column:1/-1}
.co-step .field{margin-bottom:10px}
.co-step .field textarea{background:var(--paper)}
.co-box{margin-top:18px}
.co-note{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:13.5px;color:var(--muted);line-height:1.5}
.co-note .i{margin-top:3px}
.pickup{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:16px;background:var(--paper)}
.pickup .info-ic{margin:0;background:var(--teal-tint)}
.pickup b{display:block;font-size:16px;margin-bottom:4px}
.pickup p{font-size:14px;color:var(--ink-2)}
.f-err{display:none;font-style:normal;font-size:12.5px;color:var(--coral-ink);margin-top:5px}
.is-invalid .f-err,.f-err.is-on{display:block}
.is-invalid input{border-color:#E8836C}
.is-invalid input:focus{box-shadow:0 0 0 4px rgba(242,90,60,.15);border-color:var(--coral-deep)}
.co-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;max-height:300px;overflow:auto}
.co-items li{display:flex;align-items:center;gap:10px;font-size:14px}
.co-ph{width:36px;height:36px;border-radius:10px;flex-shrink:0}
.co-nm{flex:1;min-width:0;line-height:1.3}
a.co-nm:hover{color:var(--teal)}
.co-q{color:var(--muted);white-space:nowrap}
.co-edit{font-size:14px;align-self:flex-start}
.co-agree{font-size:13.5px;align-items:flex-start;line-height:1.45;min-height:0}
.co-agree input{margin-top:1px}
.co-agree a{text-decoration:underline}
.co-agree-err{margin-top:-8px}
.summary .co-note{margin-top:0}

/* ---------- заказ оформлен ---------- */
.done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:40px 0 48px}
.done-ic{width:88px;height:88px;border-radius:50%;background:var(--teal);color:#fff;font-size:34px;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 12px var(--teal-tint);margin-bottom:12px}
.done h1{font-size:40px;line-height:1.1;font-weight:700;letter-spacing:-.025em}
.done-lead{font-size:17px;color:var(--ink-2);max-width:58ch;line-height:1.55}
.done-lead b{color:var(--ink)}
.done-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px;align-items:start}
.done-grid .specs{border-top:0;margin-bottom:14px}
.done-grid .specs div{grid-template-columns:minmax(0,150px) minmax(0,1fr);border-color:rgba(31,35,39,.08)}

@media (max-width:1199px){
  .order-layout{grid-template-columns:minmax(0,1fr) 320px;gap:20px}
  .cart-row{grid-template-columns:80px minmax(0,1fr) auto;gap:14px}
  .cr-ph{width:80px;height:80px}
  .cr-price{grid-column:2/4;text-align:left;flex-direction:row;align-items:baseline;gap:8px}
}
@media (max-width:1023px){
  .page-head{align-items:flex-start}
  .head-actions{width:100%}
  .head-actions .btn{flex:1}
  .order-layout{grid-template-columns:1fr}
  .summary{position:static}
  .panel{padding:18px;border-radius:20px}
  .cart-row{grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:start}
  .cr-ph{width:72px;height:72px;border-radius:14px}
  .cr-name{font-size:15.5px}
  .cart-row .qty{grid-column:2;justify-self:start;height:40px}
  .cr-price{grid-column:2;margin-top:-4px}
  .co-grid{grid-template-columns:1fr}
  .done{padding:24px 0 32px}
  .done-ic{width:72px;height:72px;font-size:28px}
  .done h1{font-size:28px}
  .done-lead{font-size:15.5px}
  .done-grid{grid-template-columns:1fr}
  .done-grid .specs div{grid-template-columns:1fr}
  .empty{padding:40px 18px;border-radius:22px}
  .empty-actions .btn{flex:1}
}
@media (min-width:1024px){ .js-cart-bar{display:none !important} }