/* E1 visual identity — presentation only.
   Design passport: #004D43 deep emerald, #00A67E green,
   #00D6B5 turquoise and #E6FBF6 pale mint.
   Existing links, inputs, notifications, task JS and routes are unchanged. */
:root {
    --e1-deep:#004D43;
    --e1-emerald:#006E5D;
    --e1-green:#00A67E;
    --e1-turquoise:#00D6B5;
    --e1-mint:#E6FBF6;
    --e1-ink:#103D35;
    --e1-line:#D2EBDF;
}

body .header.e1-branded-header {
    position:relative;
    z-index:11;
    background:
      radial-gradient(ellipse at 75% -65%, rgba(169,255,226,.16),transparent 58%),
      linear-gradient(112deg,#004D43 0%,#006B59 38%,#00A67E 78%,#00BF9F 100%) !important;
    border-bottom:1px solid rgba(255,255,255,.19) !important;
    box-shadow:0 8px 26px rgba(0,70,55,.16) !important;
    overflow:hidden;
}
body .header.e1-branded-header::after {
    height:100%;
    background:linear-gradient(to bottom,rgba(255,255,255,.08),transparent 65%);
    pointer-events:none;
}
body .header .header-inner.e1-branded-header-inner {
    max-width:1600px !important;
    min-height:86px;
    display:flex;align-items:center;justify-content:space-between;
    gap:20px;
    padding:13px 30px !important;
}
.e1-branded-identity {
    display:flex;align-items:center;gap:14px;
    min-width:0;position:relative;z-index:1;
}
.e1-branded-mark {
    flex:0 0 59px;
    display:grid;place-items:center;
    width:59px;height:59px;
    border:1px solid rgba(255,255,255,.28);
    border-radius:18px;
    background:rgba(255,255,255,.12);
    box-shadow:0 6px 18px rgba(0,64,47,.11);
}
.e1-branded-mark img {
    width:47px;height:47px;
    filter:brightness(0) invert(1);
    object-fit:contain;
}
.e1-branded-wordmark {
    display:flex;flex-direction:column;justify-content:center;
    gap:5px;min-width:0;
}
.e1-branded-name {
    color:#FFF;font-size:30px;line-height:.97;
    font-weight:900;letter-spacing:-1.1px;
}
.e1-branded-description {
    color:#D9FFF1;font-size:12px;line-height:1.35;
    font-weight:700;letter-spacing:.01em;
}
.e1-branded-organization {
    position:relative;z-index:1;
    display:flex;flex-direction:column;align-items:flex-end;gap:5px;
    text-align:right;
    padding:6px 0 6px 20px;
    border-left:1px solid rgba(229,255,246,.32);
    min-width:0;
}
.e1-branded-organization-label {
    color:#B3FBE5;
    font-size:9px;font-weight:800;letter-spacing:.14em;
}
.e1-branded-organization .company {
    color:#FFFFFF !important;font-size:13px;font-weight:800;
    line-height:1.3;overflow-wrap:anywhere;
}
.e1-branded-organization .version {
    margin-top:0;
    color:#C6F6E8 !important;
    font-size:10px;
}
body .accent-bar.e1-branded-accent {
    height:3px !important;
    background:linear-gradient(90deg,#005647,#00A67E,#00D6B5,#9CF9E0,#00A67E) !important;
    background-size:100% 100%;
    animation:none !important;
}

body .sub-nav.e1-branded-navigation {
    position:relative;z-index:20;
    min-height:65px;
    padding:10px 30px !important;
    display:flex !important;align-items:center;
    justify-content:space-between;gap:12px;
    background:rgba(249,255,252,.97) !important;
    border-bottom:1px solid #D2E9DE !important;
    box-shadow:0 5px 17px rgba(0,77,60,.065) !important;
    backdrop-filter:blur(14px);
}
.e1-branded-navigation .nav-left,
.e1-branded-navigation .nav-right {
    display:flex;align-items:center;
    flex-wrap:wrap;gap:9px !important;
}
.e1-branded-navigation .nav-pill {
    min-height:39px;
    display:inline-flex;align-items:center;justify-content:center;
    background:#FFF !important;
    color:#006B57 !important;
    border:1px solid #CDE9DC !important;
    border-radius:11px !important;
    padding:8px 14px !important;
    font-size:12px !important;font-weight:750 !important;
    box-shadow:0 2px 8px rgba(0,80,57,.025);
    transition:background .16s,border-color .16s,color .16s !important;
}
.e1-branded-navigation .nav-pill:hover {
    color:#004D43 !important;
    background:#E4FAF0 !important;
    border-color:#8CD8BC !important;
    box-shadow:0 3px 9px rgba(0,100,74,.09);
    transform:none;
}
.e1-branded-navigation .nav-pill[href*="logout"] {
    color:#B8424E !important;
    background:#FFF8F8 !important;
    border-color:#F4D5D8 !important;
    box-shadow:none !important;
}
.e1-branded-navigation .nav-pill[href*="logout"]:hover {
    color:#A62D40 !important;
    background:#FFECEE !important;
    border-color:#EFB6BF !important;
}
.e1-branded-navigation .user-chip {
    border-radius:12px !important;
    border:1px solid #CFE9DC !important;
    padding:5px 12px 5px 5px !important;
    background:#FFF !important;
    box-shadow:0 2px 9px rgba(0,90,61,.035);
}
.e1-branded-navigation .user-chip:hover {
    border-color:#A1DEC5 !important;
    background:#EFFFF6 !important;
}
.e1-branded-navigation .nav-avatar {
    width:38px !important;height:38px !important;
    border:2px solid #DDF4EA;
}
.e1-branded-navigation .user-name {
    color:#175643 !important;
    font-size:12px !important;
}
.e1-branded-navigation .user-role {
    color:#699083 !important;
    font-size:10px !important;
}
.e1-branded-navigation .crm-task-notify-bell {
    width:41px;height:41px;
    border:1px solid #BFE6D5;
    border-radius:12px;
    background:#FFF;
    color:#00856A;
    box-shadow:0 2px 8px rgba(0,90,61,.035);
}
.e1-branded-navigation .crm-task-notify-bell:hover,
.e1-branded-navigation .crm-task-notify-bell[aria-expanded="true"] {
    background:#DFF8ED;
    border-color:#89D5B8;
}
/* Keep the notification panel above the navigation and main content. */
.e1-branded-navigation .crm-task-notify-popover {
    z-index:310;
}
.e1-branded-navigation :is(a,button):focus-visible,
.e1-branded-header a:focus-visible {
    outline:2px solid #00A67E;outline-offset:2px;
}
@media(max-width:850px) {
    body .header .header-inner.e1-branded-header-inner {
        min-height:74px;padding:12px 18px !important;
    }
    body .sub-nav.e1-branded-navigation {
        padding:9px 18px !important;flex-wrap:wrap;
    }
    .e1-branded-navigation .nav-left,
    .e1-branded-navigation .nav-right {gap:7px !important;}
}
@media(max-width:560px) {
    body .header .header-inner.e1-branded-header-inner {
        flex-wrap:wrap;gap:12px;
        padding:11px 14px !important;
    }
    .e1-branded-mark {width:49px;height:49px;flex-basis:49px;border-radius:14px;}
    .e1-branded-mark img {width:39px;height:39px;}
    .e1-branded-name {font-size:26px;}
    .e1-branded-description {font-size:11px;}
    .e1-branded-organization {
        padding:0 0 0 12px;
        flex:1 1 100%;align-items:flex-start;
        border-left:0;border-top:1px solid rgba(255,255,255,.23);
        padding-top:9px;text-align:left;
    }
    .e1-branded-organization-label {display:none;}
    .e1-branded-organization .company {font-size:11px;}
    .e1-branded-organization .version {display:none;}
    body .sub-nav.e1-branded-navigation {padding:10px 12px !important;}
    .e1-branded-navigation .nav-left,
    .e1-branded-navigation .nav-right {width:100%;}
    .e1-branded-navigation .nav-right {justify-content:space-between;}
    .e1-branded-navigation .nav-right > div {margin-left:0 !important;}
    .e1-branded-navigation .user-chip {flex:0 1 auto !important;}
    .e1-branded-navigation .nav-pill {min-height:36px;padding:7px 10px !important;}
}
@media(prefers-reduced-motion:reduce) {
    .e1-branded-header *, .e1-branded-navigation * {transition:none!important;}
}
