/*
Theme Name: BigBang Delivery
Author: Luis
Version: 1.7
Description: Tema “delivery” con acordeones, carrito flotante y checkout moderno. Totalmente personalizable.
Text Domain: bigbang-delivery
*/

/* ===== Variables ===== */
:root{
  --wrap:1100px;
  --brand:#111111;
  --cat:#d81616;
  --accent:var(--cat);
  --fab-bg:#111111;
  --fab-text:#ffffff;
  --card-bg:#ffffff;
  --card-br:#e9e9e9;
  --muted:#636363;
  --shadow:0 18px 50px rgba(0,0,0,.35);
  --radius:18px;
  --scale:1;
  --density:1;
  --mini-width:540px;
  --fab-x:16px;
  --fab-y:16px;
}

/* ===== Base ===== */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,sans-serif;
  font-size:calc(16px * var(--scale));
  background:#fafafa;color:#111;line-height:1.45;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:16px}

/* ===== Header ===== */
.site-header{position:sticky;top:0;background:var(--brand);z-index:100}
.topbar.simple{display:flex;align-items:center;min-height:54px}
.brand{display:flex;align-items:center;gap:10px}
.brand-text{color:#fff;text-decoration:none;font-weight:700}
.custom-logo{max-height:36px;width:auto}

/* ===== Layout ===== */
.site-main{padding-bottom:calc(80px * var(--density))}
.layout{display:block}

/* ===== Acordeones ===== */
.acc-cat{margin:10px 0}
.acc-cat details{border-radius:var(--radius);overflow:hidden}
.acc-cat summary{
  display:flex;align-items:center;gap:10px;
  justify-content:flex-start; /* clave para meter la imagen a la izquierda */
  background:var(--cat);color:#fff;
  padding:calc(12px * var(--density)) calc(14px * var(--density));
  cursor:pointer;border-radius:var(--radius)
}
.acc-cat summary::-webkit-details-marker{display:none}
.acc-cat summary .ttl{font-weight:700}
.acc-cat summary .count{
  background:rgba(255,255,255,.22);
  padding:2px 8px;border-radius:999px;font-weight:700
}
body.no-counts .acc-cat summary .count{display:none}
.acc-cat summary .chev{margin-left:auto}

/* Miniatura de categoría (NUEVO) */
.acc-cat summary .cat-img{
  flex:0 0 40px;width:40px;height:40px;
  border-radius:10px;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.30)
}
.acc-cat summary img.cat-thumb{width:100%;height:100%;object-fit:cover;display:block}
.acc-cat summary .cat-thumb.ph{width:24px;height:24px;opacity:.75}

@media (min-width:960px){
  .acc-cat summary .cat-img{width:44px;height:44px}
}

.product-list{
  list-style:none;margin:0;padding:10px;background:#fff;
  border:1px solid #eee;border-radius:var(--radius)
}

/* ===== Card de producto ===== */
.prow{
  display:grid;grid-template-columns:72px 1fr auto;gap:12px;align-items:center;
  padding:calc(10px * var(--density));border-bottom:1px dotted #eee;background:#fff
}
.prow:last-child{border-bottom:0;border-radius:0 0 var(--radius) var(--radius)}
.prow .thumb img{
  width:72px;height:72px;object-fit:cover;border-radius:12px;background:#f2f2f2;display:block
}
.prow .name{font-weight:800}
.prow .price{font-weight:800}

.prow .desc{
  margin-top:4px;
  font-size:.92rem;
  color:var(--muted);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.prow .buy{display:flex;gap:8px;align-items:center}
.button{
  padding:calc(10px * var(--density)) calc(14px * var(--density));
  border:0;border-radius:12px;cursor:pointer;background:#111;color:#fff;transition:transform .04s ease
}
.button:active{transform:translateY(1px)}
.button.ghost{background:#f2f2f2;color:#111}

/* ===== FAB ===== */
.cart-fab{
  position:fixed;right:var(--fab-x);bottom:var(--fab-y);background:var(--fab-bg);color:var(--fab-text);
  border:0;border-radius:999px;padding:12px 16px;font-weight:700;display:flex;align-items:center;gap:8px;
  z-index:10000;box-shadow:0 10px 20px rgba(0,0,0,.15)
}
body.fab-left .cart-fab{left:var(--fab-x);right:auto}
.cart-fab .count{background:var(--fab-text);color:var(--fab-bg);border-radius:999px;padding:2px 8px;font-weight:800}

/* ===== Mini-carrito (cajón) ===== */
#mini-cart{
  position:fixed;left:50%;transform:translate(-50%, 110%);bottom:0;width:min(100vw, var(--mini-width));
  max-height:80vh;transition:transform .25s ease, opacity .25s ease;opacity:0;pointer-events:none;z-index:10001
}
body.drawer-open #mini-cart{transform:translate(-50%, 0);opacity:1;pointer-events:auto}
body.drawer-open{overflow:hidden}
body.drawer-open::after{content:"";position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:10000}
.mc-card{background:#fff;border:1px solid var(--card-br);border-radius:var(--radius) var(--radius) 0 0;box-shadow:var(--shadow);overflow:hidden;position:relative;z-index:10002}
.mc-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--card-br);background:#fff}
.mc-head strong{font-weight:900;letter-spacing:.2px}
.mc-close{background:#f2f2f2;color:#111;border:0;border-radius:999px;width:32px;height:32px;cursor:pointer}
#mini-cart .widget_shopping_cart_content{padding:0}
.mc{padding:14px 18px;background:#fff}
.mc ul{list-style:none;margin:0;padding:0}
.mc li{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #f3f3f3;background:#fff}
.mc li:last-child{border-bottom:0}
.mc .thumb img{width:56px;height:56px;border-radius:12px;object-fit:cover;background:#f2f2f2}
.mc .name{font-weight:800;line-height:1.2}
.mc .meta{font-size:.9rem;color:var(--muted)}
.mc .qty{font-weight:700;color:#222}
.mc .remove{order:3;margin-left:8px}
.mc .total{font-weight:900;border-top:1px solid var(--card-br);padding-top:12px;margin-top:12px}
.mc .buttons{display:flex;gap:10px;margin-top:12px}
.mc .buttons .button{flex:1;text-align:center;border-radius:12px}
.mc .buttons .button.ghost{background:#f2f2f2;color:#111}

/* ===== Modal de producto ===== */
#bb-modal{position:fixed;inset:0;display:none;align-items:flex-end;justify-content:center;z-index:10003}
#bb-modal .mask{position:absolute;inset:0;background:rgba(0,0,0,.55)}
#bb-modal .sheet{
  position:relative;width:min(100vw,560px);max-height:80vh;overflow:auto;
  background:#fff;border-radius:16px 16px 0 0;box-shadow:var(--shadow);
  padding:16px 16px 20px;transform:translateY(16px);opacity:0;transition:.2s ease
}
#bb-modal.open{display:flex}
#bb-modal.open .sheet{transform:translateY(0);opacity:1}
.bb-head{display:flex;gap:12px}
.bb-head .ph{flex:0 0 120px}
.bb-head .ph img{width:120px;height:120px;object-fit:cover;border-radius:12px;background:#f2f2f2}
.bb-head .meta{flex:1}
.bb-title{margin:0 0 8px 0;font-size:1.2rem;font-weight:900;letter-spacing:.2px}
.bb-price{font-weight:900;margin-bottom:8px}
.bb-desc{color:#333}
.bb-form{margin-top:12px;display:flex;flex-direction:column;gap:10px}
textarea.bb-note,
input.bb-flavors{width:100%;padding:10px;border:1px solid #ddd;border-radius:12px;background:#fff}
textarea.bb-note:focus,
input.bb-flavors:focus{outline:3px solid color-mix(in srgb, var(--accent) 20%, transparent);border-color:var(--accent)}
.bb-actions{display:flex;gap:10px;justify-content:flex-end}
.bb-close{position:absolute;right:10px;top:10px;background:#f2f2f2;color:#111;border:0;border-radius:999px;width:32px;height:32px;cursor:pointer}

/* ===== Checkout ===== */
body.woocommerce-checkout, body.woocommerce-cart, body.woocommerce-account{
  background:#f3f4f6 !important; background-image:none !important;
}
body.custom-background.woocommerce-checkout,
body.custom-background.woocommerce-cart,
body.custom-background.woocommerce-account{
  background-image:none !important; background-color:#f3f4f6 !important;
}
.woocommerce{--co-gap:20px}
.bb-co-grid{display:grid;gap:var(--co-gap)}
@media (min-width:960px){
  .bb-co-grid{grid-template-columns:1fr 380px}
  .bb-co-summary{position:sticky;top:86px;height:fit-content}
}
body.no-sticky-summary .bb-co-summary{position:static;top:auto}
.bb-card{background:#fff;border:1px solid var(--card-br);border-radius:var(--radius);box-shadow:0 8px 28px rgba(0,0,0,.06)}
.bb-card > .bb-card-head{padding:14px 18px;border-bottom:1px solid var(--card-br);font-weight:900;letter-spacing:.2px}
.bb-card > .bb-card-body{padding:18px}
.woocommerce h3, .woocommerce h2{font-weight:900;letter-spacing:.15px}
.woocommerce form .form-row{margin-bottom:14px}
.woocommerce form .form-row label{font-weight:700;margin-bottom:6px;display:block;color:#111}
.woocommerce form .form-row .optional{color:var(--muted);font-weight:400}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select{
  width:100%;padding:12px 14px;border:1px solid #ddd;border-radius:12px;background:#fff;transition:border-color .15s, box-shadow .15s;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 20%, transparent);
}
.select2-container .select2-selection--single{height:auto;border:1px solid #ddd;border-radius:12px;padding:10px 12px;background:#fff}
.select2-selection__rendered{line-height:1.4}
.select2-selection__arrow{top:12px}
.woocommerce table.shop_table{border:0;border-radius:12px;background:#fff}
.woocommerce table.shop_table th,.woocommerce table.shop_table td{padding:10px 0;border:0}
.woocommerce table.shop_table tfoot th{text-align:left;color:#111;font-weight:800}
.woocommerce-checkout-review-order{padding:0}
#payment{background:#fff;border:1px solid var(--card-br);border-radius:12px;padding:14px}
#payment .wc_payment_methods{list-style:none;margin:0;padding:0}
#payment .wc_payment_method{border:1px solid #eee;border-radius:12px;padding:12px;margin:0 0 10px 0;background:#fafafa}
#payment .wc_payment_method:last-child{margin-bottom:0}
#payment .wc_payment_method input[type="radio"]{margin-right:8px;transform:scale(1.1)}
#payment .payment_box{margin:10px 0 0 0;border-left:3px solid var(--accent);background:#fff;border:1px solid #eee;border-radius:10px;padding:12px}
#place_order{width:100%;padding:14px;border-radius:12px;font-weight:900;font-size:1rem;background:var(--brand);color:#fff;border:0;transition:transform .04s ease, filter .15s;}
#place_order:hover{filter:brightness(1.05)}
#place_order:active{transform:translateY(1px)}
.woocommerce-privacy-policy-text{font-size:.9rem;color:var(--muted)}
.woocommerce-error,.woocommerce-info,.woocommerce-message{border-radius:12px;background:#fff}
@media (max-width: 959px){
  .bb-co-summary .bb-card-body{padding-bottom:92px}
  #payment .place-order{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #ececec;padding:12px 16px;box-shadow:0 -10px 30px rgba(0,0,0,.06)}
  #place_order{max-width:var(--wrap);margin:0 auto;display:block}
}

/* ===== Ocultar elementos de plugins / toggles ===== */
.site-header .cart-contents,.site-header .widget_shopping_cart,.woofood-mini-cart-toggle,.woofood-cart,.header-cart,.menu-item-cart{display:none !important}
body.is-checkout .cart-fab { display:none !important; }
.cart-fab.back-fab{background:#fff; color:#111; border:1px solid #e5e5e5; box-shadow:0 10px 22px rgba(0,0,0,.08)}
.cart-fab.back-fab:hover{filter:brightness(1.02)}
/* Ocultar cupones si el admin lo decide */
body.hide-coupons .woocommerce-form-coupon-toggle,
body.hide-coupons form.woocommerce-form-coupon{display:none !important}




/* ===== Ticker (barra de avisos) ===== */
.top-ticker{
  background:#141414;
  color:#fff;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(0,0,0,.55);
  box-shadow:0 12px 30px rgba(0,0,0,.20) inset;
}
.top-ticker .wrap{ padding:8px 16px; }

/* Ventana y pista */
.tt-viewport{ overflow:hidden; position:relative; }
.tt-track{
  display:flex; width:max-content; gap:72px;
  animation: tt-marquee var(--tt-speed, 20s) linear infinite;
  will-change: transform;
}
.top-ticker:hover .tt-track{ animation-play-state: paused; }

/* Segmentos duplicados (para scroll continuo) */
.tt-seg{
  flex:0 0 auto; white-space:nowrap;
  font-weight:800; letter-spacing:.2px;
  display:inline-flex; align-items:center; gap:10px;
  padding:2px 0;
  text-shadow:0 1px 0 rgba(0,0,0,.45);
}
.tt-badge{
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; border-radius:999px;
  background:#d81616; color:#fff; font-size:12px;
  box-shadow:0 2px 6px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.25);
}

@keyframes tt-marquee{
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* se desplaza un “segmento” entero */
}

/* Suavizado de bordes (opcional) */
@supports (mask-image: linear-gradient(#000,#000)){
  .tt-viewport{
    -webkit-mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent);
            mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent);
  }
}

/* Responsive fino */
@media (max-width:480px){
  .tt-track{ gap:48px }
  .tt-badge{ width:20px; height:20px; font-size:11px }
}

