/* Shared disclosure motion. Existing controls keep their state and events. */
html[data-modo="classic"] :is(#rc-perfil-dropdown, .ttra-site-menu, .dropdown-color-lista, #sugerencias-direccion, #perfil-sugerencias-direccion, .ttra-dock-category-panel) {
  /* Clip extends past the box so the floating halo is not cut off. */
  --disclosure-closed: inset(var(--ed-halo-reach, 0px) var(--ed-halo-reach, 0px) 100% var(--ed-halo-reach, 0px) round 8px);
  opacity: 1;
  clip-path: inset(var(--ed-halo-reach, 0px) round 8px);
  border: 1px solid var(--ed-line);
  border-radius: 8px;
  background: var(--rc-bg-panel);
  color: var(--rc-green);
  transition: opacity .22s ease, clip-path .26s cubic-bezier(.22,1,.36,1), display .26s allow-discrete, overlay .26s allow-discrete;
}
html[data-modo="classic"] :is([data-ttra-menu][data-placement="top"], .ttra-dock-category-panel) {
  --disclosure-closed: inset(100% var(--ed-halo-reach, 0px) var(--ed-halo-reach, 0px) var(--ed-halo-reach, 0px) round 8px);
}
html[data-modo="classic"] :is(#rc-perfil-dropdown, .ttra-site-menu, .dropdown-color-lista, #sugerencias-direccion, #perfil-sugerencias-direccion, .ttra-dock-category-panel):is([hidden], .oculto) {
  opacity: 0;
  clip-path: var(--disclosure-closed);
  pointer-events: none;
}
@starting-style {
  html[data-modo="classic"] :is(#rc-perfil-dropdown, .ttra-site-menu, .dropdown-color-lista, #sugerencias-direccion, #perfil-sugerencias-direccion, .ttra-dock-category-panel) {
    opacity: 0;
    clip-path: var(--disclosure-closed);
  }
}
/* Style the actual native picker where supported, preserving form validation,
   keyboard navigation, labels, option values, and OS fallback in other browsers. */
@supports (appearance: base-select) {
  html[data-modo="classic"] select:not([multiple]):not([size]),
  html[data-modo="classic"] select:not([multiple]):not([size])::picker(select) { appearance: base-select; }
  html[data-modo="classic"] select:not([multiple]):not([size]) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 44px;
    border: 1px solid var(--ed-line);
    border-radius: 8px;
    padding: 10px 12px;
    background: var(--rc-bg-panel);
    color: var(--rc-green);
    font-family: var(--rc-font);
    cursor: pointer;
  }
  html[data-modo="classic"] select:not([multiple]):not([size])::picker-icon {
    color: var(--rc-green-dim);
    transition: rotate .22s ease;
  }
  html[data-modo="classic"] select:open::picker-icon { rotate: 180deg; }
  html[data-modo="classic"] select:not([multiple]):not([size])::picker(select) {
    position-area: block-end span-inline-end;
    position-try-fallbacks: flip-block, flip-inline, flip-block flip-inline;
    inline-size: anchor-size(self-inline);
    min-inline-size: 0;
    max-inline-size: calc(100vw - 24px);
    max-block-size: min(360px, 50dvh);
    margin-block: 6px;
    padding: 6px;
    overflow: auto;
    overscroll-behavior: contain;
    border: 1px solid var(--ed-line);
    border-radius: 8px;
    background: var(--rc-bg-panel);
    color: var(--rc-green);
    box-shadow: var(--ed-halo, 0 10px 28px #0003);
    opacity: 0;
    clip-path: inset(var(--ed-halo-reach, 0px) var(--ed-halo-reach, 0px) 100% var(--ed-halo-reach, 0px) round 8px);
    transition: opacity .22s ease, clip-path .26s cubic-bezier(.22,1,.36,1), display .26s allow-discrete, overlay .26s allow-discrete;
  }
  html[data-modo="classic"] select:not([multiple]):not([size]):open::picker(select) { opacity: 1; clip-path: inset(var(--ed-halo-reach, 0px) round 8px); }
  @starting-style {
    html[data-modo="classic"] select:not([multiple]):not([size]):open::picker(select) { opacity: 0; clip-path: inset(var(--ed-halo-reach, 0px) var(--ed-halo-reach, 0px) 100% var(--ed-halo-reach, 0px) round 8px); }
  }
  html[data-modo="classic"] select:not([multiple]):not([size]) option {
    min-height: 44px;
    padding: 10px;
    border-radius: 5px;
    background: var(--rc-bg-panel);
    color: var(--rc-green);
    font: 400 16px/1.4 var(--rc-font);
    white-space: normal;
    overflow-wrap: anywhere;
  }
  html[data-modo="classic"] select option:is(:hover, :focus, :checked) { background: var(--rc-bg-panel-2); }
  html[data-modo="classic"] select option:disabled { color: var(--rc-green-dim); }
  html[data-modo="classic"] select:focus-visible { outline: 2px solid var(--ed-accent); outline-offset: 3px; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-modo="classic"] :is(#rc-perfil-dropdown, .ttra-site-menu, .dropdown-color-lista, #sugerencias-direccion, #perfil-sugerencias-direccion, .ttra-dock-category-panel),
  html[data-modo="classic"] select:not([multiple]):not([size])::picker(select),
  html[data-modo="classic"] select:not([multiple]):not([size])::picker-icon { transition: none; }
}
