/* CyberTienda - Modern UI layer
   Capa visual no invasiva: mantiene Bootstrap y la funcionalidad PHP existente. */
:root {
  --ct-radius-sm: 10px;
  --ct-radius: 16px;
  --ct-radius-lg: 22px;
  --ct-shadow-sm: 0 4px 18px rgba(17, 24, 39, .06);
  --ct-shadow: 0 14px 38px rgba(17, 24, 39, .10);
  --ct-border: rgba(17, 24, 39, .10);
  --ct-muted: #667085;
  --ct-surface: #ffffff;
  --ct-soft: #f7f8fa;
  --ct-ink: #101828;
  --ct-primary: #111827;
  --ct-primary-hover: #000000;
  --ct-success: #16a34a;
  --ct-danger: #dc2626;
  --ct-focus: 0 0 0 4px rgba(59, 130, 246, .16);
}

html { scroll-behavior: smooth; }
body {
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background-image: linear-gradient(180deg, rgba(255,255,255,.18), rgba(248,250,252,.25));
}
body, button, input, select, textarea { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; }
a { transition: color .2s ease, opacity .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease; }
img { max-width: 100%; }

/* Store header */
.store-shell { position: relative; z-index: 1030; }
.top-bar.store-topbar {
  min-height: 42px;
  padding: 7px clamp(14px, 3vw, 36px) !important;
  gap: 16px;
  font-size: .88rem;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.store-topbar__brand { display: flex; align-items: center; gap: 8px; font-weight: 700; min-width: 0; }
.store-topbar__brand span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.store-topbar__links { display: flex; align-items: center; justify-content: flex-end; gap: 4px; flex-wrap: wrap; }
.store-topbar__links a,
.top-bar.store-topbar a { margin: 0 !important; padding: 5px 8px; border-radius: 8px; font-weight: 600 !important; text-decoration: none !important; opacity: .92; }
.store-topbar__links a:hover { background: rgba(255,255,255,.10); opacity: 1; }
.store-welcome { opacity: .82; margin-right: 4px; }

.header.store-brand-header {
  min-height: 104px;
  padding: 16px clamp(16px,4vw,42px) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.header.store-brand-header::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.03));
}
.store-brand-link { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; }
.header.store-brand-header img { max-width: min(320px, 68vw) !important; max-height: 92px; width: auto; margin: 0 !important; object-fit: contain; filter: drop-shadow(0 5px 12px rgba(0,0,0,.08)); }

.navbar.store-navbar {
  padding: 10px clamp(12px,3vw,34px) !important;
  box-shadow: 0 9px 26px rgba(0,0,0,.09);
  position: sticky;
  top: 0;
  z-index: 1025;
}
.store-navbar .container-fluid { gap: 12px; max-width: 1500px; margin: 0 auto; padding: 0; }
.store-navbar .navbar-collapse { gap: 14px; }
.store-navbar .navbar-nav { align-items: center; gap: 2px; }
.store-navbar .nav-link { padding: 9px 11px !important; border-radius: 10px; font-size: .94rem; font-weight: 650 !important; opacity: .94; }
.store-navbar .nav-link:hover,
.store-navbar .nav-link:focus { background: rgba(255,255,255,.11); opacity: 1; }
.store-navbar .dropdown-menu { border: 1px solid var(--ct-border); border-radius: 14px; padding: 7px; box-shadow: var(--ct-shadow); }
.store-navbar .dropdown-menu .nav-link,
.store-navbar .dropdown-item { color: var(--ct-ink) !important; border-radius: 9px; font-weight: 600 !important; }
.store-navbar .dropdown-menu .nav-link:hover { background: #f2f4f7; }
.store-navbar .navbar-toggler { border: 1px solid rgba(255,255,255,.22); border-radius: 11px; padding: 7px 9px; box-shadow: none !important; }

.store-search { flex: 1 1 340px; max-width: 560px; margin: 0 auto; }
.store-search__group {
  display: flex; align-items: stretch; background: rgba(255,255,255,.98); border-radius: 13px; overflow: hidden;
  border: 1px solid rgba(255,255,255,.30); box-shadow: 0 3px 10px rgba(0,0,0,.08);
}
.store-search__icon { color: #667085; display: flex; align-items: center; padding-left: 14px; }
.store-search input {
  min-width: 0; width: 100%; border: 0 !important; box-shadow: none !important; padding: 10px 10px; background: transparent !important; color: #101828 !important;
}
.store-search input::placeholder { color: #98a2b3; }
.store-search button { border: 0; border-left: 1px solid #eaecf0; border-radius: 0; padding: 0 15px; background: #fff; color: #344054; }
.store-search button:hover { background: #f8fafc; color: #101828; }
.store-actions { display: flex; gap: 8px; align-items: center; margin-left: auto; }
.store-actions .btn { white-space: nowrap; border-radius: 11px !important; min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-weight: 700; box-shadow: none !important; }
.store-actions .store-cart-btn { background: rgba(255,255,255,.13) !important; border: 1px solid rgba(255,255,255,.22) !important; color: inherit !important; }
.store-actions .store-cart-btn:hover { background: rgba(255,255,255,.22) !important; transform: translateY(-1px); }
.store-actions .store-checkout-btn { background: #fff !important; border-color: #fff !important; color: #111827 !important; }
.store-actions .store-checkout-btn:hover { background: #f2f4f7 !important; transform: translateY(-1px); }
.store-actions .cart-badge { top: -7px !important; right: -8px; left: auto !important; transform: none !important; min-width: 23px; height: 23px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px !important; padding: 0 6px !important; font-size: .72rem !important; font-weight: 800; }

/* Catalog */
.store-content { max-width: 1500px; margin-left: auto; margin-right: auto; padding-left: clamp(14px,2.4vw,28px); padding-right: clamp(14px,2.4vw,28px); }
.store-section { margin-bottom: 42px; }
.store-section-title,
.container > h2.text-secondary {
  display: flex; align-items: center; gap: 10px; color: inherit !important; font-size: clamp(1.25rem,2vw,1.65rem); font-weight: 780; letter-spacing: -.025em;
  border: 0 !important; padding: 0 0 13px !important; margin-bottom: 20px !important; position: relative;
}
.store-section-title::after,
.container > h2.text-secondary::after { content:""; position:absolute; left:0; bottom:0; width:52px; height:3px; border-radius:999px; background: currentColor; opacity:.35; }
.product-grid.row { --bs-gutter-x: 1.25rem; --bs-gutter-y: 1.25rem; }
.product-grid > [class*="col-"] { margin-bottom: 0 !important; }

.product-card {
  height: 100%; display: flex; flex-direction: column; background: var(--ct-surface); color: var(--ct-ink);
  border: 1px solid var(--ct-border) !important; border-radius: var(--ct-radius) !important; overflow: hidden;
  box-shadow: var(--ct-shadow-sm) !important; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
  margin-bottom: 0 !important; text-align: left;
}
.product-card:hover { transform: translateY(-5px) !important; box-shadow: var(--ct-shadow) !important; border-color: rgba(17,24,39,.18) !important; }
.product-card__media { display:block; position:relative; aspect-ratio:1/1; overflow:hidden; background:#f2f4f7; }
.product-card__media img { position:absolute; inset:0; width:100% !important; height:100% !important; object-fit:cover; transition:transform .35s ease; }
.product-card:hover .product-card__media img { transform: scale(1.035); }
.product-card__body { padding: 15px 16px 16px; display:flex; flex-direction:column; flex:1; }
.product-card__title { margin:0 0 7px; font-size:1rem; line-height:1.35; font-weight:760; letter-spacing:-.015em; color:var(--ct-ink); }
.product-card__title a { color:inherit; text-decoration:none; }
.product-card__description { min-height: 38px; margin:0 0 12px; color:var(--ct-muted) !important; font-size:.86rem; line-height:1.45; }
.product-card__price { margin:auto 0 13px; font-size:1.22rem; line-height:1; font-weight:820 !important; letter-spacing:-.025em; color:#101828 !important; }
.product-card__form { display:grid !important; grid-template-columns:68px 1fr; gap:8px; align-items:center; }
.product-card__form .form-control { width:100% !important; margin:0 !important; text-align:center; }
.product-card__form .btn { margin:0 !important; white-space:nowrap; }

/* Forms & buttons */
.form-control, .form-select, textarea.form-control {
  min-height: 44px; border: 1px solid #d0d5dd; border-radius: 11px; padding: 10px 12px;
  box-shadow: 0 1px 2px rgba(16,24,40,.02); transition: border-color .18s ease, box-shadow .18s ease;
}
textarea.form-control { min-height: 110px; }
.form-control:focus, .form-select:focus { border-color:#84adff; box-shadow:var(--ct-focus); }
.form-label { color:#344054; font-weight:650; font-size:.91rem; }
.btn { border-radius: 11px; font-weight: 700; padding: .63rem 1rem; transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary, .btn-custom { background:#111827 !important; border-color:#111827 !important; color:#fff !important; }
.btn-primary:hover, .btn-custom:hover { background:#000 !important; border-color:#000 !important; }
.btn-success { background:#15803d; border-color:#15803d; }
.btn-danger { background:#dc2626; border-color:#dc2626; }
.btn-warning { color:#3d2b00; }

/* Cards, tables, alerts */
.card { border:1px solid var(--ct-border); border-radius:var(--ct-radius) !important; box-shadow:var(--ct-shadow-sm); overflow:hidden; }
.card-header { border-bottom:1px solid rgba(255,255,255,.12); padding:14px 18px; }
.card-body { padding:18px; }
.alert { border:0; border-radius:13px; padding:14px 16px; }
.table-responsive, .table { border-radius:14px; }
.table { --bs-table-bg: transparent; vertical-align:middle; }
.table > :not(caption) > * > * { padding:14px 13px; border-bottom-color:#eaecf0; }
.table thead th { font-size:.82rem; text-transform:uppercase; letter-spacing:.035em; color:#667085; background:#f8fafc !important; border-bottom:1px solid #eaecf0; }
.table-dark { --bs-table-bg:#111827; --bs-table-color:#fff; }
.pagination { gap:5px; flex-wrap:wrap; }
.page-link { border:1px solid #e4e7ec; border-radius:9px !important; color:#344054; font-weight:650; }
.page-item.active .page-link { background:#111827; border-color:#111827; }

/* Customer area */
.customer-navbar { background:#111827 !important; padding:9px clamp(12px,3vw,30px) !important; box-shadow:0 8px 22px rgba(17,24,39,.13); }
.customer-navbar .navbar-brand { font-size:.98rem; font-weight:750; }
.customer-navbar .nav-link { border-radius:9px; padding:8px 10px !important; font-weight:600; opacity:.9; }
.customer-navbar .nav-link:hover { background:rgba(255,255,255,.10); opacity:1; }
body > .header:not(.store-brand-header) { padding: 28px 16px !important; background:#f8fafc !important; color:#101828 !important; border-bottom:1px solid #eaecf0; }
body > .header:not(.store-brand-header) h1 { margin:0; font-size:clamp(1.55rem,3vw,2.15rem); font-weight:800; letter-spacing:-.03em; }
body > .container { max-width:1180px; }
body.bg-light { background:#f6f7f9 !important; }
body.bg-light > .container.py-5 { max-width:900px; }
body.bg-light h1 { font-weight:800; letter-spacing:-.03em; color:#101828; }

/* Login / register pages */
body.bg-light .row.justify-content-center.mt-5 { margin-top: clamp(28px,7vh,70px) !important; }
body.bg-light .card.shadow { box-shadow:var(--ct-shadow) !important; }
body.bg-light .card-header.bg-primary { background:#111827 !important; padding:18px; }
body.bg-light .card-header h4 { margin:0; font-weight:780; }

/* Product detail */
.product-detail { max-width:1300px !important; padding-top:44px !important; padding-bottom:64px !important; }
.product-detail__grid { --bs-gutter-x:clamp(24px,5vw,68px); --bs-gutter-y:30px; align-items:flex-start; }
.product-gallery { position:sticky; top:86px; }
.product-main-image { width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--ct-radius-lg); background:#f2f4f7; box-shadow:var(--ct-shadow-sm); border:1px solid var(--ct-border); }
.product-thumbs { gap:10px; padding:4px 2px 8px; scrollbar-width:thin; }
.thumb-image { flex:0 0 78px; width:78px !important; height:78px !important; border:2px solid transparent !important; border-radius:12px !important; object-fit:cover; box-shadow:0 2px 8px rgba(0,0,0,.06); transition:transform .18s ease,border-color .18s ease; }
.thumb-image:hover { transform:translateY(-2px) !important; border-color:#98a2b3 !important; }
.product-detail__info { padding-top:8px; }
.product-detail__info h1 { font-size:clamp(1.8rem,3.6vw,3rem); line-height:1.08; font-weight:830; letter-spacing:-.045em; color:#101828; margin-bottom:18px; }
.product-detail__description { color:#475467; font-size:1rem; line-height:1.7; }
.product-detail__price { color:#101828 !important; font-size:clamp(1.55rem,3vw,2.2rem) !important; font-weight:850 !important; letter-spacing:-.035em; margin:24px 0; }
.product-detail__buy { display:grid !important; grid-template-columns:84px minmax(190px,1fr); max-width:410px; gap:10px; }
.product-detail__buy .form-control { width:100% !important; margin:0 !important; text-align:center; }

/* Search results */
.search-page { max-width:1500px !important; padding:34px clamp(14px,2.4vw,28px) 56px; }
.search-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:24px; }
.search-heading h1 { margin:0; font-size:clamp(1.55rem,3vw,2.25rem); font-weight:820; letter-spacing:-.035em; color:inherit; }
.search-meta { color:var(--ct-muted); margin-top:6px; }
.search-empty { text-align:center; padding:56px 20px; background:#fff; border:1px solid var(--ct-border); border-radius:var(--ct-radius-lg); box-shadow:var(--ct-shadow-sm); color:var(--ct-ink); }
.search-empty i { font-size:2rem; color:#98a2b3; margin-bottom:14px; }
.search-empty h2 { font-size:1.25rem; font-weight:780; }

/* Footer */
.store-footer { margin-top:48px; padding:48px 0 0 !important; }
.store-footer .container { max-width:1350px; }
.store-footer h5 { font-size:.9rem !important; letter-spacing:.06em; font-weight:800; opacity:.86; }
.store-footer p { line-height:1.6; opacity:.86; }
.store-footer__column { padding-right:20px; }
.store-footer__divider { border-color:currentColor !important; opacity:.18; }
.store-footer__bottom { margin-top:24px; padding:22px 0 25px !important; border-top:1px solid rgba(255,255,255,.14) !important; opacity:.88; }
.map-responsive { border-radius:14px !important; border:1px solid rgba(255,255,255,.18) !important; box-shadow:0 8px 24px rgba(0,0,0,.08); }

/* WhatsApp */
.whatsapp { width:58px !important; height:58px !important; right:18px !important; bottom:18px !important; z-index:1040; box-shadow:0 10px 25px rgba(37,211,102,.28) !important; transition:transform .2s ease, box-shadow .2s ease; }
.whatsapp:hover { transform:translateY(-3px) scale(1.03); color:#fff; box-shadow:0 14px 30px rgba(37,211,102,.34) !important; }

/* Checkout */
#formulario-compra { max-width:980px; margin:0 auto 50px; }
#formulario-compra > h4 { margin-top:26px; font-weight:780; }
#formulario-compra .card { margin-bottom:24px !important; }
.modal-content { border:0; border-radius:18px; box-shadow:0 24px 70px rgba(0,0,0,.20); overflow:hidden; }

@media (max-width: 1199.98px) {
  .store-navbar .navbar-collapse { padding-top:10px; }
  .store-navbar .navbar-nav { align-items:stretch; margin-bottom:10px; }
  .store-search { max-width:none; width:100%; margin:4px 0 10px; }
  .store-actions { width:100%; margin-left:0; }
  .store-actions .btn, .store-actions form { flex:1 1 auto; }
  .store-actions form .btn { width:100%; }
}
@media (max-width: 767.98px) {
  .top-bar.store-topbar { align-items:flex-start !important; flex-direction:column; gap:4px; }
  .store-topbar__links { justify-content:flex-start; }
  .store-welcome { width:100%; }
  .header.store-brand-header { min-height:86px; padding:12px 15px !important; }
  .header.store-brand-header img { max-height:70px; }
  .store-navbar { position:sticky; }
  .store-actions { display:grid; grid-template-columns:1fr 1fr; }
  .store-actions .btn { font-size:.86rem; padding:.58rem .65rem; }
  .product-card__body { padding:13px; }
  .product-card__description { min-height:0; }
  .product-detail { padding-top:28px !important; }
  .product-gallery { position:static; }
  .product-detail__buy { max-width:none; grid-template-columns:78px 1fr; }
  .search-heading { align-items:flex-start; flex-direction:column; }
  .table-responsive { border:1px solid #eaecf0; }
}
@media (max-width: 420px) {
  .store-actions { grid-template-columns:1fr; }
  .product-card__form { grid-template-columns:60px 1fr; }
}

/* Cart refinements */
.cart-table-wrap { background:#fff; border:1px solid var(--ct-border); border-radius:var(--ct-radius); box-shadow:var(--ct-shadow-sm); overflow:auto; }
.cart-table-wrap .table { margin-bottom:0; min-width:720px; }
.cart-product img { flex:0 0 auto; border:1px solid #eaecf0; background:#f2f4f7; }