/* ============================================ */
/* Themify – Matterhorn Theme Styles            */
/* ============================================ */

/* --- Block Spacing --- */
.themify-spaced > section {
    padding-top: var(--block-spacing, 6rem) !important;
    padding-bottom: var(--block-spacing, 6rem) !important;
}

/* --- Block Background Override --- */
.themify-block-bg > section,
.themify-block-bg .themify-content-boxed > section,
.themify-block-bg section {
    background-color: transparent !important;
}

/* --- Button Color Override --- */
a[style*="background-color"][class*="rounded"],
button[style*="background-color"][class*="rounded"] {
    background-color: var(--button-color, var(--primary-color, #1e293b)) !important;
    color: var(--button-text-color, white) !important;
}

/* --- Navigation: Active State --- */
.themify-nav-active,
.themify-nav-active span {
    color: var(--primary-color) !important;
    font-weight: 600;
}

.themify-nav-active svg {
    stroke: var(--primary-color) !important;
}

/* --- Navigation: Hover --- */
nav ul li > a:hover,
nav ul li > button:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

nav ul li > button:hover svg {
    stroke: white !important;
}

/* --- Navigation: Dropdown --- */
.themify-dropdown {
    background-color: var(--secondary-color) !important;
    border-color: var(--secondary-color) !important;
}

.themify-dropdown a,
.themify-nav-overlay .themify-dropdown a,
.themify-nav-has-bg .themify-dropdown a {
    color: var(--dropdown-text-color, white) !important;
    opacity: 0.85;
}

.themify-dropdown a:hover,
.themify-nav-overlay .themify-dropdown a:hover,
.themify-nav-has-bg .themify-dropdown a:hover {
    color: var(--dropdown-text-color, white) !important;
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.08) !important;
}

.themify-dropdown a.font-bold {
    color: var(--dropdown-text-color, white) !important;
    opacity: 1;
}

/* ============================================ */
/* Boxed Layout                                 */
/* ============================================ */

.themify-is-boxed {
    overflow-x: clip;
}

.themify-is-boxed .themify-boxed {
    max-width: var(--content-max-width);
    margin-left: auto;
    margin-right: auto;
}

.themify-is-boxed.themify-boxed-shadow .themify-boxed {
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.07);
}

.themify-is-boxed .themify-fullbleed {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
}

.themify-is-boxed .themify-content-boxed {
    max-width: var(--content-max-width);
    margin-left: auto;
    margin-right: auto;
}

/* ============================================ */
/* Header Full Width (bg extends, content boxed)*/
/* ============================================ */

.themify-is-boxed .themify-header-fullwidth {
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding-left: calc(50vw - 50%);
    padding-right: calc(50vw - 50%);
}

/* ============================================ */
/* Header Full Width: bg on wrapper, nav clear   */
/* ============================================ */

.themify-nav-fullwidth {
    background-color: white;
}

.themify-nav-fullwidth nav,
.themify-nav-has-bg .themify-nav-fullwidth nav,
.themify-nav-transparent .themify-nav-fullwidth nav {
    background-color: transparent !important;
}

.themify-nav-has-bg .themify-nav-fullwidth {
    background-color: var(--nav-bg-color) !important;
}

.themify-nav-transparent .themify-nav-fullwidth {
    background: transparent !important;
}

/* ============================================ */
/* Navigation: Default Background               */
/* ============================================ */

nav {
    background-color: white;
}

/* ============================================ */
/* Navigation: Transparent                      */
/* ============================================ */

.themify-nav-transparent nav {
    background: transparent !important;
}

/* ============================================ */
/* Navigation: Custom Background Color          */
/* ============================================ */

.themify-nav-has-bg nav {
    background-color: var(--nav-bg-color) !important;
}

.themify-nav-light-text nav a,
.themify-nav-light-text nav button,
.themify-nav-light-text nav span,
.themify-nav-light-text nav li a {
    color: white;
}

.themify-nav-light-text nav button svg {
    stroke: white;
}

.themify-nav-light-text nav .navbar-burger rect {
    fill: var(--primary-color, #1e293b) !important;
}

/* ============================================ */
/* Navigation: Overlay on Hero                  */
/* ============================================ */

.themify-nav-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
}

.themify-nav-overlay nav {
    background-color: var(--nav-bg-color) !important;
}

.themify-nav-overlay nav a,
.themify-nav-overlay nav button,
.themify-nav-overlay nav span,
.themify-nav-overlay nav li a {
    color: var(--overlay-text-color);
}

.themify-nav-overlay nav a[style*="background-color"],
.themify-nav-overlay nav button[style*="background-color"],
.themify-nav-overlay nav a[style*="background-color"] span,
.themify-nav-overlay nav button[style*="background-color"] span,
.themify-nav-overlay nav a[style*="background-color"] svg,
.themify-nav-overlay nav button[style*="background-color"] svg {
    color: var(--button-text-color, white) !important;
}

.themify-nav-overlay nav .themify-nav-active,
.themify-nav-overlay nav .themify-nav-active span {
    color: var(--primary-color) !important;
}

.themify-nav-overlay nav .themify-nav-active svg {
    stroke: var(--primary-color) !important;
}

.themify-nav-overlay nav button svg {
    stroke: var(--overlay-text-color);
}

.themify-nav-overlay nav .navbar-burger rect {
    fill: var(--primary-color, #1e293b) !important;
}

.themify-overlay-light-text .themify-nav-overlay nav a[style*="background-color"] span {
    color: white;
}

.themify-overlay-light-text .themify-nav-overlay nav a.border-gray-200 {
    border-color: rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.1) !important;
}

.themify-overlay-light-text .themify-nav-overlay nav a.border-gray-200:hover {
    background: rgba(255, 255, 255, 0.2) !important;
}

/* ============================================ */
/* Mobile Nav: Always solid white background    */
/* ============================================ */

.themify-nav-transparent nav.themify-mobile-nav,
.themify-nav-has-bg nav.themify-mobile-nav,
.themify-nav-overlay nav.themify-mobile-nav {
    background-color: white !important;
    color: #111827 !important;
}

.themify-nav-transparent nav.themify-mobile-nav a,
.themify-nav-transparent nav.themify-mobile-nav button,
.themify-nav-transparent nav.themify-mobile-nav span,
.themify-nav-has-bg nav.themify-mobile-nav a,
.themify-nav-has-bg nav.themify-mobile-nav button,
.themify-nav-has-bg nav.themify-mobile-nav span,
.themify-nav-overlay nav.themify-mobile-nav a,
.themify-nav-overlay nav.themify-mobile-nav button,
.themify-nav-overlay nav.themify-mobile-nav span,
.themify-nav-light-text nav.themify-mobile-nav a,
.themify-nav-light-text nav.themify-mobile-nav button,
.themify-nav-light-text nav.themify-mobile-nav span {
    color: #111827 !important;
}

/* ============================================ */
/* Rich Text: Typography (CKEditor output)      */
/* Override Tailwind v4 Preflight reset          */
/* ============================================ */

.themify-richtext p {
    margin-bottom: 1em !important;
}

.themify-richtext p:last-child {
    margin-bottom: 0 !important;
}

.themify-richtext strong,
.themify-richtext b {
    font-weight: 600 !important;
}

.themify-richtext em,
.themify-richtext i {
    font-style: italic !important;
}

.themify-richtext u {
    text-decoration: underline !important;
}

.themify-richtext s {
    text-decoration: line-through !important;
}

.themify-richtext a {
    color: var(--primary-color, #2563eb) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

.themify-richtext a:hover {
    opacity: 0.8;
}

.themify-richtext h2 {
    font-size: 1.5em !important;
    font-weight: 600 !important;
    margin-top: 1.5em !important;
    margin-bottom: 0.5em !important;
    line-height: 1.3 !important;
}

.themify-richtext h3 {
    font-size: 1.25em !important;
    font-weight: 600 !important;
    margin-top: 1.25em !important;
    margin-bottom: 0.5em !important;
    line-height: 1.3 !important;
}

.themify-richtext h4 {
    font-size: 1.1em !important;
    font-weight: 600 !important;
    margin-top: 1em !important;
    margin-bottom: 0.5em !important;
    line-height: 1.4 !important;
}

.themify-richtext h2:first-child,
.themify-richtext h3:first-child,
.themify-richtext h4:first-child {
    margin-top: 0 !important;
}

.themify-richtext ul {
    list-style-type: disc !important;
    padding-left: 1.5em !important;
    margin-bottom: 1em !important;
}

.themify-richtext ol {
    list-style-type: decimal !important;
    padding-left: 1.5em !important;
    margin-bottom: 1em !important;
}

.themify-richtext ul ul {
    list-style-type: circle !important;
    margin-bottom: 0 !important;
}

.themify-richtext ol ol {
    list-style-type: lower-alpha !important;
    margin-bottom: 0 !important;
}

.themify-richtext li {
    margin-bottom: 0.25em !important;
    display: list-item !important;
}

.themify-richtext li:last-child {
    margin-bottom: 0 !important;
}

.themify-richtext blockquote {
    border-left: 3px solid var(--primary-color, #e5e7eb) !important;
    padding-left: 1em !important;
    margin: 1em 0 !important;
    font-style: italic !important;
    color: #6b7280;
}

.themify-richtext hr {
    border: none !important;
    border-top: 1px solid #e5e7eb !important;
    margin: 1.5em 0 !important;
}

.themify-richtext sup {
    vertical-align: super;
    font-size: 0.75em;
}

.themify-richtext sub {
    vertical-align: sub;
    font-size: 0.75em;
}

/* ============================================ */
/* Prose / Rich Text: Tables                    */
/* ============================================ */

.prose-content table,
.text-content table,
.card-text table,
.themify-richtext table {
    width: 100%;
    min-width: 100%;
    border-collapse: collapse;
    font-size: 0.925rem;
    line-height: 1.6;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    box-sizing: border-box;
}

/* Responsive wrapper — inserted via JS */
.themify-table-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 0.75rem;
    border: 1px solid #e5e7eb;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

/* CKEditor wraps tables in <figure class="table"> — ensure it stretches full width */
figure.table {
    width: 100%;
    margin: 0;
    display: block;
}

.themify-table-wrapper table,
.themify-table-wrapper figure.table table {
    width: 100%;
    min-width: 100%;
    border-collapse: collapse;
    font-size: 0.925rem;
    line-height: 1.6;
    margin: 0;
    box-sizing: border-box;
}

/* Header — default (full-width context) */
.themify-table-wrapper table thead th {
    background-color: var(--primary-color, #1e293b);
    color: white;
    font-weight: 600;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0.75rem 1rem;
    text-align: left;
    white-space: nowrap;
}

/* Header — inside a card: subtle gray instead of primary color */
.card-text .themify-table-wrapper table thead th {
    background-color: #f3f4f6;
    color: #374151;
    font-weight: 600;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* Card table wrapper: no outer border, flush with card */
.card-text .themify-table-wrapper {
    border: 1px solid #e5e7eb;
    border-radius: 0.625rem;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* Body rows */
.themify-table-wrapper table tbody tr {
    border-bottom: 1px solid #f3f4f6;
    transition: background-color 0.15s ease;
}

.themify-table-wrapper table tbody tr:last-child {
    border-bottom: none;
}

.themify-table-wrapper table tbody tr:nth-child(even) {
    background-color: #f9fafb;
}

.themify-table-wrapper table tbody tr:hover {
    background-color: #f3f4f6;
}

/* Cells */
.themify-table-wrapper table td {
    padding: 0.625rem 1rem;
    color: #374151;
    vertical-align: top;
    font-size: 0.875rem;
}

.themify-table-wrapper table th {
    padding: 0.625rem 1rem;
}

/* Card cells: tighter padding */
.card-text .themify-table-wrapper table td,
.card-text .themify-table-wrapper table th {
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
}

/* First column emphasis */
.themify-table-wrapper table tbody td:first-child {
    font-weight: 500;
    color: #111827;
}

/* Numbers / monospace values (prices, specs) */
.themify-table-wrapper table td:not(:first-child) {
    font-variant-numeric: tabular-nums;
}

/* ============================================ */
/* Footer: Custom Background Color              */
/* ============================================ */

.themify-footer-has-bg footer {
    background-color: var(--footer-bg-color) !important;
}

.themify-footer-has-bg.themify-footer-light-text footer,
.themify-footer-has-bg.themify-footer-light-text footer a,
.themify-footer-has-bg.themify-footer-light-text footer p,
.themify-footer-has-bg.themify-footer-light-text footer span,
.themify-footer-has-bg.themify-footer-light-text footer li,
.themify-footer-has-bg.themify-footer-light-text footer h2,
.themify-footer-has-bg.themify-footer-light-text footer h3,
.themify-footer-has-bg.themify-footer-light-text footer h4 {
    color: white;
}

/* --- Footer: Border Top --- */

.themify-footer-border footer {
    border-top: var(--footer-border-width, 1px) solid var(--footer-border-color, #e5e7eb);
}

.themify-footer-border-shadow footer {
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
}

/* --- Footer: Text Color Override --- */

/* --- Footer: Logo as Watermark --- */

.themify-footer-logo {
    opacity: 0.35;
    filter: grayscale(100%);
    transition: opacity 0.3s ease, filter 0.3s ease;
}

.themify-footer-logo:hover {
    opacity: 0.35;
}

/* --- Sticky Header --- */

.themify-nav-sticky {
    position: sticky;
    top: 0;
    z-index: 50;
}

/* --- Logo Height --- */

nav img,
footer img.themify-footer-logo {
    height: var(--logo-height, 2rem) !important;
    width: auto !important;
}

/* --- Navigation Typography --- */

nav li a,
nav li button,
nav li span {
    font-size: var(--nav-font-size) !important;
    font-weight: var(--nav-font-weight) !important;
    line-height: var(--nav-line-height) !important;
    font-family: var(--nav-font-family, inherit) !important;
}

/* --- Content Typography --- */

main {
    font-size: var(--content-font-size) !important;
    font-weight: var(--content-font-weight) !important;
    line-height: var(--content-line-height) !important;
    font-family: var(--content-font-family, inherit) !important;
}

/* --- Heading Typography --- */

.font-heading {
    font-family: var(--heading-font-family, inherit) !important;
}

/* ============================================ */
/* Auto-contrast: dark background blocks        */
/* When a block wrapper has .text-white (dark   */
/* blockBgColor), lighten inner gray text.      */
/* ============================================ */

.text-white .text-gray-900 { color: rgba(255,255,255,1); }
.text-white .text-gray-800 { color: rgba(255,255,255,0.92); }
.text-white .text-gray-700 { color: rgba(255,255,255,0.8); }
.text-white .text-gray-600 { color: rgba(255,255,255,0.7); }
.text-white .text-gray-500 { color: rgba(255,255,255,0.6); }

.text-white .border-gray-100,
.text-white .border-gray-200 { border-color: rgba(255,255,255,0.15); }

.text-white .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.text-white .divide-gray-200 > :not([hidden]) ~ :not([hidden]) { border-color: rgba(255,255,255,0.15); }

/* --- Footer: Text Color Override --- */

.themify-footer-has-bg.themify-footer-dark-text footer,
.themify-footer-has-bg.themify-footer-dark-text footer a,
.themify-footer-has-bg.themify-footer-dark-text footer p,
.themify-footer-has-bg.themify-footer-dark-text footer span,
.themify-footer-has-bg.themify-footer-dark-text footer li,
.themify-footer-has-bg.themify-footer-dark-text footer h2,
.themify-footer-has-bg.themify-footer-dark-text footer h3,
.themify-footer-has-bg.themify-footer-dark-text footer h4 {
    color: #111827;
}

/* --- Image aspect ratios --- */
.themify-aspect-portrait {
    aspect-ratio: 3 / 4;
}

/* --- CTA placeholder (preview vs live) --- */
.themify-cta-placeholder {
    display: none;
}
.is-preview .themify-cta-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 3.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: -0.01em;
    opacity: 0.15;
    border: 2px dashed #9ca3af;
    color: #9ca3af;
    pointer-events: none;
}

/* --- Image border & padding --- */
.themify-img-border {
    border: 1px solid #e5e7eb;
}
.themify-img-pad-sm { padding: 8px; }
.themify-img-pad-md { padding: 16px; }
.themify-img-pad-lg { padding: 24px; }