*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:radial-gradient(circle at 10% 10%,#fff0a8 0,transparent 24%),radial-gradient(circle at 85% 12%,#b9ecff 0,transparent 28%),radial-gradient(circle at 15% 90%,#ffd6f1 0,transparent 26%),#fff8fc;color:#3c2748}a{text-decoration:none;color:inherit}.site-header{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 28px;background:linear-gradient(135deg,#ff4fb8,#8b5cf6,#00c2ff);color:#fff;box-shadow:0 12px 35px rgba(139,92,246,.22)}.brand-wrap{display:flex;align-items:center;gap:14px}.brand-logo{width:56px;height:56px;display:grid;place-items:center;border-radius:20px;background:rgba(255,255,255,.22);font-size:32px}.site-header h1{margin:0;font-size:28px}.site-header p{margin:3px 0 0;opacity:.92}.header-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}button,.primary,.ghost,.whatsapp,.danger,.admin-link{border:0;border-radius:999px;padding:12px 18px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.primary{background:linear-gradient(135deg,#ff4fb8,#8b5cf6);color:white;box-shadow:0 10px 26px rgba(255,79,184,.25)}.ghost,.admin-link{background:rgba(255,255,255,.22);color:#fff;border:1px solid rgba(255,255,255,.35)}.whatsapp{background:#25d366;color:white}.danger{background:#ff4d6d;color:#fff}.cart-btn{background:#fff;color:#8b2d8f}.hero-cotillon{max-width:1180px;margin:34px auto 18px;padding:40px;display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}.hero-text,.hero-card,.admin-card,.product-card,.cart-panel,.modal>div{background:rgba(255,255,255,.88);border:1px solid rgba(255,79,184,.15);border-radius:30px;box-shadow:0 18px 50px rgba(255,79,184,.16);backdrop-filter:blur(8px)}.hero-text{padding:42px}.hero-text h2{font-size:54px;line-height:1.02;margin:14px 0;color:#51215d}.hero-text p{font-size:18px;color:#7b6b85}.pill{display:inline-block;background:#fff0fa;color:#b41d81;border:1px solid #ffc2e7;border-radius:999px;padding:10px 14px;font-weight:900}.hero-buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.hero-card{padding:35px;text-align:center}.balloons{font-size:78px}.hero-card h3{font-size:30px;margin:12px 0}.features{max-width:1180px;margin:0 auto 20px;display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.features div{padding:18px;border-radius:20px;background:#fff;box-shadow:0 10px 26px rgba(0,194,255,.12);text-align:center;font-weight:900}.toolbar{max-width:1180px;margin:24px auto;display:grid;grid-template-columns:1fr 260px;gap:12px}.toolbar input,.toolbar select,input,select,textarea{width:100%;padding:14px 16px;border:2px solid rgba(255,79,184,.2);border-radius:18px;background:#fff;color:#3c2748;font-size:15px}.products-section{max-width:1180px;margin:0 auto 60px}.section-title h2{font-size:34px;margin-bottom:6px}.section-title p{color:#7b6b85;margin-top:0}.products-grid,.admin-products{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}.product-card{padding:14px;overflow:hidden}.product-card img{width:100%;height:190px;object-fit:cover;border-radius:22px;background:#fff0fa}.product-card h3{margin:12px 0 6px;font-size:18px}.product-card p{color:#7b6b85;font-size:14px}.price{color:#ff2fa6;font-size:22px;font-weight:1000}.product-actions{display:flex;gap:8px;margin-top:10px}.product-actions button{flex:1;padding:10px}.cart-panel{position:fixed;right:-420px;top:0;width:390px;max-width:92vw;height:100vh;z-index:40;padding:18px;transition:.25s;overflow:auto}.cart-panel.open{right:0}.cart-head{display:flex;justify-content:space-between;align-items:center}.icon-btn{width:38px;height:38px;padding:0;background:#ff4d6d;color:white}.cart-item{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;border-bottom:1px solid #f2d8ea;padding:12px 0}.cart-item img{width:56px;height:56px;border-radius:14px;object-fit:cover}.coupon-box{display:flex;gap:8px;margin:18px 0}.cart-total{display:flex;justify-content:space-between;font-size:22px;margin:14px 0}.full{width:100%}.hidden{display:none!important}.modal{position:fixed;inset:0;background:rgba(42,18,52,.55);z-index:60;display:grid;place-items:center;padding:18px}.modal>div{max-width:520px;width:100%;padding:24px}.admin-layout{max-width:1200px;margin:30px auto;padding:0 16px}.admin-grid{display:grid;grid-template-columns:420px 1fr;gap:18px}.admin-card{padding:22px;margin-bottom:18px}.form-actions{display:flex;gap:10px;margin-top:14px}.notice{color:#7b6b85}.orders-list{display:grid;gap:12px}.order-card{background:#fff8fc;border:1px solid #ffd6f1;border-radius:18px;padding:14px}.admin-product-row{display:grid;grid-template-columns:70px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid #ffd6f1;border-radius:18px;padding:12px}.admin-product-row img{width:70px;height:70px;border-radius:14px;object-fit:cover}@media(max-width:850px){.site-header,.hero-cotillon{grid-template-columns:1fr;flex-direction:column;align-items:flex-start}.hero-cotillon{padding:16px}.hero-text h2{font-size:38px}.features{grid-template-columns:1fr 1fr;margin:0 16px}.toolbar{grid-template-columns:1fr;margin:18px 16px}.products-section{margin:0 16px 50px}.admin-grid{grid-template-columns:1fr}}


/* Botón para cerrar todos los cuadros/modal */
.modal-box, .modal > div {
  position: relative !important;
}
.modal-close {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #ff4d6d !important;
  color: #fff !important;
  border: 0 !important;
  font-size: 26px !important;
  font-weight: 900 !important;
  line-height: 38px !important;
  cursor: pointer !important;
  z-index: 99999 !important;
  box-shadow: 0 8px 20px rgba(255,77,109,.28) !important;
}
.modal-close:hover {
  filter: brightness(1.08);
  transform: scale(1.04);
}
.modal h2 {
  padding-right: 44px;
}



/* Contador de visitas */
.contador-visitas{
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 9999;
  background: linear-gradient(135deg,#ff4fb8,#8b5cf6);
  color: #fff;
  padding: 10px 15px;
  border-radius: 999px;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(139,92,246,.28);
  border: 1px solid rgba(255,255,255,.35);
}
@media(max-width:600px){
  .contador-visitas{
    right: 10px;
    bottom: 10px;
    font-size: 13px;
    padding: 8px 12px;
  }
}


/* Logo real */
.brand-logo{overflow:hidden;background:#fff!important;padding:4px}
.brand-logo img{width:100%;height:100%;object-fit:contain;border-radius:14px}

/* Todos los botones mismo tamaño */
button,.primary,.ghost,.whatsapp,.danger,.admin-link,.cart-btn{
min-width:160px!important;
height:48px!important;
padding:0 18px!important;
font-size:15px!important;
font-weight:700!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
}

.product-actions button,
.form-actions button,
.row-actions button{
min-width:160px!important;
height:48px!important;
}



/* Logo real grande y limpio */
.brand-logo.logo-real{
  width: 150px !important;
  height: 92px !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
}
.brand-logo.logo-real img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  display: block !important;
  background: transparent !important;
}
.site-header .brand-wrap{
  align-items: center !important;
}

/* Imágenes de productos corregidas */
.product-card img{
  width: 100% !important;
  height: 220px !important;
  object-fit: contain !important;
  object-position: center !important;
  background: linear-gradient(135deg,#fff0fa,#e9f8ff) !important;
  border-radius: 22px !important;
  padding: 10px !important;
  display: block !important;
}
.cart-item img{
  width: 58px !important;
  height: 58px !important;
  object-fit: contain !important;
  background: linear-gradient(135deg,#fff0fa,#e9f8ff) !important;
  border-radius: 14px !important;
  padding: 5px !important;
}
.admin-product-row img{
  width: 76px !important;
  height: 76px !important;
  object-fit: contain !important;
  background: linear-gradient(135deg,#fff0fa,#e9f8ff) !important;
  border-radius: 14px !important;
  padding: 5px !important;
}

/* Botones medianos uniformes */
button,.primary,.ghost,.whatsapp,.danger,.admin-link,.cart-btn,.btn{
  min-width: 155px !important;
  height: 46px !important;
  padding: 0 18px !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
}
.icon-btn,.modal-close{
  min-width: 38px !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
}
.product-actions button,.form-actions button,.row-actions button{
  min-width: 145px !important;
  height: 46px !important;
}
@media(max-width:700px){
  .brand-logo.logo-real{
    width: 125px !important;
    height: 76px !important;
  }
  button,.primary,.ghost,.whatsapp,.danger,.admin-link,.cart-btn,.btn{
    min-width: 130px !important;
    height: 44px !important;
    font-size: 14px !important;
  }
}



/* === Panel administrador compacto, centrado y ordenado === */
.admin-layout{
  max-width: 1080px !important;
  margin: 24px auto !important;
  padding: 0 14px !important;
  text-align: center !important;
}

.admin-panel{
  width: 100% !important;
  margin: 0 auto !important;
}

.admin-grid{
  display: grid !important;
  grid-template-columns: minmax(280px, 360px) 1fr !important;
  gap: 16px !important;
  align-items: start !important;
  justify-content: center !important;
}

.admin-card{
  padding: 16px !important;
  margin: 0 auto 16px !important;
  border-radius: 18px !important;
  text-align: center !important;
}

.admin-card h2,
.admin-card h3,
#formTitle{
  text-align: center !important;
  font-size: 20px !important;
  margin: 0 0 12px !important;
}

.admin-card label{
  display: block !important;
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  margin: 8px 0 5px !important;
}

.admin-card input,
.admin-card select,
.admin-card textarea,
#productForm input,
#productForm select,
#productForm textarea{
  max-width: 320px !important;
  height: 40px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  margin: 0 auto 8px !important;
  display: block !important;
  text-align: center !important;
  border-radius: 13px !important;
}

.admin-card textarea,
#productForm textarea{
  height: 78px !important;
  text-align: center !important;
  resize: vertical !important;
}

.form-actions{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-top: 10px !important;
}

.admin-card button,
.form-actions button,
.row-actions button,
.admin-product-row button,
.orders-list button,
.orders-list .primary,
#loginBtn,
#logoutBtn,
#clearForm{
  min-width: 96px !important;
  width: auto !important;
  max-width: 150px !important;
  height: 36px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  border-radius: 12px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#loginBox{
  max-width: 380px !important;
  margin: 26px auto !important;
}

.admin-products{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  max-width: 980px !important;
  margin: 0 auto !important;
}

.admin-product-row{
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) 190px !important;
  gap: 10px !important;
  align-items: center !important;
  text-align: center !important;
  padding: 10px !important;
  border-radius: 16px !important;
}

.admin-product-row img{
  width: 62px !important;
  height: 62px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}

.admin-product-row strong{
  display: block !important;
  font-size: 15px !important;
  text-align: center !important;
}

.admin-product-row small{
  display: block !important;
  font-size: 12px !important;
  text-align: center !important;
  line-height: 1.35 !important;
}

.row-actions{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

.row-actions button{
  min-width: 82px !important;
  max-width: 92px !important;
  height: 34px !important;
  font-size: 12px !important;
  padding: 0 8px !important;
}

.orders-list{
  display: grid !important;
  gap: 10px !important;
  text-align: center !important;
}

.order-card{
  text-align: center !important;
  padding: 12px !important;
  border-radius: 16px !important;
}

.order-card .primary,
.order-card button{
  min-width: 88px !important;
  height: 34px !important;
  font-size: 12px !important;
  margin: 4px !important;
}

.notice,
#productMsg,
#loginMsg{
  text-align: center !important;
  font-size: 13px !important;
}

/* Header del admin más compacto */
.site-header{
  padding: 12px 22px !important;
}

.site-header h1{
  font-size: 22px !important;
  text-align: center !important;
}

.site-header p{
  font-size: 13px !important;
  text-align: center !important;
}

.site-header .brand-wrap{
  justify-content: center !important;
}

.site-header .header-actions{
  justify-content: center !important;
}

/* Evita botones gigantes globales dentro del admin */
.admin-layout button.full,
.admin-layout .full{
  width: auto !important;
  min-width: 130px !important;
}

/* Responsive */
@media(max-width: 850px){
  .admin-grid{
    grid-template-columns: 1fr !important;
  }

  .admin-card input,
  .admin-card select,
  .admin-card textarea,
  #productForm input,
  #productForm select,
  #productForm textarea{
    max-width: 100% !important;
  }

  .admin-product-row{
    grid-template-columns: 56px 1fr !important;
  }

  .admin-product-row .row-actions,
  .admin-product-row > .row-actions{
    grid-column: 1 / -1 !important;
  }

  .row-actions button{
    min-width: 96px !important;
  }

  .site-header{
    align-items: center !important;
    text-align: center !important;
  }
}



/* Cupones en panel admin */
.coupon-admin-card{
  max-width: 980px !important;
  margin: 0 auto 16px !important;
}
.coupon-form{
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}
.coupon-form input{
  max-width: 190px !important;
  height: 38px !important;
  text-align: center !important;
}
.coupon-form button{
  min-width: 120px !important;
  height: 38px !important;
  font-size: 13px !important;
}
.coupons-list{
  display: grid !important;
  gap: 8px !important;
  max-width: 520px !important;
  margin: 12px auto 0 !important;
}
.coupon-row{
  display: grid !important;
  grid-template-columns: 1fr 96px !important;
  gap: 8px !important;
  align-items: center !important;
  background: rgba(255,255,255,.75) !important;
  border: 1px solid rgba(255,79,184,.18) !important;
  border-radius: 14px !important;
  padding: 9px !important;
  text-align: center !important;
}
.coupon-row button{
  min-width: 86px !important;
  height: 32px !important;
  font-size: 12px !important;
}
@media(max-width:650px){
  .coupon-row{
    grid-template-columns: 1fr !important;
  }
}






/* === ORDEN TOTAL + NEÓN ROSA PROLIJO === */
:root{
  --neon-pink:#ff4fb8;
  --neon-pink-soft:rgba(255,79,184,.42);
  --panel-max:1120px;
}

/* Layout general más ordenado */
main,
.products-section,
.admin-layout{
  max-width: var(--panel-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
}

.site-header{
  padding: 10px 20px !important;
  gap: 12px !important;
}

.site-header h1{
  font-size: 22px !important;
  line-height: 1.15 !important;
  text-align: center !important;
}

.site-header p{
  font-size: 13px !important;
  text-align: center !important;
}

.brand-wrap,
.header-actions{
  justify-content: center !important;
  align-items: center !important;
}

/* Logo más proporcionado */
.brand-logo.logo-real{
  width: 132px !important;
  height: 78px !important;
}

/* Todos los cuadrados / tarjetas / paneles con neón rosa prolijo */
.card,
.product-card,
.admin-card,
.order-card,
.coupon-row,
.admin-product-row,
.hero-text,
.hero-card,
.cart-panel,
.modal-box,
.modal > div,
.box,
.panel,
.features div,
.toolbar,
.search-box,
.coupon-box,
.cart-item,
.result,
.message,
.form,
.login-box,
.main-card,
section[class*="card"],
div[class*="card"]{
  border: 2px solid var(--neon-pink) !important;
  box-shadow:
    0 0 4px var(--neon-pink-soft),
    0 0 12px rgba(255,79,184,.25) !important;
  border-radius: 18px !important;
}

/* Inputs también prolijos pero sin exagerar */
input,
select,
textarea{
  border: 2px solid var(--neon-pink) !important;
  box-shadow: 0 0 6px rgba(255,79,184,.18) !important;
  border-radius: 12px !important;
  height: 38px !important;
  padding: 8px 11px !important;
  font-size: 14px !important;
  text-align: center !important;
}

textarea{
  height: 74px !important;
}

/* Botones medianos/chicos, todos parejos */
button,
.btn,
.primary,
.ghost,
.whatsapp,
.danger,
.admin-link,
.cart-btn{
  min-width: 118px !important;
  max-width: 180px !important;
  height: 38px !important;
  padding: 0 13px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  border-radius: 12px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  white-space: nowrap !important;
}

/* Botones tipo X no deben hacerse grandes */
.icon-btn,
.modal-close{
  min-width: 34px !important;
  width: 34px !important;
  max-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 22px !important;
}

/* Inicio más compacto */
.hero-cotillon{
  max-width: var(--panel-max) !important;
  margin: 22px auto 14px !important;
  padding: 18px !important;
  gap: 14px !important;
}

.hero-text{
  padding: 24px !important;
  text-align: center !important;
}

.hero-text h2{
  font-size: 38px !important;
  line-height: 1.05 !important;
  margin: 10px 0 !important;
}

.hero-text p{
  font-size: 15px !important;
}

.hero-card{
  padding: 20px !important;
  text-align: center !important;
}

.balloons{
  font-size: 52px !important;
}

.features{
  max-width: var(--panel-max) !important;
  gap: 10px !important;
  margin: 12px auto !important;
}

.features div{
  padding: 12px !important;
  font-size: 14px !important;
}

.toolbar{
  max-width: var(--panel-max) !important;
  margin: 16px auto !important;
  padding: 12px !important;
  gap: 10px !important;
  align-items: center !important;
}

/* Productos más chicos y prolijos */
.products-grid{
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap: 14px !important;
}

.product-card{
  padding: 10px !important;
  text-align: center !important;
}

.product-card img{
  height: 160px !important;
  padding: 8px !important;
}

.product-card h3{
  font-size: 15px !important;
  margin: 9px 0 5px !important;
  text-align: center !important;
}

.product-card p{
  font-size: 12px !important;
  line-height: 1.3 !important;
  text-align: center !important;
}

.price{
  font-size: 18px !important;
  text-align: center !important;
}

.product-actions{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:7px !important;
}

.product-actions button{
  min-width: 120px !important;
  height: 36px !important;
  font-size: 12px !important;
}

/* Carrito compacto */
.cart-panel{
  width: 350px !important;
  padding: 14px !important;
}

.cart-item{
  padding: 9px !important;
  grid-template-columns: 50px 1fr 34px !important;
}

.cart-item img{
  width: 50px !important;
  height: 50px !important;
}

/* PANEL ADMIN bien centrado y compacto */
.admin-layout{
  max-width: 1040px !important;
  margin-top: 20px !important;
  text-align: center !important;
}

.admin-grid{
  display: grid !important;
  grid-template-columns: minmax(270px, 340px) minmax(300px, 1fr) !important;
  gap: 14px !important;
  align-items: start !important;
  justify-content: center !important;
}

.admin-card{
  padding: 14px !important;
  margin: 0 auto 14px !important;
  text-align: center !important;
}

.admin-card h2,
.admin-card h3,
#formTitle{
  font-size: 18px !important;
  margin: 0 0 10px !important;
  text-align: center !important;
}

.admin-card label{
  display:block !important;
  margin: 7px 0 4px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-align: center !important;
}

#productForm input,
#productForm select,
#productForm textarea,
.admin-card input,
.admin-card select,
.admin-card textarea{
  max-width: 290px !important;
  margin: 0 auto 7px !important;
  display: block !important;
}

.form-actions,
.row-actions{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:6px !important;
  flex-wrap:wrap !important;
}

.form-actions button,
.row-actions button,
.admin-product-row button,
.order-card button,
.order-card .primary,
.coupon-form button,
.coupon-row button{
  min-width: 78px !important;
  max-width: 110px !important;
  height: 32px !important;
  font-size: 11.5px !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
}

/* Lista productos admin: que no se salgan editar/eliminar */
.admin-products{
  display:grid !important;
  grid-template-columns: 1fr !important;
  gap: 9px !important;
  max-width: 940px !important;
  margin: 0 auto !important;
}

.admin-product-row{
  display:grid !important;
  grid-template-columns: 58px minmax(0,1fr) 178px !important;
  gap: 9px !important;
  align-items:center !important;
  padding: 9px !important;
  text-align:center !important;
}

.admin-product-row img{
  width: 58px !important;
  height: 58px !important;
  margin:0 auto !important;
}

.admin-product-row strong{
  font-size: 14px !important;
  display:block !important;
  text-align:center !important;
}

.admin-product-row small{
  font-size: 11.5px !important;
  line-height:1.25 !important;
  display:block !important;
  text-align:center !important;
}

.admin-product-row .row-actions{
  width: 100% !important;
}

/* Cupones */
.coupon-admin-card{
  max-width: 900px !important;
  margin: 0 auto 14px !important;
}

.coupon-form{
  display:flex !important;
  justify-content:center !important;
  gap:7px !important;
  align-items:center !important;
  flex-wrap:wrap !important;
}

.coupon-form input{
  max-width: 170px !important;
  height: 34px !important;
}

.coupons-list{
  max-width: 480px !important;
  margin: 10px auto 0 !important;
}

.coupon-row{
  grid-template-columns: 1fr 86px !important;
  padding: 8px !important;
}

/* Pedidos */
.order-card{
  padding: 10px !important;
  text-align: center !important;
}

.orders-list{
  gap: 9px !important;
  text-align:center !important;
}

/* Centrar textos generales */
.section-title,
.section-title h2,
.section-title p,
.notice,
#productMsg,
#loginMsg{
  text-align:center !important;
}

/* Responsive */
@media(max-width: 850px){
  .site-header{
    flex-direction: column !important;
    text-align:center !important;
  }

  .admin-grid,
  .hero-cotillon,
  .toolbar{
    grid-template-columns: 1fr !important;
  }

  .features{
    grid-template-columns: repeat(2,1fr) !important;
    padding: 0 14px !important;
  }

  .admin-product-row{
    grid-template-columns: 54px 1fr !important;
  }

  .admin-product-row .row-actions{
    grid-column: 1 / -1 !important;
  }

  button,
  .btn,
  .primary,
  .ghost,
  .whatsapp,
  .danger,
  .admin-link,
  .cart-btn{
    min-width: 105px !important;
    height: 36px !important;
    font-size: 12px !important;
  }

  .hero-text h2{
    font-size: 30px !important;
  }

  .products-grid{
    grid-template-columns: repeat(auto-fill, minmax(155px,1fr)) !important;
  }

  .product-card img{
    height: 135px !important;
  }
}

/* =========================================================
   COTILLÓN ENSUEÑOS · MAGIC PREMIUM V2
   Diseño mágico, ultra premium, con movimiento y brillo.
   Mantiene la lógica original: sólo cambia experiencia visual.
========================================================= */
:root{
  --magic-bg-1:#120018;
  --magic-bg-2:#2a0738;
  --magic-pink:#ff37c8;
  --magic-fuchsia:#ff7adf;
  --magic-purple:#8b5cf6;
  --magic-cyan:#42e8ff;
  --magic-gold:#ffe17a;
  --magic-white:rgba(255,255,255,.90);
  --magic-glass:rgba(255,255,255,.13);
  --magic-border:rgba(255,122,223,.58);
}

html{scroll-behavior:smooth;}
body{
  min-height:100vh !important;
  color:#fff !important;
  background:
    radial-gradient(circle at 20% 5%, rgba(255,55,200,.34), transparent 28%),
    radial-gradient(circle at 85% 15%, rgba(66,232,255,.26), transparent 30%),
    radial-gradient(circle at 50% 90%, rgba(255,225,122,.16), transparent 32%),
    linear-gradient(135deg,var(--magic-bg-1),var(--magic-bg-2) 45%,#080012) !important;
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-4;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.92) 0 1px, transparent 1.8px),
    radial-gradient(circle, rgba(255,122,223,.75) 0 1px, transparent 2px),
    radial-gradient(circle, rgba(66,232,255,.65) 0 1px, transparent 2px);
  background-size:90px 90px, 140px 140px, 180px 180px;
  animation:starsDrift 24s linear infinite;
  opacity:.45;
}
body:after{
  content:"";
  position:fixed;
  inset:-20%;
  pointer-events:none;
  z-index:-5;
  background:conic-gradient(from 120deg, rgba(255,55,200,.25), rgba(66,232,255,.16), rgba(255,225,122,.13), rgba(139,92,246,.25), rgba(255,55,200,.25));
  filter:blur(70px);
  animation:auroraSpin 18s ease-in-out infinite alternate;
}
@keyframes starsDrift{to{background-position:160px 240px,-180px 220px,240px -180px;}}
@keyframes auroraSpin{from{transform:rotate(0deg) scale(1);}to{transform:rotate(18deg) scale(1.12);}}

.magic-bg{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;}
.magic-bg span{
  position:absolute;
  bottom:-80px;
  width:12px;height:12px;
  border-radius:50%;
  background:radial-gradient(circle,#fff,var(--magic-fuchsia) 45%,transparent 70%);
  box-shadow:0 0 18px var(--magic-pink),0 0 34px rgba(66,232,255,.35);
  animation:floatSpark 11s linear infinite;
  opacity:.85;
}
.magic-bg span:nth-child(1){left:8%;animation-delay:0s;width:10px;height:10px;}
.magic-bg span:nth-child(2){left:22%;animation-delay:2s;width:16px;height:16px;}
.magic-bg span:nth-child(3){left:36%;animation-delay:4s;width:8px;height:8px;}
.magic-bg span:nth-child(4){left:50%;animation-delay:1s;width:18px;height:18px;}
.magic-bg span:nth-child(5){left:66%;animation-delay:3s;width:11px;height:11px;}
.magic-bg span:nth-child(6){left:80%;animation-delay:5s;width:15px;height:15px;}
.magic-bg span:nth-child(7){left:91%;animation-delay:6.5s;width:9px;height:9px;}
.magic-bg span:nth-child(8){left:14%;animation-delay:7.5s;width:20px;height:20px;}
@keyframes floatSpark{
  0%{transform:translateY(0) translateX(0) rotate(0);opacity:0;}
  10%{opacity:.9;}
  100%{transform:translateY(-120vh) translateX(70px) rotate(360deg);opacity:0;}
}
.aurora-layer{position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(circle at var(--x,30%) var(--y,35%),rgba(255,255,255,.10),transparent 16%);animation:pulseGlow 5s ease-in-out infinite alternate;}
@keyframes pulseGlow{from{opacity:.35;}to{opacity:.82;}}

.site-header{
  background:rgba(24,3,35,.62) !important;
  border-bottom:1px solid rgba(255,122,223,.38) !important;
  backdrop-filter:blur(18px) saturate(140%) !important;
  box-shadow:0 18px 60px rgba(0,0,0,.34),0 0 35px rgba(255,55,200,.20) !important;
}
.site-header h1,
.section-title h2,
.hero-text h2{
  color:#fff !important;
  text-shadow:0 0 14px rgba(255,55,200,.65),0 0 34px rgba(66,232,255,.22);
}
.site-header p,.section-title p,.hero-text p,.hero-card p,.product-card p,.notice{color:rgba(255,255,255,.78) !important;}
.brand-logo.logo-real{filter:drop-shadow(0 0 16px rgba(255,122,223,.55));animation:logoFloat 4.5s ease-in-out infinite;}
@keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

.hero-cotillon{
  position:relative;
  min-height:520px;
  align-items:stretch !important;
}
.hero-text,.hero-card,.admin-card,.product-card,.cart-panel,.modal>div,.features div,.toolbar,.coupon-row,.admin-product-row,.order-card{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.06)) !important;
  border:1px solid var(--magic-border) !important;
  color:#fff !important;
  backdrop-filter:blur(18px) saturate(155%) !important;
  box-shadow:0 24px 70px rgba(0,0,0,.34),0 0 22px rgba(255,55,200,.20),inset 0 0 20px rgba(255,255,255,.05) !important;
}
.hero-text:before,.hero-card:before,.product-card:before,.admin-card:before{
  content:"";
  position:absolute;
  inset:-2px;
  background:linear-gradient(115deg,transparent 0 28%,rgba(255,255,255,.28) 42%,transparent 57% 100%);
  transform:translateX(-120%);
  animation:shineSweep 5.5s ease-in-out infinite;
  pointer-events:none;
}
.product-card:nth-child(2n):before{animation-delay:1.2s;}
.product-card:nth-child(3n):before{animation-delay:2.4s;}
@keyframes shineSweep{0%,55%{transform:translateX(-130%)}78%,100%{transform:translateX(130%)}}
.hero-text{display:flex;flex-direction:column;justify-content:center;}
.hero-text h2{font-size:clamp(38px,6vw,78px) !important;line-height:.95 !important;letter-spacing:-2px;}
.pill{
  background:linear-gradient(135deg,rgba(255,55,200,.24),rgba(66,232,255,.16)) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.28) !important;
  box-shadow:0 0 20px rgba(255,55,200,.35) !important;
}
.magic-orb-card{display:grid;place-items:center;text-align:center;}
.magic-orb{
  width:160px;height:160px;border-radius:50%;display:grid;place-items:center;font-size:76px;
  background:radial-gradient(circle at 35% 20%,#fff 0 8%,#ff9cec 18%,#8b5cf6 52%,#1d0730 78%);
  box-shadow:0 0 28px rgba(255,55,200,.7),0 0 80px rgba(66,232,255,.30),inset 0 0 28px rgba(255,255,255,.3);
  animation:orbFloat 4s ease-in-out infinite, orbGlow 2.5s ease-in-out infinite alternate;
}
@keyframes orbFloat{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-14px) rotate(8deg)}}
@keyframes orbGlow{from{filter:saturate(1)}to{filter:saturate(1.5) brightness(1.14)}}
.balloons{filter:drop-shadow(0 0 14px rgba(255,225,122,.65));animation:softBounce 3.2s ease-in-out infinite;}
@keyframes softBounce{50%{transform:translateY(-8px)}}

.features div{
  background:linear-gradient(135deg,rgba(255,55,200,.15),rgba(66,232,255,.10)) !important;
  transform:translateZ(0);
  transition:.35s ease;
}
.features div:hover{transform:translateY(-7px) scale(1.03);box-shadow:0 24px 70px rgba(255,55,200,.30),0 0 28px rgba(66,232,255,.22) !important;}

.toolbar{padding:14px !important;}
input,select,textarea{
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
  border:1px solid rgba(255,122,223,.62) !important;
  box-shadow:0 0 18px rgba(255,55,200,.18),inset 0 0 18px rgba(255,255,255,.04) !important;
  outline:none !important;
}
input::placeholder,textarea::placeholder{color:rgba(255,255,255,.62) !important;}
select option{background:#2a0738;color:#fff;}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px rgba(255,55,200,.25),0 0 28px rgba(66,232,255,.22) !important;}

.products-grid{grid-template-columns:repeat(auto-fill,minmax(235px,1fr)) !important;gap:22px !important;}
.product-card{
  padding:14px !important;
  border-radius:26px !important;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.product-card:hover{transform:translateY(-12px) rotateX(3deg);border-color:rgba(255,255,255,.82) !important;box-shadow:0 35px 90px rgba(0,0,0,.42),0 0 40px rgba(255,55,200,.34),0 0 35px rgba(66,232,255,.18) !important;}
.product-card img{height:235px !important;background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(255,213,247,.74),rgba(202,244,255,.80)) !important;transition:transform .35s ease, filter .35s ease;}
.product-card:hover img{transform:scale(1.06);filter:saturate(1.15) contrast(1.05);}
.product-card h3{color:#fff !important;text-shadow:0 0 14px rgba(255,55,200,.45);font-size:19px !important;}
.price{color:var(--magic-gold) !important;text-shadow:0 0 14px rgba(255,225,122,.55);font-size:24px !important;}
.product-card small{color:rgba(255,255,255,.72) !important;}

button,.primary,.ghost,.whatsapp,.danger,.admin-link,.cart-btn,.btn{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.25) !important;
  color:#fff !important;
  background:linear-gradient(135deg,var(--magic-pink),var(--magic-purple)) !important;
  box-shadow:0 12px 28px rgba(255,55,200,.26),0 0 20px rgba(139,92,246,.22) !important;
  transition:transform .25s ease, filter .25s ease, box-shadow .25s ease;
}
button:before,.primary:before,.ghost:before,.whatsapp:before,.danger:before,.admin-link:before,.cart-btn:before,.btn:before{
  content:"";position:absolute;top:-40%;bottom:-40%;width:38%;left:-50%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:rotate(18deg);transition:.55s;
}
button:hover:before,.primary:hover:before,.ghost:hover:before,.whatsapp:hover:before,.danger:hover:before,.admin-link:hover:before,.cart-btn:hover:before,.btn:hover:before{left:120%;}
button:hover,.primary:hover,.ghost:hover,.whatsapp:hover,.danger:hover,.admin-link:hover,.cart-btn:hover,.btn:hover{transform:translateY(-3px);filter:brightness(1.12);box-shadow:0 18px 36px rgba(255,55,200,.34),0 0 28px rgba(66,232,255,.20) !important;}
.ghost,.admin-link{background:rgba(255,255,255,.10) !important;}
.whatsapp{background:linear-gradient(135deg,#00d084,#26efb0) !important;}
.danger{background:linear-gradient(135deg,#ff2f6d,#ff7a9f) !important;}
.cart-btn{background:linear-gradient(135deg,#ffe17a,#ff7adf) !important;color:#22002d !important;}
.cart-btn span{background:#fff;color:#8b006b;border-radius:999px;padding:2px 7px;}

.cart-panel{background:rgba(18,0,24,.82) !important;}
.modal{background:rgba(5,0,12,.72) !important;backdrop-filter:blur(10px);}
.modal h2{color:#fff;text-shadow:0 0 18px rgba(255,55,200,.58);}
footer{color:rgba(255,255,255,.75) !important;text-align:center;padding:30px 16px;}
.contador-visitas{background:linear-gradient(135deg,var(--magic-pink),var(--magic-purple),var(--magic-cyan)) !important;box-shadow:0 0 24px rgba(255,55,200,.42) !important;}

/* Admin premium */
.admin-layout{position:relative;}
#loginBox{margin-top:60px !important;}
.admin-card h2,.admin-card h3,#formTitle{color:#fff !important;text-shadow:0 0 18px rgba(255,55,200,.45);}
.admin-product-row{background:rgba(255,255,255,.10) !important;}
.admin-product-row strong,.order-card strong,.coupon-row strong{color:#fff !important;}
.admin-product-row small,.order-card small{color:rgba(255,255,255,.72) !important;}

/* Entrada suave */
.hero-text,.hero-card,.features div,.toolbar,.section-title,.product-card,.admin-card{animation:enterMagic .75s ease both;}
@keyframes enterMagic{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.product-card:nth-child(2){animation-delay:.05s}.product-card:nth-child(3){animation-delay:.10s}.product-card:nth-child(4){animation-delay:.15s}.product-card:nth-child(5){animation-delay:.20s}.product-card:nth-child(6){animation-delay:.25s}

@media(max-width:850px){
  .hero-cotillon{min-height:auto !important;}
  .hero-text{padding:26px 18px !important;}
  .hero-text h2{font-size:42px !important;}
  .magic-orb{width:120px;height:120px;font-size:58px;}
  .features{grid-template-columns:1fr 1fr !important;}
  .site-header{position:relative !important;}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none !important;transition:none !important;}
}


/* Ajustes pedidos: carrito oculto, zoom de productos y marca correcta */
.cart-panel{
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  width:390px !important;
  max-width:92vw !important;
  height:100vh !important;
  z-index:999 !important;
  overflow:auto !important;
  transform:translateX(115%) !important;
  opacity:0 !important;
  pointer-events:none !important;
  transition:transform .28s ease, opacity .28s ease !important;
}
.cart-panel.open{
  transform:translateX(0) !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
.product-img-zoomable{
  cursor:zoom-in !important;
}
.image-zoom-box{
  text-align:center;
}
.image-zoom-box img{
  width:100%;
  max-height:72vh;
  object-fit:contain;
  border-radius:24px;
  box-shadow:0 0 40px rgba(255,55,200,.35),0 0 28px rgba(66,232,255,.22);
  background:rgba(255,255,255,.10);
}
.modal-box{
  max-width:900px !important;
}
@media(max-width:850px){
  .cart-panel{width:92vw !important;}
}


/* Botón WhatsApp del cartel de compra registrada */
.whatsapp-modal-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 210px !important;
  max-width: 260px !important;
  min-height: 42px !important;
  padding: 11px 18px !important;
  margin: 10px auto 8px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #21c063, #128c7e) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(18, 140, 126, .28) !important;
}

.mis-compras-list {
  display: grid;
  gap: 10px;
  margin: 10px 0 14px;
  max-height: 52vh;
  overflow: auto;
}

.mi-pedido-card {
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 12px;
  text-align: left;
}

.mi-pedido-card strong,
.mi-pedido-card small,
.mi-pedido-card p,
.mi-pedido-card b {
  display: block;
  margin-bottom: 6px;
}

.whatsapp-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  background: #21c063;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  font-size: 13px;
}

.empty-orders,
.loading-orders,
.account-email {
  opacity: .9;
  margin: 10px 0;
}


/* Mi cuenta - fondo premium */
.modal {
  backdrop-filter: blur(10px) !important;
}

.modal:not(.hidden) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 79, 184, .24), transparent 34%),
    radial-gradient(circle at 85% 20%, rgba(139, 92, 246, .24), transparent 32%),
    rgba(8, 4, 18, .72) !important;
}

.account-modal-box {
  width: min(94vw, 520px);
  max-height: 86vh;
  overflow: auto;
  padding: 22px;
  border-radius: 26px;
  border: 1px solid rgba(255, 255, 255, .22);
  background:
    linear-gradient(145deg, rgba(38, 18, 56, .96), rgba(20, 10, 34, .96)),
    radial-gradient(circle at top left, rgba(255, 79, 184, .20), transparent 40%);
  box-shadow:
    0 24px 70px rgba(0,0,0,.55),
    0 0 34px rgba(255,79,184,.18),
    inset 0 1px 0 rgba(255,255,255,.16);
  color: #fff;
  text-align: center;
  animation: accountPop .22s ease both;
}

.account-modal-box h2 {
  margin: 0 0 8px;
  font-size: clamp(24px, 5vw, 34px);
  color: #fff;
  text-shadow: 0 0 18px rgba(255,79,184,.35);
}

.account-modal-box h3 {
  margin: 16px 0 10px;
  color: #ffd6f0;
  font-size: 19px;
}

.account-email {
  display: inline-flex;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  color: #ffe8f7;
  font-size: 13px;
}

.account-modal-box .ghost.full,
.account-modal-box .primary.full {
  width: 100%;
  max-width: 320px;
  margin: 8px auto 0;
}

.mis-compras-list {
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  padding: 10px;
}

.mi-pedido-card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.07)) !important;
  border: 1px solid rgba(255, 214, 240, .20) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.20);
}

.loading-orders,
.empty-orders {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  padding: 14px;
  color: #fff;
}

@keyframes accountPop {
  from { opacity: 0; transform: translateY(10px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}


/* ===== Corrección Mi Cuenta + Botón WhatsApp ===== */
.modal:not(.hidden) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 79, 184, .24), transparent 34%),
    radial-gradient(circle at 85% 20%, rgba(139, 92, 246, .24), transparent 32%),
    rgba(8, 4, 18, .76) !important;
  backdrop-filter: blur(10px) !important;
}

.account-modal-box {
  width: min(94vw, 520px);
  max-height: 86vh;
  overflow: auto;
  padding: 22px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.22);
  background:
    linear-gradient(145deg, rgba(38,18,56,.96), rgba(20,10,34,.96)),
    radial-gradient(circle at top left, rgba(255,79,184,.20), transparent 40%);
  box-shadow:
    0 24px 70px rgba(0,0,0,.55),
    0 0 34px rgba(255,79,184,.18),
    inset 0 1px 0 rgba(255,255,255,.16);
  color: #fff;
  text-align: center;
}

.account-modal-box h2 {
  margin: 0 0 8px;
  color: #fff;
  text-shadow: 0 0 18px rgba(255,79,184,.35);
}

.account-email {
  display: inline-flex;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  color: #ffe8f7;
  font-size: 13px;
}

.mis-compras-list {
  display: grid;
  gap: 10px;
  margin: 10px 0 14px;
  max-height: 52vh;
  overflow: auto;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  padding: 10px;
}

.mi-pedido-card {
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.07)) !important;
  border: 1px solid rgba(255,214,240,.20) !important;
  border-radius: 16px;
  padding: 12px;
  text-align: left;
  box-shadow: 0 10px 24px rgba(0,0,0,.20);
}

.whatsapp-modal-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 210px !important;
  max-width: 260px !important;
  min-height: 42px !important;
  padding: 11px 18px !important;
  margin: 10px auto 8px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #21c063, #128c7e) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(18,140,126,.28) !important;
}

.whatsapp-mini {
  display: inline-flex;
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  background: #21c063;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  font-size: 13px;
}


/* ===== Panel Administrador ordenado ===== */
.admin-layout-clean,
.admin-main {
  width: min(1460px, 96vw) !important;
  margin: 0 auto !important;
  padding: 22px 14px 42px !important;
}

#adminPanel.admin-panel-order,
.admin-panel-order {
  width: 100% !important;
}

.admin-panel-order > header,
.admin-panel-order .admin-header,
header.admin-header {
  display: grid !important;
  grid-template-columns: 180px 1fr 220px !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 auto 26px !important;
  width: 100% !important;
}

.admin-panel-order h1,
.admin-header h1 {
  text-align: center !important;
  margin: 0 !important;
  font-size: clamp(30px, 4vw, 48px) !important;
  line-height: 1.05 !important;
}

#welcomeAdminMsg {
  text-align: center !important;
  margin-top: 8px !important;
}

#welcomeAdminMsg h3 {
  margin: 0 !important;
  font-size: clamp(18px, 2vw, 25px) !important;
  color: #ffe2f7 !important;
  text-shadow: 0 0 16px rgba(255,79,184,.45) !important;
}

.admin-panel-order .admin-actions,
.admin-header .admin-actions,
.admin-panel-order nav {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.admin-panel-order .brand,
.admin-header .brand,
.admin-panel-order .brand-wrap {
  justify-content: flex-start !important;
}

/* Grilla principal: Nuevo producto + Pedidos */
.admin-top-grid,
.admin-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 22px !important;
  align-items: start !important;
  width: 100% !important;
  margin: 0 auto 22px !important;
}

/* Tarjetas más parejas */
.admin-clean-card,
.admin-card {
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 24px !important;
  padding: 22px !important;
  margin: 0 !important;
}

/* Cupones y productos ocupan todo el ancho */
.coupon-admin-card,
.admin-card.coupon-admin-card {
  grid-column: 1 / -1 !important;
  margin-top: 22px !important;
}

.admin-panel-order > .admin-card,
.admin-panel-order section.admin-card {
  max-width: none !important;
}

/* Productos cargados ancho completo */
.admin-products,
#adminProducts {
  width: 100% !important;
}

.admin-products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important;
  gap: 14px !important;
}

/* Formulario nuevo producto más prolijo */
#productForm,
.product-form,
.admin-card form {
  display: grid !important;
  gap: 12px !important;
}

#productForm input,
#productForm textarea,
#productForm select,
.coupon-form input {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Pedidos más ordenados */
.orders-list,
#ordersList {
  display: grid !important;
  gap: 12px !important;
  max-height: 620px !important;
  overflow: auto !important;
  padding-right: 4px !important;
}

.order-card {
  border-radius: 18px !important;
  padding: 14px !important;
  background: rgba(255,255,255,.09) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
}

.order-card a.primary,
.order-card button {
  width: auto !important;
  min-width: 92px !important;
  min-height: 34px !important;
  padding: 8px 11px !important;
  font-size: 12px !important;
  border-radius: 11px !important;
  margin: 4px 4px 0 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Cupones mejor alineados */
.coupon-form {
  display: grid !important;
  grid-template-columns: 1fr 170px 170px !important;
  gap: 12px !important;
  align-items: center !important;
}

/* Header responsive */
@media (max-width: 900px) {
  .admin-panel-order > header,
  .admin-panel-order .admin-header,
  header.admin-header {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }

  .admin-panel-order .brand,
  .admin-header .brand,
  .admin-panel-order .brand-wrap,
  .admin-panel-order .admin-actions,
  .admin-header .admin-actions,
  .admin-panel-order nav {
    justify-content: center !important;
  }

  .admin-top-grid,
  .admin-grid {
    grid-template-columns: 1fr !important;
  }

  .coupon-form {
    grid-template-columns: 1fr !important;
  }
}


/* Variantes por color */
.variant-admin-box {
  margin-top: 14px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
}

.variant-admin-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.variant-admin-head h3 {
  margin: 0 0 4px;
}

.variant-admin-head p {
  margin: 0;
  font-size: 13px;
  opacity: .85;
}

.color-variants-list {
  display: grid;
  gap: 12px;
}

.variant-row {
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(0,0,0,.16);
  border: 1px solid rgba(255,255,255,.14);
}

.variant-row-title {
  font-weight: 900;
  color: #ffd6f0;
}

.small-btn {
  min-height: 34px !important;
  padding: 8px 12px !important;
  font-size: 12px !important;
  border-radius: 12px !important;
  width: auto !important;
}

.variant-label {
  display: block;
  margin-top: 8px;
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: 800;
  color: #ffe2f7;
}

.variant-select {
  width: 100%;
  min-height: 38px;
  border-radius: 12px;
  padding: 8px 10px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: inherit;
  outline: none;
  margin-bottom: 8px;
}

.variant-select option {
  color: #22102f;
}


/* Ajustes finales selector color y stock por color */
.variant-select {
  color: #ffffff !important;
  background: rgba(28, 10, 45, .92) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  font-weight: 800 !important;
}

.variant-select option {
  color: #ffffff !important;
  background: #231135 !important;
}

.add-color-btn,
#addColorVariantBtn {
  min-width: 150px !important;
  width: auto !important;
  white-space: nowrap !important;
  padding: 10px 16px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  border-radius: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.variant-color-stock {
  color: #ffffff !important;
}


/* Selector de cantidad */
.qty-selector {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 10px auto 8px;
  padding: 6px;
  border-radius: 16px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.16);
}

.qty-selector button {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.qty-selector input {
  width: 58px !important;
  height: 32px !important;
  text-align: center !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  background: rgba(28,10,45,.92) !important;
  color: #fff !important;
  font-weight: 900 !important;
}


/* Detalle de productos dentro de pedidos */
.order-products {
  margin: 10px 0;
  padding: 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  display: grid;
  gap: 7px;
}

.order-products.empty {
  opacity: .8;
  font-size: 13px;
}

.order-product-line {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
  font-size: 13px;
}

.order-color {
  display: inline-flex;
  margin-left: 4px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  color: #ffe2f7;
  font-size: 12px;
  font-weight: 800;
}

.order-product-line b {
  color: #fff;
  white-space: nowrap;
}


.discount-line{
  margin:10px 0;
  padding:10px 12px;
  border:1px solid rgba(255,77,166,.55);
  border-radius:14px;
  background:rgba(255,240,248,.92);
  display:flex;
  flex-direction:column;
  gap:4px;
  font-size:.92rem;
}
.discount-line b{ color:#b10068; }

/* Variantes nuevas: tamaño y número/letra */
.letter-image-box{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:0;
  margin:4px 0 8px;
}
.letter-image-box img{
  width:72px;
  height:72px;
  object-fit:cover;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.24);
  box-shadow:0 0 16px rgba(255,105,180,.28);
}
.order-product-line .order-color{
  display:inline-block;
  margin-left:6px;
}


/* FIX variantes visibles en la publicación */
.product-option-block{
  width:100%;
  margin:10px 0;
  padding:10px;
  border-radius:16px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
}
.product-option-block .variant-label{
  display:block !important;
  margin:0 0 7px !important;
  font-size:13px !important;
  font-weight:900 !important;
  color:#fff !important;
}
.product-option-block .variant-select{
  display:block !important;
  width:100% !important;
  min-height:42px !important;
}
.option-size-block{border-color:rgba(0,194,255,.35);}
.option-letter-block{border-color:rgba(255,210,90,.35);}
.option-color-block{border-color:rgba(255,79,184,.35);}
.letter-image-box{min-height:0 !important;margin-top:8px !important;}
.letter-image-box img{display:block !important;margin:auto !important;}