/* Tu bodega: la barra del filtro común. Va con tu-bodega.js; todo con clases «tb-» para no chocar con la página.
   Usa las variables de la marca (tokens.json) con su valor por defecto, para que valga también en el Calendario. */
.tb,.tb-cuenta-movil,.tb-vacia{
  --tb-uva:var(--uva,#63204F);
  --tb-tinta:var(--tinta,#17131A);
  --tb-suave:var(--tinta-suave,#6E676B);
  --tb-filete:var(--filete,#DDD7D3);
  --tb-fondo:var(--fondo,#F7F5F0);
  --tb-sans:var(--f-sans,"Figtree","Segoe UI",system-ui,sans-serif);
  --tb-mono:var(--f-mono,"Figtree",system-ui,sans-serif);
  --tb-ease:cubic-bezier(.23,1,.32,1);
}
.tb{
  position:sticky;top:0;z-index:15;
  background:color-mix(in srgb,var(--tb-fondo) 92%,transparent);
  -webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);
  border-bottom:1px solid var(--tb-filete);
  font:400 14px/1.3 var(--tb-sans);color:var(--tb-tinta);
}
.tb:empty{display:none}
html:has(.tb:not(.tb-lado):not(:empty)){scroll-padding-top:60px}
.tb [hidden],.tb-cuenta[hidden],.tb-vacia[hidden]{display:none!important}
.tb-in{max-width:var(--sitio-ancho,72rem);margin:0 auto;padding:6px var(--espacio-m,20px)}
.tb-oculto{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tb :is(select,button):focus-visible,.tb-cuenta button:focus-visible{outline:2px solid var(--tb-uva);outline-offset:2px}

/* El punto: hueco sin filtro, lleno con filtro y con borde mientras se ve todo */
.tb-punto{flex:none;width:7px;height:7px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--tb-suave)}
.tb-activo .tb-punto{background:var(--tb-uva);box-shadow:none}
.tb-ver-todo .tb-punto{background:transparent;box-shadow:inset 0 0 0 1.5px var(--tb-uva)}

/* Fila: Tu bodega · Comunidad · DO · quitar ……… cuenta */
.tb-plegada{display:none}
.tb-panel{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
.tb-titulo{display:inline-flex;align-items:center;gap:7px;margin-right:4px;font:500 11px/1 var(--tb-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--tb-suave)}
.tb-select-w{position:relative;display:inline-flex;min-width:0}
.tb-select{
  -webkit-appearance:none;appearance:none;max-width:17rem;min-width:0;min-height:32px;margin:0;
  padding:5px 30px 5px 13px;border:1px solid var(--tb-filete);border-radius:999px;background:var(--hoja,#fff);
  font:500 14px/1.2 var(--tb-sans);color:var(--tb-suave);text-overflow:ellipsis;cursor:pointer;
  transition:border-color 160ms var(--tb-ease),box-shadow 160ms var(--tb-ease);
}
.tb-select.tb-elegido{color:var(--tb-tinta);font-weight:600;border-color:var(--tb-uva);box-shadow:inset 0 0 0 .5px var(--tb-uva)}
.tb-select option,.tb-select optgroup{color:var(--tb-tinta);font-weight:400}
.tb-select optgroup{font-weight:600}
.tb-flecha{position:absolute;right:11px;top:50%;width:12px;height:12px;margin-top:-6px;pointer-events:none;fill:none;stroke:var(--tb-suave);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tb-quitar{display:inline-grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--tb-suave);cursor:pointer;transition:background-color 160ms var(--tb-ease),color 160ms var(--tb-ease),transform 160ms var(--tb-ease)}
.tb-quitar:active{transform:scale(.94)}
.tb-x{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.tb-quitar-t{display:none}
@media (hover:hover) and (pointer:fine){
  .tb-select:hover{border-color:var(--tb-suave)}
  .tb-select.tb-elegido:hover{border-color:var(--tb-uva)}
  .tb-quitar:hover{background:color-mix(in srgb,var(--tb-tinta) 7%,transparent);color:var(--tb-tinta)}
}

/* La línea de lo oculto: «16 Comunidades y 9 DO ocultas · Ver todo» */
.tb-cuenta{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin:0 0 0 auto;font:400 13px/1.35 var(--tb-sans);color:var(--tb-suave)}
.tb-cuenta-t:empty{display:none}
.tb-ver{padding:4px 0;border:0;background:none;font:600 13px/1.35 var(--tb-sans);color:var(--tb-uva);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer}
.tb-cuenta-t:not(:empty) + .tb-ver::before{content:"·";display:inline-block;margin-right:8px;color:var(--tb-suave);text-decoration:none}
.tb-cuenta-movil{display:none}
.tb-vacia{margin:0;font:400 14.5px/1.45 var(--tb-sans);color:var(--tb-suave)}

/* Móvil: una sola línea («Castilla y León · DO Ribera del Duero ▾») que se abre; la cuenta va debajo, sin fijar */
@media (max-width:759px){
  .tb-in{padding:0 16px}
  .tb-plegada{display:flex;align-items:center;gap:9px;width:100%;min-height:44px;padding:0;border:0;background:none;font:600 14.5px/1.2 var(--tb-sans);color:var(--tb-tinta);text-align:left;cursor:pointer}
  .tb:not(.tb-activo) .tb-plegada{font-weight:500;color:var(--tb-suave)}
  .tb-resumen{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tb-plegada .tb-flecha{position:static;margin:0;flex:none;transition:transform 180ms var(--tb-ease)}
  .tb[data-abierta] .tb-plegada .tb-flecha{transform:rotate(180deg)}
  .tb-panel{display:none;flex-direction:column;align-items:stretch;gap:8px;padding:2px 0 14px}
  .tb[data-abierta] .tb-panel{display:flex;transition:opacity 180ms var(--tb-ease),transform 180ms var(--tb-ease)}
  @starting-style{.tb[data-abierta] .tb-panel{opacity:0;transform:translateY(-4px)}}
  .tb-titulo{display:none}
  .tb-select-w{display:flex}
  .tb-select{width:100%;max-width:none;min-height:44px;font-size:16px}
  .tb-quitar{align-self:flex-start;display:inline-flex;gap:6px;width:auto;height:36px;padding:0 4px;border-radius:6px;font:600 14px/1 var(--tb-sans)}
  .tb-quitar-t{display:inline}
  .tb-panel .tb-cuenta{display:none}
  .tb-cuenta-movil{display:flex;max-width:var(--sitio-ancho,72rem);margin:0 auto;padding:10px 16px 0}
}
@media (prefers-reduced-motion:reduce){
  .tb-select,.tb-quitar,.tb-plegada .tb-flecha{transition:none}
  .tb[data-abierta] .tb-panel{transition:opacity 120ms linear}
  @starting-style{.tb[data-abierta] .tb-panel{transform:none}}
}
@media print{
  .tb,.tb-cuenta-movil{display:none}
}

/* La norma de una Comunidad o una DO en una página de la UE o de España: solo con el filtro de esa Comunidad o DO. Sin JavaScript,
   oculta; con él (html.tb-solo), la oculta o la enseña tu-bodega.js, con su forma de siempre */
html:not(.tb-solo) [data-solo]{display:none}

/* En la Wiki, panel a la derecha de los documentos y trámites (Iñaki, 20-10): una tarjeta, con los campos uno debajo de otro
   y la invitación arriba. En el móvil va antes del texto como una fila que se abre, igual que en el Calendario. */
.tb.tb-lado{position:static;-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--panel,#EEECE7);border:1px solid var(--tb-filete);border-radius:12px}
@media (min-width:760px){
  .tb-lado .tb-in{padding:16px}
  .tb-lado .tb-panel{flex-direction:column;align-items:stretch;gap:8px}
  .tb-lado .tb-titulo{order:-2;margin:0 0 2px}
  .tb-lado .tb-cuenta{margin:2px 0 0}
  .tb-lado .tb-cuenta.tb-pista{order:-1;margin:0 0 4px;font-size:13.5px;color:var(--tb-tinta)}
  .tb-lado .tb-select-w{display:flex}
  .tb-lado .tb-select{width:100%;max-width:none}
  .tb-lado .tb-quitar{align-self:flex-start;display:inline-flex;gap:6px;width:auto;height:32px;padding:0 4px;border-radius:6px;font:600 13.5px/1 var(--tb-sans)}
  .tb-lado .tb-quitar-t{display:inline}
}
@media (max-width:759px){
  .tb-lado .tb-in{padding:0 14px}
  .lado .tb-cuenta-movil{padding:8px 2px 0}
}