/* ========================================
   SERVICE DISPATCH — GLOBAL STYLES
   Enqueued on EVERY front-end page.

   footer.php and the legal pages render site-wide, so their styles
   must not live in the conditionally loaded sd-custom.css bundle.
   ======================================== */

/* ── Footer ── */
.sd-footer {
    background: #0f172a;
    color: #cbd5e1;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.sd-footer-main {
    padding: 48px 0 32px;
}

.sd-footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1fr;
    gap: 40px;
}

.sd-footer-col h4 {
    color: white;
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 16px;
}

.sd-footer-col p {
    font-size: 14px;
    line-height: 1.6;
    color: #94a3b8;
}

.sd-footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sd-footer-col ul li {
    margin-bottom: 10px;
}

.sd-footer-col ul li a {
    color: #94a3b8;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.2s;
}

.sd-footer-col ul li a:hover {
    color: #60a5fa;
}

.sd-footer-tagline {
    color: #6EC1E4;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}

.sd-footer-contact li {
    color: #94a3b8;
    font-size: 14px;
    line-height: 1.6;
    display: flex;
    gap: 10px;
}

.sd-footer-contact li i {
    color: #6EC1E4;
    margin-top: 4px;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
}

.sd-footer-contact li a {
    color: #94a3b8;
}

.sd-footer-contact li a:hover {
    color: #60a5fa;
}

.sd-footer-bottom {
    border-top: 1px solid #1e293b;
    padding: 20px 0;
    text-align: center;
}

.sd-footer-bottom p {
    margin: 0;
    font-size: 13px;
    color: #64748b;
}

/* ========================================
   SMS CONSENT (A2P) + LEGAL PAGES
   Consent wording lives in inc/sd-sms-consent.php —
   this file only styles it.
   ======================================== */

/* ── Contact Us: SMS consent fieldset ── */
.sd-sms-consent {
    border: 1px solid #dbe3ec;
    border-left: 4px solid #2563eb;
    border-radius: 10px;
    background: #f8fafc;
    padding: 20px 22px 18px;
    margin: 24px 0 20px;
    min-width: 0;
}

.sd-sms-consent-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    width: auto;
    float: none;
    border: 0;
    padding: 0;
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    color: #0f172a;
}

.sd-optional-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    background: #e0e7ff;
    color: #3730a3;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.sd-sms-consent-intro {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.6;
    color: #475569;
}

.sd-consent-row + .sd-consent-row {
    margin-top: 14px;
}

/* Contact Form 7 renders each acceptance tag as a label wrapping the input. */
.sd-sms-consent .wpcf7-list-item {
    display: block;
    margin: 0;
}

.sd-sms-consent .wpcf7-list-item label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #dbe3ec;
    border-radius: 8px;
    font-weight: 400;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.sd-sms-consent .wpcf7-list-item label:hover {
    border-color: #93b4f5;
}

.sd-sms-consent .wpcf7-list-item label:focus-within {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

/* A 20px target with padding around it clears the 44px minimum tap size. */
.sd-sms-consent input[type="checkbox"] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 1px 0 0;
    accent-color: #2563eb;
    cursor: pointer;
}

.sd-sms-consent .wpcf7-list-item-label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    line-height: 1.65;
    color: #1e293b;
    /* Long consent text must wrap, never clip or overflow its container. */
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
}

.sd-consent-note {
    margin: 16px 0 12px;
    font-size: 13px;
    line-height: 1.65;
    color: #475569;
}

.sd-consent-note strong {
    color: #0f172a;
}

.sd-consent-policy-links {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
}

.sd-consent-policy-links a {
    display: inline-block;
    /* Generous padding keeps these easy to tap on a phone. */
    padding: 8px 4px;
    color: #2563eb;
    text-decoration: underline;
}

.sd-consent-policy-links a:hover,
.sd-consent-policy-links a:focus {
    color: #1d4ed8;
}

.sd-consent-policy-links span[aria-hidden] {
    color: #94a3b8;
    padding: 0 6px;
}

/* Contact Us phone + submit spacing */
.widget-contact .phone {
    margin-bottom: 15px;
}

.sd-form-submit {
    margin-top: 4px;
}

/* ── Fluent Forms consent blocks (service request, vendor registration) ── */
.ff-el-group.sd-consent-field .ff-el-form-check,
.ff-el-group.sd-consent-field .ff_tc_checkbox_wrapper {
    align-items: flex-start;
}

.sd-consent-field .ff-el-tc,
.sd-consent-field .ff_tc_content {
    font-size: 14px;
    line-height: 1.65;
    overflow-wrap: break-word;
    word-break: break-word;
}

.sd-consent-field .ff-el-form-check-input,
.sd-consent-field input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: #2563eb;
}

.sd-consent-footnote {
    border-top: 1px solid #e2e8f0;
    padding-top: 14px;
    margin-top: 4px;
}

.sd-consent-footnote .sd-consent-note {
    margin-top: 0;
}

/* ── Legal pages (Privacy Policy / Terms of Service) ── */
.sd-legal-page {
    max-width: 860px;
    font-size: 16px;
    line-height: 1.75;
    color: #1e293b;
    overflow-wrap: break-word;
}

.sd-legal-page h2 {
    margin: 40px 0 14px;
    padding-top: 8px;
    font-size: 24px;
    line-height: 1.3;
    font-weight: 700;
    color: #0f172a;
    scroll-margin-top: 100px;
}

.sd-legal-page h3 {
    margin: 28px 0 10px;
    font-size: 19px;
    line-height: 1.35;
    font-weight: 700;
    color: #0f172a;
    scroll-margin-top: 100px;
}

.sd-legal-page p,
.sd-legal-page li {
    font-size: 16px;
    line-height: 1.75;
}

.sd-legal-page ul {
    margin: 0 0 18px;
    padding-left: 22px;
}

.sd-legal-page li {
    margin-bottom: 10px;
}

.sd-legal-page a {
    color: #2563eb;
    text-decoration: underline;
}

.sd-legal-page a:hover,
.sd-legal-page a:focus {
    color: #1d4ed8;
}

.sd-legal-updated {
    color: #64748b;
    font-size: 14px;
    margin-bottom: 24px;
}

.sd-legal-callout {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-left: 4px solid #2563eb;
    border-radius: 10px;
    padding: 18px 22px;
    margin: 20px 0 24px;
}

.sd-legal-callout p:last-child {
    margin-bottom: 0;
}

.sd-consent-quote {
    margin: 10px 0 20px;
    padding: 14px 18px;
    background: #f8fafc;
    border-left: 4px solid #94a3b8;
    border-radius: 0 8px 8px 0;
    font-size: 15px;
    line-height: 1.7;
    color: #334155;
}

.sd-consent-quote p:last-child {
    margin-bottom: 0;
}

.sd-legal-crosslink {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
    font-weight: 600;
}

/* ── Footer legal + SMS disclosure ── */
.sd-footer-legal-heading {
    margin-top: 24px;
}

.sd-footer-sms-notice {
    border-top: 1px solid #1e293b;
    padding: 18px 0;
}

.sd-footer-sms-notice p {
    margin: 0;
    font-size: 12px;
    line-height: 1.7;
    color: #64748b;
}

.sd-footer-sms-notice strong {
    color: #94a3b8;
}

.sd-footer-sms-notice a {
    color: #94a3b8;
    text-decoration: underline;
}

.sd-footer-sms-notice a:hover {
    color: #60a5fa;
}

.sd-footer-bottom-links {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 22px;
    padding: 0;
    margin: 12px 0 0;
}

.sd-footer-bottom-links li {
    margin: 0;
}

.sd-footer-bottom-links a {
    display: inline-block;
    padding: 6px 2px;
    font-size: 13px;
    color: #94a3b8;
    text-decoration: none;
}

.sd-footer-bottom-links a:hover,
.sd-footer-bottom-links a:focus {
    color: #60a5fa;
    text-decoration: underline;
}

/* ── Tablet ── */
@media (max-width: 991px) {
    .sd-legal-page {
        max-width: 100%;
    }

    .sd-sms-consent {
        padding: 18px 18px 16px;
    }
}

/* ── Mobile ── */
@media (max-width: 767px) {
    .sd-sms-consent {
        padding: 16px 14px 14px;
        margin: 20px 0 18px;
        border-left-width: 3px;
    }

    .sd-sms-consent-title {
        font-size: 15px;
    }

    .sd-sms-consent .wpcf7-list-item label {
        padding: 14px 12px;
        gap: 10px;
    }

    /* The theme's viewport meta omits initial-scale, so phones lay the page
       out at ~456 CSS px and scale down. Size the consent copy up to keep it
       comfortably legible after that down-scale. */
    .sd-sms-consent .wpcf7-list-item-label {
        font-size: 15px;
        line-height: 1.7;
    }

    .sd-sms-consent-intro,
    .sd-consent-note {
        font-size: 14px;
    }

    /* Lay the policy links out as a wrapping row with generous tap targets.
       The "|" separator is dropped so it can never end up dangling at the end
       of a wrapped line. */
    .sd-consent-policy-links {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 0 20px;
        font-size: 15px;
    }

    .sd-consent-policy-links span[aria-hidden] {
        display: none;
    }

    .sd-consent-policy-links a {
        padding: 10px 6px;
    }

    .sd-legal-page,
    .sd-legal-page p,
    .sd-legal-page li {
        font-size: 15px;
    }

    .sd-legal-page h2 {
        font-size: 21px;
        margin-top: 32px;
    }

    .sd-legal-page h3 {
        font-size: 17.5px;
    }

    .sd-legal-callout,
    .sd-consent-quote {
        padding: 14px 16px;
    }

    .sd-footer-sms-notice p {
        font-size: 11.5px;
    }
}

/* ── Footer responsive ── */
@media (max-width: 768px) {
    .sd-footer-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

/* ── Back to top ──
   The parent theme absolutely positions this button centred at the bottom of
   the footer (left: 50%), so it scrolls away with the page. Pin it to the
   bottom-right corner of the viewport instead. */
.apus-footer .add-fix-top,
#back-to-top.add-fix-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    left: auto;
    transform: none;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    width: 46px;
    height: 46px;
    line-height: 44px;
    font-size: 26px;
    border-radius: 10px;
    background: #2563eb;
    border: 1px solid #2563eb;
    color: #fff;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.25);
    /* Hidden until the theme's scroll handler adds .active. */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, background 0.2s;
}

.apus-footer .add-fix-top.active,
#back-to-top.add-fix-top.active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.apus-footer .add-fix-top:hover,
.apus-footer .add-fix-top:focus,
.apus-footer .add-fix-top:active,
#back-to-top.add-fix-top:hover,
#back-to-top.add-fix-top:focus {
    background: #1d4ed8;
    border-color: #1d4ed8;
    color: #fff !important;
}

@media (max-width: 767px) {
    .apus-footer .add-fix-top,
    #back-to-top.add-fix-top {
        right: 14px;
        bottom: 14px;
        width: 42px;
        height: 42px;
        line-height: 40px;
        font-size: 23px;
    }
}

/* ── Full-width page layout fix ──
   Full-width pages render #main-container as ".container-fluid no-padding".
   Its child Bootstrap .row keeps margin: 0 -15px, which normally sits inside
   the container's 15px padding — with that padding removed the row escapes by
   15px and the whole document scrolls sideways. Neutralise the row's negative
   margins; the columns' own 15px padding keeps the content inset correct. */
#main-container.container-fluid.no-padding > .row {
    margin-left: 0;
    margin-right: 0;
}

/* ── Contact intro heading ──
   The theme sets .heading-center .content to 35px. At that size the support
   email address is a single unbreakable 441px string, which forced the mobile
   layout viewport out to 456px — that is why the whole Contact Us page
   rendered zoomed out and clipped on phones. Let long strings wrap and scale
   the heading down on small screens. */
.heading-center .content,
.heading-center .title {
    overflow-wrap: break-word;
    word-break: break-word;
}

@media (max-width: 991px) {
    .heading-center .content {
        font-size: 26px;
        line-height: 1.45;
    }
}

@media (max-width: 767px) {
    .heading-center .content {
        font-size: 20px;
        line-height: 1.5;
    }
}
