/* sidebar.css — navegación lateral: logo, tabs, packs, acordeón, marcos, footer */
.logo{padding:22px 14px;border-bottom:1px solid rgba(214,167,122,0.2);background:var(--color-fondo);display:flex;align-items:center;justify-content:center}
.logo img{width:155px;height:auto;display:block}
.sc{flex:1;overflow-y:auto;padding:14px}
.sc::-webkit-scrollbar{width:3px}.sc::-webkit-scrollbar-thumb{background:rgba(214,167,122,0.3)}
.cl{font-size:14px;color:rgba(214,167,122,0.85);letter-spacing:1px;margin:16px 0 8px;text-transform:uppercase;font-weight:700}
.csub{font-size:11px;color:rgba(242,239,234,0.5);letter-spacing:1.5px;margin:8px 0 5px;text-transform:uppercase;font-weight:700}
.acch{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:11px 12px;background:rgba(214,167,122,0.1);border:1px solid rgba(214,167,122,0.25);color:rgba(242,239,234,0.92);cursor:pointer;margin-bottom:4px;font-size:13px;font-weight:700;font-family:inherit;border-radius:3px;letter-spacing:0.3px}
.acch:hover{background:rgba(214,167,122,0.18)}
.acch.open{background:var(--color-dorado);color:var(--color-azul)}
.acch.open span[style]{opacity:0.7!important}
.acch .chev{font-size:16px;color:var(--color-dorado);transition:transform 0.2s;line-height:1}
.acch.open .chev{transform:rotate(90deg);color:var(--color-azul)}
.accbody{margin:0 0 4px 0}
.accbody .pb{margin-left:10px;width:calc(100% - 10px)}
.pb{position:relative;display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 10px;background:transparent;border:1px solid rgba(214,167,122,0.15);color:rgba(242,239,234,0.85);cursor:pointer;margin-bottom:4px;font-size:12px;line-height:1.35;font-family:inherit;border-radius:5px}
/* Marcadores de venta (Popular / Promo): anclas de decisión para quien no conoce los productos */
.pbtag{position:absolute;top:5px;right:5px;font-size:8.5px;font-weight:700;letter-spacing:0.2px;padding:2px 6px;border-radius:8px;line-height:1.35;z-index:2;white-space:nowrap}
.pbtag.pop{background:var(--color-dorado);color:var(--color-azul)}
.pbtag.promo{background:var(--color-acento);color:#fff}
.pb.on .pbtag.pop{background:var(--color-azul);color:var(--color-dorado)}
.pb:hover{background:rgba(214,167,122,0.1);border-color:rgba(214,167,122,0.4)}.pb.on{background:var(--color-dorado);color:var(--color-azul);border-color:var(--color-dorado)}
/* Miniatura del layout: caja clara para que la silueta del mural resalte */
.mthumbw{flex-shrink:0;width:46px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(242,239,234,0.06);border:1px solid rgba(214,167,122,0.25);border-radius:4px}
.pb.on .mthumbw{background:rgba(13,28,81,0.12);border-color:rgba(13,28,81,0.25)}
.mthumb{color:var(--color-dorado)}.pb.on .mthumb{color:var(--color-azul)}
.pbtxt{min-width:0;flex:1}
.pn{font-weight:700;display:block;font-size:13px}
.pbh{display:block;font-size:10.5px;opacity:0.6;margin-top:1px;line-height:1.25}
.pp{display:block;opacity:0.85;font-size:12px;font-weight:600;margin-top:2px}.pb.on .pp{opacity:0.9}
.dv{border-top:1px solid rgba(214,167,122,0.2);margin:12px 0}
.fr{display:flex;gap:6px;margin-bottom:4px}
.fb{width:30px;height:30px;border:2px solid transparent;cursor:pointer;border-radius:2px}
.fb.on{border-color:var(--color-dorado)}
.fneg{background:#141414}.fbla{background:#F5F5F5;box-shadow:inset 0 0 0 1px #ddd}.fmad{background:linear-gradient(135deg,#cfa96c 0%,#b1813f 55%,#8f6533 100%)}
.wallbtn{display:block;width:100%;text-align:center;font-size:12px;font-weight:700;color:var(--color-azul);background:var(--color-dorado);border:none;border-radius:5px;padding:9px 8px;cursor:pointer;font-family:inherit;letter-spacing:0.2px}
.wallbtn:hover{background:#e0b78c}
.wallclr{display:block;width:100%;text-align:center;font-size:10.5px;color:rgba(214,167,122,0.75);background:none;border:none;cursor:pointer;padding:7px 0 2px;font-family:inherit;letter-spacing:0.5px;text-decoration:underline}
.wallclr:hover{color:#fff}
.wallclr.hidden{display:none}
.sendhelp{display:block;width:100%;text-align:center;font-size:12px;font-weight:700;color:var(--color-dorado);background:transparent;border:1px solid rgba(214,167,122,0.5);border-radius:5px;padding:9px 8px;cursor:pointer;font-family:inherit;letter-spacing:0.2px;margin-top:8px}
.sendhelp:hover{background:rgba(214,167,122,0.12);color:#fff}
.clr{display:block;text-align:center;font-size:10px;color:rgba(214,167,122,0.45);cursor:pointer;padding:8px 0 2px;letter-spacing:1px;background:none;border:none;width:100%;font-family:inherit}
.clr:hover{color:rgba(214,167,122,0.9)}
.snote{font-size:10.5px;line-height:1.5;color:rgba(242,239,234,0.6);background:rgba(214,167,122,0.09);border-left:2px solid rgba(214,167,122,0.45);padding:8px 10px;margin:4px 0 2px;border-radius:0 4px 4px 0}
.snote strong{color:var(--color-dorado);font-weight:700}
.tabs{display:flex;padding:10px 14px 4px;gap:0}
.tab{flex:1;text-align:center;padding:9px 4px;font-size:11px;font-weight:700;letter-spacing:0.3px;cursor:pointer;background:rgba(214,167,122,0.06);border:1px solid rgba(214,167,122,0.35);color:rgba(242,239,234,0.75);font-family:inherit;text-transform:uppercase;line-height:1.2;display:flex;align-items:center;justify-content:center;min-height:44px}
.tab:hover{background:rgba(214,167,122,0.16)}
.tab:not(:first-child){border-left:none}
.tab:first-child{border-radius:4px 0 0 4px}
.tab:last-child{border-radius:0 4px 4px 0}
.tab.on{background:var(--color-dorado);color:var(--color-azul);border-color:var(--color-dorado)}
.sbfoot{flex-shrink:0;padding:12px 14px 14px;border-top:1px solid rgba(214,167,122,0.25);background:var(--color-azul)}
/* Toggle Color / Blanco y negro dentro del sidebar oscuro: el estado activo debe verse claramente
   (antes el 'on' era azul sobre fondo azul y se perdía). Activo = dorado; inactivo = tenue. */
.sbfoot .ptg2{width:100%}
.sbfoot .ptb{flex:1;text-align:center;background:rgba(214,167,122,0.08);border-color:rgba(214,167,122,0.35);color:rgba(242,239,234,0.72)}
.sbfoot .ptb:hover{background:rgba(214,167,122,0.16)}
.sbfoot .ptb.on{background:var(--color-dorado);border-color:var(--color-dorado);color:var(--color-azul)}
