/* SURFLOCAL WEBSITEOS HIDDEN STATE AUTHORITY */
.wos-chat-widget [hidden] {
    display: none !important;
}
/* SURFLOCAL WEBSITEOS HIDDEN STATE AUTHORITY END */

/* WebsiteOS unified customer-engagement center — v4 */
.wos-center-head{max-width:780px;margin:0 auto 28px;text-align:center}
.wos-center-head h2{margin:8px 0 10px;color:var(--primary-dark);font-family:var(--font-heading)}
.wos-center-head p{margin:0;color:var(--muted)}
.wos-engagement-center{overflow:hidden;border:1px solid var(--border);border-radius:28px;background:var(--surface);box-shadow:0 24px 60px rgba(14,65,105,.14)}
.wos-choice-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--surface-alt) 74%,var(--surface))}
.wos-choice{display:grid;gap:5px;min-height:94px;padding:18px 20px;border:0;border-right:1px solid var(--border);background:transparent;color:var(--muted);text-align:left;cursor:pointer}
.wos-choice:last-child{border-right:0}
.wos-choice span{color:var(--primary-dark);font-family:var(--font-heading);font-size:1rem;font-weight:950}
.wos-choice small{font-size:.8rem;line-height:1.4}
.wos-choice:hover{background:color-mix(in srgb,var(--secondary) 7%,var(--surface))}
.wos-choice.active{position:relative;background:var(--surface);color:var(--text)}
.wos-choice.active:after{position:absolute;right:18px;bottom:-1px;left:18px;height:5px;border-radius:999px 999px 0 0;background:linear-gradient(90deg,var(--primary),var(--secondary));content:""}
.wos-choice:focus-visible{outline:4px solid color-mix(in srgb,var(--secondary) 24%,transparent);outline-offset:-4px}
.wos-center-panel{padding:30px}
.wos-center-panel[hidden]{display:none!important}
.wos-panel-intro{max-width:760px;margin-bottom:22px}
.wos-panel-intro h3{margin:7px 0 8px;color:var(--primary-dark);font-family:var(--font-heading);font-size:clamp(1.35rem,2.4vw,2rem)}
.wos-panel-intro p{margin:0;color:var(--muted)}
.wos-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.wos-field{display:grid;gap:7px;color:var(--primary-dark);font-size:.9rem;font-weight:850}
.wos-field.full{grid-column:1/-1}
.wos-field input,.wos-field select,.wos-field textarea,.wos-newsletter-form input{width:100%;min-height:48px;padding:12px 13px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font:inherit;outline:none}
.wos-field textarea{min-height:126px;resize:vertical}
.wos-field input:focus,.wos-field select:focus,.wos-field textarea:focus,.wos-newsletter-form input:focus{border-color:var(--secondary);box-shadow:0 0 0 4px color-mix(in srgb,var(--secondary) 16%,transparent)}
.wos-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.wos-consent{display:flex;align-items:flex-start;gap:10px;padding:13px 14px;border:1px solid color-mix(in srgb,var(--accent-two) 28%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--accent-two) 8%,var(--surface));color:var(--muted);font-size:.86rem;line-height:1.5}
.wos-consent input{width:19px;height:19px;min-height:19px;margin:2px 0 0;flex:0 0 auto;accent-color:var(--accent-two)}
.wos-form-note{margin:10px 0 0;color:var(--muted);font-size:.84rem}
.wos-status{display:none;margin:0 0 18px;padding:14px 16px;border-radius:14px;font-weight:850}
.wos-status.visible{display:block}
.wos-status.success{border:1px solid color-mix(in srgb,var(--accent-two) 40%,var(--border));background:color-mix(in srgb,var(--accent-two) 12%,var(--surface));color:color-mix(in srgb,var(--accent-two) 75%,var(--text))}
.wos-status.error{border:1px solid #ef9a9a;background:#fff3f3;color:#9f1d1d}
.wos-hp{position:absolute!important;left:-99999px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.wos-chat-choice-action{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:20px;border:1px solid var(--border);border-radius:18px;background:color-mix(in srgb,var(--surface-alt) 68%,var(--surface))}
.wos-chat-choice-action span{color:var(--muted);font-size:.88rem}
.wos-newsletter-strip{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:26px;margin-top:24px;padding:24px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));border-radius:24px;background:color-mix(in srgb,var(--accent) 7%,var(--surface))}
.wos-newsletter-strip h3{margin:7px 0 8px;color:var(--primary-dark);font-family:var(--font-heading)}
.wos-newsletter-strip p{margin:0;color:var(--muted)}
.wos-newsletter-form{display:grid;gap:12px}
.wos-input-row{display:grid;grid-template-columns:1fr auto;gap:10px}
.footer-links{margin-left:auto}.footer-links .business-login{margin-left:8px;opacity:.82;white-space:nowrap;font-size:.82rem;font-weight:700}
.footer-links .business-login:hover{opacity:1}
.wos-chat-widget{position:fixed;right:18px;bottom:18px;z-index:9999;font-family:var(--font-body)}
.wos-chat-launcher{display:flex;align-items:center;gap:9px;border:0;border-radius:999px;padding:13px 18px;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;font-size:var(--button-size);font-weight:950;box-shadow:0 18px 40px color-mix(in srgb,var(--primary) 36%,transparent);cursor:pointer}
.wos-chat-dot{width:10px;height:10px;border-radius:50%;background:#d9fff0;box-shadow:0 0 0 5px rgba(217,255,240,.18)}
.wos-chat-panel[hidden],.wos-chat-start[hidden],.wos-chat-conversation[hidden],.wos-chat-error[hidden]{display:none!important}
.wos-chat-panel{position:fixed;right:18px;top:18px;bottom:18px;width:min(400px,calc(100vw - 36px));display:flex;flex-direction:column;overflow:hidden;border:1px solid color-mix(in srgb,var(--secondary) 34%,var(--border));border-radius:24px;background:var(--surface);color:var(--text);box-shadow:0 30px 75px rgba(0,0,0,.35)}
.wos-chat-header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:18px;color:#fff;background:linear-gradient(135deg,var(--primary-dark),var(--primary),var(--secondary))}
.wos-chat-header span{display:block;margin-top:3px;color:#edf8ff;font-size:.8rem}
.wos-chat-close{width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:1.45rem;cursor:pointer}
.wos-chat-body{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}
.wos-chat-start{padding:16px;overflow:auto}
.wos-chat-form{display:grid;gap:10px}
.wos-chat-form label{display:grid;gap:5px;color:var(--primary-dark);font-size:.8rem;font-weight:850}
.wos-chat-form input,.wos-chat-form textarea,.wos-chat-send input{width:100%;padding:10px 11px;border:1px solid var(--border);border-radius:11px;background:var(--surface);color:var(--text);font:inherit;outline:none}
.wos-chat-form textarea{min-height:88px;resize:vertical}
.wos-chat-submit,.wos-chat-send button{border:0;border-radius:12px;padding:11px 14px;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;font-weight:950;cursor:pointer}
.wos-chat-conversation{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}
.wos-chat-messages{display:grid;flex:1 1 auto;gap:10px;padding:16px;overflow:auto;background:color-mix(in srgb,var(--surface-alt) 70%,var(--surface))}
.wos-chat-message{max-width:86%;padding:10px 12px;border:1px solid var(--border);border-radius:15px;background:var(--surface);line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.wos-chat-message.customer{justify-self:end;border-bottom-right-radius:5px;background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff}
.wos-chat-message.assistant,.wos-chat-message.business{justify-self:start;border-bottom-left-radius:5px}
.wos-chat-message.system{justify-self:center;max-width:95%;background:color-mix(in srgb,var(--accent) 13%,var(--surface))}
.wos-chat-message-name{display:block;margin-bottom:3px;font-size:.68rem;font-weight:950}
.wos-chat-send{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px 16px 16px;border-top:1px solid var(--border);background:var(--surface)}
.wos-chat-error{margin:0 16px 16px;padding:10px;border:1px solid #ef9a9a;border-radius:10px;background:#fff3f3;color:#9f1d1d;font-size:.82rem}
@media(max-width:850px){.wos-choice-bar,.wos-newsletter-strip{grid-template-columns:1fr}.wos-choice{min-height:auto;border-right:0;border-bottom:1px solid var(--border)}.wos-choice:last-child{border-bottom:0}.wos-choice.active:after{top:12px;right:auto;bottom:12px;left:0;width:5px;height:auto;border-radius:0 999px 999px 0}}
@media(max-width:720px){.footer-links{margin-left:0}.footer-links .business-login{margin-left:0}}
@media(max-width:700px){.wos-center-panel{padding:22px 18px}.wos-form-grid,.wos-input-row{grid-template-columns:1fr}.wos-field.full{grid-column:auto}.wos-chat-panel{inset:10px;width:auto}}

/* WebsiteOS custom multi-service two-choice CSS repair */
.wos-choice-bar{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

/* SURFLOCAL COMPACT CHAT 2027 START */

/*
 * Compact floating chat.
 * Keeps theme-controlled accent colors while using a strong,
 * readable dark communication panel similar to the original
 * Surflocal business chat.
 */

.wos-chat-widget{
    right:18px;
    bottom:18px;
}

.wos-chat-launcher{
    gap:8px;
    padding:10px 15px;
    border-radius:999px;
    font-size:13px;
    line-height:1;
    box-shadow:0 12px 28px rgba(0,0,0,.28);
}

.wos-chat-dot{
    width:8px;
    height:8px;
    box-shadow:0 0 0 4px rgba(217,255,240,.14);
}

.wos-chat-panel{
    top:auto;
    right:18px;
    bottom:18px;

    width:min(374px,calc(100vw - 36px));
    height:min(560px,calc(100vh - 36px));
    max-height:560px;

    border-radius:20px;
    overflow:hidden;

    border:1px solid color-mix(
        in srgb,
        var(--secondary) 30%,
        rgba(255,255,255,.16)
    );

    background:
        color-mix(
            in srgb,
            var(--primary-dark) 82%,
            #050b14
        );

    color:#f8fafc;

    box-shadow:
        0 24px 58px rgba(0,0,0,.42);
}

.wos-chat-header{
    align-items:center;
    gap:10px;

    padding:13px 14px 12px;

    background:
        linear-gradient(
            135deg,
            var(--primary-dark),
            var(--primary),
            var(--secondary)
        );
}

.wos-chat-header strong{
    display:block;
    margin:0;
    color:#fff;
    font-size:15px;
    line-height:1.15;
    font-weight:900;
}

.wos-chat-header span{
    margin-top:2px;
    color:rgba(255,255,255,.84);
    font-size:11px;
    line-height:1.3;
}

.wos-chat-close{
    flex:0 0 auto;

    width:30px;
    height:30px;

    border-radius:50%;

    background:rgba(255,255,255,.13);
    color:#fff;

    font-size:20px;
    line-height:1;
}

.wos-chat-body{
    min-height:0;

    background:
        color-mix(
            in srgb,
            var(--primary-dark) 84%,
            #050b14
        );
}

.wos-chat-start{
    padding:12px 13px 13px;
    overflow:auto;
    scrollbar-width:thin;
}

.wos-chat-form{
    gap:8px;
}

.wos-chat-form label{
    gap:4px;

    color:#e8eef7;

    font-size:11px;
    line-height:1.2;
    font-weight:850;
}

.wos-chat-form input,
.wos-chat-form textarea,
.wos-chat-send input{
    min-height:39px;

    padding:8px 10px;

    border:1px solid rgba(255,255,255,.15);
    border-radius:10px;

    background:#050a14;
    color:#f8fafc;

    font-size:13px;
    line-height:1.25;

    box-shadow:none;
}

.wos-chat-form input::placeholder,
.wos-chat-form textarea::placeholder,
.wos-chat-send input::placeholder{
    color:#7f8b9c;
}

.wos-chat-form input:focus,
.wos-chat-form textarea:focus,
.wos-chat-send input:focus{
    border-color:color-mix(
        in srgb,
        var(--secondary) 72%,
        #fff
    );

    box-shadow:
        0 0 0 2px
        color-mix(
            in srgb,
            var(--secondary) 18%,
            transparent
        );
}

.wos-chat-form textarea{
    min-height:74px;
    max-height:120px;
    resize:vertical;
}

.wos-chat-submit,
.wos-chat-send button{
    min-height:38px;

    padding:9px 12px;

    border-radius:10px;

    font-size:12px;
    line-height:1;
}

.wos-chat-conversation{
    min-height:0;

    background:
        color-mix(
            in srgb,
            var(--primary-dark) 84%,
            #050b14
        );
}

.wos-chat-messages{
    gap:8px;

    padding:12px;

    background:
        color-mix(
            in srgb,
            var(--primary-dark) 88%,
            #030711
        );

    scrollbar-width:thin;
}

.wos-chat-message{
    max-width:88%;

    padding:8px 10px;

    border-color:rgba(255,255,255,.11);
    border-radius:13px;

    background:rgba(255,255,255,.07);
    color:#f8fafc;

    font-size:12px;
    line-height:1.38;
}

.wos-chat-message.assistant,
.wos-chat-message.business{
    background:rgba(255,255,255,.08);
    color:#f8fafc;
}

.wos-chat-message.system{
    background:
        color-mix(
            in srgb,
            var(--accent) 14%,
            #07101d
        );

    color:#f8fafc;
}

.wos-chat-message-name{
    margin-bottom:2px;

    color:#cbd5e1;

    font-size:10px;
}

.wos-chat-send{
    gap:7px;

    padding:9px 11px 11px;

    border-top:1px solid rgba(255,255,255,.09);

    background:
        color-mix(
            in srgb,
            var(--primary-dark) 86%,
            #050b14
        );
}

.wos-chat-error{
    margin:0 12px 12px;
    padding:8px 10px;

    border-radius:9px;

    font-size:11px;
}


/* Desktop: deliberately compact rather than full-height. */
@media (min-width:701px){
    .wos-chat-panel{
        top:auto;
        bottom:18px;

        width:374px;
        height:min(560px,calc(100vh - 36px));
        max-height:560px;
    }
}


/* Phones stay usable without creating desktop-style whitespace. */
@media (max-width:700px){
    .wos-chat-widget{
        right:10px;
        bottom:10px;
    }

    .wos-chat-panel{
        top:auto;
        left:10px;
        right:10px;
        bottom:10px;

        width:auto;
        height:min(610px,calc(100vh - 20px));
        max-height:calc(100vh - 20px);

        border-radius:18px;
    }

    .wos-chat-header{
        padding:12px 13px 11px;
    }

    .wos-chat-start{
        padding:11px 12px 12px;
    }
}

/* SURFLOCAL COMPACT CHAT 2027 END */


/* SURFLOCAL SH CHAT THEME RUNTIME START */

/* Chat window */
.wos-chat-panel{
    border-color:
        var(--dc-theme-chat-input-border,#334155);

    border-radius:
        var(--dc-theme-chat-radius-px,20px);

    background:
        var(--dc-theme-chat-panel-background,#07111D);

    color:
        var(--dc-theme-chat-body-text,#F8FAFC);
}

.wos-chat-header{
    background:
        var(--dc-theme-chat-header-background,#1E3A5F);

    color:
        var(--dc-theme-chat-header-text,#FFFFFF);
}

.wos-chat-header strong,
.wos-chat-header span{
    color:
        var(--dc-theme-chat-header-text,#FFFFFF);
}

.wos-chat-body,
.wos-chat-start,
.wos-chat-conversation{
    background:
        var(--dc-theme-chat-panel-background,#07111D);

    color:
        var(--dc-theme-chat-body-text,#F8FAFC);
}

.wos-chat-form label{
    color:
        var(--dc-theme-chat-body-text,#F8FAFC);
}

.wos-chat-form input,
.wos-chat-form textarea,
.wos-chat-send input{
    border-color:
        var(--dc-theme-chat-input-border,#334155);

    background:
        var(--dc-theme-chat-input-background,#0D1B2A);

    color:
        var(--dc-theme-chat-input-text,#FFFFFF);
}

.wos-chat-form input::placeholder,
.wos-chat-form textarea::placeholder,
.wos-chat-send input::placeholder{
    color:
        var(--dc-theme-chat-muted-text,#A8B4C4);
}

.wos-chat-submit,
.wos-chat-send button{
    background:
        var(--dc-theme-chat-submit-background,#1E3A5F);

    color:
        var(--dc-theme-chat-submit-text,#FFFFFF);
}



/* SURFLOCAL SH CHAT MESSAGE THEME CONTRACT START */

/*
 * Conversation presentation belongs to the SH Chat Theme.
 *
 * The compact-chat layer supplies geometry only.
 * It must not force dark-theme message colors after the
 * customer/admin has selected a light Chat Theme.
 */

.wos-chat-messages{
    background:
        var(
            --dc-theme-chat-panel-background,
            #07111D
        );

    color:
        var(
            --dc-theme-chat-body-text,
            #F8FAFC
        );
}

.wos-chat-message{
    border-color:
        var(
            --dc-theme-chat-input-border,
            #334155
        );

    background:
        var(
            --dc-theme-chat-input-background,
            #0D1B2A
        );

    color:
        var(
            --dc-theme-chat-body-text,
            #F8FAFC
        );
}

.wos-chat-message.assistant,
.wos-chat-message.business,
.wos-chat-message.system{
    border-color:
        var(
            --dc-theme-chat-input-border,
            #334155
        );

    background:
        var(
            --dc-theme-chat-input-background,
            #0D1B2A
        );

    color:
        var(
            --dc-theme-chat-body-text,
            #F8FAFC
        );
}

.wos-chat-message.customer{
    border-color:
        var(
            --dc-theme-chat-submit-background,
            #1E3A5F
        );

    background:
        var(
            --dc-theme-chat-submit-background,
            #1E3A5F
        );

    color:
        var(
            --dc-theme-chat-submit-text,
            #FFFFFF
        );
}

.wos-chat-message-name{
    color:
        var(
            --dc-theme-chat-muted-text,
            #A8B4C4
        );
}

.wos-chat-message.customer
.wos-chat-message-name{
    color:
        var(
            --dc-theme-chat-submit-text,
            #FFFFFF
        );

    opacity:.82;
}

.wos-chat-send{
    border-top-color:
        var(
            --dc-theme-chat-input-border,
            #334155
        );

    background:
        var(
            --dc-theme-chat-panel-background,
            #07111D
        );
}

/* SURFLOCAL SH CHAT MESSAGE THEME CONTRACT END */

/* Floating round chat button / launcher */
.wos-chat-launcher,
.dc-chat-launcher[data-wos-chat-open]{
    background:
        var(
            --dc-theme-chat-launcher-background,
            #1E3A5F
        );

    color:
        var(
            --dc-theme-chat-launcher-text,
            #FFFFFF
        );
}


/* Helper bubble beside floating launcher */
.dc-chat-launcher-helper{
    background:
        var(
            --dc-theme-chat-helper-background,
            #FFFFFF
        );

    color:
        var(
            --dc-theme-chat-helper-text,
            #172033
        );
}


/* Desktop window size */
@media (min-width:701px){
    .wos-chat-panel{
        width:
            min(
                var(--dc-theme-chat-width-px,370px),
                calc(100vw - 36px)
            );

        height:
            min(
                var(--dc-theme-chat-height-px,500px),
                calc(100vh - 36px)
            );

        max-height:
            var(--dc-theme-chat-height-px,500px);
    }
}

/* SURFLOCAL SH CHAT THEME RUNTIME END */