/* ============================================================
   ARTFOOD · dirnav.css — navegación de directorios (v20261008)
   Solo tokens del sistema visual ARTFOOD (definidos en :root).
   ============================================================ */
.dn{margin:2rem 0 1.2rem;scroll-margin-top:1rem}
.dn-bar{display:flex;gap:.75rem;align-items:center}
.dn-search{position:relative;flex:1}
.dn-search input{width:100%;font:500 1rem var(--font);color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:.9rem 3rem .9rem 1.3rem;min-height:48px;box-shadow:var(--shadow-sm)}
.dn-search input:focus{outline:2px solid var(--navy);outline-offset:2px;border-color:var(--navy)}
.dn-kbd{position:absolute;right:1rem;top:50%;transform:translateY(-50%);font:600 .75rem var(--font);color:var(--gray-light);border:1px solid var(--line);border-radius:6px;padding:.05rem .45rem;pointer-events:none}
.dn-search input:focus + .dn-kbd,.dn-search input:not(:placeholder-shown) + .dn-kbd{display:none}
.dn-sugg{position:absolute;z-index:30;left:0;right:0;top:calc(100% + .4rem);margin:0;padding:.4rem;list-style:none;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);max-height:22rem;overflow:auto}
.dn-sugg li{padding:.6rem .8rem;border-radius:8px;cursor:pointer;font-size:.9375rem}
.dn-sugg li:hover,.dn-sugg li[aria-selected="true"]{background:#eeedfb}
.dn-sugg li.is-facet{border-top:1px solid var(--line);color:var(--navy);font-weight:600}
.dn-sugg li small{color:var(--gray);font-weight:500;margin-right:.3rem}
.dn-hl{background:rgba(51,229,216,.35);color:inherit;border-radius:3px;padding:0 1px}

.dn-open-sheet{display:none}
.dn-sheet-head,.dn-sheet-foot,.dn-sheet-backdrop{display:none}
.dn-facets{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-top:.9rem}
.dn-facet{position:relative}
.dn-facet summary{list-style:none;display:flex;gap:.35rem;align-items:center;cursor:pointer;font:600 .875rem var(--font);color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:.6rem 1rem;min-height:44px;user-select:none}
.dn-facet summary::-webkit-details-marker{display:none}
.dn-facet summary::after{content:"";width:.45rem;height:.45rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:.25rem}
.dn-facet[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.dn-facet.is-on summary{border-color:var(--navy);color:var(--navy);background:#f1f0fc}
.dn-facet summary:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.dn-pop{position:absolute;z-index:25;top:calc(100% + .4rem);left:0;min-width:260px;max-width:340px;max-height:20rem;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);padding:.4rem}
.dn-opt{display:flex;align-items:center;gap:.6rem;padding:.55rem .6rem;border-radius:8px;cursor:pointer;font-size:.875rem;min-height:40px}
.dn-opt:hover{background:#f4f4f8}
.dn-opt input{accent-color:var(--navy);width:1.05rem;height:1.05rem;flex:none}
.dn-opt span{flex:1}
.dn-opt small{color:var(--gray-light);font-variant-numeric:tabular-nums}
.dn-opt.is-zero{display:none}
.dn-opt.is-zero:has(input:checked){display:flex;opacity:.6}
.dn-noopt{margin:.5rem;color:var(--gray)}
.dn-sort{display:flex;align-items:center;gap:.5rem;font:600 .875rem var(--font);color:var(--gray);margin-left:auto}
.dn-sort select{font:600 .875rem var(--font);color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:.6rem 1rem;min-height:44px}
.dn-clear{font:600 .875rem var(--font);color:var(--navy);background:none;border:0;padding:.6rem .4rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px}

.dn-az{display:flex;flex-wrap:wrap;gap:.2rem;margin:1rem 0 .4rem}
.dn-az button{font:600 .8125rem var(--font);color:var(--ink);background:none;border:1px solid transparent;border-radius:8px;min-width:2.1rem;min-height:2.1rem;padding:0 .35rem;cursor:pointer}
.dn-az button:hover:not(:disabled){border-color:var(--line);background:var(--card)}
.dn-az button[aria-pressed="true"]{background:var(--navy);color:#fff}
.dn-az button:disabled{color:#c9c9d2;cursor:default}
.dn-az button:focus-visible{outline:2px solid var(--navy);outline-offset:1px}

.dn-chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.6rem 0 0}
.dn-chips:empty{display:none}
.dn-chip{display:inline-flex;gap:.45rem;align-items:center;font:600 .8125rem var(--font);color:var(--navy);background:#eeedfb;border:0;border-radius:999px;padding:.45rem .8rem;cursor:pointer;min-height:36px}
.dn-chip span{font-size:1rem;line-height:1}
.dn-chip:hover{background:#e2e0fa}
.dn-chip-clear{background:none;text-decoration:underline;text-underline-offset:3px}

.dn-status{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin:1.2rem 0 1rem;flex-wrap:wrap}
.dn-status p{margin:0;color:var(--gray);font-size:.875rem}
.dn-summary{font-weight:600;color:var(--ink)!important;outline:none}

.dn-empty{text-align:center;padding:3rem 1rem;color:var(--gray)}
.dn-empty-title{font:800 1.4rem var(--font);letter-spacing:-.02em;color:var(--ink);margin-bottom:.4rem}
.dn-empty-actions{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-top:1.2rem}

.dn-pager{display:flex;align-items:center;justify-content:center;gap:.5rem;margin:2.4rem 0 .5rem;flex-wrap:wrap}
.dn-pager[hidden]{display:none}
.dn-nums{display:flex;gap:.3rem;align-items:center}
.dn-pager a,.dn-pager .is-disabled{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 .8rem;border-radius:999px;font:600 .875rem var(--font);text-decoration:none;color:var(--ink);border:1px solid var(--line);background:var(--card)}
.dn-pager a:hover{border-color:var(--ink)}
.dn-pager a[aria-current="page"]{background:var(--navy);border-color:var(--navy);color:#fff}
.dn-pager .is-disabled{color:#c9c9d2;border-color:#efeff3}
.dn-pager a:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.dn-gap{color:var(--gray-light);padding:0 .2rem}

.dn-new{display:inline-block;font:700 .6875rem var(--font);letter-spacing:.04em;text-transform:uppercase;color:#0b6b64;background:rgba(51,229,216,.22);border-radius:999px;padding:.2rem .55rem;margin-left:.4rem;vertical-align:middle}

.dn-consent{position:fixed;z-index:60;left:1rem;right:1rem;bottom:1rem;max-width:560px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:1rem 1.2rem;display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.dn-consent p{margin:0;flex:1 1 240px;font-size:.875rem;color:var(--gray)}
.dn-consent div{display:flex;gap:.5rem}

/* ---------- móvil: hoja inferior ---------- */
@media (max-width:760px){
  .dn-open-sheet{display:inline-flex;white-space:nowrap;min-height:48px}
  .dn-sheet{position:fixed;z-index:50;left:0;right:0;bottom:0;max-height:85vh;display:flex;flex-direction:column;background:var(--card);border-radius:var(--radius) var(--radius) 0 0;box-shadow:var(--shadow-lg);transform:translateY(105%);transition:transform .25s ease;visibility:hidden}
  .dn-sheet.is-open{transform:none;visibility:visible}
  .dn-sheet-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;border-bottom:1px solid var(--line)}
  .dn-sheet-close{font-size:1.6rem;line-height:1;background:none;border:0;min-width:44px;min-height:44px;cursor:pointer;color:var(--ink)}
  .dn-sheet-foot{display:block;padding:.9rem 1.2rem calc(.9rem + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
  .dn-sheet-foot .button{width:100%;text-align:center}
  .dn-sheet-backdrop{display:block;position:fixed;inset:0;z-index:45;background:rgba(13,11,31,.4)}
  .dn-sheet-backdrop[hidden]{display:none}
  .dn-facets{flex-direction:column;align-items:stretch;flex-wrap:nowrap;overflow:auto;padding:.6rem 1.2rem;margin:0;gap:.5rem}
  .dn-facet summary{border-radius:var(--radius-sm);justify-content:space-between}
  .dn-pop{position:static;max-width:none;min-width:0;max-height:none;box-shadow:none;border:0;padding:.2rem 0 .4rem}
  .dn-sort{margin-left:0;justify-content:space-between}
  .dn-az{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.3rem;scrollbar-width:thin}
  .dn-az button{flex:none}
  .dn-pager{gap:.3rem}
  .dn-pager .dn-prev,.dn-pager .dn-next{padding:0 .7rem}
  .dn-nums a:not([aria-current]):not(:first-child):not(:last-child){display:none}
  .dn-gap{display:none}
}
html.dn-lock,html.dn-lock body{overflow:hidden}
@media (prefers-reduced-motion:reduce){.dn-sheet{transition:none}}
@media (max-width:760px){.dn-facet .dn-fl{flex:1}}
