/*
|--------------------------------------------------------------------------
| PBDC Official System Branding
|--------------------------------------------------------------------------
|
| Palette sampled directly from the official PBDC logo supplied for DCOS:
|
| PBDC Red    #DB222A
| PBDC Orange #FF914D
| PBDC Yellow #FFDE59
| PBDC Blue   #2B3C94
|
| System strategy:
| - PBDC Blue is the primary application colour for strong contrast.
| - Orange is the interaction/accent colour.
| - Red remains available for danger/error semantics.
| - Yellow is reserved for warning/highlight use.
|
*/

:root{
    --pbdc-red:#db222a;
    --pbdc-orange:#ff914d;
    --pbdc-yellow:#ffde59;
    --pbdc-blue:#2b3c94;
    --pbdc-blue-deep:#1f2d74;
    --pbdc-blue-soft:#eef0fb;
    --pbdc-orange-soft:#fff2e9;

    --bg:#f7f8fc;
    --surface:#ffffff;
    --surface-2:#fafbfe;
    --text:#20243c;
    --muted:#6b7190;
    --line:#dfe3f2;

    --brand:var(--pbdc-blue);
    --brand-2:var(--pbdc-blue-deep);
    --brand-soft:var(--pbdc-blue-soft);

    --danger:var(--pbdc-red);
    --danger-soft:#fff0f1;

    --shadow:0 10px 30px rgba(43,60,148,.07);
}

/* Official logo */

.pbdc-logo-shell{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    flex:0 0 auto;
    overflow:hidden;
    border-radius:12px;
    background:#fff;
    box-shadow:
        0 0 0 1px rgba(255,255,255,.32),
        0 5px 18px rgba(16,24,72,.16);
}

.pbdc-brand-logo{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

.pbdc-system-brand{
    color:#fff;
    text-decoration:none;
}

.pbdc-system-brand:hover{
    color:#fff;
}

/* DCOS shell */

.sidebar{
    background:
        linear-gradient(
            180deg,
            #1f2d74 0%,
            #263986 54%,
            #1b2868 100%
        );
}

.sidebar::before{
    content:"";
    position:absolute;
    inset:0 0 auto 0;
    height:4px;
    background:
        linear-gradient(
            90deg,
            var(--pbdc-red) 0 38%,
            var(--pbdc-orange) 38% 63%,
            var(--pbdc-yellow) 63% 78%,
            #ffffff 78% 80%,
            var(--pbdc-blue) 80% 100%
        );
}

.brand strong{
    letter-spacing:.01em;
}

.brand span{
    opacity:.82;
}

.nav a{
    color:rgba(255,255,255,.82);
    transition:
        background .15s ease,
        color .15s ease,
        box-shadow .15s ease;
}

.nav a:hover{
    background:rgba(255,255,255,.10);
    color:#fff;
}

.nav a.active{
    background:rgba(255,255,255,.14);
    color:#fff;
    box-shadow:
        inset 3px 0 0 var(--pbdc-orange);
}

.nav-divider{
    border-color:rgba(255,255,255,.15)!important;
}

.sidebar-foot .muted{
    color:rgba(255,255,255,.62);
}

.topbar{
    border-bottom-color:#e2e5f3;
    box-shadow:0 3px 14px rgba(43,60,148,.03);
}

.eyebrow{
    color:#727895;
}

.global-search-input-wrap,
.field input,
.field select,
.branch-switch select,
.permission-search input{
    border-color:#d4d9ea;
}

.field input:focus,
.field select:focus,
.branch-switch select:focus,
.permission-search input:focus,
.global-search input:focus{
    border-color:var(--pbdc-orange)!important;
    box-shadow:
        0 0 0 3px rgba(255,145,77,.18)!important;
}

.button.primary{
    background:var(--pbdc-blue);
    color:#fff;
}

.button.primary:hover{
    background:var(--pbdc-blue-deep);
}

.button.secondary:hover{
    border-color:#c8cfe7;
    background:#fafbff;
}

.text-action,
.password-toggle{
    color:var(--pbdc-blue);
}

.badge.neutral{
    background:#f0f1f7;
    color:#666d8b;
}

.badge.warning{
    background:#fff6cf;
    color:#7b5c00;
}

/* Authentication */

.auth-body{
    background:
        radial-gradient(
            circle at 12% 18%,
            rgba(219,34,42,.07),
            transparent 30%
        ),
        radial-gradient(
            circle at 87% 13%,
            rgba(255,145,77,.10),
            transparent 28%
        ),
        radial-gradient(
            circle at 80% 90%,
            rgba(43,60,148,.09),
            transparent 34%
        ),
        #f7f8fc;
}

.auth-card{
    position:relative;
    overflow:hidden;
    border-color:#dfe3f2;
    box-shadow:
        0 24px 70px rgba(34,45,112,.13);
}

.auth-card::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:5px;
    background:
        linear-gradient(
            90deg,
            var(--pbdc-red) 0 38%,
            var(--pbdc-orange) 38% 63%,
            var(--pbdc-yellow) 63% 78%,
            var(--pbdc-blue) 78% 100%
        );
}

.pbdc-auth-brand{
    align-items:center;
}

.auth-logo-shell{
    width:62px;
    height:62px;
    border:1px solid #edf0f8;
    box-shadow:0 8px 20px rgba(43,60,148,.10);
}

.auth-brand strong,
.dpos-auth-brand strong{
    color:var(--pbdc-blue);
}

.auth-copy h1{
    color:#20243c;
}

/* DPos */

.dpos-body{
    background:#f7f8fc;
}

.dpos-topbar{
    min-height:72px;
    border-bottom:
        3px solid var(--pbdc-orange);
    box-shadow:
        0 4px 18px rgba(43,60,148,.05);
}

.dpos-logo-shell{
    width:42px;
    height:42px;
    border:1px solid #edf0f8;
    box-shadow:0 4px 14px rgba(43,60,148,.09);
}

.dpos-brand strong{
    color:var(--pbdc-blue);
    font-size:14px;
}

.dpos-brand span{
    color:#737995;
}

.dpos-branch-context{
    border-left-color:#e1e5f2;
}

.dpos-branch-context span{
    color:#7b8099;
}

.dpos-branch-context strong{
    color:#313756;
}

.dpos-branch-switch select{
    border-color:#d8ddeb;
    color:#303755;
}

.pos-terminal-choice{
    border-color:#d9deed;
    color:#353b60;
}

.pos-terminal-choice.selected{
    border-color:var(--pbdc-orange);
    background:var(--pbdc-orange-soft);
    color:#8c471b;
}

.pos-primary-action{
    background:var(--pbdc-blue);
}

.pos-primary-action:hover{
    background:var(--pbdc-blue-deep);
}

.pos-account-link,
.pos-treatment-session,
.pos-shift-action summary{
    color:var(--pbdc-blue);
}

.pos-treatment-count{
    background:var(--pbdc-blue-soft);
    color:#596294;
}

.dpos-auth-body{
    background:
        radial-gradient(
            circle at top right,
            rgba(255,145,77,.11),
            transparent 34%
        ),
        radial-gradient(
            circle at bottom left,
            rgba(43,60,148,.09),
            transparent 38%
        ),
        #f7f8fc;
}

.dpos-auth-note{
    border-top-color:#e3e6f2;
}

.dpos-auth-note strong{
    color:var(--pbdc-blue);
}

/* Small visual accents — never used as clinical status meaning */

.page-head .eyebrow,
.panel-head .eyebrow{
    color:#737995;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible{
    outline:3px solid rgba(255,145,77,.30);
    outline-offset:2px;
}

/* Responsive logo balance */

@media(max-width:820px){
    .pbdc-logo-shell{
        width:42px;
        height:42px;
    }
}

@media(max-width:620px){
    .auth-logo-shell{
        width:56px;
        height:56px;
    }
}
