/* ==========================================================================
   Directory pages only (GeoDirectory + AyeCode UI/Bootstrap).
   Loaded by inc/assets.php when yq_is_directory_request() is true.
   Scoped to .directory / .listing / GD wrappers so Bootstrap can't leak into theme styles.
   ========================================================================== */

/* Layout: filters | results */
.directory__layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: var(--gap); align-items: start; }
.directory__filters { position: sticky; top: calc(var(--header-h-stuck) + 24px); }
@media (max-width: 1023px) { .directory__layout { grid-template-columns: minmax(0, 1fr); } .directory__filters { position: static; } }

.dir-search { display: grid; gap: 16px; }
.dir-search .field input { min-height: 48px; }
.dir-cats ul { margin: 8px 0 0; padding: 0; list-style: none; }
.dir-cats a { display: flex; justify-content: space-between; padding-block: 12px; border-bottom: 1px solid var(--ink-15); font-weight: 700; color: var(--ink); text-decoration: none; }
.dir-cats a:hover { text-decoration: underline; }
.dir-cats a[aria-current] { color: var(--red); }
.dir-cats__count { font-weight: 400; color: var(--ink-60); }

/* GD listings grid: GD wraps each [yaqwa_card] in .card.h-100 inside a Bootstrap row. */
.directory .geodir-loop-container .row { --bs-gutter-x: var(--gap); --bs-gutter-y: var(--gap); }
.directory .geodir-post .card { height: 100%; padding: 0 !important; border: 1px solid var(--ink-15) !important; border-radius: 0 !important; box-shadow: none !important; overflow: hidden; transition: transform var(--motion-base) var(--ease-out), box-shadow var(--motion-base) var(--ease-out); }
@media (hover: hover) { .directory .geodir-post .card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card) !important; } }
.dir-card { position: relative; display: flex; flex-direction: column; height: 100%; }
.dir-card__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--sand); }
.dir-card__media img { width: 100%; height: 100%; object-fit: cover; }
.dir-card__body { display: flex; flex: 1; flex-direction: column; gap: 12px; padding: 24px; }
.dir-card__title { margin: 0; font-family: var(--font); font-size: 20px; line-height: 27px; font-weight: 700; }
.dir-card__title a { color: var(--ink); }
.dir-card__desc { margin: 0; font-size: 15px; line-height: 24px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.dir-card .link-arrow { margin-top: auto; }
.dir-card__placeholder { display: block; width: 100%; height: 100%; background: var(--pattern-triangles) 0 0 / 60px 60px, var(--sand); }

/* Category badges: beat Bootstrap's .badge (loaded after the theme). */
.directory .badge, .listing .badge { display: inline-block; padding: 4px 10px; border-radius: 2px; font-family: var(--font); font-size: 11px; line-height: 16px; letter-spacing: .8px; font-weight: 700; text-transform: uppercase; white-space: normal; }
.directory .badge.badge--red, .listing .badge.badge--red { background: var(--red); color: var(--white); }
.directory .badge.badge--blue, .listing .badge.badge--blue { background: var(--blue); color: var(--white); }

/* Bootstrap resets that fight the theme inside GD output. */
.directory, .listing, .geodir-add-listing { font-family: var(--font); }
.directory a, .listing a { text-decoration: none; }
.directory .pagination { margin-top: 32px; }
.directory .page-link { border-radius: 0 !important; color: var(--ink); }
.directory .page-item.active .page-link { background: var(--ink); border-color: var(--ink); }

/* Single listing */
.listing__layout { display: grid; grid-template-columns: minmax(0, 770fr) minmax(0, 370fr); gap: var(--gap); align-items: start; }
@media (max-width: 1023px) { .listing__layout { grid-template-columns: minmax(0, 1fr); } }
.listing__hero img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.listing__thumbs { display: flex; flex-wrap: wrap; gap: 12px; }
.listing__thumbs img { width: 120px; height: 80px; object-fit: cover; }
.listing__aside { padding: 32px; background: var(--sand); }
.listing__logo { display: grid; place-items: center; width: 140px; aspect-ratio: 1; padding: 12px; background: var(--white); }
.listing__logo img { width: 100%; height: 100%; object-fit: contain; }
.listing__contact { display: grid; gap: 4px 0; margin: 0; }
.listing__contact dt { margin-top: 12px; font-size: 13px; line-height: 18px; letter-spacing: 1px; font-weight: 700; text-transform: uppercase; color: var(--ink-70); }
.listing__contact dd { margin: 0; font-size: 15px; line-height: 24px; }
.listing__contact address { font-style: normal; }
.listing__map { overflow: hidden; }

/* Add Listing form (GD) — CSS-only fieldset cards and inputs. */
/* GD outputs each step heading as its own (empty) fieldset: style as a section title with a rule. */
.geodir-add-listing fieldset, #geodirectory-add-post fieldset { margin: 48px 0 24px; padding: 32px 0 0; border: 0; border-top: 3px solid var(--blue); }
.geodir-add-listing legend, #geodirectory-add-post legend, .geodir-add-listing h3, #geodirectory-add-post h3 { font-family: var(--font); font-size: 32px; line-height: 42.56px; font-weight: 700; }
#geodirectory-add-post .form-control, #geodirectory-add-post .form-select { min-height: 52px; border-radius: 0; border-color: var(--ink-25); font-size: 16px; }
#geodirectory-add-post .form-control:focus, #geodirectory-add-post .form-select:focus { border: 2px solid var(--blue); box-shadow: none; }
#geodirectory-add-post label { font-weight: 700; }
#geodirectory-add-post .btn-primary, #geodirectory-add-post [type="submit"] { min-height: 45px; padding: 13px 29px; border-radius: 0; background: var(--blue); border-color: var(--blue); text-transform: uppercase; font-size: 14px; letter-spacing: .21px; }
/* Stack labels above fields (GD uses a narrow col-sm-2 label column). */
#geodirectory-add-post .row, #geodirectory-add-post .form-group.row { display: flex; flex-direction: column; margin-inline: 0; }
#geodirectory-add-post .row > [class*="col-"] { width: 100%; max-width: 100%; flex: 0 0 auto; padding-inline: 0; }
#geodirectory-add-post .col-form-label { padding-bottom: 6px; font-size: 15px; line-height: 22px; }
#geodirectory-add-post .form-text, #geodirectory-add-post small { color: var(--ink-60); }
#geodirectory-add-post .mb-3 { margin-bottom: 24px !important; }
#geodirectory-add-post .form-check-inline { margin-right: 24px; }
@media (max-width: 599px) { .geodir-add-listing legend, #geodirectory-add-post legend, #geodirectory-add-post h3 { font-size: 24px; line-height: 32px; } }
