/* Wakoo Suite · directorio. Claro por defecto; oscuro con [data-wakoo-theme="dark"] o prefers-color-scheme vía --wks-*. */
.wks-dir { --dir-surface: var(--wks-bg, transparent); --dir-field: #fff; --dir-field-ink: #1f2430; --dir-muted: rgba(127,127,127,.9); }
[data-wakoo-theme="dark"] .wks-dir { --dir-field: #1e2230; --dir-field-ink: #e8eaf0; --wks-line: rgba(255,255,255,.16); --wks-soft: color-mix(in srgb, var(--wks-accent) 24%, transparent); }
.wks-dir .wks-dir__label { margin: 0; font-size: .74em; letter-spacing: .2em; text-transform: uppercase; opacity: .65; }
.wks-dir .wks-dir__title { margin: 6px 0 18px; font-size: clamp(1.8rem, 4vw, 3rem); line-height: 1.1; letter-spacing: -.02em; }
.wks-dir .wks-dir__search { position: relative; max-width: 720px; margin: 0 0 14px; }
.wks-dir .wks-dir__search input[type=search] { padding: 14px 44px 14px 18px; font-size: 1.05em; border-radius: 999px; -webkit-appearance: none; appearance: none; background: var(--dir-field); color: var(--dir-field-ink); box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.wks-dir .wks-dir__clear, .wks-dir button.wks-dir__clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border: 0 !important; border-radius: 50% !important; background: var(--wks-soft) !important; color: inherit !important; cursor: pointer; padding: 0; line-height: 1; }
.wks-dir .wks-dir__facets { display: grid; gap: 12px; margin-bottom: 8px; }
.wks-dir .wks-dir__chips, .wks-dir .wks-dir__tagrow, .wks-dir .wks-dir__tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.wks-dir .wks-dir__chips .wks-chip i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--dot); margin-right: 6px; }
.wks-dir .wks-chip small { opacity: .7; margin-left: 2px; }
.wks-dir .wks-chip.is-empty { opacity: .45; }
.wks-dir .wks-dir__open-now i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #2e9e5b; margin-right: 6px; }
.wks-dir .wks-dir__tool { display: inline-block; min-width: 0; }
.wks-dir select.wks-dir__select { width: auto; max-width: 100%; padding: 7px 30px 7px 12px; border-radius: 999px; background-color: var(--dir-field); color: var(--dir-field-ink); }
.wks-dir .wks-dir__views { display: inline-flex; margin-left: auto; border: 1px solid var(--wks-line); border-radius: 999px; overflow: hidden; }
.wks-dir .wks-dir__views button.wks-dir__view { border: 0 !important; background: transparent !important; color: inherit !important; padding: 6px 12px; cursor: pointer; font-size: 1em; line-height: 1; }
.wks-dir .wks-dir__views button.wks-dir__view.is-active { background: var(--wks-accent) !important; color: #fff !important; }
.wks-dir .wks-dir__tag, .wks-dir button.wks-dir__tag { border: 1px solid var(--wks-line) !important; background: transparent !important; color: inherit !important; border-radius: 999px; padding: 3px 11px; font: inherit; font-size: .85em; cursor: pointer; }
.wks-dir button.wks-dir__tag.is-active { background: var(--wks-accent) !important; color: #fff !important; border-color: var(--wks-accent) !important; }
.wks-dir .wks-dir__tag small { opacity: .65; }
.wks-dir .wks-dir__status-row { display: flex; gap: 14px; align-items: center; margin: 10px 0 14px; min-height: 1.6em; }
.wks-dir .wks-dir__status { margin: 0; font-size: .9em; opacity: .75; }
.wks-dir button.wks-dir__reset { background: transparent !important; border: 0 !important; color: var(--wks-accent) !important; text-decoration: underline; cursor: pointer; font: inherit; font-size: .9em; padding: 0; }
.wks-dir.is-loading .wks-dir__list { opacity: .5; transition: opacity .2s; }
.wks-dir .wks-dir__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.wks-dir .wks-dir__list.is-list .wks-dir__grid { grid-template-columns: 1fr; gap: 10px; }
.wks-dir .wks-dir__card { padding: 0; overflow: hidden; transition: box-shadow .2s, transform .2s; border-top: 3px solid var(--dot, transparent); }
.wks-dir .wks-dir__card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.12); transform: translateY(-2px); }
.wks-dir .wks-dir__card.is-featured { box-shadow: 0 0 0 2px color-mix(in srgb, var(--wks-accent) 55%, transparent); }
.wks-dir .wks-dir__open, .wks-dir button.wks-dir__open { display: flex; gap: 12px; align-items: center; width: 100%; text-align: left; padding: 14px; background: transparent !important; color: inherit !important; border: 0 !important; border-radius: 0 !important; cursor: pointer; font: inherit; }
.wks-dir .wks-dir__open:hover { background: var(--wks-soft) !important; }
.wks-dir .wks-dir__logo, .wks-dir-modal .wks-dir__logo { flex: none; width: 52px; height: 52px; border-radius: 50%; background: var(--dot, #2E7D55); color: #fff; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; }
.wks-dir .wks-dir__logo img, .wks-dir-modal .wks-dir__logo img { width: 100%; height: 100%; object-fit: cover; }
.wks-dir .wks-dir__txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.wks-dir .wks-dir__nm { font-size: 1.02em; }
.wks-dir .wks-dir__ty, .wks-dir .wks-dir__ar { font-size: .88em; opacity: .8; font-style: normal; }
.wks-dir .wks-dir__ar { display: flex; gap: 10px; flex-wrap: wrap; }
.wks-dir .wks-dir__chiprow { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.wks-dir .wks-dir__badge, .wks-dir-modal .wks-dir__badge { background: #fff3cd; color: #7a5b00; border-radius: 999px; padding: 1px 10px; font-weight: 600; font-size: .78em; }
.wks-dir .wks-dir__state, .wks-dir-modal .wks-dir__state { border-radius: 999px; padding: 1px 10px; font-weight: 600; font-size: .78em; }
.wks-dir .wks-dir__state.is-open, .wks-dir-modal .wks-dir__state.is-open { background: #d7f3e3; color: #14663a; }
.wks-dir .wks-dir__state.is-closed, .wks-dir-modal .wks-dir__state.is-closed { background: #f6dede; color: #8a2323; }
.wks-dir mark { background: color-mix(in srgb, var(--wks-accent) 28%, transparent); color: inherit; border-radius: 3px; padding: 0 1px; }
.wks-dir .wks-dir__pager { display: flex; justify-content: center; margin-top: 20px; }
.wks-dir .wks-dir__pages { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; }
.wks-dir button.wks-dir__pg { min-width: 38px; height: 38px; border: 1px solid var(--wks-line) !important; background: transparent !important; color: inherit !important; border-radius: 10px !important; cursor: pointer; font: inherit; }
.wks-dir button.wks-dir__pg.is-active { background: var(--wks-accent) !important; color: #fff !important; border-color: var(--wks-accent) !important; }
.wks-dir .wks-dir__none { padding: 32px 12px; text-align: center; display: grid; gap: 6px; }
.wks-dir .wks-dir__plain { margin: 0; padding-left: 18px; }
@media (max-width: 600px) { .wks-dir .wks-dir__views { margin-left: 0; } .wks-dir .wks-dir__grid { grid-template-columns: 1fr; } }
/* Ventana emergente */
.wks-dir-modal { position: fixed; inset: 0; z-index: 99999; background: rgba(0, 0, 0, .62); display: flex; align-items: center; justify-content: center; padding: 16px; }
.wks-dir-modal[hidden] { display: none; }
.wks-dir-modal__box { position: relative; background: var(--dm-bg, #fff); color: var(--dm-ink, #1f2430); border-radius: var(--wks-radius, 14px); width: 100%; max-width: 900px; max-height: 92vh; overflow: auto; outline: 0; display: block; }
.wks-dir-modal .wks-dir-modal__x, .wks-dir-modal button.wks-dir-modal__x { position: absolute; top: 8px; right: 8px; z-index: 3; width: 40px; height: 40px; border: 0 !important; border-radius: 50% !important; background: rgba(0, 0, 0, .55) !important; color: #fff !important; font-size: 24px; line-height: 1; cursor: pointer; padding: 0; }
.wks-dir-modal a:focus-visible, .wks-dir-modal button:focus-visible { outline: 3px solid var(--wks-accent, #2563eb); outline-offset: 2px; }
.wks-dir-modal .wks-dir__gal { background: var(--dm-soft, #eef0f3); }
.wks-dir-modal .wks-dir__main { position: relative; aspect-ratio: 16 / 7; }
.wks-dir-modal .wks-dir__slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s; }
.wks-dir-modal .wks-dir__slide.is-on { opacity: 1; }
.wks-dir-modal .wks-dir__arrow, .wks-dir-modal button.wks-dir__arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border: 0 !important; border-radius: 50% !important; background: rgba(0, 0, 0, .55) !important; color: #fff !important; font-size: 24px; cursor: pointer; padding: 0; line-height: 1; }
.wks-dir-modal .wks-dir__arrow[data-d="-1"] { left: 10px; } .wks-dir-modal .wks-dir__arrow[data-d="1"] { right: 10px; }
.wks-dir-modal .wks-dir__counter { position: absolute; right: 12px; bottom: 10px; background: rgba(0, 0, 0, .55); color: #fff; font-size: .8em; padding: 2px 10px; border-radius: 999px; }
.wks-dir-modal .wks-dir__info { padding: 22px 26px 26px; display: grid; gap: 14px; }
.wks-dir-modal .wks-dir__head { display: flex; gap: 14px; align-items: center; }
.wks-dir-modal .wks-dir__pname { margin: 0; font-size: 1.5em; }
.wks-dir-modal .wks-dir__meta { margin: 2px 0 0; display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: center; font-size: .9em; }
.wks-dir-modal .wks-dir__cat i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--dot); margin-right: 5px; }
.wks-dir-modal .wks-dir__desc { margin: 0; line-height: 1.6; }
.wks-dir-modal .wks-dir__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.wks-dir-modal .wks-btn { background: var(--wks-accent, #6C5CE7) !important; color: #fff !important; border-radius: 999px; padding: 9px 18px; text-decoration: none; font-weight: 600; font-size: .92em; }
.wks-dir-modal .wks-btn--ghost { background: transparent !important; color: var(--wks-accent, #6C5CE7) !important; box-shadow: inset 0 0 0 2px var(--wks-accent, #6C5CE7); }
.wks-dir-modal .wks-dir__dl { margin: 0; display: grid; gap: 10px; }
.wks-dir-modal .wks-dir__dl dt { font-size: .75em; letter-spacing: .12em; text-transform: uppercase; opacity: .6; }
.wks-dir-modal .wks-dir__dl dd { margin: 0 !important; padding: 0 !important; }
.wks-dir-modal .wks-dir__hours { display: grid; grid-template-columns: auto 1fr; gap: 2px 18px; max-width: 320px; }
.wks-dir-modal .wks-dir__tags span { display: inline-block; background: var(--dm-soft, #eef0f3); border-radius: 999px; padding: 2px 10px; margin: 0 6px 6px 0; font-size: .85em; }
.wks-dir-modal .wks-dir__note { font-size: .85em; opacity: .7; margin: 0; }
.wks-dir-modal .wks-stars { color: #f5b301; letter-spacing: 2px; }
.wks-dir-modal .wks-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html.wks-dir-lock { overflow: hidden; }
.wks-dir-modal .wks-dir__thumbs { display: flex; gap: 6px; padding: 8px 12px; overflow-x: auto; background: var(--dm-soft, #eef0f3); }
.wks-dir-modal button.wks-dir__thumb { flex: none; width: 64px; height: 44px; padding: 0; border: 2px solid transparent !important; border-radius: 6px !important; overflow: hidden; background: transparent !important; cursor: pointer; opacity: .65; }
.wks-dir-modal button.wks-dir__thumb.is-on { border-color: var(--wks-accent, #6C5CE7) !important; opacity: 1; }
.wks-dir-modal .wks-dir__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wks-dir-modal { --dm-bg: #fff; --dm-ink: #1f2430; --dm-soft: #eef0f3; }
[data-wakoo-theme="dark"] .wks-dir-modal { --dm-bg: #1a1d29; --dm-ink: #e8eaf0; --dm-soft: #262a3a; }
[data-wakoo-theme="dark"] .wks-dir-modal .wks-dir__badge { background: #4a3d10; color: #ffe08a; }
[data-wakoo-theme="dark"] .wks-dir-modal .wks-dir__state.is-open { background: #17422a; color: #8fe3b4; }
[data-wakoo-theme="dark"] .wks-dir-modal .wks-dir__state.is-closed { background: #4a1f1f; color: #f1a9a9; }
.wks-dir-modal .wks-dir__social a { margin-right: 8px; }
@media (prefers-reduced-motion: reduce) { .wks-dir .wks-dir__card, .wks-dir-modal .wks-dir__slide { transition: none; } .wks-dir .wks-dir__card:hover { transform: none; } }