/* Version 4.4 mobile-first dashboard */
.dashboard-quick-tools{
    display:none;
}

.dashboard-intro{
    margin:0;
    color:var(--muted);
}

.dashboard-stat-icon{
    position:relative;
    display:block;
    width:25px;
    height:25px;
    margin-bottom:7px;
    color:#64748b;
}

.stat-icon-cases::before{
    content:'';
    position:absolute;
    left:3px;
    top:7px;
    width:19px;
    height:14px;
    border-radius:3px;
    background:currentColor;
}
.stat-icon-cases::after{
    content:'';
    position:absolute;
    left:8px;
    top:3px;
    width:9px;
    height:6px;
    border-radius:2px 2px 0 0;
    background:currentColor;
}

.stat-icon-user::before{
    content:'';
    position:absolute;
    left:8px;
    top:2px;
    width:10px;
    height:10px;
    border-radius:50%;
    background:currentColor;
}
.stat-icon-user::after{
    content:'';
    position:absolute;
    left:4px;
    bottom:1px;
    width:18px;
    height:10px;
    border-radius:10px 10px 4px 4px;
    background:currentColor;
}

.stat-icon-clock{
    border:3px solid currentColor;
    border-radius:50%;
}
.stat-icon-clock::before{
    content:'';
    position:absolute;
    left:10px;
    top:4px;
    width:3px;
    height:8px;
    border-radius:2px;
    background:currentColor;
}
.stat-icon-clock::after{
    content:'';
    position:absolute;
    left:10px;
    top:10px;
    width:7px;
    height:3px;
    border-radius:2px;
    background:currentColor;
    transform:rotate(25deg);
    transform-origin:left center;
}

.stat-icon-minus::before{
    content:'−';
    position:absolute;
    inset:1px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#aab2bd;
    color:#fff;
    font-size:20px;
    font-weight:700;
}

.stat-icon-alert::before{
    content:'!';
    position:absolute;
    inset:1px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#d71920;
    color:#fff;
    font-weight:900;
}

.stat-icon-vote::before{
    content:'✓';
    position:absolute;
    inset:1px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:3px solid currentColor;
    border-radius:5px;
    font-size:15px;
    font-weight:900;
}

.stat-icon-archive::before{
    content:'';
    position:absolute;
    left:3px;
    top:7px;
    width:20px;
    height:15px;
    border-radius:2px;
    background:currentColor;
}
.stat-icon-archive::after{
    content:'';
    position:absolute;
    left:1px;
    top:3px;
    width:24px;
    height:6px;
    border-radius:2px;
    background:currentColor;
}

.case-summary-badges{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.case-summary-time{
    color:var(--muted);
    font-size:.9rem;
    white-space:nowrap;
}

@media(max-width:700px){
    body{
        background:#f1f5fa;
    }

    header{
        padding:22px 0 74px !important;
        border-radius:0 0 28px 28px;
        background:linear-gradient(135deg,#0a2947 0%,#0c2038 100%);
    }

    header .wrap{
        padding-left:18px !important;
        padding-right:18px !important;
    }

    .site-brand strong{
        font-size:1.58rem !important;
        line-height:1.1;
    }

    .site-brand span{
        margin-top:5px;
        font-size:.94rem !important;
    }

    .nav-toggle{
        position:relative;
        display:flex !important;
        align-items:center;
        gap:11px;
        min-width:96px !important;
        padding:7px 38px 7px 6px !important;
        border:0 !important;
        background:transparent !important;
        font-size:1.02rem;
    }

    .nav-toggle::before,
    .nav-toggle::after{
        content:'';
        position:absolute;
        right:4px;
        width:28px;
        height:3px;
        border-radius:3px;
        background:#fff;
        box-shadow:0 8px 0 #fff;
    }
    .nav-toggle::before{ top:10px; }
    .nav-toggle::after{ top:26px; box-shadow:none; }

    main{
        padding-top:0 !important;
    }

    main > .wrap{
        padding:0 18px !important;
    }

    .dashboard-quick-tools{
        position:relative;
        z-index:20;
        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        gap:10px;
        align-items:center;
        margin:-47px 0 46px;
        padding:13px;
        border:1px solid rgba(255,255,255,.8);
        border-radius:18px;
        background:rgba(255,255,255,.96);
        box-shadow:0 12px 28px rgba(15,23,42,.14);
        backdrop-filter:blur(12px);
    }

    .dashboard-quick-search{
        position:relative;
        min-width:0;
    }

    .dashboard-quick-search input{
        height:54px;
        padding:0 14px 0 49px !important;
        border:1px solid #cfd7e2;
        border-radius:12px;
        background:#fff;
        font-size:1rem !important;
    }

    .dashboard-search-icon{
        position:absolute;
        left:17px;
        top:16px;
        z-index:1;
        width:19px;
        height:19px;
        border:2px solid #44556b;
        border-radius:50%;
    }
    .dashboard-search-icon::after{
        content:'';
        position:absolute;
        right:-6px;
        bottom:-4px;
        width:8px;
        height:2px;
        border-radius:2px;
        background:#44556b;
        transform:rotate(45deg);
    }

    .dashboard-create-ticket{
        display:flex;
        align-items:center;
        justify-content:center;
        height:54px;
        padding:0 9px 0 18px;
        border-radius:13px;
        background:linear-gradient(180deg,#1175ff 0%,#0b5fd9 100%);
        color:#fff;
        text-decoration:none;
        font-size:.95rem;
        font-weight:800;
        white-space:nowrap;
        box-shadow:0 9px 20px rgba(10,94,215,.28);
    }

    .dashboard-create-plus{
        display:flex;
        align-items:center;
        justify-content:center;
        align-self:stretch;
        margin-left:11px;
        padding-left:11px;
        border-left:1px solid rgba(0,0,0,.18);
        font-size:1.45rem;
        font-weight:400;
    }

    .dashboard-heading{
        display:block !important;
        margin-bottom:25px !important;
    }

    .dashboard-heading h1{
        margin-bottom:13px;
        font-size:2rem;
        letter-spacing:-.025em;
    }

    .dashboard-intro{
        max-width:530px;
        color:#334155;
        font-size:1rem;
        line-height:1.55;
    }

    .dashboard-desktop-actions{
        display:none !important;
    }

    .dashboard-stat-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:14px !important;
        margin-bottom:42px !important;
    }

    .dashboard-stat{
        min-height:154px !important;
        justify-content:flex-start;
        padding:20px 18px !important;
        border:1px solid #e1e6ed !important;
        border-radius:17px !important;
        box-shadow:0 8px 19px rgba(15,23,42,.055) !important;
    }

    .dashboard-stat-alert{
        border-color:#ef8c85 !important;
        background:#fff8f7 !important;
    }

    .dashboard-stat-alert .dashboard-stat-icon,
    .dashboard-stat-alert .dashboard-stat-value,
    .dashboard-stat-alert .dashboard-stat-label{
        color:#c81017;
    }

    .dashboard-stat-value{
        margin-top:auto;
        font-size:2.12rem !important;
        line-height:1;
    }

    .dashboard-stat-label{
        color:#26384e;
        font-size:1rem;
        font-weight:500;
        line-height:1.25;
    }

    .dashboard-stat-icon{
        margin-bottom:15px;
    }

    .dashboard-stat-grid + .card{
        padding:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
    }

    .section-heading{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) auto;
        gap:14px;
        align-items:end !important;
        margin-bottom:21px !important;
    }

    .section-heading h2{
        margin-bottom:8px;
        font-size:1.85rem;
    }

    .section-heading .small{
        color:#334155;
        font-size:.98rem;
        line-height:1.45;
    }

    .dashboard-view-all{
        width:auto !important;
        min-width:174px;
        min-height:52px;
        padding:10px 16px !important;
        border-radius:12px !important;
        background:#515866 !important;
        font-size:.92rem;
    }

    .case-card-list{
        gap:17px !important;
    }

    .case-summary-card{
        display:block !important;
        padding:21px !important;
        border:0 !important;
        border-radius:17px !important;
        background:#fff !important;
        box-shadow:0 8px 20px rgba(15,23,42,.06) !important;
    }

    .case-summary-number{
        margin-bottom:9px;
        color:#07549c;
        font-size:.96rem;
        letter-spacing:.015em;
    }

    .case-summary-card h3{
        margin:0 0 9px !important;
        font-size:1.55rem !important;
        line-height:1.18;
        letter-spacing:-.018em;
    }

    .case-summary-meta{
        display:flex !important;
        flex-direction:column;
        gap:3px !important;
        color:#2f4054 !important;
        font-size:1rem !important;
        line-height:1.35;
    }

    .case-summary-meta span::after{
        display:none !important;
    }

    .case-summary-state{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) auto;
        gap:12px;
        align-items:end;
        margin-top:15px;
    }

    .case-summary-badges{
        align-items:center;
    }

    .case-summary-state .badge{
        padding:7px 12px;
        border-radius:999px;
        font-size:.86rem;
        font-weight:500;
    }

    .status-badge{
        background:#e9edf2;
        color:#182433;
    }

    .priority-normal{
        background:#e7f3ff;
        color:#0062ad;
    }

    .case-summary-time{
        align-self:end;
        color:#42536a;
        font-size:.9rem;
    }
}

@media(max-width:430px){
    .dashboard-quick-tools{
        grid-template-columns:minmax(0,1fr) 147px;
        padding:10px;
    }

    .dashboard-create-ticket{
        padding-left:12px;
        font-size:.88rem;
    }

    .dashboard-create-plus{
        margin-left:7px;
        padding-left:7px;
    }

    .section-heading{
        grid-template-columns:1fr;
        align-items:start !important;
    }

    .dashboard-view-all{
        width:100% !important;
        min-width:0;
    }
}


/* Version 5.5.2 — mobile dashboard search placement repair */
@media(max-width:700px){
    body{
        background:#f1f5fa;
    }

    /* The new compact portal header must not reserve the old hero space. */
    header.portal-header{
        padding:0 !important;
        border-radius:0 !important;
        background:#0d2a43 !important;
    }

    main{
        padding-top:16px !important;
    }

    main > .wrap{
        padding-left:18px !important;
        padding-right:18px !important;
    }

    .dashboard-quick-tools{
        position:relative;
        z-index:1;
        display:grid !important;
        grid-template-columns:minmax(0,1fr) auto;
        gap:10px;
        align-items:stretch;
        width:100%;
        margin:0 0 30px !important;
        padding:12px;
        border:1px solid #d8e0e9;
        border-radius:16px;
        background:#ffffff;
        box-shadow:0 9px 24px rgba(15,23,42,.09);
        backdrop-filter:none;
    }

    .dashboard-quick-search{
        display:block;
        min-width:0;
        margin:0;
    }

    .dashboard-quick-search input{
        width:100% !important;
        height:52px;
        margin:0 !important;
        padding:0 14px 0 47px !important;
        border:1px solid #c9d3df;
        border-radius:11px;
        background:#fff;
        box-shadow:none;
        font-size:16px !important;
    }

    .dashboard-search-icon{
        left:16px;
        top:16px;
    }

    .dashboard-create-ticket{
        width:auto !important;
        min-width:145px;
        height:52px;
        margin:0;
        padding:0 10px 0 16px;
        border-radius:11px;
    }

    .dashboard-heading{
        margin-top:0 !important;
        margin-bottom:25px !important;
    }
}

@media(max-width:480px){
    main{
        padding-top:14px !important;
    }

    .dashboard-quick-tools{
        grid-template-columns:1fr;
        gap:10px;
        margin-bottom:27px !important;
        padding:11px;
    }

    .dashboard-create-ticket{
        width:100% !important;
        min-width:0;
        justify-content:space-between;
        padding-left:17px;
    }

    .dashboard-create-plus{
        min-width:43px;
        margin-left:12px;
        padding-left:12px;
    }

    .dashboard-heading h1{
        font-size:clamp(2rem,10vw,2.65rem);
        line-height:1.08;
    }
}


/* Version 5.7.0 — latest response and per-Officer unread activity */
.case-summary-response{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:5px;
    margin-top:8px;
    color:#667085;
    font-size:.86rem;
    line-height:1.4;
}

.case-summary-response strong{
    color:#52606d;
    font-weight:750;
}

.case-summary-response-separator{
    color:#98a2b3;
}

.case-summary-no-response{
    color:#8a4b10;
    font-weight:700;
}

.case-summary-card-unread{
    position:relative;
    border-color:#74c891 !important;
    background:linear-gradient(
        90deg,
        #f2fff6 0,
        #ffffff 42%
    ) !important;
    box-shadow:
        0 0 0 2px rgba(31,157,85,.12),
        0 8px 22px rgba(31,157,85,.16) !important;
}

.case-summary-card-unread::before{
    content:'';
    position:absolute;
    top:14px;
    bottom:14px;
    left:0;
    width:4px;
    border-radius:0 4px 4px 0;
    background:#22a55b;
}

.case-summary-card-unread:hover,
.case-summary-card-unread:focus-visible{
    border-color:#44b875 !important;
    box-shadow:
        0 0 0 3px rgba(31,157,85,.15),
        0 11px 28px rgba(31,157,85,.2) !important;
}

.case-unread-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    align-self:flex-end;
    min-height:27px;
    padding:4px 9px;
    border:1px solid #9bd9af;
    border-radius:999px;
    background:#e7f8ed;
    color:#14753a;
    font-size:.76rem;
    font-weight:850;
    white-space:nowrap;
}

@media(max-width:700px){
    .case-summary-response{
        display:grid;
        grid-template-columns:auto minmax(0,1fr);
        gap:3px 6px;
        margin-top:10px;
        font-size:.82rem;
    }

    .case-summary-response time{
        grid-column:2;
    }

    .case-summary-response-separator{
        display:none;
    }

    .case-summary-no-response{
        grid-column:1 / -1;
    }

    .case-unread-badge{
        align-self:flex-start;
        margin-bottom:7px;
    }

    .case-summary-card-unread::before{
        top:12px;
        bottom:12px;
    }
}
