/**
 * TNT CMS — base.css
 * Shared structural styles. Loaded by every theme.
 * Colors and fonts are defined in theme-*.css via CSS variables — not here.
 */

html { scroll-behavior: smooth; }

body {
    font-family: var(--tnt-font-body, sans-serif);
    color:       var(--tnt-color-text, #333);
    background:  var(--tnt-color-bg,   #fff);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}

/* ── Header ─────────────────────────────────────────────────────────────── */
.tnt-header {
    position:   sticky;
    top:        0;
    z-index:    1030;
    background: var(--tnt-header-bg, #fff);
    box-shadow: var(--tnt-header-shadow, 0 2px 8px rgba(0,0,0,.08));
}
.tnt-header .navbar { padding: 0.75rem 0; }
.tnt-logo__text {
    font-family:     var(--tnt-font-heading, sans-serif);
    font-weight:     700;
    font-size:       1.4rem;
    color:           var(--tnt-color-primary, #0d6efd);
    text-decoration: none;
}
.tnt-logo__img { max-height: 52px; width: auto; }

/* ── Hero ───────────────────────────────────────────────────────────────── */
.tnt-hero {
    position:    relative;
    min-height:  var(--tnt-hero-height, 520px);
    display:     flex;
    align-items: center;
    overflow:    hidden;
    background:  var(--tnt-hero-bg, var(--tnt-color-primary, #0d6efd));
}
.tnt-hero__bg      { position: absolute; inset: 0; background-size: cover; background-position: center; }
.tnt-hero__overlay { position: absolute; inset: 0; background: var(--tnt-hero-overlay, rgba(0,0,0,.55)); }
.tnt-hero__content { position: relative; z-index: 2; padding: 4rem 0; color: #fff; }
.tnt-hero__heading {
    font-family:   var(--tnt-font-heading, sans-serif);
    font-size:     clamp(2rem, 5vw, 3.25rem);
    font-weight:   800;
    line-height:   1.15;
    margin-bottom: 1rem;
}
.tnt-hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* ── Trust Bar ──────────────────────────────────────────────────────────── */
.tnt-trust-bar {
    background:    var(--tnt-trust-bar-bg, #f8f9fa);
    padding:       1.25rem 0;
    border-bottom: 1px solid var(--tnt-border-color, #dee2e6);
}
.tnt-trust-bar__item {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             0.5rem;
    font-weight:     600;
    font-size:       0.9rem;
}
.tnt-trust-bar__icon { font-size: 1.1rem; color: var(--tnt-color-primary); }

/* ── Section Titles ─────────────────────────────────────────────────────── */
.tnt-section-title {
    font-family:   var(--tnt-font-heading, sans-serif);
    font-size:     clamp(1.6rem, 3vw, 2.25rem);
    font-weight:   700;
    color:         var(--tnt-color-heading, #1a1a2e);
    margin-bottom: 0.5rem;
}

/* ── Content Areas ──────────────────────────────────────────────────────── */
.tnt-content-section { padding: 4rem 0; }
.tnt-content-area    { padding: 3.5rem 0 4rem; }

.tnt-body-content             { font-size: 1.05rem; line-height: 1.8; }
.tnt-body-content h2          { font-family: var(--tnt-font-heading); font-size: 1.7rem; font-weight: 700; margin-top: 2rem; margin-bottom: 0.75rem; color: var(--tnt-color-heading); }
.tnt-body-content h3          { font-family: var(--tnt-font-heading); font-size: 1.3rem; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.5rem; color: var(--tnt-color-heading); }
.tnt-body-content img         { max-width: 100%; height: auto; border-radius: 6px; margin: 1rem 0; }
.tnt-body-content ul,
.tnt-body-content ol          { padding-left: 1.5rem; margin-bottom: 1rem; }
.tnt-body-content a           { color: var(--tnt-color-primary); }

/* ── Page Banner ────────────────────────────────────────────────────────── */
.tnt-page-banner {
    position:   relative;
    background: var(--tnt-banner-bg, var(--tnt-color-primary, #0d6efd));
    color:      #fff;
    padding:    3rem 0 2rem;
    overflow:   hidden;
}
.tnt-page-banner__bg      { position: absolute; inset: 0; background-size: cover; background-position: center; }
.tnt-page-banner__overlay { position: absolute; inset: 0; background: var(--tnt-hero-overlay, rgba(0,0,0,.6)); }
.tnt-page-banner__inner   { position: relative; z-index: 2; color: #fff; }
.tnt-page-banner__h1 {
    font-family:   var(--tnt-font-heading);
    font-size:     clamp(1.6rem, 3.5vw, 2.5rem);
    font-weight:   800;
    margin-bottom: 0.5rem;
}
.tnt-page-banner__location { font-size: 1rem; opacity: 0.85; margin-bottom: 0.5rem; }

/* ── Breadcrumb ─────────────────────────────────────────────────────────── */
.tnt-breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.6); margin-bottom: 0; }
.tnt-breadcrumb .breadcrumb-item a         { color: rgba(255,255,255,.8); text-decoration: none; }
.tnt-breadcrumb .breadcrumb-item a:hover   { color: #fff; }
.tnt-breadcrumb .breadcrumb-item.active    { color: rgba(255,255,255,.9); }
.tnt-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255,255,255,.5); }

/* ── Service Cards ──────────────────────────────────────────────────────── */
.tnt-services { padding: 4rem 0; background: var(--tnt-services-bg, #f8f9fa); }
.tnt-service-card {
    display:        block;
    text-decoration: none;
    background:     var(--tnt-card-bg, #fff);
    border:         1px solid var(--tnt-border-color, #dee2e6);
    border-radius:  var(--tnt-radius, 8px);
    padding:        2rem 1.5rem;
    height:         100%;
    transition:     box-shadow 0.2s, transform 0.2s, border-color 0.2s;
    color:          var(--tnt-color-text);
}
.tnt-service-card:hover         { box-shadow: 0 8px 24px rgba(0,0,0,.1); transform: translateY(-3px); border-color: var(--tnt-color-primary); color: var(--tnt-color-text); }
.tnt-service-card__title        { font-family: var(--tnt-font-heading); font-size: 1.2rem; font-weight: 700; color: var(--tnt-color-heading); margin-bottom: 0.75rem; }
.tnt-service-card__desc         { font-size: 0.92rem; color: var(--tnt-color-muted); margin-bottom: 1rem; line-height: 1.6; }
.tnt-service-card__link         { font-size: 0.9rem; font-weight: 600; color: var(--tnt-color-primary); }

/* ── CTA Band ───────────────────────────────────────────────────────────── */
.tnt-cta-band           { background: var(--tnt-cta-bg, var(--tnt-color-primary)); color: #fff; padding: 4rem 0; }
.tnt-cta-band__heading  { font-family: var(--tnt-font-heading); font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 700; margin-bottom: 0.75rem; }
.tnt-cta-band__sub      { font-size: 1.1rem; opacity: 0.9; margin-bottom: 2rem; }
.tnt-cta-band__actions  { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }

/* ── Inline CTA ─────────────────────────────────────────────────────────── */
.tnt-inline-cta {
    background:    var(--tnt-trust-bar-bg, #f8f9fa);
    border-left:   4px solid var(--tnt-color-primary);
    border-radius: var(--tnt-radius, 8px);
    padding:       2rem;
    margin-top:    3rem;
}
.tnt-inline-cta__heading { font-family: var(--tnt-font-heading); font-size: 1.4rem; font-weight: 700; margin-bottom: 0.5rem; }

/* ── Sidebar ────────────────────────────────────────────────────────────── */
.tnt-sidebar            { position: sticky; top: 100px; }
.tnt-sidebar-widget     { background: var(--tnt-card-bg, #fff); border: 1px solid var(--tnt-border-color, #dee2e6); border-radius: var(--tnt-radius, 8px); padding: 1.5rem; margin-bottom: 1.5rem; }
.tnt-sidebar-widget__title { font-family: var(--tnt-font-heading); font-size: 1.05rem; font-weight: 700; color: var(--tnt-color-heading); margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 2px solid var(--tnt-color-primary); }
.tnt-sidebar-cta        { background: var(--tnt-color-primary); border-color: var(--tnt-color-primary); color: #fff; text-align: center; }
.tnt-sidebar-cta .tnt-sidebar-widget__title { color: #fff; border-color: rgba(255,255,255,.3); }
.tnt-sidebar-phone      { display: block; font-size: 1.5rem; font-weight: 800; color: #fff; text-decoration: none; margin-bottom: 0.5rem; }
.tnt-sidebar-phone:hover { color: rgba(255,255,255,.85); }
.tnt-sidebar-links      { list-style: none; padding: 0; margin: 0; }
.tnt-sidebar-links li   { padding: 0.35rem 0; border-bottom: 1px solid var(--tnt-border-color); }
.tnt-sidebar-links li:last-child { border-bottom: none; }
.tnt-sidebar-links a    { color: var(--tnt-color-text); text-decoration: none; font-size: 0.95rem; }
.tnt-sidebar-links a:hover { color: var(--tnt-color-primary); }

/* ── Trust List ─────────────────────────────────────────────────────────── */
.tnt-trust-list__items          { list-style: none; padding: 0; margin: 0; }
.tnt-trust-list__items li       { padding: 0.35rem 0 0.35rem 1.5rem; position: relative; font-size: 0.95rem; border-bottom: 1px solid var(--tnt-border-color); }
.tnt-trust-list__items li:last-child { border-bottom: none; }
.tnt-trust-list__items li::before { content: '✓'; position: absolute; left: 0; color: var(--tnt-color-primary); font-weight: 700; }

/* ── Blog Post Cards ────────────────────────────────────────────────────── */
.tnt-blog-preview           { padding: 4rem 0; }
.tnt-post-card              { background: var(--tnt-card-bg, #fff); border: 1px solid var(--tnt-border-color, #dee2e6); border-radius: var(--tnt-radius, 8px); overflow: hidden; height: 100%; display: flex; flex-direction: column; transition: box-shadow 0.2s, transform 0.2s; }
.tnt-post-card:hover        { box-shadow: 0 6px 20px rgba(0,0,0,.09); transform: translateY(-2px); }
.tnt-post-card__img-wrap    { display: block; overflow: hidden; }
.tnt-post-card__img         { width: 100%; height: 200px; object-fit: cover; display: block; transition: transform 0.3s; }
.tnt-post-card:hover .tnt-post-card__img { transform: scale(1.03); }
.tnt-post-card__body        { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; }
.tnt-post-card__date        { font-size: 0.8rem; color: var(--tnt-color-muted); margin-bottom: 0.4rem; }
.tnt-post-card__title       { font-family: var(--tnt-font-heading); font-size: 1.05rem; font-weight: 700; margin-bottom: 0.5rem; }
.tnt-post-card__title a     { color: var(--tnt-color-heading); text-decoration: none; }
.tnt-post-card__title a:hover { color: var(--tnt-color-primary); }
.tnt-post-card__excerpt     { font-size: 0.9rem; color: var(--tnt-color-muted); flex: 1; }
.tnt-post-card__more        { font-size: 0.88rem; font-weight: 600; color: var(--tnt-color-primary); text-decoration: none; margin-top: 0.75rem; display: inline-block; }

/* ── Blog Single ────────────────────────────────────────────────────────── */
.tnt-post-meta              { font-size: 0.9rem; color: rgba(255,255,255,.8); margin-bottom: 0.5rem; display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.tnt-post-featured-img      { width: 100%; border-radius: var(--tnt-radius); }
.tnt-tag                    { display: inline-block; background: var(--tnt-color-primary); color: #fff; font-size: 0.75rem; font-weight: 600; padding: 0.2rem 0.6rem; border-radius: 4px; }

/* ── Phone Button ───────────────────────────────────────────────────────── */
.tnt-btn-phone { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 700; }

/* ── Footer ─────────────────────────────────────────────────────────────── */
.tnt-footer         { background: var(--tnt-footer-bg, #1a1a2e); color: var(--tnt-footer-text, rgba(255,255,255,.8)); padding: 4rem 0 2rem; }
.tnt-footer__heading { font-family: var(--tnt-font-heading); font-size: 1rem; font-weight: 700; color: #fff; margin-bottom: 1rem; }
.tnt-footer__address { font-style: normal; font-size: 0.9rem; line-height: 1.7; }
.tnt-footer__phone,
.tnt-footer__email  { color: var(--tnt-footer-text); text-decoration: none; font-size: 0.95rem; }
.tnt-footer__phone:hover,
.tnt-footer__email:hover { color: #fff; }
.tnt-footer__links  { list-style: none; padding: 0; margin: 0; }
.tnt-footer__links li { padding: 0.3rem 0; }
.tnt-footer__links a { color: var(--tnt-footer-text); text-decoration: none; font-size: 0.9rem; }
.tnt-footer__links a:hover { color: #fff; }
.tnt-footer__bottom { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); }
.tnt-footer__bottom small { color: rgba(255,255,255,.5); }
.tnt-footer__bottom a { color: rgba(255,255,255,.6); text-decoration: none; }
.tnt-footer__bottom a:hover { color: #fff; }

/* ── 404 ────────────────────────────────────────────────────────────────── */
.tnt-404-content { padding: 8rem 1rem; }
.tnt-404__code   { font-size: 8rem; font-weight: 900; color: var(--tnt-color-primary); line-height: 1; }
.tnt-404__msg    { font-size: 2rem; font-weight: 700; margin-bottom: 1rem; }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 991.98px) {
    .tnt-sidebar { position: static; }
    .tnt-hero    { min-height: 400px; }
}
@media (max-width: 767.98px) {
    .tnt-cta-band__actions { flex-direction: column; align-items: center; }
    .tnt-hero__actions     { flex-direction: column; }
}

/* ── Contact Form ───────────────────────────────────────────────────────── */
.tnt-form-wrap {
    max-width: 640px;
}
.tnt-form .tnt-field {
    margin-bottom: 1.25rem;
}
.tnt-form label {
    display:       block;
    font-weight:   600;
    font-size:     0.9rem;
    margin-bottom: 0.4rem;
    color:         var(--tnt-color-heading);
}
.tnt-required {
    color: #dc3545;
    margin-left: 2px;
}
.tnt-form input[type="text"],
.tnt-form input[type="email"],
.tnt-form input[type="phone"],
.tnt-form input[type="tel"],
.tnt-form input[type="number"],
.tnt-form select,
.tnt-form textarea {
    display:        block;
    width:          100%;
    padding:        0.6rem 0.9rem;
    font-size:      1rem;
    font-family:    var(--tnt-font-body);
    color:          var(--tnt-color-text);
    background:     var(--tnt-color-bg);
    border:         1px solid var(--tnt-color-border);
    border-radius:  var(--tnt-radius);
    transition:     border-color 0.15s, box-shadow 0.15s;
    -webkit-appearance: none;
}
.tnt-form input:focus,
.tnt-form select:focus,
.tnt-form textarea:focus {
    outline:      none;
    border-color: var(--tnt-color-primary);
    box-shadow:   0 0 0 3px color-mix(in srgb, var(--tnt-color-primary) 15%, transparent);
}
.tnt-form textarea {
    resize:     vertical;
    min-height: 130px;
}
.tnt-field-submit {
    margin-top: 0.5rem;
}
.tnt-submit {
    display:       inline-block;
    padding:       0.7rem 2rem;
    background:    var(--tnt-color-primary);
    color:         #fff;
    font-family:   var(--tnt-font-heading);
    font-size:     1rem;
    font-weight:   700;
    border:        none;
    border-radius: var(--tnt-radius);
    cursor:        pointer;
    transition:    background 0.2s, transform 0.1s;
}
.tnt-submit:hover    { background: var(--tnt-color-primary-d); }
.tnt-submit:active   { transform: scale(0.98); }
.tnt-submit:disabled { opacity: 0.65; cursor: not-allowed; }

/* Form messages */
.tnt-form-messages {
    padding:       0.9rem 1.1rem;
    border-radius: var(--tnt-radius);
    font-weight:   600;
    margin-bottom: 1rem;
}
.tnt-form-messages.tnt-success {
    background: #d1fae5;
    color:      #065f46;
    border:     1px solid #6ee7b7;
}
.tnt-form-messages.tnt-error {
    background: #fee2e2;
    color:      #991b1b;
    border:     1px solid #fca5a5;
}

/* Radio & checkbox groups */
.tnt-radio-label,
.tnt-checkbox-label {
    display:       flex;
    align-items:   center;
    gap:           0.5rem;
    font-weight:   normal;
    cursor:        pointer;
    margin-bottom: 0.4rem;
}

/* ── Directory Module ───────────────────────────────────────────────────── */

/* City Venues Listing */
.dir-city-venues__header          { margin-bottom: 2rem; }
.dir-city-venues__title           { font-family: var(--tnt-font-heading); font-size: clamp(1.6rem, 3vw, 2.25rem); font-weight: 800; color: var(--tnt-color-heading); margin-bottom: 0.25rem; }
.dir-city-venues__meta            { font-size: 0.95rem; color: var(--tnt-color-muted); }

/* Venue Card */
.dir-venue-card                   { background: var(--tnt-color-card-bg, #fff); border: 1px solid var(--tnt-color-border, #e2e8f0); border-radius: var(--tnt-radius, 10px); overflow: hidden; height: 100%; display: flex; flex-direction: column; transition: box-shadow 0.2s, transform 0.15s; }
.dir-venue-card:hover             { box-shadow: 0 6px 20px rgba(0,0,0,.09); transform: translateY(-2px); }
.dir-venue-card__img-wrap         { display: block; overflow: hidden; background: #f1f5f9; aspect-ratio: 16 / 9; position: relative; }
.dir-venue-card__img              { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.3s; position: absolute; inset: 0; }
.dir-venue-card:hover .dir-venue-card__img { transform: scale(1.03); }
.dir-venue-card__img-placeholder  { width: 100%; aspect-ratio: 16 / 9; display: flex; align-items: center; justify-content: center; background: #f1f5f9; color: var(--tnt-color-muted); font-size: 2rem; position: relative; }
.dir-venue-card__body             { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; }
.dir-venue-card__name             { font-family: var(--tnt-font-heading); font-size: 1.1rem; font-weight: 700; color: var(--tnt-color-heading); margin: 0 0 0.35rem; line-height: 1.3; }
.dir-venue-card__name a           { color: inherit; text-decoration: none; }
.dir-venue-card__name a:hover     { color: var(--tnt-color-primary); }
.dir-venue-card__rating           { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.78rem; font-weight: 700; position: absolute; top: 0.6rem; right: 0.6rem; background: var(--tnt-color-primary); color: #fff; padding: 0.2rem 0.55rem; border-radius: 20px; z-index: 2; line-height: 1; }
.dir-venue-card__rating-star      { color: #fbbf24; }
.dir-venue-card__location         { font-size: 0.88rem; color: var(--tnt-color-muted); margin-bottom: 0.5rem; }
.dir-venue-card__summary          { font-size: 0.88rem; color: var(--tnt-color-muted); line-height: 1.5; margin-bottom: 0; flex: 1; }
.dir-venue-card__actions          { display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 1rem 1.25rem; border-top: 1px solid var(--tnt-color-border, #e2e8f0); margin-top: auto; }
.dir-venue-card__btn              { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.4rem 0.85rem; font-size: 0.82rem; font-weight: 600; border-radius: 6px; text-decoration: none; white-space: nowrap; transition: background 0.15s, color 0.15s; }
a.dir-venue-card__btn--primary     { background: var(--tnt-color-primary); color: #fff; }
a.dir-venue-card__btn--primary:hover { background: var(--tnt-color-primary-d); color: #fff; }
.dir-venue-card__btn--outline     { background: transparent; color: var(--tnt-color-text); border: 1px solid var(--tnt-color-border, #cbd5e1); }
.dir-venue-card__btn--outline:hover { background: #f1f5f9; color: var(--tnt-color-primary); border-color: var(--tnt-color-primary); }

/* Region Cities Grid */
.dir-region-cities__heading       { font-family: var(--tnt-font-heading); font-size: 1.3rem; font-weight: 700; }
.dir-city-card                    { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; background: var(--tnt-color-card-bg, #fff); border: 1px solid var(--tnt-color-border, #e2e8f0); border-radius: var(--tnt-radius, 10px); text-decoration: none; color: var(--tnt-color-text); transition: box-shadow 0.2s, border-color 0.15s; }
.dir-city-card:hover              { box-shadow: 0 4px 12px rgba(0,0,0,.08); border-color: var(--tnt-color-primary); color: var(--tnt-color-text); }
.dir-city-card__name              { font-weight: 600; color: var(--tnt-color-heading); }
.dir-city-card__count             { font-size: 0.85rem; color: var(--tnt-color-muted); margin-top: 0.15rem; }
.dir-city-card__badge             { background: var(--tnt-color-primary); color: #fff; font-size: 0.78rem; font-weight: 700; padding: 0.25rem 0.65rem; border-radius: 20px; flex-shrink: 0; }

/* Venue Detail Page */
.dir-venue-detail__hero-img       { width: 100%; max-height: 400px; object-fit: cover; border-radius: var(--tnt-radius, 10px); }
.dir-venue-detail__name           { font-family: var(--tnt-font-heading); font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 800; margin-bottom: 0.25rem; }
.dir-venue-detail__rating         { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 1rem; font-weight: 600; }
.dir-venue-detail__rating-star    { color: #f59e0b; font-size: 1.1rem; }
.dir-venue-detail__section-title  { font-family: var(--tnt-font-heading); font-size: 1.15rem; font-weight: 700; margin-bottom: 0.75rem; }

/* Venue Detail Pill Buttons */
a.dir-pill                        { display: inline-block; padding: 0.45rem 1.1rem; font-size: 0.88rem; font-weight: 600; border-radius: 20px; text-decoration: none; border: 1px solid var(--tnt-color-border, #cbd5e1); color: var(--tnt-color-text); background: transparent; transition: background 0.15s, color 0.15s, border-color 0.15s; }
a.dir-pill:hover                  { background: #f1f5f9; color: var(--tnt-color-primary); border-color: var(--tnt-color-primary); }
a.dir-pill--filled                { background: var(--tnt-color-primary); color: #fff; border-color: var(--tnt-color-primary); }
a.dir-pill--filled:hover          { background: var(--tnt-color-primary-d); border-color: var(--tnt-color-primary-d); color: #fff; }

/* Directory Pagination */
.dir-pagination .page-link        { color: var(--tnt-color-primary); border-color: var(--tnt-color-border); }
.dir-pagination .page-item.active .page-link { background: var(--tnt-color-primary); border-color: var(--tnt-color-primary); color: #fff; }
.dir-pagination .page-link:hover  { background: #f1f5f9; color: var(--tnt-color-primary-d); }

@media (max-width: 575.98px) {
    .dir-venue-card__img-wrap      { aspect-ratio: 16 / 10; }
    .dir-venue-card__actions       { flex-direction: column; }
    .dir-venue-card__btn           { justify-content: center; }
}