/* =====================================================================================
   VITRINA CON EL LORITO (5-oct-2026, idea de Oscar). Los productos van parados en repisas
   de madera, con la etiqueta de precio colgada del borde, y el lorito de la marca (el del
   sombrero, /tienda/periquito.png: 16 cuadros de 150x150 = reposo, caminar, volar, celebrar)
   atiende desde el mostrador. Sin librerías, sin 3D: una imagen de 72 KB y este CSS.
   Se carga DESPUÉS de tienda.css y le gana a sus reglas de tarjeta.
   ===================================================================================== */
.fc-lorito-sp{display:block;width:var(--s,72px);height:var(--s,72px);background:url(/tienda/periquito-hd.webp?v=1) 0 0/1600% 100% no-repeat;flex:none}
/* periquito-hd.webp = cuadros de 300 px sacados del atlas original (carga/lorito_hd.py): nítido en celular */

/* --- la vitrina: repisas de madera --- */
.fc-lista{background:linear-gradient(180deg,var(--f) 0,#FBF7EF 180px,#FBF7EF 100%)}
.fc-grid{column-gap:0;row-gap:30px;padding-top:8px}
@media(min-width:720px){.fc-grid{column-gap:0;row-gap:38px}}
@media(min-width:1060px){.fc-grid{column-gap:0;row-gap:42px}}
.fc-pc{background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;padding:0 8px}
@media(min-width:720px){.fc-pc{padding:0 12px}}
.fc-pc:hover{transform:none;box-shadow:none}
.fc-pc-img{background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.fc-pc-img::after{left:18%;right:18%;bottom:-7px;height:12px;background:radial-gradient(closest-side,rgba(70,42,14,.38),rgba(70,42,14,0));z-index:1}
/* la tabla: se pega con la de la tarjeta vecina porque las columnas no tienen espacio entre sí */
.fc-pc-img::before{content:"";position:absolute;left:-8px;right:-8px;bottom:-22px;height:24px;z-index:0;
  background:linear-gradient(180deg,#F6E3C2 0,#EBCB9C 40%,#D9AE76 41%,#C8955A 70%,#A8743E 100%);
  box-shadow:0 12px 16px -8px rgba(90,55,20,.5)}
@media(min-width:720px){.fc-pc-img::before{left:-12px;right:-12px;height:26px;bottom:-24px}}
.fc-pc-img img{inset:8% 6% -6px;width:88%;height:calc(92% + 6px);z-index:2;object-fit:contain;object-position:50% 100%;filter:drop-shadow(0 8px 8px rgba(60,38,14,.22));transition:transform .3s cubic-bezier(.2,.8,.3,1.4)}
.fc-pc:hover .fc-pc-img img,.fc-pc-img:focus-visible img{transform:translateY(-8px) scale(1.03)}
.fc-pc-img:active img{transform:translateY(-3px) scale(.98)}
.fc-pc-b{padding:32px 2px 4px;gap:5px}
@media(min-width:760px){.fc-pc-b{padding:36px 4px 6px}}
/* la etiqueta de precio, colgada del borde de la repisa */
.fc-pc-pie{align-items:center}
.fc-pc-p{position:relative;display:inline-block;padding:6px 10px 6px 13px;border-radius:4px 10px 10px 4px;background:#FFFDF6;border:1.5px solid #E7D7B8;box-shadow:0 3px 8px rgba(90,55,20,.12);color:var(--vo)}
.fc-pc-p::before{content:"";position:absolute;left:4px;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:#D8C29A}
.fc-add{height:38px}
@media(max-width:420px){.fc-pc-p{padding:5px 8px 5px 11px}.fc-pc-b{padding:24px 0 2px}}

/* --- el lorito en el mostrador del encabezado --- */
.fc-hero-lorito{display:none}
@media(min-width:900px){
  .con-lorito .fc-hero-in{padding-right:330px}
  .fc-hero-lorito{display:block;position:absolute;right:max(28px,calc((100vw - 1200px)/2 + 28px));bottom:44px;width:300px;height:230px;z-index:1;pointer-events:none}
  .fc-hero-lorito .fc-lorito-sp{--s:170px;position:absolute;right:50px;bottom:22px}
  .fc-hero-lorito .mostrador{position:absolute;right:0;bottom:0;width:270px;height:30px;border-radius:12px 12px 6px 6px;background:linear-gradient(180deg,#F0D3A6 0,#D9A766 45%,#B07A40 100%);box-shadow:0 18px 30px -10px rgba(0,0,0,.55),inset 0 2px 0 rgba(255,255,255,.35)}
  .fc-hero-lorito .glo{position:absolute;left:-30px;top:0;width:200px;padding:12px 14px;border-radius:18px 18px 4px 18px;background:#fff;color:var(--t);font:500 13.5px/1.35 var(--fb);box-shadow:0 14px 30px rgba(0,0,0,.3);animation:fcGloEntra .5s .6s both}
  .fc-hero-lorito .glo b{color:var(--vo)}
}
@keyframes fcGloEntra{from{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:none}}
.fc-hero-tip{display:flex;align-items:center;gap:8px;margin-top:14px;color:#E4F5E8;font:600 13.5px/1.3 var(--fb)}
.fc-hero-tip .fc-lorito-sp{--s:46px;margin:-10px -2px -6px -6px}
@media(min-width:900px){.fc-hero-tip{display:none}}

/* --- el lorito de la esquina (sale cuando el del mostrador se va de la vista) --- */
.fc-lorito{position:fixed;left:8px;bottom:10px;z-index:72;display:flex;align-items:flex-end;padding:0;border:0;background:none;cursor:pointer;transition:bottom .25s,transform .25s,opacity .25s;-webkit-tap-highlight-color:transparent}
.fc-lorito .fc-lorito-sp{--s:78px;filter:drop-shadow(0 6px 8px rgba(15,27,45,.25))}
.fc-lorito::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:7px;border-radius:9px;background:linear-gradient(180deg,#D9A766,#A8743C);z-index:-1;box-shadow:0 4px 8px rgba(0,0,0,.2)}
.fc-lorito .glo{position:absolute;left:64px;bottom:60px;white-space:nowrap;padding:7px 12px;border-radius:14px 14px 14px 4px;background:#fff;color:var(--ao);font:700 13px/1 var(--fb);box-shadow:0 8px 20px rgba(15,27,45,.2);opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;pointer-events:none}
.fc-lorito.habla .glo{opacity:1;transform:none}
.fc-lorito.oculto{opacity:0;transform:translate(-30px,40px);pointer-events:none}
.fc-lorito.llega{animation:fcLlega .9s cubic-bezier(.2,.7,.3,1) both}
@keyframes fcLlega{from{transform:translate(70px,-280px)}to{transform:none}}
/* con la barra del carrito abajo, el lorito sube para no taparla */
body.con-barra .fc-lorito{bottom:82px}
@media(max-width:899px){body.con-fija .fc-lorito{bottom:78px}}
@media(max-width:480px){.fc-lorito .fc-lorito-sp{--s:66px}.fc-lorito .glo{left:54px;bottom:52px}}

/* --- la conversación con el lorito (va dentro de la hoja .fc-hoja-c) --- */
.fc-lr-cab{display:flex;align-items:flex-end;gap:8px;margin-bottom:12px}
.fc-lr-cab .fc-lorito-sp{--s:84px;margin:-10px -6px -4px -8px}
.fc-lr-glo{position:relative;flex:1;min-height:52px;padding:11px 14px;border-radius:18px 18px 18px 4px;background:#EEF6F0;color:var(--t);font:500 14.5px/1.4 var(--fb)}
.fc-lr-glo b{color:var(--vo)}
.fc-lr-glo .pts{display:inline-flex;gap:4px;padding:6px 0}
.fc-lr-glo .pts i{width:7px;height:7px;border-radius:50%;background:#8BB79A;animation:fcPts 1s infinite}
.fc-lr-glo .pts i:nth-child(2){animation-delay:.15s}
.fc-lr-glo .pts i:nth-child(3){animation-delay:.3s}
@keyframes fcPts{0%,80%,100%{opacity:.3;transform:none}40%{opacity:1;transform:translateY(-3px)}}
.fc-lr-cab .fc-hoja-cerrar{align-self:flex-start;flex:none}
.fc-lr-prod{display:flex;align-items:center;gap:12px;padding:10px;border-radius:16px;border:1px solid var(--b);background:#fff}
.fc-lr-prod .ft{flex:none;width:64px;height:64px;border-radius:14px;background:radial-gradient(75% 70% at 50% 42%,#fff 0%,#EEF5F0 100%);display:grid;place-items:center}
.fc-lr-prod .ft img{width:82%;height:82%;object-fit:contain}
.fc-lr-prod h3{font:600 1.02rem/1.2 var(--ff);color:var(--ao)}
.fc-lr-prod .ver{font-size:.82rem;font-weight:600;color:var(--vo);text-decoration:underline;text-underline-offset:3px}
.fc-lr-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.fc-lr-chips button{flex:1 1 auto;min-height:44px;padding:0 14px;border-radius:999px;border:1.5px solid #CFE3D4;background:#fff;color:var(--ao);font:700 14px var(--fb);cursor:pointer;transition:background .15s,border-color .15s}
.fc-lr-chips button:hover{border-color:#9EDDA9}
.fc-lr-chips button.on{background:var(--ao);border-color:var(--ao);color:#fff}
.fc-lr-chips button.ya{background:linear-gradient(180deg,#3AD83A,#22B922);border-color:transparent;color:#052E12}
.fc-lr-chips button.ya.on{box-shadow:0 0 0 3px rgba(38,197,38,.35)}
.fc-lr-preg{position:relative;display:flex;margin-top:12px}
.fc-lr-preg input{width:100%;height:46px;border-radius:999px;border:1.5px solid #D6E2DA;background:#F7FAF8;padding:0 54px 0 16px;font:500 16px var(--fb);color:var(--t);outline:none}
.fc-lr-preg input:focus{border-color:var(--vo);background:#fff}
.fc-lr-preg button{position:absolute;right:4px;top:4px;width:38px;height:38px;border-radius:50%;border:0;background:var(--ao);color:#fff;display:grid;place-items:center;cursor:pointer}
.fc-lr-preg button svg{width:17px;height:17px}
.fc-lr-zona:empty{display:none}
.fc-lr-zona{margin-top:14px}
.fc-lr-zona ul{display:grid;gap:6px;margin-top:10px}
.fc-lr-zona li{position:relative;padding-left:22px;font-size:14px;line-height:1.4;color:#2A3A50}
.fc-lr-zona li::before{content:"";position:absolute;left:4px;top:6px;width:9px;height:9px;border-radius:50%;background:var(--v)}
.fc-lr-zona .uso{font-size:14.5px;line-height:1.5;color:#2A3A50}
.fc-lr-zona .ficha{display:inline-block;margin-top:10px;font-size:.88rem;font-weight:700;color:var(--vo);text-decoration:underline;text-underline-offset:3px}
.fc-lr-mini{display:grid;gap:8px}
.fc-lr-mini button{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:14px;border:1px solid var(--b);background:#fff;text-align:left;cursor:pointer;font:600 14px/1.25 var(--fb);color:var(--t)}
.fc-lr-mini button:hover{border-color:#9EDDA9}
.fc-lr-mini img{width:48px;height:48px;object-fit:contain;flex:none}
.fc-lr-mini b{display:block;margin-top:2px;color:var(--vo);font-weight:800}
.fc-lr-acc{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.fc-hoja .fc-lr-acc .fci-btn{flex:1 1 auto;width:auto;margin-top:0}
.fc-lr-chat{display:block;width:100%;height:min(62vh,520px);border:0;border-radius:16px;background:#fff;box-shadow:0 0 0 1px var(--b)}
.fc-lr-listo{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fc-hoja .fc-lr-listo .fci-btn{margin-top:0;width:100%}
@media(min-width:720px){.fc-hoja-c{width:540px}}
@media(prefers-reduced-motion:reduce){.fc-lorito.llega,.fc-hero-lorito .glo{animation:none}.fc-pc-img img{transition:none}}

/* --- HOJITAS (Oscar: "hojitas que haya por ahí moviéndose") ---
   En el encabezado vuelan con el viento; en la vitrina caen despacio POR DETRÁS de las repisas
   (capa pegajosa del alto de la pantalla, z 0; la grilla va en z 1). Solo transform: no pesa. */
.fc-hojitas i,.fc-caen i,.fc-brote i{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 21C3 10 10 3 21 2c0 11-7 19-18 19z' fill='%2326C526'/%3E%3Cpath d='M3.5 20.5 15 9' stroke='%230B6630' stroke-width='1.3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.fc-hojitas i:nth-child(3n+2),.fc-caen i:nth-child(3n+2),.fc-brote i:nth-child(3n+2){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 21C3 10 10 3 21 2c0 11-7 19-18 19z' fill='%235FE35F'/%3E%3Cpath d='M3.5 20.5 15 9' stroke='%2322A022' stroke-width='1.3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.fc-hojitas i:nth-child(3n+3),.fc-caen i:nth-child(3n+3),.fc-brote i:nth-child(3n+3){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 21C3 10 10 3 21 2c0 11-7 19-18 19z' fill='%23A9D84B'/%3E%3Cpath d='M3.5 20.5 15 9' stroke='%236E9A1E' stroke-width='1.3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E")}
.fc-hojitas{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.fc-hojitas i{position:absolute;left:-40px;top:var(--y);width:var(--t,22px);height:var(--t,22px);opacity:.85;animation:fcViento var(--d,16s) linear var(--w,0s) infinite;will-change:transform}
@keyframes fcViento{
  0%{transform:translate3d(0,0,0) rotate(0)}
  25%{transform:translate3d(28vw,-18px,0) rotate(80deg)}
  50%{transform:translate3d(55vw,14px,0) rotate(170deg)}
  75%{transform:translate3d(82vw,-10px,0) rotate(260deg)}
  100%{transform:translate3d(calc(100vw + 80px),8px,0) rotate(360deg)}}
.fc-lista{position:relative}
.fc-lista>.fci-wrap{position:relative;z-index:1}
.fc-caen{position:sticky;top:0;height:100vh;margin-bottom:-100vh;overflow:hidden;pointer-events:none;z-index:0}
.fc-caen i{position:absolute;top:-30px;left:var(--x);width:var(--t,20px);height:var(--t,20px);opacity:.8;animation:fcCae var(--d,20s) linear var(--w,0s) infinite;will-change:transform}
@keyframes fcCae{
  0%{transform:translate3d(0,0,0) rotate(0)}
  20%{transform:translate3d(34px,22vh,0) rotate(70deg)}
  40%{transform:translate3d(-18px,44vh,0) rotate(150deg)}
  60%{transform:translate3d(30px,66vh,0) rotate(220deg)}
  80%{transform:translate3d(-14px,88vh,0) rotate(300deg)}
  100%{transform:translate3d(10px,calc(100vh + 60px),0) rotate(380deg)}}
/* al agregar al carrito, el lorito suelta un puñado de hojitas */
.fc-lr-cab{position:relative}
.fc-brote{position:absolute;left:30px;top:30px;width:0;height:0;pointer-events:none;z-index:3}
.fc-brote i{position:absolute;left:-9px;top:-9px;width:18px;height:18px;animation:fcBrote 1.1s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes fcBrote{0%{transform:translate(0,0) rotate(0) scale(.4);opacity:1}70%{opacity:1}100%{transform:translate(var(--bx),var(--by)) rotate(var(--br)) scale(1);opacity:0}}
@media(prefers-reduced-motion:reduce){.fc-hojitas,.fc-caen,.fc-brote{display:none}}
/* los sellos (Marca propia, Combo, Precio por cantidad) van pegados al canto de la repisa, como
   las etiquetas de un supermercado: arriba tapaban la tapa de los envases altos */
.fc-pc .fc-sello{top:auto;bottom:-21px;left:2px;flex-direction:row;gap:4px;z-index:3}
.fc-pc .fc-sello span{padding:4px 8px;font-size:10px;box-shadow:0 1px 3px rgba(90,55,20,.25)}
@media(max-width:420px){.fc-pc .fc-sello span{padding:3px 6px;font-size:9.5px}.fc-pc .fc-sello span+span{display:none}}
.en-chat .fc-lr-preg{display:none}

/* --- 7-oct: el lorito en su RAMA con un arbolito (encabezado) y en una ramita (esquina). Camina encima
   (fc.js → pasear). La posición la pone el JS con transform; estos translate son para antes de que cargue. --- */
.fc-hero-lorito .mostrador{display:none}
@media(min-width:900px){
  .con-lorito .fc-hero-in{padding-right:370px}
  .fc-hero-lorito{width:340px;height:250px;bottom:26px}
  .fc-hero-lorito .rama{position:absolute;left:0;bottom:0;width:340px;height:200px;filter:drop-shadow(0 16px 18px rgba(0,0,0,.35))}
  .fc-hero-lorito .fc-lorito-sp{--s:150px;left:0;top:0;right:auto;bottom:auto;z-index:2;transform:translate(76px,33px)}
  .fc-hero-lorito .glo{left:6px;top:-58px;width:196px;z-index:3}
}
.fc-lorito{width:110px;height:92px}
.fc-lorito::after{display:none}
.fc-lorito .ramita{position:absolute;left:0;bottom:2px;width:110px;height:24px;z-index:0;filter:drop-shadow(0 4px 5px rgba(0,0,0,.28))}
.fc-lorito .fc-lorito-sp{position:absolute;left:0;top:0;z-index:1;transform:translate(16px,-4px)}
.fc-lorito .glo{left:84px;bottom:66px;z-index:2}
@media(max-width:480px){.fc-lorito .fc-lorito-sp{transform:translate(22px,7px)}.fc-lorito .glo{left:76px;bottom:56px}}
/* 7-oct: los productos BLANCOS (sabra borrador, platos de icopor, dispensadores) se perdían en la repisa clara:
   un contorno muy suave (sombra de 1 px) los despega sin que se note en los de color. */
.fc-pc-img img{filter:drop-shadow(0 0 1px rgba(70,45,15,.45)) drop-shadow(0 8px 8px rgba(60,38,14,.22))}
/* 9-oct (revisión de facilidad y estética): el botón "Agregar" de la hoja queda pegado abajo, siempre a la vista;
   y en el celular el lorito de la esquina no tapa precios ni botones: en la ficha y el carrito se esconde (ahí el
   lorito se abre tocando la foto) y en los listados va más pequeño. */
.fc-hoja-ok{position:sticky;bottom:0;z-index:3;box-shadow:0 -8px 16px rgba(255,255,255,.9)}
@media(max-width:719px){body.fc-producto .fc-lorito,body.fc-carrito-pag .fc-lorito{display:none}.fc-lorito{transform:scale(.78);transform-origin:left bottom}}