/* sky-prayer-fonts */
/* Self-hosted Google Font (Share Tech Mono) — bundled to avoid third-party
   requests to fonts.googleapis.com/gstatic.com (GDPR + performance). */
@font-face {
  font-family: 'Share Tech Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://ghh.org.uk/wp-content/plugins/sky-prayer-timetable/assets/fonts/share-tech-mono-v16-latin.woff2") format('woff2');
}

/* sky-prayer-split-design */
/**
 * Sky Prayer Timetable - Split Design Styles
 *
 * Modern split-layout design with blue header/footer and white content.
 * Features a 2x3 grid of prayer boxes with full Elementor styling support.
 *
 * @package Sky_Prayer_Timetable
 */

/* Note: Share Tech Mono font is loaded via PHP wp_enqueue_style for better performance */

/* ========================================
   CSS Variables for Split Design
   ======================================== */
:root {
    --sky-split-primary-color: #204c93;
    --sky-split-header-bg: #204c93;
    --sky-split-content-bg: #ffffff;
    --sky-split-content-header-bg: #f8f9fa;
    --sky-split-footer-bg: #204c93;
    --sky-split-text-light: #ffffff;
    --sky-split-text-dark: #204c93;
    --sky-split-text-muted: #666666;
    --sky-split-border-color: #e0e0e0;
    --sky-split-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    --sky-split-font-family: 'Roboto Condensed', sans-serif;
    --sky-split-active-bg: #204c93;
}

/* ========================================
   Main Widget Container
   ======================================== */
.sky-split-timetable-widget {
    font-family: var(--sky-split-font-family);
    position: relative;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

.sky-split-timetable-widget *,
.sky-split-timetable-widget *::before,
.sky-split-timetable-widget *::after {
    box-sizing: border-box;
}

/* ========================================
   Header Section
   ======================================== */
.sky-split-header {
    background-color: #204c93;
    background-image: url("https://ghh.org.uk/wp-content/plugins/sky-prayer-timetable/assets/img/arabesque-bg.svg");
    background-repeat: repeat;
    background-size: auto;
    color: #ffffff;
    padding: 20px 30px 30px;
    text-align: center;
    position: relative;
}

.sky-split-header-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
    font-size: 14px;
    position: relative;
    z-index: 1;
}

/* Header overlay for background images */
.sky-split-header-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 0;
}

.sky-split-english-date {
    font-weight: 500;
}

.sky-split-current-time {
    font-size: 18px;
    font-weight: 600;
}

.sky-split-arabic-date {
    direction: rtl;
    font-size: 14px;
}

/* ========================================
   Countdown Section - Labels Under Numbers
   ======================================== */
.sky-split-countdown-section {
    margin-top: 15px;
    position: relative;
    z-index: 1;
}

.sky-split-countdown-text {
    font-size: 20px;
    margin-bottom: 15px;
}

.sky-split-next-prayer-name {
    font-weight: 700;
    text-transform: uppercase;
}

.sky-split-countdown-timer {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 0;
}

.sky-split-countdown-unit {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sky-split-countdown-number {
    font-family: "Share Tech Mono", monospace;
    font-size: 72px;
    font-weight: 400;
    line-height: 1;
    text-align: center;
}

.sky-split-countdown-separator {
    font-size: 60px;
    font-weight: 300;
    line-height: 1;
    margin: 0 5px;
    opacity: 0.8;
    height: 72px; /* Match the number font-size to align vertically */
    display: flex;
    align-items: center;
}

.sky-split-countdown-label {
    display: inline-block;
    background-color: #204c938a;
    color: #fff;
    border-radius: 7px;
    padding: 3px 10px 3px 10px;
    font-size: 13px;
    font-weight: 500;
    text-transform: capitalize;
    margin-top: 10px;
}

/* ========================================
   Content Section
   ======================================== */
.sky-split-content {
    background-color: var(--sky-split-content-bg);
    color: var(--sky-split-text-dark);
    padding: 0px 0px 0px 0px;
}

.sky-split-content-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 15px;
    background-color: var(--sky-split-content-header-bg);
    border-bottom: 1px solid var(--sky-split-border-color);
}

.sky-split-content-date {
    flex: 1;
    text-align: center;
}

.sky-split-content-english-date {
    font-size: 18px;
    font-weight: 600;
    color: var(--sky-split-primary-color);
    margin-bottom: 5px;
}

.sky-split-content-hijri-date {
    font-size: 14px;
    color: var(--sky-split-primary-color);
    opacity: 0.8;
}

/* Navigation Buttons */
.sky-split-nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(32, 76, 147, 0.1);
    border: 2px solid #204c93;
    color: #204c93;
    cursor: pointer;
    transition: all 0.2s ease;
    border-radius: 50%;
    padding: 0;
    flex-shrink: 0;
}

.sky-split-nav-btn:hover {
    background-color: #204c93;
    color: #ffffff;
}

.sky-split-nav-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(32, 76, 147, 0.3);
}

.sky-split-nav-btn svg {
    width: 28px;
    height: 28px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sky-split-nav-btn svg path {
    fill: none;
    stroke: currentColor;
}

/* ========================================
   Prayer Grid
   ======================================== */
.sky-split-prayer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    padding: 20px 0px 20px 0px;
}

.sky-split-prayer-box {
    background-color: #f8f9fa;
    border: 1px solid var(--sky-split-border-color);
    border-radius: 8px;
    padding: 20px 15px;
    text-align: center;
    transition: all 0.2s ease;
    box-shadow: var(--sky-split-box-shadow);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 120px;
}

.sky-split-prayer-box:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

.sky-split-prayer-box.active {
    background-color: #204c93;
    border-color: #204c93;
}

.sky-split-prayer-box.active .sky-split-prayer-name,
.sky-split-prayer-box.active .sky-split-prayer-time {
    color: #ffffff;
}

/* Iqamah in active state - all text white */
.sky-split-prayer-box.active .sky-split-iqamah,
.sky-split-prayer-box.active .sky-split-iqamah-time {
    color: #ffffff !important;
}

/* Name row - icon beside prayer name */
.sky-split-name-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin-bottom: 6px;
}

/* Icon styles */
.sky-split-prayer-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.sky-split-prayer-icon img,
.sky-split-prayer-icon svg,
.sky-split-prayer-icon lottie-player {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.sky-split-prayer-name {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0;
    color: #204c93;
}

.sky-split-prayer-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
}

/* Icon color in active state - controlled by Elementor settings */
/* Default fallback: invert to white for visibility on blue background */
.sky-split-prayer-box.active .sky-split-prayer-icon img,
.sky-split-prayer-box.active .sky-split-prayer-icon svg {
    filter: brightness(0) invert(1);
}

.sky-split-prayer-time {
    font-family: "Share Tech Mono", monospace;
    font-size: 32px;
    font-weight: 400;
    color: #204c93;
    line-height: 1.2;
    margin-bottom: 8px;
}

.sky-split-iqamah {
    font-size: 11px;
    color: #888888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 4px;
    /* Visibility controlled by PHP inline style or JS */
}

.sky-split-iqamah-time {
    font-family: "Share Tech Mono", monospace;
    font-weight: 500;
    font-size: 13px;
    color: #555555;
    margin-left: 6px;
}

/* ========================================
   Islamic Midnight
   ======================================== */
.sky-split-islamic-midnight {
    text-align: center;
    padding: 10px 20px 16px;
    border-top: 1px dashed rgba(32, 76, 147, 0.15);
}

.sky-split-midnight-inner {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, rgba(32, 76, 147, 0.06) 0%, rgba(32, 76, 147, 0.12) 100%);
    border-radius: 20px;
    padding: 6px 16px;
}

.sky-split-midnight-icon {
    width: 16px;
    height: 16px;
    color: #204c93;
    flex-shrink: 0;
}

.sky-split-midnight-label {
    font-size: 12px;
    font-weight: 600;
    color: #204c93;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.sky-split-midnight-time {
    font-family: "Share Tech Mono", monospace;
    font-size: 15px;
    font-weight: 700;
    color: #204c93;
    letter-spacing: 1px;
}

.sky-split-midnight-note {
    font-size: 10px;
    color: #888888;
    margin-top: 4px;
    letter-spacing: 0.3px;
}

/* ========================================
   Footer Section (Location)
   ======================================== */
.sky-split-footer {
    background-color: #204c93;
    color: #ffffff;
    padding: 12px 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sky-split-location-display {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sky-split-location-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.sky-split-location-icon path,
.sky-split-location-icon circle {
    stroke: currentColor;
}

.sky-split-location-name {
    font-size: 14px;
    font-weight: 500;
}

/* ========================================
   Loading Overlay
   ======================================== */
.sky-split-loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.sky-split-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(32, 76, 147, 0.2);
    border-top-color: var(--sky-split-primary-color);
    border-radius: 50%;
    animation: sky-split-spin 0.8s linear infinite;
}

@keyframes sky-split-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ========================================
   Responsive Styles
   ======================================== */
@media (max-width: 768px) {
    .sky-split-header {
        padding: 15px 20px 25px;
    }

    .sky-split-header-top {
        flex-direction: column;
        gap: 8px;
    }

    .sky-split-countdown-number {
        font-size: 48px;
    }

    .sky-split-countdown-separator {
        font-size: 40px;
        height: 48px; /* Match number font-size */
    }

    .sky-split-countdown-label {
        padding: 3px 8px;
        font-size: 11px;
        margin-top: 8px;
    }

    .sky-split-prayer-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
        padding: 20px 15px;
    }

    .sky-split-prayer-box {
        padding: 15px 10px;
    }

    .sky-split-prayer-name {
        font-size: 12px;
        gap: 4px;
    }

    .sky-split-prayer-icon {
        width: 16px;
        height: 16px;
    }

    .sky-split-prayer-time {
        font-size: 24px;
    }

    .sky-split-iqamah {
        font-size: 10px;
    }

    .sky-split-footer {
        padding: 12px 20px;
    }

    .sky-split-jumuah-label {
        font-size: 12px;
    }

    .sky-split-jumuah-time {
        font-size: 18px;
    }

    .sky-split-content-header {
        padding: 15px 10px;
    }

    .sky-split-nav-btn {
        width: 36px;
        height: 36px;
    }

    .sky-split-nav-btn svg {
        width: 20px;
        height: 20px;
    }
}

@media (max-width: 480px) {
    .sky-split-countdown-number {
        font-size: 36px;
    }

    .sky-split-countdown-separator {
        font-size: 30px;
        height: 36px; /* Match number font-size */
    }

    .sky-split-countdown-text {
        font-size: 16px;
    }

    .sky-split-countdown-label {
        padding: 2px 8px;
        font-size: 10px;
    }

    .sky-split-prayer-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .sky-split-prayer-time {
        font-size: 28px;
    }

    .sky-split-content-english-date {
        font-size: 16px;
    }

    .sky-split-content-hijri-date {
        font-size: 12px;
    }
}

/* ========================================
   Print Styles
   ======================================== */
@media print {
    .sky-split-loading-overlay,
    .sky-split-nav-btn {
        display: none !important;
    }

    .sky-split-timetable-widget {
        box-shadow: none;
    }

    .sky-split-prayer-box {
        break-inside: avoid;
    }
}

/* ========================================
   RTL Support
   ======================================== */
[dir="rtl"] .sky-split-header-top {
    flex-direction: row-reverse;
}

[dir="rtl"] .sky-split-content-header {
    flex-direction: row-reverse;
}

[dir="rtl"] .sky-split-footer {
    flex-direction: row-reverse;
}

[dir="rtl"] .sky-split-jumuah-left,
[dir="rtl"] .sky-split-jumuah-right {
    flex-direction: row-reverse;
}

[dir="rtl"] .sky-split-iqamah-time {
    margin-left: 0;
    margin-right: 5px;
}

/* ========================================
   Elementor Editor Styles
   ======================================== */
.elementor-editor-active .sky-split-timetable-widget {
    min-height: 400px;
}

/* Ensure proper styling in Elementor preview */
.elementor-widget-sky-prayer-timetable-split .elementor-widget-container {
    width: 100%;
}

/* sky-prayer-landing */
/**
 * Prayer Landing Widget Kit
 *
 * Shared, brand-neutral base styling for the landing-page widget kit
 * (Header, Today's Times, Article, Qibla, Monthly, Nearby Cities, FAQ, CTA,
 * City Directory). Defaults reproduce the approved design; every meaningful
 * value is overridable per-widget via Elementor controls ({{WRAPPER}} selectors).
 *
 * Palette tokens are scoped so a customer can retheme the whole kit from one
 * place without touching individual widgets. No third-party font is loaded —
 * typography defaults to a neutral system stack and is set via Elementor.
 */

.spt-l {
    --spt-primary: #204C93;
    --spt-primary-dark: #16305c;
    --spt-primary-mid: #265aad;
    --spt-accent: #e0902a;
    --spt-accent-light: #f2c14e;
    --spt-ink: #1c2431;
    --spt-heading: #16305c;
    --spt-body: #3a465c;
    --spt-muted: #7a8699;
    --spt-line: #e6e9f0;
    --spt-line-soft: #eef1f6;
    --spt-bg-soft: #fafbfd;

    font-family: var(--spt-font, 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif);
    color: var(--spt-ink);
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box;
}

.spt-l *,
.spt-l *::before,
.spt-l *::after {
    box-sizing: border-box;
}

.spt-l a {
    color: var(--spt-primary);
    text-decoration: none;
}

/* The header and today-strip bands paint their own background edge to edge and
   centre their content at 1120. Elementor's boxed container (the kit width, e.g.
   1440) cut the bands short on wide screens, leaving white gutters either side
   while the masjid pages ran full width — lift the cap on the container holding them. */
.e-con.e-parent > .e-con-inner:has(> .elementor-widget-sky-prayer-header, > .e-con > .elementor-widget-sky-prayer-header, > .elementor-widget-sky-prayer-today-cards) {
    max-width: none;
}

/* The sections carry their own 24px side padding; Elementor's container padding
   on top of it stepped them 16px in from the header on phones. */
.e-con.e-parent:has(> .e-con-inner > .elementor-widget-sky-prayer-intro, > .e-con-inner > .elementor-widget-sky-prayer-city-directory) {
    --padding-left: 0px;
    --padding-right: 0px;
}

/* The last section on the page (usually the city directory) ran straight into
   the site footer with ~10px between them. */
.elementor > .e-con.e-parent:last-child .elementor-widget:last-child > .elementor-widget-container > .spt-l {
    padding-bottom: 96px;
}
/* …unless the masjid list is appended after it (cities with masjids): that list
   carries the bottom space, and sits a normal section gap below the directory. */
.elementor:has(+ .spt-masjid-city-section) > .e-con.e-parent:last-child .elementor-widget:last-child > .elementor-widget-container > .spt-l {
    padding-bottom: 0;
}
.elementor + .spt-masjid-city-section { margin-top: 56px; }

/* Shared inner width wrapper (design uses 1120 for full-bleed, 900 for prose).
   City-page sections share the 1120 column with the header (as the masjid
   pages do); paragraphs keep a ~820px reading width inside it. */
.spt-l-inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
}

.spt-l-inner--narrow {
    max-width: 900px;
}

/* ===================================================================== *
 *  HEADER widget
 * ===================================================================== */

.spt-hdr__crumbs {
    border-bottom: 1px solid var(--spt-line-soft);
    background: var(--spt-bg-soft);
    font-size: 13px;
    color: var(--spt-muted);
}

.spt-hdr__crumbs .spt-l-inner {
    padding-top: 11px;
    padding-bottom: 11px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.spt-hdr__crumbs a {
    color: var(--spt-muted);
}

.spt-hdr__crumbs .spt-hdr__crumb-sep {
    color: var(--spt-muted);
    opacity: 0.7;
}

.spt-hdr__crumbs .is-current {
    color: var(--spt-primary-dark);
    font-weight: 600;
}

.spt-hdr__hero {
    position: relative;
    overflow: visible; /* let the city-search results dropdown escape the hero */
    color: #fff;
    background: linear-gradient(160deg, var(--spt-primary-mid) 0%, var(--spt-primary) 55%, var(--spt-primary-dark) 100%);
}

.spt-hdr__hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 85% 12%, rgba(255, 255, 255, 0.10), transparent 45%);
    pointer-events: none;
}

.spt-hdr__hero .spt-l-inner {
    position: relative;
    padding-top: 46px;
    padding-bottom: 52px;
}

.spt-hdr__row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px;
}

.spt-hdr__col {
    max-width: 560px;
}

.spt-hdr__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.14);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
}

.spt-hdr__title {
    margin: 16px 0 8px;
    font-size: 40px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.05;
}

.spt-hdr__intro {
    margin: 0;
    font-size: 16px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.82);
}

.spt-hdr__dateline {
    margin: 14px 0 0;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
}

.spt-hdr__dateline .spt-hdr__dot {
    margin: 0 8px;
    opacity: 0.6;
}

/* Countdown card */
.spt-hdr__countdown {
    text-align: center;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 20px;
    padding: 22px 26px;
}

.spt-hdr__countdown-label {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.78);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
}

.spt-hdr__countdown-clocks {
    display: flex;
    gap: 9px;
    margin-top: 12px;
    justify-content: center;
}

.spt-hdr__clock {
    background: rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    padding: 11px 15px;
    min-width: 62px;
}

.spt-hdr__clock-num {
    font-size: 32px;
    font-weight: 800;
    line-height: 1;
}

.spt-hdr__clock--sec .spt-hdr__clock-num {
    color: var(--spt-accent-light);
}

.spt-hdr__clock-unit {
    font-size: 10.5px;
    color: rgba(255, 255, 255, 0.7);
    margin-top: 4px;
    letter-spacing: 0.08em;
}

@media (max-width: 640px) {
    .spt-hdr__title {
        font-size: 30px;
    }
    .spt-hdr__hero .spt-l-inner {
        padding-top: 34px;
        padding-bottom: 38px;
    }
    .spt-hdr__countdown {
        width: 100%;
    }
}

/* ===================================================================== *
 *  HEADER — merged location controls, redesigned countdown, drawer
 * ===================================================================== */

@keyframes dvpulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }

/* Location control row (inside the hero left column) */
.spt-hdr__loc { margin-top: 24px; }
.spt-hdr__loc-label {
    font-size: 11.5px; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.09em; color: rgba(255,255,255,0.6); margin-bottom: 9px;
}
.spt-hdr__loc-row { display: flex; align-items: stretch; gap: 10px; flex-wrap: wrap; }
.spt-hdr__search {
    flex: 1; min-width: 240px; position: relative; display: flex; align-items: center;
    gap: 11px; background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.26);
    border-radius: 13px; padding: 0 8px 0 15px; height: 48px;
}
.spt-hdr__search:focus-within { border-color: #fff; background: rgba(255,255,255,0.22); }
.spt-hdr__search > svg { width: 19px; height: 19px; flex: none; color: rgba(255,255,255,0.85); }
.spt-hdr__search-input {
    flex: 1; min-width: 0; border: 0; outline: none; font-family: inherit;
    font-size: 15.5px; font-weight: 700; color: #fff; background: transparent;
}
.spt-hdr__search-input::placeholder { color: rgba(255,255,255,0.6); font-weight: 600; }
.spt-hdr__search-results {
    position: absolute; top: calc(100% + 8px); left: 0; right: 0; background: #fff;
    border: 1px solid #eaeef5; border-radius: 16px;
    box-shadow: 0 20px 48px rgba(16,28,54,0.20); z-index: 40;
    max-height: 340px; overflow-y: auto; padding: 7px; text-align: left;
}
.spt-hdr .spt-hdr__result,
.spt-hdr button.spt-hdr__result {
    display: flex !important; align-items: center !important; gap: 12px !important;
    width: 100% !important; text-align: left !important; border: 0 !important;
    background: none !important; padding: 9px 11px !important; border-radius: 11px !important;
    cursor: pointer !important; font-family: inherit !important; color: #16305c !important;
    box-shadow: none !important; transition: background 0.12s;
}
.spt-hdr__result-pin {
    width: 36px !important; height: 36px !important; flex: none !important;
    padding: 9px; border-radius: 10px; background: #eef4ff; color: #2f5bb7;
    box-sizing: border-box; transition: background 0.12s, color 0.12s;
}
.spt-hdr__result-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.spt-hdr__result-name { font-size: 14.5px; font-weight: 700; color: #16305c; }
.spt-hdr__result-sub {
    font-size: 12.5px; font-weight: 500; color: #8a94a8; margin-top: 1px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.spt-hdr .spt-hdr__result:hover, .spt-hdr .spt-hdr__result.is-active { background: #f2f7ff !important; }
.spt-hdr__result:hover .spt-hdr__result-pin, .spt-hdr__result.is-active .spt-hdr__result-pin { background: #2f5bb7; color: #fff; }
.spt-hdr__result-empty { padding: 14px 12px; font-size: 13.5px; color: #8a94a8; text-align: center; }
.spt-hdr__locate {
    display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 20px;
    flex: none; background: #fff; border: 0; border-radius: 13px; cursor: pointer;
    color: #204C93; font-family: inherit; font-size: 14.5px; font-weight: 800;
    box-shadow: 0 6px 18px rgba(12,28,60,0.24); transition: background 0.15s, transform 0.15s;
}
.spt-hdr__locate:hover { background: #eef3fc; transform: translateY(-1px); }
.spt-hdr__locate svg { width: 19px; height: 19px; flex: none; }
.spt-hdr__settings-btn {
    display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px;
    flex: none; background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.26);
    border-radius: 13px; cursor: pointer; color: #fff; font-family: inherit;
    font-size: 14.5px; font-weight: 700; transition: background 0.15s;
}
.spt-hdr__settings-btn:hover { background: rgba(255,255,255,0.26); }
.spt-hdr__settings-btn svg { width: 20px; height: 20px; flex: none; }

/* Redesigned countdown card */
.spt-hdr__countdown {
    background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.18);
    border-radius: 22px; padding: 22px 26px 24px; min-width: 290px;
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.spt-hdr__cd-head { display: flex; align-items: center; justify-content: center; gap: 8px; }
.spt-hdr__cd-dot {
    width: 8px; height: 8px; border-radius: 50%; background: #4ade80;
    box-shadow: 0 0 0 0 rgba(74,222,128,0.6); animation: dvpulse 1.6s infinite;
}
.spt-hdr__countdown-label {
    font-size: 12.5px; color: rgba(255,255,255,0.82); font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.11em;
}
.spt-hdr__countdown-clocks { display: flex; gap: 10px; margin-top: 16px; justify-content: center; }
.spt-hdr__clock {
    background: rgba(255,255,255,0.13); border: 1px solid rgba(255,255,255,0.10);
    border-radius: 14px; padding: 12px 16px; min-width: 66px;
}
.spt-hdr__clock-num { font-size: 34px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.spt-hdr__clock--sec { border-color: rgba(242,193,78,0.35); }
.spt-hdr__clock--sec .spt-hdr__clock-num { color: #f2c14e; }
.spt-hdr__clock-unit { font-size: 10.5px; color: rgba(255,255,255,0.65); margin-top: 6px; letter-spacing: 0.1em; text-transform: uppercase; }
.spt-hdr__cd-colon {
    display: flex; align-items: center; font-size: 26px; font-weight: 800;
    color: rgba(255,255,255,0.4); padding-bottom: 14px;
}
.spt-hdr__cd-progress { margin-top: 18px; }
.spt-hdr__cd-track { height: 5px; border-radius: 999px; background: rgba(255,255,255,0.14); overflow: hidden; }
.spt-hdr__cd-fill { height: 100%; background: linear-gradient(90deg,#f2c14e,#ffd97a); border-radius: 999px; transition: width 0.9s linear; }
.spt-hdr__cd-ends { display: flex; justify-content: space-between; margin-top: 8px; font-size: 11px; font-weight: 600; color: rgba(255,255,255,0.62); }

/* Settings drawer */
.spt-hdr__drawer[hidden] { display: none; }
.spt-hdr__drawer { position: fixed; inset: 0; z-index: 99999; }
.spt-hdr__drawer-overlay { position: fixed; inset: 0; background: rgba(16,28,54,0.45); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
.spt-hdr__drawer-panel {
    position: fixed; top: 0; right: 0; bottom: 0; width: 360px; max-width: 88vw;
    background: #fff; box-shadow: -12px 0 40px rgba(16,28,54,0.22);
    display: flex; flex-direction: column; overflow-y: auto;
}
.spt-hdr__drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-bottom: 1px solid #eef1f6; }
.spt-hdr__drawer-head h2 { margin: 0; font-size: 18px; font-weight: 800; color: #16305c; }
.spt-hdr__drawer-x { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; background: #f2f5fa; border: 0; border-radius: 9px; cursor: pointer; color: #5b6b86; font-size: 20px; line-height: 1; }
.spt-hdr__drawer-body { padding: 22px; }
.spt-hdr__drawer-heading { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.07em; color: #8fa0c4; margin-bottom: 12px; }
.spt-hdr__drawer-heading + .spt-hdr__madhabs, .spt-hdr__methods + .spt-hdr__drawer-heading { margin-top: 26px; }
.spt-hdr__methods { display: flex; flex-direction: column; gap: 9px; }
.spt-hdr__method { display: flex; align-items: flex-start; gap: 12px; text-align: left; padding: 13px 15px; border: 1.5px solid #e6e9f0; background: #fff; border-radius: 12px; cursor: pointer; font-family: inherit; }
.spt-hdr__method.is-active { border-color: #204C93; background: #f4f8ff; }
.spt-hdr__method-dot { width: 18px; height: 18px; flex: none; margin-top: 1px; border-radius: 50%; border: 2px solid #cbd5e6; background: #fff; }
.spt-hdr__method.is-active .spt-hdr__method-dot { border-color: #204C93; background: #204C93; box-shadow: inset 0 0 0 3px #fff; }
.spt-hdr__method-name { display: block; font-size: 14.5px; font-weight: 700; color: #16305c; }
.spt-hdr__method-desc { display: block; font-size: 12.5px; color: #7a8699; margin-top: 2px; line-height: 1.4; }
.spt-hdr__madhabs { display: flex; gap: 10px; }
.spt-hdr__madhab { flex: 1; padding: 13px 10px; border: 1.5px solid #e6e9f0; background: #fff; border-radius: 12px; cursor: pointer; font-family: inherit; text-align: center; }
.spt-hdr__madhab.is-active { border-color: #204C93; background: #f4f8ff; }
.spt-hdr__madhab-name { display: block; font-size: 14.5px; font-weight: 700; color: #16305c; }
.spt-hdr__madhab.is-active .spt-hdr__madhab-name { color: #204C93; }
.spt-hdr__madhab-desc { display: block; font-size: 12px; color: #7a8699; margin-top: 2px; }
.spt-hdr__drawer-note { margin-top: 26px; padding: 14px 16px; background: #f4f8ff; border: 1px solid #dce6f6; border-radius: 12px; font-size: 13px; line-height: 1.55; color: #4a5f85; }
.spt-hdr__drawer-apply { width: 100%; margin-top: 22px; padding: 14px; background: #204C93; color: #fff; border: 0; border-radius: 12px; font-family: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }

/* Neutralise theme input styling so the search field is transparent inside the
   translucent pill (themes like WoodMart force a white bg / border / radius). */
.spt-hdr .spt-hdr__search-input,
.spt-hdr input.spt-hdr__search-input {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    line-height: 1.2 !important;
    color: #fff !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    outline: none !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
}
.spt-hdr .spt-hdr__search-input:focus { background: transparent !important; box-shadow: none !important; outline: none !important; }
.spt-hdr .spt-hdr__search-input::placeholder { color: rgba(255, 255, 255, 0.6) !important; opacity: 1; }

/* Neutralise theme <button> styling across the header controls + drawer. */
.spt-hdr button {
    text-transform: none !important;
    letter-spacing: normal !important;
    text-shadow: none !important;
    min-height: 0 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.spt-hdr .spt-hdr__locate,
.spt-hdr button.spt-hdr__locate {
    display: inline-flex !important; align-items: center !important; gap: 8px !important;
    height: 48px !important; padding: 0 20px !important; background: #fff !important;
    color: #204C93 !important; border: 0 !important; border-radius: 13px !important;
    font-family: inherit !important; font-size: 14.5px !important; font-weight: 800 !important;
    line-height: 1 !important; box-shadow: 0 6px 18px rgba(12, 28, 60, 0.24) !important;
}
.spt-hdr .spt-hdr__locate:hover { background: #eef3fc !important; color: #204C93 !important; transform: translateY(-1px); }
.spt-hdr .spt-hdr__settings-btn,
.spt-hdr button.spt-hdr__settings-btn {
    display: inline-flex !important; align-items: center !important; gap: 8px !important;
    height: 48px !important; padding: 0 16px !important; background: rgba(255, 255, 255, 0.16) !important;
    color: #fff !important; border: 1px solid rgba(255, 255, 255, 0.26) !important;
    border-radius: 13px !important; font-family: inherit !important; font-size: 14.5px !important;
    font-weight: 700 !important; line-height: 1 !important; box-shadow: none !important;
}
.spt-hdr .spt-hdr__settings-btn:hover { background: rgba(255, 255, 255, 0.26) !important; color: #fff !important; }
.spt-hdr .spt-hdr__locate svg, .spt-hdr .spt-hdr__settings-btn svg { flex: none !important; }

/* Drawer buttons — force layout too (theme centres button text by default) */
.spt-hdr .spt-hdr__method {
    display: flex !important; align-items: flex-start !important; gap: 12px !important;
    text-align: left !important; padding: 13px 15px !important; width: 100% !important;
    background: #fff !important; border: 1.5px solid #e6e9f0 !important; color: #16305c !important;
}
.spt-hdr .spt-hdr__method.is-active { border-color: #204C93 !important; background: #f4f8ff !important; }
.spt-hdr .spt-hdr__method-dot { flex: none !important; margin-top: 1px !important; }
.spt-hdr .spt-hdr__method-txt { display: block !important; text-align: left !important; flex: 1 1 auto !important; }
.spt-hdr .spt-hdr__method-name { display: block !important; text-align: left !important; }
.spt-hdr .spt-hdr__method-desc { display: block !important; text-align: left !important; }
.spt-hdr .spt-hdr__madhab {
    display: block !important; text-align: center !important; padding: 13px 10px !important;
    background: #fff !important; border: 1.5px solid #e6e9f0 !important;
}
.spt-hdr .spt-hdr__madhab.is-active { border-color: #204C93 !important; background: #f4f8ff !important; }
.spt-hdr .spt-hdr__madhab-name { display: block !important; }
.spt-hdr .spt-hdr__madhab-desc { display: block !important; }
.spt-hdr .spt-hdr__drawer-apply { display: block !important; width: 100% !important; text-align: center !important; background: #204C93 !important; color: #fff !important; border: 0 !important; box-shadow: none !important; font-weight: 700 !important; }
.spt-hdr .spt-hdr__drawer-x { background: #f2f5fa !important; color: #5b6b86 !important; border: 0 !important; box-shadow: none !important; }

/* elementor-post-163026 */
.elementor-163026 .elementor-element.elementor-element-6c2e466{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:-40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-163026 .elementor-element.elementor-element-ea1f9f6{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__title{color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__intro{color:rgba(255,255,255,0.82);}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__dateline{color:rgba(255,255,255,0.7);}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__badge{background:rgba(255,255,255,0.14);color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__countdown{background:rgba(255,255,255,0.10);}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__countdown-label{color:rgba(255,255,255,0.78);}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__clock-num{color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-5573c35 .spt-hdr__clock--sec .spt-hdr__clock-num{color:#f2c14e;}.elementor-163026 .elementor-element.elementor-element-72ee1a0{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__card{border-color:#e6e9f0;border-radius:16px;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__cards{gap:14px;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__card.is-next{background:#eef3fc;border-color:#204C93;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__badge{background:#204C93;color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__name{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-ca2bfc3 .spt-today__time{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-0c46869{--display:flex;--gap:50px 50px;--row-gap:50px;--column-gap:50px;}.elementor-163026 .elementor-element.elementor-element-1cd8bfe .spt-intro__p{color:#3a465c;}.elementor-163026 .elementor-element.elementor-element-3480495 .spt-fast__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-3480495 .spt-fast__card--muted .spt-fast__time{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-f190685 .spt-article__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-f190685 .spt-article__p{color:#3a465c;}.elementor-163026 .elementor-element.elementor-element-f190685 .spt-article__link{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-f190685 .spt-article__quote-text{color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-f190685 .spt-article__quote-cite{color:#f2c14e;}.elementor-163026 .elementor-element.elementor-element-4ca7c85 .spt-qibla__box{background:#fafbfd;border-color:#eaedf3;border-radius:18px;}.elementor-163026 .elementor-element.elementor-element-4ca7c85 .spt-qibla__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-4ca7c85 .spt-qibla__body{color:#3a465c;}.elementor-163026 .elementor-element.elementor-element-4ca7c85 .spt-qibla__deg{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-4ca7c85 .spt-qibla__needle{stroke:#e0902a;}.elementor-163026 .elementor-element.elementor-element-4ca7c85 .spt-qibla__ring{stroke:#dfe4ee;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__title{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__sub{color:#7a8699;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__note{color:#9aa4b5;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__pill--greg{background:#204C93;color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__pill--hijri{background:#eef1f6;color:#5b6b86;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__table thead tr{background:#204C93;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__table thead th{color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__table tbody td{color:#3a465c;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__table tbody tr:nth-child(odd){background:#fafbfd;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__table tbody tr.is-today{background:#fef6ea;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__badge{background:#e0902a;color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-68f34f3 .spt-monthly__table-frame{border-color:#e6e9f0;border-radius:16px;}.elementor-163026 .elementor-element.elementor-element-44aab59 .spt-tools__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-44aab59 .spt-tools__btn--primary{background:#204C93;}.elementor-163026 .elementor-element.elementor-element-107aca0 .spt-mosques__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-107aca0 .spt-mosques__name{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-107aca0 .spt-mosques__pin svg{fill:#204C93;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__title{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__sub{color:#7a8699;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__table{border-color:#e6e9f0;border-radius:16px;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__row{border-top-color:#e6e9f0;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__head{background:#f4f6fb;color:#5b6b86;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__cell{color:#3a4a63;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__row.is-current{background:#f4f8ff;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__badge{background:#eef3fc;color:#204C93;}.elementor-163026 .elementor-element.elementor-element-b54b72b .spt-nearby__link{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__item{background:#ffffff;border-color:#e6e9f0;border-radius:14px;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__q-text{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__sign{color:#204C93;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__a{color:#3a465c;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__verified{background:#f4f8ff;border-color:#dce6f6;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__seal-fill{fill:#45c9a5;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__verified-label{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-05985dd .spt-faq__verified-note{color:#5b6b86;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-cta__heading{color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-cta__text{color:rgba(255,255,255,0.85);}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-cta__btn--primary{background:#e0902a;color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-cta__btn--secondary{background:rgba(255,255,255,0.14);border-color:rgba(255,255,255,0.3);color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-cta__btn{border-radius:999px;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-app__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-app__text{color:#5b6b86;}.elementor-163026 .elementor-element.elementor-element-f094cb7 .spt-app__btn{background:#16305c;color:#ffffff;}.elementor-163026 .elementor-element.elementor-element-6b218ad .spt-dir__heading{color:#16305c;}.elementor-163026 .elementor-element.elementor-element-6b218ad .spt-dir__subtext{color:#7a8699;}.elementor-163026 .elementor-element.elementor-element-6b218ad .spt-dir__grid{gap:12px;}.elementor-163026 .elementor-element.elementor-element-6b218ad .spt-dir__item{background:#ffffff;border-color:#e6e9f0;color:#16305c;border-radius:12px;}.elementor-163026 .elementor-element.elementor-element-6b218ad .spt-dir__dot{background:#204C93;}.elementor-163026 .elementor-element.elementor-element-6b218ad .spt-dir__item:hover{background:#f4f8ff;border-color:#204C93;color:#204C93;}
/* base-desktop */
.elementor .e-div-block-base{min-width:30px;padding:10px;display:block;}.elementor .e-flexbox-base{padding:10px;display:flex;flex-direction:row;}.elementor .e-grid-base{column-gap:20px;padding:10px;display:grid;row-gap:20px;grid-template-columns:repeat(3, 1fr);grid-template-rows:repeat(2, 1fr);}.elementor .e-tabs-base{padding-block-start:0px;display:flex;flex-direction:column;gap:30px;}.elementor .e-tabs-menu-base{display:flex;justify-content:center;}.elementor .e-tab-base{width:160px;color:#0C0D0E;cursor:pointer;padding:8px;border-width:2px;border-color:#E0E0E0;border-style:solid;background-color:#FFFFFF;display:block;}.elementor .e-tab-base.e--selected{border-color:#0C0D0E;outline-width:0px;}.elementor .e-tab-base:focus{border-color:#0C0D0E;outline-width:0px;}.elementor .e-tab-base:hover,.elementor .e-tab-base:focus-visible{background-color:#E0E0E0;}.elementor .e-tabs-content-area-base{display:block;}.elementor .e-tab-content-base{min-width:30px;padding:10px;display:block;}.elementor .e-accordion-base{padding:0px;display:flex;flex-direction:column;}.elementor .e-accordion-item-base{padding:0px;display:block;}.elementor .e-accordion-item-header-base{cursor:pointer;padding:10px;display:flex;gap:8px;justify-content:space-between;align-items:center;}.elementor .e-accordion-item-title-base{padding:0px;}.elementor .e-accordion-item-icon-base{width:200px;height:20px;padding:0px;display:inline-flex;flex:0 0 auto;justify-content:flex-end;align-items:center;}.elementor .e-accordion-item-content-base{min-width:30px;padding:10px;display:block;}.elementor .e-background-video-base{width:100%;overflow:hidden;position:relative;padding:10px;display:flex;flex-direction:column;}.elementor .e-background-video-content-base{width:100%;position:relative;z-index:1;padding:0px;display:flex;flex-direction:column;flex:1 1 auto;}.elementor .e-background-video-controls-base{width:auto;position:absolute;inset-inline-end:20px;inset-block-end:20px;z-index:2;display:flex;gap:8px;}.elementor .e-background-video-play-base{cursor:pointer;padding:8px;border-style:none;background-color:transparent;display:inline-flex;justify-content:center;align-items:center;}.elementor .e-background-video-pause-base{cursor:pointer;padding:8px;border-style:none;background-color:transparent;display:inline-flex;justify-content:center;align-items:center;}.elementor .e-form-base{padding:20px;display:flex;flex-direction:row;gap:10px;flex-wrap:wrap;align-content:start;align-items:flex-start;}.elementor .e-form-base .e-form-checkbox-row{padding:0px;gap:8px;align-items:center;}.elementor .e-form-success-message-base{font-size:12px;color:#2F532E;text-align:center;padding:12px;background-color:#D4E9D6;display:none;}.elementor .e-form-error-message-base{font-size:12px;color:#870000;text-align:center;padding:12px;background-color:#ffdede;display:none;}.elementor .e-collection-loop-base{display:block;}.elementor .e-collection-loop-layout-base{display:grid;gap:20px;grid-template-columns:repeat(3, 1fr);grid-auto-rows:1fr;}.elementor .e-pagination-base{padding-block-start:8px;padding-block-end:8px;padding-inline-start:8px;padding-inline-end:8px;margin-block-start:8px;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start;align-items:center;}.elementor .e-pagination-prev-base{font-size:14px;color:#1F2937;text-align:center;text-decoration:none;padding-block-start:8px;padding-block-end:8px;padding-inline-start:12px;padding-inline-end:12px;border-radius:4px;border-width:1px;border-color:#E5E7EB;border-style:solid;display:inline-flex;gap:8px;align-items:center;}.elementor .e-pagination-next-base{font-size:14px;color:#1F2937;text-align:center;text-decoration:none;padding-block-start:8px;padding-block-end:8px;padding-inline-start:12px;padding-inline-end:12px;border-radius:4px;border-width:1px;border-color:#E5E7EB;border-style:solid;display:inline-flex;gap:8px;align-items:center;}.elementor .e-collection-loop-empty-state-base{display:flex;justify-content:center;}
/* base-mobile */
@media (max-width:767px) {
@media(max-width:767px){.elementor .e-grid-base{grid-template-columns:repeat(1, 1fr);}}
}
/* ght-compat */
/* ==========================================================================
 * GHH Toolkit — what the old theme (WoodMart) gave the Sky plugins.
 * Loaded on every page. SkyDonate's stylesheets were written on top of
 * WoodMart, so without these its forms and pop-ups fall apart under Hello:
 *
 * 1. WoodMart made every button position:relative, inline-flex and centred.
 *    SkyDonate draws the chosen amount / Once-Monthly with an absolutely
 *    placed ::after/::before; without a positioned button it covers the
 *    whole pop-up.
 * 2. SkyDonate draws its close ✕ and video ▶ as glyphs of WoodMart's icon
 *    font ("woodmart-font", \f112 / \f101). Nothing of WoodMart is used: the
 *    same three marks are drawn here as icons in the text colour, 1em square.
 *
 * :where() keeps the button rule at zero specificity, so any real style wins.
 * ======================================================================== */

.donation-card .donation-image .play-button i:before,
button.lity-close:before,
.quick-modal-close:after {
	content: "" !important;
	display: inline-block;
	width: 1em;
	height: 1em;
	vertical-align: middle;
	font-family: inherit !important;
	background-color: currentColor;
	-webkit-mask: var(--ght-ico) center / contain no-repeat;
	mask: var(--ght-ico) center / contain no-repeat;
}
.donation-card .donation-image .play-button i:before { --ght-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 4.5v15l12.5-7.5z'/%3E%3C/svg%3E"); }
button.lity-close:before { display: block; margin: auto; }
button.lity-close:before, .quick-modal-close:after { --ght-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }

/* 3. WoodMart padded every page section; Elementor's default is 10px, so older sections ran to
      the screen edge. Top-level containers get the GHH side gutter by default (containers that set
      their own padding, like the toolkit's sections, keep theirs). */
body.ght-site .e-con.e-parent { --container-default-padding-left: var(--ght-pad, 16px); --container-default-padding-right: var(--ght-pad, 16px); }

:where(button, [type="submit"], [type="button"], .button) { position: relative; }
:where(.donation-form-wrapper, .quick-modal, .skydonate-quick-donation-widget, [class*="skydonate"], [class*="skd-"], .donation-card) :where(button, [type="submit"], [type="button"], .button) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
}

/* While the basket is open SkyDonate stops the page scrolling with `body { overflow: hidden }`. That
   makes <body> a scroll box, and the sticky header then measures from it instead of the screen: it
   dropped 32px when signed in (the admin bar's margin counted twice) and left the screen when the page
   was scrolled (user: "header shows big when opening the mini basket"). Lock the page on <html>
   instead, which is the screen itself. (Moved from ght-minicart.css in 1.53.6.) */
body.ght-site.skd-mc-locked { overflow: visible; overflow-x: clip; }
html:has(body.ght-site.skd-mc-locked) { overflow: hidden; }

