/* FRESH AGUI V5.3 — fotos reales del usuario + banner admin integrado. */
:root{--fa-blue:#0968d9;--fa-deep:#043b82;--fa-cyan:#27b9ef;--fa-ice:#f4fbff;--fa-line:#d7e9f4;--fa-ink:#113a5e}
body{font-size:16px}

/* ---------- CLIENTE: identidad premium y producto real ---------- */
.customerShell{width:min(1500px,calc(100% - 34px))}
.customerTop{min-height:82px}
.brandDrop{width:68px;height:68px;border-radius:18px}.brandText b{font-size:34px}.brandText strong{font-size:11px}
.customerHero{min-height:435px;border-radius:34px;grid-template-columns:1.02fr .98fr;background:linear-gradient(123deg,#03458f 0%,#0873dc 47%,#29b9ed 100%)}
.heroContent{padding:50px 58px}.heroContent h1{font-size:clamp(52px,5vw,78px);max-width:660px}.heroContent p{font-size:16px;max-width:620px}.heroKicker{padding:9px 15px;font-size:10px}.heroButtons a{height:51px}
.heroProducts{min-height:435px;position:relative;isolation:isolate}
.heroProductStage{position:absolute;inset:22px 24px 18px 6px;border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(229,248,255,.83));border:1px solid rgba(255,255,255,.95);box-shadow:0 25px 55px rgba(0,63,128,.22);overflow:hidden;transform:rotate(-1deg)}
.heroProductStage:before{content:"";position:absolute;inset:auto -80px -100px 25px;height:220px;border-radius:50%;border:24px solid rgba(38,179,238,.17);border-top-color:rgba(8,111,215,.35);transform:rotate(-4deg)}
.stageBubble{position:absolute;border-radius:50%;background:rgba(50,187,241,.11);border:1px solid rgba(40,157,219,.12)}.bubbleA{width:170px;height:170px;right:-55px;top:-45px}.bubbleB{width:72px;height:72px;left:42px;top:50px}
.heroJugWrap{position:absolute;z-index:3;right:115px;bottom:22px;width:235px;height:330px;display:flex;align-items:flex-end;justify-content:center}.heroJugWrap img{max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 25px 23px rgba(0,67,130,.20))}.heroJugWrap span{position:absolute;right:8px;top:52px;background:#0872d9;color:#fff;font-size:10px;font-weight:950;padding:8px 10px;border-radius:999px;box-shadow:0 8px 18px rgba(8,105,208,.18)}
.heroDrink{position:absolute;z-index:4;bottom:23px;display:flex;align-items:flex-end;justify-content:center;filter:drop-shadow(0 14px 13px rgba(0,62,111,.15))}.heroDrink img{max-height:100%;max-width:100%;object-fit:contain}.heroCoke{height:155px;width:74px;right:48px}.heroGlup{height:144px;width:72px;right:7px}.heroJusty{height:135px;width:65px;right:78px;bottom:14px}
.heroPrice{position:absolute;z-index:6;left:24px;bottom:28px;background:#fff;border:1px solid #d7e9f4;border-radius:17px;padding:13px 16px;box-shadow:0 15px 30px rgba(10,79,138,.12)}.heroPrice small{display:block;font-size:8px;color:#6e879a;font-weight:900;letter-spacing:.08em}.heroPrice b{display:block;font-size:27px;color:#0867ce;margin-top:3px;letter-spacing:-.04em}
.heroDeliveryChip{position:absolute;z-index:6;left:24px;top:28px;display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.95);border:1px solid #d7eaf6;border-radius:999px;padding:10px 13px;color:#24638f;font-size:9px}.heroDeliveryChip b{font-size:9px;color:#0872d6}.heroDeliveryChip span{color:#8297a7}

.storeLayout{grid-template-columns:minmax(0,1fr) 400px;gap:18px}.storeMain,.checkoutCard{border-radius:27px}.storeMain{padding:25px}.productGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.productCard{border-radius:19px;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;background:#fff}.productCard:hover{transform:translateY(-3px);box-shadow:0 18px 34px rgba(17,79,129,.12);border-color:#b7daf0}.productVisual{height:225px;background:radial-gradient(circle at 50% 35%,#fff 0,#f4fbff 52%,#eaf7ff 100%)}.productVisual img{width:92%;height:91%;object-fit:contain;filter:drop-shadow(0 12px 15px rgba(26,82,120,.08))}.productTag{z-index:4}.productInfo{padding:14px 15px 15px}.productInfo h3{font-size:14px;min-height:36px}.productPrices strong{font-size:22px}.qtyControl{height:40px}.checkoutCard{top:14px;padding:20px}

/* ---------- ADMIN: no vuelve a colapsar en una franja azul ---------- */
.adminBody{background:#edf5fa}
.adminShell{width:100%;max-width:none;grid-template-columns:238px minmax(0,1fr)!important;display:grid!important;min-height:100vh}
.adminSide{width:238px!important;min-width:238px;position:sticky!important;top:0;height:100vh!important;padding:18px 14px;background:linear-gradient(180deg,#073f86,#052e68)}
.adminBrand{padding:5px 7px 16px}.adminBrand img{width:52px;height:52px}.adminBrand b{font-size:19px}.adminBrand strong{font-size:8px}
.adminNav{gap:5px;margin-top:15px}.adminNav button{padding:11px 11px}.adminNav button b{font-size:10px}.adminNav button span{font-size:14px}
.sideContact{padding:10px}.sideContact b{font-size:13px}
.adminMain{padding:18px 20px 22px!important;min-width:0;overflow:hidden}.adminHeader{border-radius:20px;padding:16px 18px}.adminWelcome h1{font-size:26px}.adminMetrics{gap:9px}.adminMetrics article{min-height:103px;padding:12px}.adminContentGrid{grid-template-columns:minmax(0,1fr) 300px;gap:12px}.kanban{grid-template-columns:repeat(4,minmax(190px,1fr));overflow-x:auto;padding-bottom:4px}.kanbanCol{min-width:190px}.adminAside{grid-template-columns:1fr!important}.qrPanel{grid-column:auto!important}
.adminFooter:after{content:" · V5.3";color:#6f8aa1;font-weight:800}

/* ---------- LOGIN ---------- */
.loginBody{background:radial-gradient(circle at 15% 15%,rgba(40,184,239,.16),transparent 26%),linear-gradient(145deg,#f7fcff,#edf7fd);padding:28px}
.loginWrap{width:min(1120px,100%);min-height:650px;border-radius:34px;box-shadow:0 38px 90px rgba(8,72,130,.16)}
.loginVisual{background:linear-gradient(135deg,#043c83,#0874db 55%,#28b5ee);position:relative;overflow:hidden}.loginVisual:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;border:55px solid rgba(255,255,255,.07);right:-250px;bottom:-260px}.loginVisualInner{max-width:470px}.loginVisual h1{font-size:58px;line-height:.97;letter-spacing:-.055em}.loginVisual p{font-size:14px;max-width:430px}.loginLogoPlate{width:185px;height:120px;border-radius:24px}.loginCard{padding:58px 52px}.loginCard>img{width:95px;height:72px;object-fit:contain;border-radius:16px;margin-bottom:25px}.loginCard h2{font-size:38px;letter-spacing:-.04em}.loginCard>p{font-size:12px;max-width:380px}.loginCard .field input{height:56px;border-radius:14px}.loginCard .sendOrder{height:55px;border-radius:14px}

/* Tablet / Windows con escalado: conserva dashboard lateral. */
@media (max-width:1180px) and (min-width:761px){
  .customerShell{width:calc(100% - 22px)}.storeLayout{grid-template-columns:1fr 350px}.productGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.productVisual{height:205px}
  .adminShell{grid-template-columns:190px minmax(0,1fr)!important}.adminSide{width:190px!important;min-width:190px;padding:14px 10px}.adminBrand b{font-size:16px}.adminBrand img{width:46px;height:46px}.adminNav button{padding:10px 8px;gap:7px}.sideContact small{font-size:8px}.adminMain{padding:12px!important}.adminHeader{align-items:flex-start}.adminWelcome h1{font-size:22px}.adminAvatar{display:none}.adminMetrics{grid-template-columns:repeat(3,minmax(0,1fr))}.adminMetrics article:nth-child(4),.adminMetrics article:nth-child(5){min-height:90px}.adminContentGrid{grid-template-columns:1fr}.adminAside{grid-template-columns:repeat(3,minmax(0,1fr))!important}.qrPanel{grid-column:auto!important}.kanban{grid-template-columns:repeat(4,minmax(175px,1fr))}
  .loginWrap{grid-template-columns:1fr 1fr;min-height:590px}.loginVisual{padding:32px}.loginVisual h1{font-size:43px}.loginCard{padding:40px 32px}
}

@media (max-width:900px){
  .customerHero{min-height:400px;grid-template-columns:1fr}.heroContent{max-width:61%;padding:38px 28px}.heroContent h1{font-size:48px}.heroProducts{position:absolute;right:0;top:0;bottom:0;width:48%;min-height:0}.heroProductStage{inset:35px 14px 28px 0}.heroJugWrap{width:180px;height:270px;right:55px}.heroDrink{display:none}.heroPrice{left:14px;bottom:18px;padding:10px}.heroPrice b{font-size:21px}.heroDeliveryChip{left:14px;top:18px}.storeLayout{grid-template-columns:1fr}.checkoutCard{position:static}.businessBand{grid-template-columns:repeat(2,1fr)}
}

/* Solo teléfono real: barra superior compacta. */
@media (max-width:760px){
  .adminShell{display:block!important}.adminSide{position:static!important;width:100%!important;min-width:0;height:auto!important;padding:9px 10px}.adminBrand{border:0;padding:4px}.adminBrand img{width:43px;height:43px}.adminBrand strong{font-size:7px}.adminBrand b{font-size:16px}.adminNav{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:7px}.adminNav button{padding:8px 4px;justify-content:center}.adminNav button b{display:none}.adminNav button span{width:auto}.sideContact,.sideDev{display:none}.adminMain{padding:8px!important}.adminMetrics{grid-template-columns:repeat(2,1fr)}.adminMetrics article:last-child{grid-column:1/3}.adminContentGrid{grid-template-columns:1fr}.adminAside{grid-template-columns:1fr!important}.kanban{grid-template-columns:1fr;overflow:visible}.kanbanCol{min-width:0}
  .customerShell{width:calc(100% - 12px)}.brandDrop{width:53px;height:53px}.brandText b{font-size:23px}.customerHero{min-height:350px;border-radius:25px}.heroContent{max-width:76%;padding:28px 20px}.heroContent h1{font-size:39px}.heroContent p{font-size:11px}.heroProductStage{right:-28px;width:230px}.heroJugWrap{width:135px;height:210px;right:30px}.heroPrice{left:8px;bottom:12px}.heroPrice small{font-size:6px}.heroPrice b{font-size:17px}.heroDeliveryChip{display:none}.productVisual{height:150px}.productGrid{gap:8px}.productInfo h3{font-size:11px}.productPrices strong{font-size:17px}.businessBand{grid-template-columns:1fr}
  .loginBody{padding:10px}.loginWrap{grid-template-columns:1fr;min-height:auto}.loginVisual{min-height:245px;padding:22px}.loginLogoPlate{width:125px;height:82px;margin-bottom:18px}.loginVisual h1{font-size:37px}.loginVisual p{font-size:11px}.loginCard{padding:28px 22px}.loginCard>img{display:none}.loginCard h2{font-size:29px}
}
/* V5.2.1 audit fixes after desktop/tablet/mobile render */
@media (max-width:1180px) and (min-width:761px){
  .adminNav{display:grid!important;grid-template-columns:1fr!important;gap:5px!important}
  .adminNav button{justify-content:flex-start!important;padding:10px 9px!important}
  .adminNav button b{display:block!important;font-size:9px!important}
  .adminNav button span{width:22px!important}
}
@media (max-width:900px) and (min-width:761px){
  .heroContent{max-width:55%}
  .heroContent p{max-width:430px}
}
@media (max-width:760px){
  .customerHero{min-height:560px!important;display:block!important}
  .heroContent{position:relative;z-index:5;max-width:none!important;width:100%;padding:28px 20px 0!important}
  .heroContent h1{font-size:41px!important;max-width:330px;margin:14px 0 12px!important}
  .heroContent p{font-size:11px!important;line-height:1.5;max-width:330px!important;min-height:34px}
  .heroButtons{margin-top:15px}.secondaryHeroBtn{display:none}.heroTrust{display:none}
  .heroProducts{position:absolute!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%!important;height:250px!important;min-height:250px!important}
  .heroProductStage{left:14px!important;right:14px!important;top:8px!important;bottom:14px!important;width:auto!important;height:auto!important;transform:none!important;border-radius:23px!important}
  .heroJugWrap{right:28px!important;bottom:8px!important;width:140px!important;height:205px!important}
  .heroJugWrap span{right:0!important;top:36px!important;font-size:8px!important;padding:6px 8px!important}
  .heroPrice{left:14px!important;bottom:18px!important;padding:9px 11px!important;border-radius:13px!important}.heroPrice b{font-size:19px!important}.heroPrice small{font-size:6px!important}
  .heroDeliveryChip{display:flex!important;left:14px!important;top:15px!important;font-size:7px!important;padding:7px 9px!important}.heroDeliveryChip b{font-size:7px!important}
  .heroCoke,.heroGlup,.heroJusty{display:none!important}
  .splashRing{display:none!important}
}


/* ---------- V5.3: banner real integrado al ADMIN ---------- */
.adminBrandBanner{position:relative;min-height:235px;margin-top:13px;border:1px solid #d8e9f4;border-radius:22px;overflow:hidden;background-image:url('/static/images/admin_banner_fresh_agui.png');background-size:cover;background-position:center right;box-shadow:0 18px 38px rgba(8,72,130,.10);isolation:isolate}
.adminBrandBanner:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 34%,rgba(247,252,255,.46) 58%,rgba(235,248,255,.12) 100%);z-index:0}
.adminBrandBanner:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(15,104,191,.06));backdrop-filter:saturate(1.05);z-index:0;pointer-events:none}
.adminBrandBannerShade{position:absolute;left:-80px;bottom:-115px;width:690px;height:220px;border-radius:50%;background:rgba(37,174,236,.10);filter:blur(30px);z-index:0}
.adminBrandBannerCopy{position:relative;z-index:1;max-width:560px;padding:46px 42px;color:#103c63}.adminBrandBannerCopy span{display:inline-block;font-size:9px;font-weight:950;letter-spacing:.14em;color:#0872d6;background:rgba(255,255,255,.72);border:1px solid rgba(168,211,239,.75);padding:7px 10px;border-radius:999px}.adminBrandBannerCopy h2{font-size:38px;line-height:1;margin:13px 0 9px;letter-spacing:-.045em;color:#0b4f91}.adminBrandBannerCopy p{margin:0;font-size:12px;color:#5c7b92;max-width:430px}

/* Las fotos exactas enviadas por el usuario deben verse como fotos, no como iconos/dibujos. */
.productVisual img[src*="_real_usuario"]{width:88%;height:90%;object-fit:contain;object-position:center;filter:drop-shadow(0 12px 15px rgba(26,82,120,.10));border-radius:12px}

@media (max-width:1180px) and (min-width:761px){.adminBrandBanner{min-height:200px}.adminBrandBannerCopy{padding:34px 30px}.adminBrandBannerCopy h2{font-size:31px}.adminBrandBanner:before{background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.88) 42%,rgba(247,252,255,.40) 67%,rgba(235,248,255,.10) 100%)}}
@media (max-width:760px){.adminBrandBanner{min-height:185px;border-radius:17px;background-position:66% center}.adminBrandBanner:before{background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.89) 58%,rgba(245,251,255,.42) 100%)}.adminBrandBannerCopy{padding:25px 18px;max-width:72%}.adminBrandBannerCopy h2{font-size:27px}.adminBrandBannerCopy p{font-size:10px}}


/* V5.4 — INDUVEXA branding + real catalog imagery */
.sideDevBrand{margin-top:12px!important;padding:10px!important;border:1px solid rgba(237,184,54,.34);border-radius:15px;background:linear-gradient(145deg,rgba(6,13,24,.86),rgba(14,30,51,.78));box-shadow:0 10px 25px rgba(0,0,0,.16);gap:10px!important;color:white!important}
.sideDevBrand>img{width:72px;height:40px;object-fit:contain;flex:0 0 auto}.sideDevBrand>div{min-width:0}.sideDevBrand small{font-size:6px!important;line-height:1.25;letter-spacing:.05em;color:#cbd5e1!important}.sideDevBrand b{display:block;margin-top:3px;font-size:10px!important;letter-spacing:.09em;color:#efbd4c!important}
.induvexaBrandCard{background:linear-gradient(135deg,#07111f,#0e2034)!important;border-color:#d5ae4a!important;box-shadow:0 12px 28px rgba(7,17,31,.13)!important}.induvexaBrandCard>img{width:82px;height:44px;object-fit:contain;flex:0 0 auto}.induvexaBrandCard small{color:#d3dbe5!important;font-size:6px!important;letter-spacing:.04em}.induvexaBrandCard b{color:#f1bd46!important;font-size:11px!important;letter-spacing:.08em}
.loginDevBrand{margin-top:20px;padding:11px 12px;border:1px solid #d9c184;border-radius:14px;background:linear-gradient(135deg,#09111e,#102238);display:flex;align-items:center;gap:12px}.loginDevBrand img{width:96px;height:48px;object-fit:contain}.loginDevBrand div{display:flex;flex-direction:column}.loginDevBrand small{font-size:6px;letter-spacing:.08em;color:#cbd5df}.loginDevBrand b{margin-top:3px;font-size:11px;letter-spacing:.1em;color:#efbd4c}
.productVisual img[src*="agua_fresh_15l_real"],.productVisual img[src*="agua_fresh_8l_real"],.productVisual img[src*="agua_12l_real"],.productVisual img[src*="agua_5l_real"],.productVisual img[src*="agua_400ml_real"]{width:86%;height:90%;object-fit:contain;object-position:center;filter:drop-shadow(0 13px 18px rgba(24,82,121,.10));border-radius:10px}
@media(max-width:760px){.induvexaBrandCard>img{width:70px;height:38px}.loginDevBrand img{width:84px;height:42px}.sideDevBrand{display:none!important}}