/* Vaarzeker / Kompas. Presentation only: existing workspace and actions stay in place. */
:root{--navy-950:#073562;--navy-900:#083c70;--navy-800:#024a8c;--navy-700:#235e94;--blue-50:#f2f6fb;--blue-100:#e9f1fa;--orange:#ed792b;--orange-soft:#fff3e9;--ink:#19334e;--muted:#5c7085;--line:#dce5ef;--surface:#fff;--canvas:#edf2f7;--shadow:0 2px 8px rgba(20,53,86,.045);--radius:10px;font-family:Bahnschrift,'Segoe UI',Arial,sans-serif}
body{background:var(--canvas);color:var(--ink)}
.sidebar{background:#083c70;color:#e7eff7}
.brand{padding:0 9px 25px;min-height:68px}
.brand-logo{width:178px;max-width:100%;height:auto;display:block}
.mobile-brand .brand-logo{width:140px;height:44px;object-fit:contain}
.login-card .brand-logo{width:220px;margin:0 0 22px}
.main-nav a{color:#bfd1e3;border-radius:8px;font-weight:500}
.main-nav a.active{background:#205687;box-shadow:inset 3px 0 #f18a39;color:white}
.main-nav a:hover{background:#194d7e;color:white}
.sidebar .secondary-button{background:transparent;color:#dce8f4;border-color:#426c94}
.sidebar .secondary-button:hover{background:#205687}
.sidebar .sync-state,.sidebar .user-button small{color:#bfd1e3}
.sidebar .user-button{border-color:#32628d}
.sidebar .avatar{background:#205687;color:white}
.main-nav em{background:#2c6192;color:#fff;border:1px solid #4b7aa5;font-weight:600}
.nav-icon svg,.bottom-nav svg,.mobile-notification-button svg{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.topbar{background:#fff;border-bottom:1px solid var(--line)}
.search-launch{background:#f5f8fc;border-color:var(--line);border-radius:8px}
#global-search{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;font-weight:400}
.icon-button,.version-link{border-radius:7px;border-color:var(--line);box-shadow:none}
.page-heading h1{font-family:Bahnschrift,'Segoe UI',Arial,sans-serif;font-weight:600;letter-spacing:-.025em}
.eyebrow{color:var(--muted);font-weight:500;letter-spacing:.08em}
.card,.conversation,.thread-list{background:white;border-color:var(--line);border-radius:10px;box-shadow:var(--shadow)}
.card-header{border-color:var(--line)}
.primary-button{background:#024a8c;border-color:#024a8c;color:#fff;border-radius:7px;font-weight:600;box-shadow:none}
.primary-button:hover:not(:disabled){background:#083c70;border-color:#083c70}
.primary-button[data-action="close-ticket-now"]{background:#024a8c;border-color:#024a8c}
.secondary-button,.detail-actions button,.ticket-actions button:not(.primary-button),.quick-actions button{background:white;border:1px solid var(--line);border-radius:7px;color:var(--ink);box-shadow:none;font-weight:500}
.secondary-button:hover:not(:disabled),.detail-actions button:hover:not(:disabled){background:var(--blue-50);border-color:#91aec9}
.text-button{color:#024a8c;font-weight:500}
.chip,.segmented button{border-radius:6px;font-weight:500}
.chip.active,.segmented button.active{background:#024a8c;border-color:#024a8c;color:white;box-shadow:none}
.status{border-radius:5px;font-weight:500}
.status.active,.identity-known{background:#edf4fb;color:#205e93;border-color:#cddfed}
.status.watch{color:#805017;background:#fff5e8}
.status.danger,.status.late{color:#9b3440;background:#fff0f1}
.identity-member{color:var(--ink)}
.channel-icon,.avatar{border-radius:8px;background:#eaf1f9;color:#235e94;font-weight:600}
.channel-icon.whatsapp,.channel-icon.email,.channel-icon.ticket,.channel-icon.task{background:#edf3f9;color:#235e94}
.detail-hero,.support-hero,.ticket-detail-head{background:white;color:var(--ink);border-bottom:1px solid var(--line)}
.detail-name p{color:var(--muted)}
.detail-name .avatar{background:#eaf1f9;color:#235e94;border-radius:8px}
.detail-body,.ticket-detail-body{background:var(--canvas)}
.detail-body>.detail-section,.ticket-detail-body>.detail-section,.customer-overview,.customer-source-details,.ticket-facts{border-color:var(--line);background:#fff;border-radius:9px;box-shadow:none}
.detail-tabs button.active{border-bottom-color:#024a8c;color:#024a8c}
.thread-item{border-color:var(--line)}
.thread-item.selected{background:#edf4fc;box-shadow:inset 3px 0 #024a8c}
.thread-item.unread .thread-head b:before{background:#024a8c}
.thread-item .thread-subject{color:var(--ink)}
.conversation-head{background:white;border-color:var(--line)}
.conversation-actions,.inbox-customer-toolbar{background:#f8fafd;border-color:var(--line)}
.message-area{background:#f5f8fc}
.message{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:0 9px 9px;box-shadow:none}
.message.out,.message.outgoing{background:#eaf2fc;color:var(--ink);border-color:#dce8f6;border-radius:9px 0 9px 9px}
.wa-reply,.composer{background:white;border-color:var(--line)}
.wa-template-preview,.wa-image-draft{background:#f4f7fb;border-color:var(--line)}
.timeline-item{border-color:var(--line);border-radius:7px;background:#fff}
.contact-row.selected,.ticket-row.selected,.picker-customer:hover{background:#edf4fc}
.form-dialog,.workspace-dialog,.search-dialog{border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 70px #07356226;color:var(--ink)}
.form-dialog::backdrop,.workspace-dialog::backdrop,.search-dialog::backdrop{background:#092d4d70}
.form-dialog-head,.form-dialog-foot{background:#f5f8fc;border-color:var(--line)}
.form-dialog-body{background:white}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),textarea,select{border:1px solid #cbd8e5;border-radius:7px;background:#fff;color:var(--ink);padding:9px 11px;line-height:1.4;box-shadow:inset 0 1px 2px #17304b03}
input::placeholder,textarea::placeholder{color:#738497;opacity:1}
input:disabled,textarea:disabled,select:disabled{background:#f2f5f8;color:#77879a}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid #3476b4;outline-offset:2px;border-color:#3476b4}
input[type=checkbox],input[type=radio]{accent-color:#024a8c}
select:not([multiple]):not([size]){appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%235c7085' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 11px center;background-repeat:no-repeat;padding-right:35px}
select[multiple],select[size]{padding:6px;background:#f8fafd;border-radius:8px}
select option{padding:9px;color:#19334e;background:white}
.search-launch input{background:transparent;border:0;box-shadow:none;padding:4px 0}
.picker-customer,.selected-customer{border-color:var(--line);border-radius:8px}
.record-picker{display:grid;gap:5px;margin-top:6px;font-size:14px}
.record-picker-options{display:grid;gap:5px;max-height:300px;overflow:auto;overscroll-behavior:contain;padding:3px}
.record-picker .record-choice{display:flex;align-items:center;gap:11px;margin:0;padding:11px 12px;background:#fff;border:1px solid var(--line);border-radius:7px;cursor:pointer;font-size:14px;font-weight:500;line-height:1.4;min-width:0}
.record-picker .record-choice:hover{background:#f5f8fc;border-color:#9ab6ce}
.record-picker .record-choice:has(input:checked){background:#edf4fc;border-color:#4382ba;box-shadow:inset 3px 0 #024a8c}
.record-choice input[type=radio]{width:17px;height:17px;min-height:0;padding:0;flex:none;margin:0}
.record-choice span{display:block;min-width:0;overflow-wrap:anywhere}
.record-choice small{display:block;margin-top:3px;color:var(--muted);font-size:12px;font-weight:400}
.record-picker-note{color:var(--muted);font-size:12px;line-height:1.4;margin:5px 3px}
#sharing-body form>label{display:grid;gap:5px;margin-bottom:10px;font-size:14px}
#sharing-body form>label input{width:100%;min-width:0}
.timeline-item:before{background:#3476b4}
body #voip-live-banner{background:#fff;color:var(--ink);border-bottom:1px solid var(--line);box-shadow:0 2px 8px #1836530c;gap:9px;padding:8px 16px;border-top:2px solid #ed792b;align-items:center}
#voip-live-banner .voip-banner-main{padding:5px 0;line-height:1.4;display:flex;align-items:center;gap:11px;font-size:14px}
.voip-call-symbol{display:grid;place-items:center;width:32px;height:32px;flex:none;background:#fff3e9;color:#9b4c19;border-radius:50%}
.voip-call-symbol svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.voip-call-copy{display:flex;align-items:center;gap:12px;flex-wrap:wrap;text-align:left}
#voip-live-banner .voip-call-copy strong{font-size:11px;text-transform:uppercase;letter-spacing:.045em;color:#99501f;font-weight:500}
.voip-call-copy small{font-size:13px;color:var(--muted)}
#voip-live-banner [data-voip-dismiss]{width:34px;height:34px;margin:0;border-color:var(--line);border-radius:6px}
#voip-live-banner .text-button{font-size:13px;white-space:nowrap}
.bottom-nav{background:#fff;border-color:var(--line);box-shadow:0 -2px 10px #17304b06}
.bottom-nav a{color:#657b91}
.bottom-nav a.active{color:#024a8c}
.bottom-nav em{background:#eaf2fb;border:1px solid #c6d9ec;color:#024a8c;box-shadow:none}
.bottom-nav [data-count]{background:#eaf2fb;border-color:#c6d9ec;color:#024a8c}
.bottom-nav a.active:before{background:#ed792b}
@media(max-width:1000px){
 .topbar{background:#083c70;border-color:#083c70;color:white;gap:10px}
 .topbar .search-launch{background:#205687;border-color:#396a96;color:#d9e7f4}
 .topbar .search-launch input{color:#fff}
 .topbar .search-launch input::placeholder{color:#d1e0ed}
 .topbar .mobile-notification-button{background:transparent;color:#fff;border-color:#477299}
 .topbar .mobile-brand{min-width:0;flex-shrink:0}
 .mobile-brand .brand-logo{width:128px;height:40px}
 .mobile-ui .form-dialog,.mobile-ui .workspace-dialog{border-radius:0}
 .mobile-ui .detail-hero,.mobile-ui .ticket-detail-head{background:#fff}
 .mobile-ui .detail-body,.mobile-ui .ticket-detail-body{background:#edf2f7}
 .mobile-ui .detail-actions button{border-radius:6px}
 .mobile-ui .conversation-head{background:white;color:var(--ink)}
 .mobile-ui .record-picker-options{max-height:42dvh}
 .mobile-ui .record-choice{min-height:46px}
 .mobile-ui input:not([type=radio]):not([type=checkbox]),.mobile-ui textarea,.mobile-ui select{font-size:16px}
 body #voip-live-banner{gap:8px;padding:7px 10px;flex-wrap:wrap}
 #voip-live-banner .voip-banner-main{flex-basis:calc(100% - 48px);padding:0}
 .voip-call-copy{gap:1px 7px}
 #voip-live-banner .voip-call-copy strong{flex-basis:100%}
 #voip-live-banner .voip-call-copy small{font-size:12px}
 #voip-live-banner [data-voip-calls]{order:3;margin-left:40px;padding:2px 0;min-height:28px}
 #voip-live-banner [data-voip-dismiss]{order:2;min-height:32px}
}
@media(max-width:380px){.mobile-brand .brand-logo{width:110px}.topbar{gap:7px}.mobile-ui .topbar{padding-inline:10px}.mobile-ui .detail-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}