/*
 * Hotless LiveChat 2.2 visual redesign.
 * This file intentionally contains presentation-only overrides so the existing
 * chat, REST, privacy and inbox behavior remains unchanged.
 */

/* =========================
   Frontend widget redesign
   ========================= */
.hlc-widget{
    --hlc-redesign-accent:var(--hlc-primary,#7c3aed);
    --hlc-redesign-ink:#101828;
    --hlc-redesign-muted:#667085;
    --hlc-redesign-line:#e7e8ec;
    --hlc-redesign-surface:#ffffff;
    --hlc-redesign-soft:#f7f7f9;
    --hlc-redesign-shadow:0 24px 70px rgba(16,24,40,.18),0 8px 24px rgba(16,24,40,.08);
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
    color:var(--hlc-redesign-ink)!important;
}

.hlc-launcher{
    min-height:58px!important;
    padding:0 19px!important;
    gap:10px!important;
    border:1px solid rgba(255,255,255,.52)!important;
    border-radius:18px!important;
    background:linear-gradient(145deg,#15161b 0%,#22242b 48%,#2d3038 100%)!important;
    box-shadow:0 18px 38px rgba(16,24,40,.24),inset 0 1px 0 rgba(255,255,255,.18)!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:760!important;
    letter-spacing:.01em!important;
    overflow:hidden!important;
}
.hlc-launcher:before{
    inset:auto!important;
    left:0!important;
    bottom:0!important;
    width:100%!important;
    height:3px!important;
    border:0!important;
    border-radius:0!important;
    background:linear-gradient(90deg,transparent,var(--hlc-redesign-accent),transparent)!important;
    opacity:.95!important;
    animation:none!important;
}
.hlc-launcher:after{
    content:""!important;
    position:absolute!important;
    width:82px!important;
    height:82px!important;
    right:-35px!important;
    top:-44px!important;
    border-radius:50%!important;
    background:var(--hlc-redesign-accent)!important;
    opacity:.16!important;
    pointer-events:none!important;
}
.hlc-launcher:hover{
    transform:translateY(-3px)!important;
    filter:none!important;
    box-shadow:0 22px 44px rgba(16,24,40,.28),inset 0 1px 0 rgba(255,255,255,.2)!important;
}
.hlc-launcher:focus-visible{
    outline:3px solid color-mix(in srgb,var(--hlc-redesign-accent) 28%,transparent)!important;
    outline-offset:4px!important;
}
.hlc-launcher-shape-pill{border-radius:999px!important}
.hlc-launcher-shape-rounded{border-radius:18px!important}
.hlc-launcher-shape-circle,.hlc-launcher.is-icon-only{
    width:58px!important;
    height:58px!important;
    min-width:58px!important;
    border-radius:19px!important;
}
.hlc-launcher-icon{
    width:32px!important;
    height:32px!important;
    flex:0 0 32px!important;
    border-radius:11px!important;
    background:rgba(255,255,255,.09)!important;
}
.hlc-launcher-icon svg{width:21px!important;height:21px!important}
.hlc-launcher-text{font-weight:760!important;letter-spacing:.005em!important}

.hlc-panel{
    width:404px!important;
    max-width:calc(100vw - 24px)!important;
    height:min(650px,calc(var(--hlc-viewport-height) - 104px))!important;
    min-height:450px!important;
    border:1px solid rgba(16,24,40,.1)!important;
    border-radius:26px!important;
    background:var(--hlc-redesign-surface)!important;
    box-shadow:var(--hlc-redesign-shadow)!important;
    overflow:hidden!important;
}
.hlc-panel-header{
    min-height:86px!important;
    padding:17px 18px!important;
    gap:12px!important;
    border-bottom:1px solid rgba(255,255,255,.1)!important;
    background:
        radial-gradient(circle at 92% 5%,rgba(255,255,255,.15),transparent 30%),
        linear-gradient(145deg,#17181d 0%,#202229 55%,#282b33 100%)!important;
}
.hlc-avatar{
    width:46px!important;
    height:46px!important;
    flex:0 0 46px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:15px!important;
    background:linear-gradient(145deg,var(--hlc-redesign-accent),#24262d)!important;
    box-shadow:0 8px 20px rgba(0,0,0,.18)!important;
    font-size:15px!important;
}
.hlc-title-wrap{gap:4px!important}
.hlc-title-wrap strong{font-size:15px!important;font-weight:760!important;letter-spacing:-.01em!important}
.hlc-title-wrap span{color:rgba(255,255,255,.7)!important;font-size:10px!important;letter-spacing:.02em!important}
.hlc-title-wrap i{width:7px!important;height:7px!important;margin-right:7px!important;background:#32d583!important;box-shadow:0 0 0 4px rgba(50,213,131,.12)!important}
.hlc-close{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.06)!important;
    font-size:21px!important;
}
.hlc-close:hover,.hlc-close:focus-visible{background:rgba(255,255,255,.12)!important}

.hlc-welcome{
    padding:15px 18px 10px!important;
    background:#fff!important;
}
.hlc-welcome p{
    color:#475467!important;
    font-size:12px!important;
    line-height:1.62!important;
}
.hlc-channel-row{
    gap:8px!important;
    padding:7px 18px 14px!important;
}
.hlc-channel{
    min-height:36px!important;
    padding:8px 11px!important;
    border:1px solid #e4e7ec!important;
    border-radius:12px!important;
    background:#f9fafb!important;
    color:#344054!important;
    font-size:10px!important;
    font-weight:720!important;
}
.hlc-channel:hover{border-color:#d0d5dd!important;background:#fff!important;color:#101828!important}
.hlc-whatsapp{border-color:#d1fadf!important;background:#ecfdf3!important;color:#027a48!important}

.hlc-chat-body{
    border-top:1px solid #eaecf0!important;
    background:linear-gradient(180deg,#f9fafb 0%,#f6f7f9 100%)!important;
}
.hlc-messages{
    padding:18px 16px 12px!important;
    scrollbar-color:#d0d5dd transparent!important;
}
.hlc-message{max-width:82%!important;margin-bottom:13px!important}
.hlc-bubble{
    padding:11px 13px!important;
    border:1px solid #e4e7ec!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 3px 12px rgba(16,24,40,.045)!important;
    color:#344054!important;
    font-size:12px!important;
    line-height:1.52!important;
}
.hlc-message.is-agent .hlc-bubble{border-bottom-left-radius:6px!important}
.hlc-message.is-visitor .hlc-bubble{
    border-color:#24262d!important;
    border-bottom-right-radius:6px!important;
    background:linear-gradient(145deg,#17181d,#292c33)!important;
    box-shadow:0 8px 20px rgba(16,24,40,.12)!important;
    color:#fff!important;
}
.hlc-message>span{margin-top:5px!important;color:#98a2b3!important;font-size:8px!important}

.hlc-start-form{
    padding:16px 18px 19px!important;
}
.hlc-start-form label{margin-bottom:12px!important}
.hlc-start-form label>span{
    margin-bottom:6px!important;
    color:#475467!important;
    font-size:10px!important;
    font-weight:720!important;
    letter-spacing:.015em!important;
}
.hlc-start-form input,.hlc-start-form textarea{
    padding:11px 12px!important;
    border:1px solid #d0d5dd!important;
    border-radius:13px!important;
    background:#fff!important;
    box-shadow:0 1px 2px rgba(16,24,40,.03)!important;
    color:#101828!important;
    font-size:12px!important;
}
.hlc-start-form input{height:44px!important;min-height:44px!important;max-height:44px!important}
.hlc-start-form textarea{height:92px!important;min-height:92px!important}
.hlc-start-form input:focus,.hlc-start-form textarea:focus{
    border-color:#98a2b3!important;
    box-shadow:0 0 0 3px rgba(16,24,40,.06)!important;
}
.hlc-privacy-note{color:#98a2b3!important;font-size:8px!important;line-height:1.5!important}
.hlc-send-primary{
    min-height:45px!important;
    margin-top:5px!important;
    border:1px solid #17181d!important;
    border-radius:13px!important;
    background:linear-gradient(145deg,#15161b,#292c33)!important;
    box-shadow:0 10px 20px rgba(16,24,40,.14)!important;
    font-size:12px!important;
    font-weight:760!important;
}
.hlc-send-primary:hover{filter:brightness(1.06)!important}

.hlc-message-form{
    min-height:72px!important;
    gap:9px!important;
    padding:11px 12px!important;
    border-top:1px solid #eaecf0!important;
    background:#fff!important;
}
.hlc-message-form textarea{
    height:48px!important;
    min-height:48px!important;
    padding:13px 14px!important;
    border:1px solid #d0d5dd!important;
    border-radius:15px!important;
    background:#f9fafb!important;
    color:#101828!important;
    font-size:12px!important;
}
.hlc-message-form textarea:focus{
    border-color:#98a2b3!important;
    background:#fff!important;
    box-shadow:0 0 0 3px rgba(16,24,40,.06)!important;
}
.hlc-message-form button{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    border:1px solid #17181d!important;
    border-radius:15px!important;
    background:linear-gradient(145deg,#15161b,#292c33)!important;
    box-shadow:0 9px 18px rgba(16,24,40,.14)!important;
}
.hlc-powered{
    padding:7px 10px!important;
    border-top:1px solid #f2f4f7!important;
    color:#b0b6c0!important;
    font-size:8px!important;
    letter-spacing:.02em!important;
}
.hlc-closed-note{
    border-color:#e4e7ec!important;
    background:#f9fafb!important;
    color:#667085!important;
}
.hlc-closed-note button{
    border-color:#d0d5dd!important;
    background:#fff!important;
    color:#344054!important;
}
.hlc-unread-badge{
    border:2px solid #fff!important;
    background:#f04438!important;
    box-shadow:0 4px 10px rgba(240,68,56,.25)!important;
}

@media (max-width:600px){
    .hlc-widget.hlc-pos-left,.hlc-widget.hlc-pos-right{left:0!important;right:0!important}
    .hlc-widget.hlc-anchor-bottom{bottom:0!important}
    .hlc-widget.hlc-anchor-top{top:0!important}
    .hlc-panel{
        width:100vw!important;
        max-width:100vw!important;
        height:var(--hlc-viewport-height)!important;
        min-height:0!important;
        border:0!important;
        border-radius:0!important;
        box-shadow:none!important;
    }
    .hlc-panel-header{min-height:82px!important;padding:16px 17px!important}
    .hlc-welcome{padding-left:17px!important;padding-right:17px!important}
    .hlc-channel-row{padding-left:17px!important;padding-right:17px!important}
    .hlc-start-form{padding-left:17px!important;padding-right:17px!important}
    .hlc-messages{padding-left:14px!important;padding-right:14px!important}
}

/* =========================
   WordPress admin redesign
   ========================= */
.hlc-admin-wrap{
    --hlc-r2-accent:#7c3aed;
    --hlc-r2-accent-2:#5b21b6;
    --hlc-r2-ink:#18181b;
    --hlc-r2-text:#3f3f46;
    --hlc-r2-muted:#71717a;
    --hlc-r2-line:#e4e4e7;
    --hlc-r2-soft:#f7f7f8;
    margin:22px 24px 0 0!important;
    max-width:1500px!important;
    color:var(--hlc-r2-text)!important;
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important;
}
.hlc-admin-header{
    min-height:148px!important;
    padding:26px 28px!important;
    border:1px solid #27272a!important;
    border-radius:24px!important;
    background:
        radial-gradient(circle at 83% 15%,rgba(124,58,237,.35),transparent 27%),
        radial-gradient(circle at 65% 120%,rgba(34,211,238,.12),transparent 35%),
        linear-gradient(145deg,#111113 0%,#1d1d20 52%,#27272a 100%)!important;
    box-shadow:0 20px 48px rgba(24,24,27,.16)!important;
}
.hlc-admin-header:after{
    right:40px!important;
    bottom:-115px!important;
    width:250px!important;
    height:250px!important;
    border-color:rgba(255,255,255,.06)!important;
    box-shadow:0 0 0 34px rgba(255,255,255,.025),0 0 0 68px rgba(255,255,255,.015)!important;
}
.hlc-eyebrow{
    margin-bottom:8px!important;
    color:#c4b5fd!important;
    font-size:9px!important;
    letter-spacing:.18em!important;
}
.hlc-admin-header h1{
    margin-bottom:7px!important;
    font-size:30px!important;
    font-weight:760!important;
    letter-spacing:-.04em!important;
}
.hlc-admin-header p{color:rgba(255,255,255,.67)!important;font-size:12px!important}
.hlc-header-actions{gap:8px!important}
.hlc-header-actions .button,.hlc-live-badge{
    min-height:41px!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.06)!important;
    color:#f4f4f5!important;
    backdrop-filter:blur(8px)!important;
}
.hlc-header-actions .button:hover,.hlc-header-actions .button:focus{
    border-color:rgba(255,255,255,.22)!important;
    background:rgba(255,255,255,.1)!important;
}
.hlc-header-actions .button.button-primary{
    border-color:#fff!important;
    background:#fff!important;
    color:#18181b!important;
}
.hlc-live-badge{color:#e4e4e7!important}
.hlc-live-badge i{background:#32d583!important;box-shadow:0 0 0 4px rgba(50,213,131,.11)!important}

.hlc-stat-grid{gap:14px!important;margin:18px 0!important}
.hlc-stat-card{
    min-height:94px!important;
    padding:18px 19px!important;
    border:1px solid var(--hlc-r2-line)!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 7px 24px rgba(24,24,27,.045)!important;
}
.hlc-stat-card:after{
    right:-17px!important;
    top:-25px!important;
    width:76px!important;
    height:76px!important;
    background:#f4f4f5!important;
}
.hlc-stat-card span{color:#71717a!important;font-size:9px!important;letter-spacing:.09em!important}
.hlc-stat-card strong{color:#18181b!important;font-size:30px!important;font-weight:760!important}
.hlc-stat-card.is-unread{
    border-color:#ddd6fe!important;
    background:linear-gradient(145deg,#fff,#faf8ff)!important;
}
.hlc-stat-card.is-unread strong{color:#6d28d9!important}

.hlc-inbox-app{
    grid-template-columns:340px minmax(450px,1fr) 292px!important;
    min-height:630px!important;
    border:1px solid var(--hlc-r2-line)!important;
    border-radius:24px!important;
    background:#fff!important;
    box-shadow:0 18px 46px rgba(24,24,27,.07)!important;
}
.hlc-conversations-panel{
    border-right:1px solid #e8e8eb!important;
    background:#f8f8fa!important;
}
.hlc-conversation-tools{
    padding:14px!important;
    border-bottom:1px solid #e8e8eb!important;
    background:#fff!important;
}
.hlc-search-box{
    height:42px!important;
    padding:0 11px!important;
    border:1px solid #d4d4d8!important;
    border-radius:12px!important;
    background:#fafafa!important;
}
.hlc-search-box:focus-within{
    border-color:#a1a1aa!important;
    background:#fff!important;
    box-shadow:0 0 0 3px rgba(24,24,27,.055)!important;
}
.hlc-filter-row{gap:6px!important;margin-top:11px!important}
.hlc-filter{
    padding:7px 11px!important;
    border-radius:9px!important;
    color:#71717a!important;
    font-size:10px!important;
}
.hlc-filter:hover{background:#f4f4f5!important;color:#27272a!important}
.hlc-filter.is-active{
    background:#27272a!important;
    color:#fff!important;
    box-shadow:none!important;
}
.hlc-conversation{
    grid-template-columns:46px minmax(0,1fr) auto!important;
    gap:11px!important;
    padding:14px!important;
    border-bottom:1px solid #ececef!important;
}
.hlc-conversation:hover{background:#f4f4f6!important}
.hlc-conversation.is-active{
    background:linear-gradient(90deg,#f1edff,#faf9ff)!important;
    box-shadow:inset 3px 0 0 var(--hlc-r2-accent)!important;
}
.hlc-conversation-avatar,.hlc-thread-avatar{
    width:43px!important;
    height:43px!important;
    border-radius:14px!important;
    background:linear-gradient(145deg,#27272a,#52525b)!important;
    box-shadow:0 6px 15px rgba(24,24,27,.12)!important;
}
.hlc-conversation-title strong{color:#27272a!important;font-size:11px!important}
.hlc-conversation-title time{color:#a1a1aa!important;font-size:8px!important}
.hlc-conversation-copy small{color:#85858e!important;font-size:9px!important}
.hlc-conversation-side b{background:#e11d48!important}

.hlc-thread-panel{background:#fff!important}
.hlc-empty-icon{
    width:72px!important;
    height:72px!important;
    border:1px solid #e4e4e7!important;
    border-radius:23px!important;
    background:linear-gradient(145deg,#fafafa,#fff)!important;
    color:#7c3aed!important;
    box-shadow:0 10px 28px rgba(24,24,27,.055)!important;
}
.hlc-empty-state h2{color:#27272a!important;font-size:18px!important}
.hlc-empty-state p{color:#8a8a93!important;font-size:11px!important}
.hlc-thread-header{
    min-height:76px!important;
    padding:13px 17px!important;
    border-bottom:1px solid #e8e8eb!important;
}
.hlc-thread-avatar{width:42px!important;height:42px!important}
.hlc-thread-header h2{color:#18181b!important;font-size:13px!important}
.hlc-thread-meta{color:#8b8b94!important;font-size:9px!important}
.hlc-status-select select{
    min-width:118px!important;
    height:39px!important;
    border-color:#d4d4d8!important;
    border-radius:11px!important;
    background:#fafafa!important;
}
.hlc-admin-messages{
    padding:24px 22px 14px!important;
    background:radial-gradient(circle at 25% 0,#fff 0,#fafafa 42%,#f7f7f8 100%)!important;
}
.hlc-admin-message{max-width:74%!important;margin-bottom:14px!important}
.hlc-admin-bubble{
    padding:11px 13px!important;
    border:1px solid #e4e4e7!important;
    border-radius:17px!important;
    background:#fff!important;
    box-shadow:0 3px 11px rgba(24,24,27,.04)!important;
    color:#3f3f46!important;
    font-size:11px!important;
}
.hlc-admin-message.is-agent .hlc-admin-bubble{
    border-color:#27272a!important;
    background:linear-gradient(145deg,#18181b,#303036)!important;
    box-shadow:0 9px 18px rgba(24,24,27,.13)!important;
}
.hlc-quick-replies{
    gap:7px!important;
    padding:10px 14px 0!important;
    border-top:1px solid #eeeef0!important;
}
.hlc-quick-reply{
    padding:7px 11px!important;
    border:1px solid #e4e4e7!important;
    background:#fafafa!important;
    color:#52525b!important;
}
.hlc-quick-reply:hover,.hlc-quick-reply:focus{
    border-color:#c4b5fd!important;
    background:#f5f3ff!important;
    color:#6d28d9!important;
}
.hlc-reply-form{padding:11px 14px 14px!important}
.hlc-reply-form textarea{
    min-height:78px!important;
    padding:12px 13px!important;
    border:1px solid #d4d4d8!important;
    border-radius:14px!important;
}
.hlc-reply-form textarea:focus{
    border-color:#a1a1aa!important;
    box-shadow:0 0 0 3px rgba(24,24,27,.055)!important;
}
.hlc-reply-actions .button-primary{
    min-height:38px!important;
    padding:0 16px!important;
    border-color:#27272a!important;
    border-radius:11px!important;
    background:#27272a!important;
}

.hlc-visitor-panel{
    padding:19px!important;
    border-left:1px solid #e8e8eb!important;
    background:#fafafa!important;
}
.hlc-panel-label{color:#8a8a93!important;font-size:9px!important;letter-spacing:.12em!important}
.hlc-visitor-details dt{color:#9b9ba3!important;font-size:8px!important}
.hlc-visitor-details dd{color:#45454d!important;font-size:10px!important}
.hlc-visitor-actions .button{border-radius:11px!important}

.hlc-settings-grid{gap:17px!important}
.hlc-settings-grid section{
    padding:22px!important;
    border:1px solid #e4e4e7!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:0 7px 24px rgba(24,24,27,.04)!important;
}
.hlc-settings-grid section:hover{
    border-color:#d4d4d8!important;
    box-shadow:0 12px 28px rgba(24,24,27,.055)!important;
    transform:translateY(-1px)!important;
}
.hlc-section-heading{gap:12px!important;margin-bottom:18px!important}
.hlc-section-heading>.dashicons{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
    border:1px solid #e9d5ff!important;
    border-radius:13px!important;
    background:#faf5ff!important;
    color:#7e22ce!important;
}
.hlc-section-heading h2{color:#27272a!important;font-size:14px!important}
.hlc-section-heading p{color:#8a8a93!important;font-size:10px!important}
.hlc-field>span,.hlc-check span{color:#52525b!important}
.hlc-field input[type="text"],.hlc-field input[type="email"],.hlc-field input[type="url"],.hlc-field input[type="number"],.hlc-field input[type="tel"],.hlc-field textarea,.hlc-field select{
    border-color:#d4d4d8!important;
    border-radius:11px!important;
    background:#fafafa!important;
    box-shadow:none!important;
}
.hlc-field input:focus,.hlc-field textarea:focus,.hlc-field select:focus{
    border-color:#a78bfa!important;
    background:#fff!important;
    box-shadow:0 0 0 3px rgba(124,58,237,.07)!important;
}
.hlc-settings-submit{
    border-top:1px solid #e4e4e7!important;
    background:rgba(250,250,250,.94)!important;
    backdrop-filter:blur(10px)!important;
}
.hlc-settings-submit .button-primary{
    min-height:41px!important;
    padding:0 18px!important;
    border-color:#27272a!important;
    border-radius:11px!important;
    background:#27272a!important;
    font-weight:760!important;
}

@media (max-width:1180px){
    .hlc-inbox-app{grid-template-columns:300px minmax(420px,1fr)!important}
    .hlc-visitor-panel{display:none!important}
}
@media (max-width:900px){
    .hlc-admin-wrap{margin-right:14px!important}
    .hlc-admin-header{align-items:flex-start!important;flex-direction:column!important}
    .hlc-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .hlc-inbox-app{grid-template-columns:1fr!important;height:auto!important;min-height:0!important}
    .hlc-conversations-panel{min-height:360px!important;border-right:0!important;border-bottom:1px solid #e4e4e7!important}
    .hlc-thread-panel{min-height:560px!important}
    .hlc-settings-grid{grid-template-columns:1fr!important}
}
@media (max-width:560px){
    .hlc-admin-wrap{margin:12px 10px 0 0!important}
    .hlc-admin-header{padding:22px 20px!important;border-radius:19px!important}
    .hlc-admin-header h1{font-size:24px!important}
    .hlc-stat-grid{grid-template-columns:1fr 1fr!important;gap:9px!important}
    .hlc-stat-card{min-height:80px!important;padding:14px!important}
    .hlc-stat-card strong{font-size:25px!important}
    .hlc-inbox-app{border-radius:18px!important}
    .hlc-admin-messages{padding:18px 12px 10px!important}
    .hlc-admin-message{max-width:88%!important}
}
