:root {
  --dt-directory-blue: #082d7a;
  --dt-directory-violet: #4b16e8;
  --dt-directory-ink: #10234e;
  --dt-directory-muted: #62729a;
  --dt-directory-line: #d9e0f1;
  --dt-directory-soft: #f4f7ff;
  --dt-directory-gold: #c99a27;
}

.dt-directory {
  color: var(--dt-directory-ink);
  font-family: inherit;
  margin: 0 auto;
  max-width: 1180px;
}

/* El shortcode ya contiene el único H1 de la landing. Evitamos que la
   cabecera genérica del tema duplique título y migas sólo en esta página. */
body.dt-directory-landing .td-page-header {
  display: none;
}

.dt-directory * {
  box-sizing: border-box;
}

.dt-directory__header {
  background: linear-gradient(110deg, #fff 0%, #f6f8ff 100%);
  border: 1px solid var(--dt-directory-line);
  border-left: 7px solid var(--dt-directory-blue);
  margin: 0 0 1.25rem;
  padding: clamp(1.1rem, 3vw, 2rem);
}

.dt-directory__eyebrow {
  color: var(--dt-directory-violet);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .08em;
  margin: 0 0 .35rem;
  text-transform: uppercase;
}

.dt-directory__header h1 {
  color: var(--dt-directory-blue);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.85rem, 4vw, 3rem);
  line-height: 1;
  margin: 0;
}

.dt-directory__header > p:last-child {
  color: var(--dt-directory-muted);
  margin: .7rem 0 0;
  max-width: 48rem;
}

.dt-directory__filters {
  align-items: end;
  background: #fff;
  border: 1px solid var(--dt-directory-line);
  display: grid;
  gap: .85rem;
  grid-template-columns: minmax(13rem, 2fr) repeat(2, minmax(9rem, 1fr)) auto;
  padding: 1rem;
}

.dt-directory__field {
  display: grid;
  gap: .35rem;
  min-width: 0;
}

.dt-directory__field label,
.dt-directory__features-title,
.dt-directory__feature-group legend {
  color: var(--dt-directory-blue);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .025em;
}

.dt-directory__field input,
.dt-directory__field select {
  background: #fff;
  border: 1px solid #bac6e4;
  border-radius: .35rem;
  color: var(--dt-directory-ink);
  font: inherit;
  min-height: 2.65rem;
  padding: .55rem .65rem;
  width: 100%;
}

.dt-directory__field input:focus,
.dt-directory__field select:focus {
  border-color: var(--dt-directory-violet);
  box-shadow: 0 0 0 3px rgb(75 22 232 / 13%);
  outline: 0;
}

.dt-directory__restaurant-filters {
  display: contents;
}

.dt-directory__restaurant-filters[hidden] {
  display: none;
}

.dt-directory__actions {
  align-items: center;
  display: flex;
  gap: .7rem;
  min-height: 2.65rem;
}

.dt-directory__actions button {
  background: var(--dt-directory-violet);
  border: 0;
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: .86rem;
  font-weight: 800;
  min-height: 2.65rem;
  padding: .55rem 1.05rem;
  white-space: nowrap;
}

.dt-directory__actions button:hover,
.dt-directory__actions button:focus {
  background: #3510bc;
}

.dt-directory__actions a {
  color: var(--dt-directory-blue);
  font-size: .82rem;
  font-weight: 700;
  text-decoration: underline;
  white-space: nowrap;
}

.dt-directory__features {
  border-top: 1px solid var(--dt-directory-line);
  display: grid;
  gap: .7rem;
  grid-column: 1 / -1;
  margin-top: .25rem;
  padding-top: .85rem;
}

.dt-directory__features-title {
  margin: 0;
}

.dt-directory__feature-hint {
  color: var(--dt-directory-muted);
  font-size: .84rem;
  line-height: 1.42;
  margin: -.2rem 0 0;
}

.dt-directory__feature-group {
  border: 0;
  display: grid;
  gap: .42rem;
  margin: 0;
  min-width: 0;
  padding: 0;
}

.dt-directory__feature-group > div {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.dt-directory__feature-group label {
  align-items: center;
  background: var(--dt-directory-soft);
  border: 1px solid #d6def2;
  border-radius: 999px;
  color: var(--dt-directory-ink);
  cursor: pointer;
  display: inline-flex;
  font-size: .8rem;
  gap: .38rem;
  line-height: 1.15;
  padding: .43rem .65rem;
}

.dt-directory__feature-group label:hover {
  border-color: var(--dt-directory-violet);
}

.dt-directory__feature-group input {
  accent-color: var(--dt-directory-violet);
  height: .95rem;
  margin: 0;
  width: .95rem;
}

.dt-directory__feature-group label[hidden],
.dt-directory__feature-group[hidden] {
  display: none;
}

.dt-directory__notice {
  background: #fffaf0;
  border-left: 3px solid var(--dt-directory-gold);
  color: #5e4a1f;
  font-size: .82rem;
  line-height: 1.45;
  margin: 1rem 0;
  padding: .75rem .9rem;
}

.dt-directory__status {
  color: var(--dt-directory-muted);
  font-size: .84rem;
  font-weight: 700;
  margin: 0 0 .85rem;
}

.dt-directory__results[aria-busy="true"] {
  opacity: .58;
}

.dt-directory__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dt-directory-card {
  background: #fff;
  border: 1px solid var(--dt-directory-line);
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
}

.dt-directory-card:hover {
  box-shadow: 0 .5rem 1.35rem rgb(13 42 110 / 10%);
  transform: translateY(-1px);
  transition: box-shadow .18s ease, transform .18s ease;
}

.dt-directory-card__image {
  background: linear-gradient(135deg, #dce7ff, #f3f6fd);
  display: block;
  min-height: 11.4rem;
  overflow: hidden;
}

.dt-directory-card__image span {
  align-items: center;
  color: var(--dt-directory-blue);
  display: flex;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2rem;
  height: 100%;
  justify-content: center;
  min-height: 11.4rem;
}

.dt-directory-card__image span::before {
  content: "⌂";
}

.dt-directory-card__image img {
  display: block;
  height: 11.4rem;
  object-fit: cover;
  transition: transform .25s ease;
  width: 100%;
}

.dt-directory-card:hover .dt-directory-card__image img {
  transform: scale(1.025);
}

.dt-directory-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: .9rem;
}

.dt-directory-card__topline {
  align-items: center;
  color: var(--dt-directory-violet);
  display: flex;
  font-size: .68rem;
  font-weight: 800;
  gap: .45rem;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.dt-directory-card__topline b {
  background: #e7f7eb;
  border-radius: 999px;
  color: #176b36;
  font-size: .63rem;
  letter-spacing: .025em;
  padding: .2rem .42rem;
}

.dt-directory-card h2 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.26rem;
  line-height: 1.08;
  margin: .4rem 0;
}

.dt-directory-card h2 a,
.dt-directory-card__link {
  color: var(--dt-directory-blue);
  text-decoration: none;
}

.dt-directory-card h2 a:hover,
.dt-directory-card__link:hover {
  text-decoration: underline;
}

.dt-directory-card p {
  color: #46587f;
  font-size: .84rem;
  line-height: 1.38;
  margin: 0 0 .7rem;
}

.dt-directory-card__meta {
  color: var(--dt-directory-muted);
  font-size: .76rem;
  line-height: 1.35;
  margin: 0 0 .6rem;
}

.dt-directory-card ul {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  list-style: none;
  margin: auto 0 .75rem;
  padding: 0;
}

.dt-directory-card li {
  background: #f1f4fb;
  color: #46577d;
  font-size: .69rem;
  line-height: 1.2;
  padding: .25rem .4rem;
}

.dt-directory-card__link {
  font-size: .8rem;
  font-weight: 800;
  margin-top: auto;
}

.dt-directory-card__directions {
  color: var(--dt-directory-violet);
  display: inline-block;
  font-size: .76rem;
  font-weight: 800;
  margin: 0 0 .45rem;
  text-decoration: none;
}

.dt-directory-card__directions:hover,
.dt-directory-card__directions:focus {
  text-decoration: underline;
}

.dt-directory-card__link span {
  color: var(--dt-directory-violet);
  margin-left: .25rem;
}

.dt-directory__empty {
  background: var(--dt-directory-soft);
  border: 1px dashed #b5c1df;
  padding: 2.25rem 1.2rem;
  text-align: center;
}

.dt-directory__empty h2 {
  color: var(--dt-directory-blue);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.4rem;
  margin: 0 0 .45rem;
}

.dt-directory__empty p {
  color: var(--dt-directory-muted);
  margin: 0;
}

/* Mapa: la API de Google se carga únicamente tras una acción explícita. */
.dt-directory__map {
  background: #fff;
  border: 1px solid var(--dt-directory-line);
  margin: 1.25rem 0;
  overflow: hidden;
}

.dt-directory__map-header {
  align-items: center;
  border-bottom: 1px solid var(--dt-directory-line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem 1.1rem;
}

.dt-directory__map-header .dt-directory__eyebrow {
  margin-bottom: .2rem;
}

.dt-directory__map-header h2,
.dt-business-location h2 {
  color: var(--dt-directory-blue);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.35rem, 2.4vw, 1.8rem);
  line-height: 1.08;
  margin: 0;
}

.dt-directory__map-header h2 + p {
  color: var(--dt-directory-muted);
  font-size: .86rem;
  margin: .35rem 0 0;
}

.dt-directory__map-load {
  background: var(--dt-directory-violet);
  border: 0;
  border-radius: 999px;
  color: #fff;
  cursor: pointer;
  flex: 0 0 auto;
  font: inherit;
  font-size: .84rem;
  font-weight: 800;
  line-height: 1.2;
  padding: .7rem 1rem;
}

.dt-directory__map-load:hover,
.dt-directory__map-load:focus {
  background: #3510bc;
}

.dt-directory__map-load:disabled {
  cursor: wait;
  opacity: .7;
}

.dt-directory__map-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.72fr) minmax(16rem, .82fr);
}

.dt-directory__map-stage {
  background: linear-gradient(135deg, #eef3ff, #f8fbff);
  min-height: clamp(18rem, 34vw, 26rem);
  position: relative;
}

.dt-directory__map-canvas {
  height: 100%;
  min-height: clamp(18rem, 34vw, 26rem);
  width: 100%;
}

.dt-business-location .dt-directory__map-canvas {
  border: 1px solid var(--dt-directory-line);
  margin-top: 1rem;
  min-height: clamp(16rem, 34vw, 24rem);
}

.dt-directory__map-canvas[hidden] {
  display: none;
}

.dt-directory__map-placeholder {
  align-content: center;
  color: var(--dt-directory-muted);
  display: grid;
  inset: 0;
  justify-items: center;
  padding: 2rem;
  position: absolute;
  text-align: center;
}

.dt-directory__map-placeholder span {
  color: var(--dt-directory-blue);
  font-size: 3.2rem;
  line-height: 1;
}

.dt-directory__map-placeholder p {
  font-size: .9rem;
  margin: .7rem 0 0;
  max-width: 16rem;
}

.dt-directory__map-list {
  border-left: 1px solid var(--dt-directory-line);
  max-height: clamp(18rem, 34vw, 26rem);
  overflow: auto;
  padding: .9rem;
}

.dt-directory__map-list > strong {
  color: var(--dt-directory-blue);
  display: block;
  font-size: .76rem;
  letter-spacing: .04em;
  margin-bottom: .5rem;
  text-transform: uppercase;
}

.dt-directory__map-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.dt-directory__map-list li {
  border-top: 1px solid #e6ebf5;
  display: flex;
  flex-wrap: wrap;
  gap: .3rem .55rem;
  padding: .65rem 0;
}

.dt-directory__map-list li:first-child {
  border-top: 0;
}

.dt-directory__map-business {
  color: var(--dt-directory-blue);
  flex: 1 0 100%;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .95rem;
  font-weight: 700;
  text-decoration: none;
}

.dt-directory__map-business:hover,
.dt-directory__map-business:focus,
.dt-directory__map-directions:hover,
.dt-directory__map-directions:focus {
  text-decoration: underline;
}

.dt-directory__map-list li > span {
  color: var(--dt-directory-muted);
  flex: 1 0 100%;
  font-size: .74rem;
  line-height: 1.3;
}

.dt-directory__map-directions,
.dt-directory__map-focus {
  background: transparent;
  border: 0;
  color: var(--dt-directory-violet);
  cursor: pointer;
  font: inherit;
  font-size: .72rem;
  font-weight: 800;
  padding: 0;
  text-decoration: none;
}

.dt-directory__map-empty {
  color: var(--dt-directory-muted);
  display: block !important;
  font-size: .83rem;
  line-height: 1.4;
}

.dt-directory__map-privacy {
  color: var(--dt-directory-muted);
  font-size: .74rem;
  line-height: 1.4;
  margin: 0;
  padding: .65rem 1.1rem;
}

.dt-directory__map-privacy a {
  color: var(--dt-directory-blue);
}

.dt-directory__map-infowindow {
  color: #24385f;
  max-width: 14rem;
}

.dt-directory__map-infowindow strong,
.dt-directory__map-infowindow a {
  color: var(--dt-directory-blue);
}

.dt-directory__map-infowindow p {
  font-size: .82rem;
  margin: .35rem 0 .55rem;
}

.dt-directory__map-infowindow a + a {
  margin-left: .7rem;
}

.dt-directory-map-pin {
  color: var(--dt-directory-blue);
}

.dt-business-location {
  background: linear-gradient(120deg, #f7f9ff, #fff);
  border: 1px solid var(--dt-directory-line);
  border-left: 5px solid var(--dt-directory-blue);
  color: var(--dt-directory-ink);
  margin: 1.7rem 0;
  padding: clamp(1rem, 3vw, 1.5rem);
}

.dt-business-location .dt-directory__eyebrow {
  margin-bottom: .3rem;
}

.dt-business-location__address {
  color: var(--dt-directory-ink);
  font-weight: 700;
  margin: .75rem 0 .35rem;
}

.dt-business-location__status {
  color: var(--dt-directory-muted);
  font-size: .86rem;
  line-height: 1.42;
  margin: .35rem 0 .85rem;
}

.dt-business-location__directions {
  color: var(--dt-directory-violet);
  font-weight: 800;
}

.dt-business-location .dt-directory__map-privacy {
  padding: .65rem 0 0;
}

@media (max-width: 900px) {
  .dt-directory__filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dt-directory__field--search,
  .dt-directory__features {
    grid-column: 1 / -1;
  }

  .dt-directory__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .dt-directory__map-header,
  .dt-directory__map-layout {
    display: grid;
    grid-template-columns: 1fr;
  }

  .dt-directory__map-header {
    align-items: start;
  }

  .dt-directory__map-load {
    justify-self: start;
  }

  .dt-directory__map-list {
    border-left: 0;
    border-top: 1px solid var(--dt-directory-line);
    max-height: none;
  }
}

@media (max-width: 580px) {
  .dt-directory__filters,
  .dt-directory__grid {
    grid-template-columns: 1fr;
  }

  .dt-directory__field--search,
  .dt-directory__features {
    grid-column: auto;
  }

  .dt-directory__actions {
    justify-content: space-between;
  }

  .dt-directory-card__image,
  .dt-directory-card__image img,
  .dt-directory-card__image span {
    min-height: 10.2rem;
    height: 10.2rem;
  }
}