/* ============================================================================
   Sefirmarket storefront — "Boutique" modern refinement layer
   sefirmarket.css DAN KEYIN yuklanadi (uni bosib o'tadi).
   Navy (#072134) ink + antique-gold accent + Playfair Display serif.
   Editorial, premium parfyum uyi hissi. Layoutga tegmaydi — faqat elevate.
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&family=Manrope:wght@400;500;600;700&display=swap');

:root {
  --sm-gold: #B0872E;
  --sm-gold-bright: #C9A227;
  --sm-gold-tint: #F7F0DD;
  --sm-gold-line: #E4D3A6;
  --sm-cream: #FBF8F2;
  --sm-serif: "Playfair Display", Georgia, serif;
}

body { font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }

/* ---------- Display typografiya (serif) ---------- */
#content h1,
#content > h2,
.sm-cat-title,
.sm-thumb-card .sm-thumb-name,
.sm-thumb-card .sm-thumb-price {
  font-family: var(--sm-serif);
}

/* ---------- Bo'lim sarlavhasi ("Kategoriyalar") ---------- */
.sm-cat-title {
  font-size: clamp(1.7rem, 3vw, 2.15rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em;
  color: var(--sm-ink, #072134);
  position: relative;
  padding-bottom: 16px;
}
.sm-cat-head { justify-content: center; position: relative; }
/* Oltin bezakli ajratuvchi (banner'dagi flourish echo) */
.sm-cat-title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 74px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--sm-gold), transparent);
}

/* ---------- Kategoriya doiralari ---------- */
.sm-cat-circle {
  border: 1px solid var(--sm-gold-line) !important;
  box-shadow: 0 6px 18px -8px rgba(7, 33, 52, 0.18);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.sm-cat-link:hover .sm-cat-circle {
  transform: translateY(-4px) scale(1.03);
  border-color: var(--sm-gold) !important;
  box-shadow: 0 14px 30px -10px rgba(176, 135, 46, 0.4);
}
.sm-cat-label {
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--sm-ink, #072134);
}
.sm-cat-circle--initial {
  background: linear-gradient(160deg, #0d3550, #072134) !important;
  color: var(--sm-gold-bright) !important;
  font-family: var(--sm-serif);
}

/* ---------- Mahsulot kartasi ---------- */
.product-thumb.sm-thumb-card,
.sm-thumb-card {
  border: 1px solid #ECE7DC !important;
  border-radius: 18px;
  box-shadow: 0 2px 4px rgba(7, 33, 52, 0.03), 0 14px 30px -20px rgba(7, 33, 52, 0.22);
  padding: 10px;
}
.product-thumb.sm-thumb-card:hover,
.sm-thumb-card:hover {
  border-color: var(--sm-gold-line) !important;
  box-shadow: 0 10px 34px -12px rgba(176, 135, 46, 0.28), 0 4px 10px rgba(7, 33, 52, 0.05);
  transform: translateY(-4px);
}
.sm-thumb-card .sm-thumb-image { border-radius: 13px; background: #FBFAF7; }

/* Sevimlilar yuragi — oltin hover */
.sm-thumb-card .sm-thumb-heart:hover,
.sm-thumb-card .sm-thumb-heart:focus-visible {
  background: linear-gradient(160deg, var(--sm-gold-bright), var(--sm-gold)) !important;
  color: #2a1f05 !important;
  box-shadow: 0 6px 16px -4px rgba(176, 135, 46, 0.5) !important;
}
.sm-thumb-card .sm-thumb-heart.sm-wished {
  background: linear-gradient(160deg, var(--sm-gold-bright), var(--sm-gold)) !important;
  color: #2a1f05 !important;
}

/* Nom — serif, elegant */
.sm-thumb-card .sm-thumb-name {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.005em;
}
.sm-thumb-card .sm-thumb-name:hover { color: var(--sm-gold) !important; }

/* Narx — serif, kuchli */
.sm-thumb-card .sm-thumb-price {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Reyting — boyroq oltin */
.sm-thumb-card .sm-thumb-rating { color: var(--sm-gold-bright); font-size: 14px; }

/* "Savatga qo'shish" — premium navy, oltin hover */
.sm-thumb-card .sm-thumb-cart-link {
  background: var(--sm-ink, #072134) !important;
  color: #fff !important;
  border: 1.5px solid var(--sm-ink, #072134) !important;
  border-radius: 12px;
  padding: 12px 16px;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.sm-thumb-card .sm-thumb-cart-link:hover,
.sm-thumb-card .sm-thumb-cart-link:focus-visible {
  background: linear-gradient(160deg, var(--sm-gold-bright), var(--sm-gold)) !important;
  color: #2a1f05 !important;
  border-color: var(--sm-gold) !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -8px rgba(176, 135, 46, 0.5);
}

/* ---------- Umumiy tugmalar (navy CTA) ---------- */
.btn-primary, .sm-prod-buy {
  letter-spacing: 0.01em;
}
.sm-prod-buy:hover {
  box-shadow: 0 10px 24px -10px rgba(176, 135, 46, 0.45);
}

/* ---------- Product sahifasi sarlavhasi ---------- */
.sm-prod-title, .sm-prod-name, h1.sm-prod-title {
  font-family: var(--sm-serif);
  letter-spacing: -0.01em;
}

/* ---------- Sahifa sarlavhalari (account, cart va h.k.) ---------- */
#content h1 { letter-spacing: -0.01em; }

/* ---------- Kirish/reyting yulduzlari umumiy ---------- */
.rating .fa-star, .fa-solid.fa-star { color: var(--sm-gold-bright); }

/* ============================================================================
   Phase B — Auth (login/register) + Account premium redesign
   ============================================================================ */

/* ---- Login / Register: markazlashgan premium karta ---- */
#account-login .row,
#account-register .row { justify-content: center; }

#account-login #content,
#account-register #content {
  max-width: 540px;
  margin: 10px auto 40px;
  background: #fff;
  border: 1px solid #ECE7DC;
  border-radius: 22px;
  box-shadow: 0 2px 6px rgba(7,33,52,.04), 0 28px 60px -30px rgba(7,33,52,.28);
  padding: 42px 40px;
}

/* O'ng account-nav ustunini auth sahifalarда yashiramiz (ortiqcha) */
#account-login #column-right,
#account-register #column-right,
#account-login .col-lg-3:last-child,
#account-register .col-lg-3:last-child { display: none; }

#account-login #content > h1,
#account-register #content > h1 {
  font-family: var(--sm-serif);
  text-align: center;
  font-size: 2rem;
  margin-bottom: 6px;
}
#account-login #content > p,
#account-register #content > p { text-align: center; color: var(--sm-muted); margin-bottom: 26px; }
#account-login #content > p a,
#account-register #content > p a { color: var(--sm-gold); font-weight: 600; text-decoration: none; }

/* Fieldset / legend */
#account-login fieldset,
#account-register fieldset { border: 0; margin: 0; padding: 0; }
#account-login legend,
#account-register legend {
  font-family: var(--sm-serif);
  font-size: 1.15rem;
  border: 0;
  color: var(--sm-ink, #072134);
  margin-bottom: 4px;
}
#account-login .text-muted,
#account-register .text-muted { margin-bottom: 18px; display: block; }

/* Maydonlarni ustma-ust (label tepada) — Bootstrap grid'ni bekor qilamiz */
#account-login .row.mb-3,
#account-register .row.mb-3 { display: block; margin-left: 0; margin-right: 0; }
#account-login .row.mb-3 > [class*="col"],
#account-register .row.mb-3 > [class*="col"] { width: 100%; max-width: 100%; flex: 0 0 100%; padding: 0; }
#account-login .col-form-label,
#account-register .col-form-label {
  text-align: left !important;
  font-weight: 600;
  padding: 0 0 7px;
  color: var(--sm-ink, #072134);
}

/* Inputlar */
#account-login .form-control,
#account-register .form-control {
  border: 1px solid #DED8CD;
  border-radius: 12px;
  padding: .8rem 1rem;
  font-size: 1rem;
}
#account-login .form-control:focus,
#account-register .form-control:focus {
  border-color: var(--sm-gold);
  box-shadow: 0 0 0 3px rgba(176,135,46,.16);
}
#account-login #input-code,
#account-register #input-code { letter-spacing: .5em; text-align: center; font-size: 1.3rem; font-weight: 600; }

/* Tugmalar */
#account-login .btn-primary,
#account-register .btn-primary {
  width: 100%;
  border-radius: 12px;
  padding: .85rem 1.4rem;
  font-weight: 600;
  font-size: 1rem;
}
#account-login .text-end,
#account-register .text-end { text-align: stretch !important; }
#account-login #otp-form-code .d-flex,
#account-register #otp-form-code .d-flex { flex-direction: column-reverse; gap: 10px; align-items: stretch !important; }
#account-login #button-resend,
#account-register #button-resend { border-radius: 12px; }
#account-login #button-change,
#account-register #button-change { color: var(--sm-gold); text-align: center; }

/* ---- Account dashboard ---- */
#account-account #content > h2,
#account-account #content h2 {
  font-family: var(--sm-serif);
  font-size: 1.5rem;
  color: var(--sm-ink, #072134);
  margin: 28px 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ECE7DC;
}
#account-account #content > h2:first-child { margin-top: 8px; }
#account-account .list-unstyled { margin-bottom: 26px; }
#account-account .list-unstyled li { margin-bottom: 2px; }
#account-account .list-unstyled a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--sm-ink, #072134);
  text-decoration: none;
  padding: 9px 12px;
  border-radius: 10px;
  transition: background .15s, color .15s;
}
#account-account .list-unstyled a::before {
  content: "\2192";
  color: var(--sm-gold);
  font-weight: 700;
}
#account-account .list-unstyled a:hover { background: var(--sm-gold-tint); color: var(--sm-gold); }

/* ============================================================================
   Phase D — Savat: dropdown (#header-cart) + cart sahifasi (#checkout-cart)
   ============================================================================ */

/* ---- Header cart dropdown ---- */
#header-cart .dropdown-menu {
  min-width: 400px;
  border: 1px solid #ECE7DC;
  border-radius: 18px;
  box-shadow: 0 24px 56px -22px rgba(7,33,52,.4);
  padding: 14px !important;
}
#header-cart .dropdown-menu .table { margin-bottom: 10px; }
#header-cart .dropdown-menu .table.table-striped > tbody > tr,
#header-cart .dropdown-menu .table.table-striped > tbody > tr > td { background: transparent !important; }
#header-cart .dropdown-menu td { vertical-align: middle; border: 0; border-bottom: 1px solid #F3F0EA; padding: 9px 6px; }
#header-cart .dropdown-menu img.img-thumbnail {
  width: 52px; height: 52px; object-fit: cover; border-radius: 10px;
  border: 1px solid #ECE7DC; padding: 0; background: #FBFAF7;
}
#header-cart .dropdown-menu a { color: var(--sm-ink, #072134); text-decoration: none; font-weight: 600; }
#header-cart .dropdown-menu a:hover { color: var(--sm-gold); }
#header-cart .dropdown-menu small { color: var(--sm-muted); }
#header-cart .dropdown-menu .btn-danger {
  background: #FBEBEA; color: #c0392b; border: 0; padding: 6px 9px; border-radius: 9px;
}
#header-cart .dropdown-menu .btn-danger:hover { background: #c0392b; color: #fff; }
#header-cart .dropdown-menu .table-bordered,
#header-cart .dropdown-menu .table-bordered td { border: 0 !important; }
#header-cart .dropdown-menu .table-sm td { padding: 3px 6px; }
#header-cart .dropdown-menu .table-sm tr:last-child td { font-family: var(--sm-serif); font-size: 1.05rem; color: var(--sm-ink, #072134); }
#header-cart .dropdown-menu p.text-end { display: flex; gap: 10px; margin: 8px 0 2px; }
#header-cart .dropdown-menu p.text-end a {
  flex: 1; text-align: center; padding: 11px 12px; border-radius: 11px; font-size: .9rem;
}
#header-cart .dropdown-menu p.text-end a:first-child { background: #fff; border: 1.5px solid #DED8CD; color: var(--sm-ink, #072134); }
#header-cart .dropdown-menu p.text-end a:last-child { background: var(--sm-ink, #072134); color: #fff; }
#header-cart .dropdown-menu p.text-end a:last-child:hover { background: #0d3550; }
#header-cart .dropdown-menu p.text-end a i { margin-right: 5px; }
#header-cart .dropdown-menu li.text-center { color: var(--sm-muted); font-size: .95rem; }

/* ---- Cart sahifasi ---- */
#checkout-cart #shopping-cart .table { border: 0; margin-bottom: 0; }
#checkout-cart #shopping-cart .table thead th {
  background: #FBFAF7; text-transform: uppercase; font-size: .72rem; letter-spacing: .05em;
  font-weight: 700; color: var(--sm-muted); border-bottom: 1px solid #ECE7DC; padding: 12px;
}
#checkout-cart #shopping-cart .table td { vertical-align: middle; border-color: #F1EEE7; padding: 14px 12px; }
#checkout-cart #shopping-cart .table img,
#checkout-cart #shopping-cart img.img-thumbnail {
  width: 66px; height: 66px; object-fit: cover; border-radius: 12px; border: 1px solid #ECE7DC; padding: 0; background: #FBFAF7;
}
#checkout-cart #shopping-cart a { color: var(--sm-ink, #072134); font-weight: 600; text-decoration: none; }
#checkout-cart #shopping-cart a:hover { color: var(--sm-gold); }
#checkout-cart #shopping-cart .table tfoot td,
#checkout-cart #shopping-cart .table tr:has(strong) td { font-weight: 600; }
#checkout-cart #shopping-cart .input-group { flex-wrap: nowrap; width: auto; gap: 6px; }
#checkout-cart #shopping-cart .form-control { max-width: 62px; border-radius: 10px; border-color: #DED8CD; text-align: center; }
#checkout-cart #shopping-cart .btn { border-radius: 10px !important; }
#checkout-cart #shopping-cart .btn-danger { background: #FBEBEA !important; color: #c0392b !important; border: 0 !important; }
#checkout-cart #shopping-cart .btn-danger:hover { background: #c0392b !important; color: #fff !important; }
#checkout-cart #shopping-cart .btn-primary { background: var(--sm-ink, #072134); border-color: var(--sm-ink, #072134); }

/* Totalar — oxirgi (Total) ni ajratib ko'rsatamiz */
#checkout-cart #shopping-cart tfoot tr:last-child td,
#checkout-cart #shopping-cart .table:last-of-type tr:last-child td {
  font-family: var(--sm-serif); font-size: 1.25rem; color: var(--sm-ink, #072134);
}

/* Accordion (Yetkazib berish / kupon / sertifikat) */
#checkout-cart .accordion-item { border: 1px solid #ECE7DC; border-radius: 14px !important; margin-bottom: 12px; overflow: hidden; }
#checkout-cart .accordion-button { font-weight: 600; color: var(--sm-ink, #072134); }
#checkout-cart .accordion-button:not(.collapsed) { background: var(--sm-gold-tint); color: var(--sm-ink, #072134); box-shadow: none; }
#checkout-cart .accordion-button:focus { box-shadow: 0 0 0 3px rgba(176,135,46,.16); }

/* Pastdagi tugmalar */
#checkout-cart .btn-primary {
  background: var(--sm-ink, #072134); border-color: var(--sm-ink, #072134);
  border-radius: 12px; padding: .85rem 2rem; font-weight: 600;
}
#checkout-cart .btn-primary:hover { box-shadow: 0 10px 24px -10px rgba(176,135,46,.5); }
#checkout-cart .btn-light { border-radius: 12px; border: 1.5px solid #DED8CD; padding: .85rem 1.6rem; font-weight: 600; }