/* =========================================================
   DEWPOINT STAFF DASHBOARD V3
   ========================================================= */

.staff-dashboard-v2{
    display:flex;
    flex-direction:column;
    gap:18px;
}


/* ---------------------------------------------------------
   WELCOME / COMMAND CENTER
   --------------------------------------------------------- */

.staff-v3-welcome{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px;

    padding:24px 26px;

    border-radius:18px;

    background:
        linear-gradient(
            115deg,
            var(--dp-sidebar),
            var(--dp-accent)
        );

    box-shadow:
        0 14px 34px
        color-mix(
            in srgb,
            var(--dp-accent) 14%,
            transparent
        );

    color:#fff;
}

.staff-v3-welcome > div:first-child{
    min-width:0;
}

.staff-v3-welcome small{
    display:block;
    font-size:11px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:rgba(255,255,255,.72);
}

.staff-v3-welcome h2{
    margin:5px 0 4px;
    font-size:29px;
    line-height:1.1;
    color:#fff;
}

.staff-v3-welcome p{
    margin:0;
    font-size:14px;
    color:rgba(255,255,255,.80);
}

.staff-v3-date{
    flex:0 0 auto;

    display:flex;
    flex-direction:column;
    align-items:flex-end;

    padding:11px 14px;

    border:
        1px solid
        rgba(255,255,255,.18);

    border-radius:12px;

    background:
        rgba(255,255,255,.10);

    backdrop-filter:blur(8px);
}

.staff-v3-date b{
    font-size:13px;
    color:#fff;
}

.staff-v3-date small{
    margin-top:2px;
    color:rgba(255,255,255,.68);
}


/* ---------------------------------------------------------
   KPI CARDS
   --------------------------------------------------------- */

.staff-v3-kpis{
    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:12px;
}

.staff-v3-kpi{
    position:relative;

    display:flex;
    align-items:center;
    gap:13px;

    min-height:104px;

    padding:16px;

    border:
        1px solid
        #e1e8ee;

    border-radius:15px;

    background:#fff;

    box-shadow:
        0 6px 20px
        rgba(15,23,42,.045);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.staff-v3-kpi:hover{
    transform:translateY(-2px);

    border-color:
        var(--dp-theme-border);

    box-shadow:
        0 10px 25px
        color-mix(
            in srgb,
            var(--dp-accent) 8%,
            transparent
        );
}

.staff-v3-kpi > i{
    flex:0 0 auto;

    display:grid;
    place-items:center;

    width:42px;
    height:42px;

    border-radius:12px;

    font-style:normal;
    font-weight:900;
    font-size:18px;

    color:
        var(--dp-accent-text);

    background:
        var(--dp-theme-soft);
}

.staff-v3-kpi > div{
    min-width:0;
}

.staff-v3-kpi strong{
    display:block;

    margin-bottom:3px;

    font-size:21px;
    line-height:1;

    color:#172033;
}

.staff-v3-kpi b{
    display:block;

    font-size:12px;
    line-height:1.2;

    color:#334155;
}

.staff-v3-kpi small{
    display:block;

    margin-top:4px;

    font-size:10px;
    line-height:1.25;

    color:#8491a3;
}

.staff-v3-kpi.attention{
    border-color:
        color-mix(
            in srgb,
            var(--dp-accent) 24%,
            #e1e8ee
        );

    background:
        linear-gradient(
            145deg,
            #fff,
            var(--dp-theme-faint)
        );
}


/* ---------------------------------------------------------
   LIVE COURTS PANEL
   --------------------------------------------------------- */

.staff-v3-live-panel{
    border:
        1px solid
        #e1e8ee;

    border-radius:17px;

    background:#fff;

    box-shadow:
        0 8px 26px
        rgba(15,23,42,.05);
}

.staff-v3-live-panel .staff-live-heading{
    padding:18px 20px 14px;
}

.staff-v3-live-panel .staff-live-heading h2{
    font-size:18px;
}

.staff-v3-live-panel .staff-live-heading h2 span{
    color:
        var(--dp-accent-text) !important;
}

.staff-v3-live-panel
.staff-status-summary
article.available > i{
    color:
        var(--dp-accent-text) !important;

    background:
        var(--dp-theme-soft) !important;
}


/* ---------------------------------------------------------
   PAYMENT QUEUE + UPCOMING BOOKINGS
   --------------------------------------------------------- */

.staff-quick-ops{
    display:grid;

    grid-template-columns:
        minmax(0,1.35fr)
        minmax(300px,.65fr);

    gap:16px;
}

.staff-confirmation-card,
.staff-next-reservations-card{
    border:
        1px solid
        #e1e8ee;

    border-radius:17px;

    box-shadow:
        0 8px 24px
        rgba(15,23,42,.045);
}

.staff-quick-over{
    display:block;

    margin-bottom:5px;

    font-size:11px;
    letter-spacing:.10em;

    color:
        var(--dp-accent-text);
}

.staff-confirmation-card > p,
.staff-next-reservations-card > p{
    margin-top:0;
    color:#64748b;
}


/* ---------------------------------------------------------
   PAYMENT CONFIRMATION ITEMS
   --------------------------------------------------------- */

.staff-confirmation-item{
    border:
        1px solid
        #e6ebef;

    border-radius:13px;

    background:#fff;

    transition:
        border-color .18s ease,
        box-shadow .18s ease;
}

.staff-confirmation-item:hover{
    border-color:
        var(--dp-theme-border);

    box-shadow:
        0 5px 18px
        color-mix(
            in srgb,
            var(--dp-accent) 6%,
            transparent
        );
}

.staff-confirmation-actions .confirm{
    color:#fff !important;

    background:
        linear-gradient(
            90deg,
            var(--dp-accent),
            var(--dp-accent-2)
        ) !important;

    border-color:
        var(--dp-accent) !important;
}


/* ---------------------------------------------------------
   TODAY TIMELINE
   --------------------------------------------------------- */

.staff-v3-timeline{
    padding:0;
    overflow:hidden;

    border:
        1px solid
        #e1e8ee;

    border-radius:17px;

    box-shadow:
        0 8px 24px
        rgba(15,23,42,.045);
}

.staff-v3-section-head{
    display:flex;
    justify-content:space-between;
    align-items:center;

    gap:15px;

    padding:18px 20px;

    border-bottom:
        1px solid
        #edf1f4;
}

.staff-v3-section-head b{
    display:block;

    font-size:13px;
    letter-spacing:.08em;

    color:
        var(--dp-accent-text);
}

.staff-v3-section-head p{
    margin:4px 0 0;

    font-size:12px;

    color:#7b8796;
}

.staff-v3-section-head > button{
    flex:0 0 auto;

    padding:9px 13px;

    border:
        1px solid
        var(--dp-theme-border);

    border-radius:9px;

    background:
        var(--dp-theme-faint);

    color:
        var(--dp-accent-text);

    font-weight:800;
    font-size:11px;

    cursor:pointer;
}

.staff-v3-timeline-list{
    padding:4px 20px 12px;
}

.staff-v3-timeline-list article{
    position:relative;

    display:grid;

    grid-template-columns:
        92px
        16px
        minmax(0,1fr)
        auto;

    gap:10px;

    align-items:center;

    min-height:75px;

    border-bottom:
        1px solid
        #edf1f4;
}

.staff-v3-timeline-list article:last-child{
    border-bottom:0;
}

.staff-v3-timeline-list time{
    display:flex;
    flex-direction:column;
}

.staff-v3-timeline-list time b{
    font-size:13px;
    color:#172033;
}

.staff-v3-timeline-list time small{
    font-size:10px;
    color:#8a96a5;
}

.staff-v3-line-dot{
    width:9px;
    height:9px;

    border-radius:50%;

    background:
        var(--dp-accent);

    box-shadow:
        0 0 0 4px
        var(--dp-theme-soft);
}

.staff-v3-timeline-list article.pending
.staff-v3-line-dot{
    background:#f59e0b;

    box-shadow:
        0 0 0 4px
        #fef3c7;
}

.staff-v3-timeline-list article > div{
    min-width:0;
}

.staff-v3-timeline-list article > div strong{
    display:block;

    font-size:13px;

    color:#1f2937;
}

.staff-v3-timeline-list article > div span{
    display:block;

    margin-top:2px;

    font-size:12px;

    color:#4b5563;
}

.staff-v3-timeline-list article > div small{
    display:block;

    margin-top:3px;

    font-size:10px;

    color:#94a3b8;
}

.staff-v3-timeline-list article > em{
    font-style:normal;
    font-size:9px;
    font-weight:900;
    letter-spacing:.05em;

    padding:6px 8px;

    border-radius:999px;

    color:
        var(--dp-accent-text);

    background:
        var(--dp-theme-soft);
}

.staff-v3-timeline-list article.pending > em{
    color:#b45309;
    background:#fef3c7;
}


/* ---------------------------------------------------------
   QUICK OPERATIONS
   --------------------------------------------------------- */

.staff-v3-actions{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    gap:12px;
}

.staff-v3-actions > button{
    display:flex;
    align-items:center;

    gap:12px;

    min-height:82px;

    padding:14px 15px;

    text-align:left;

    border:
        1px solid
        #e1e8ee;

    border-radius:14px;

    background:#fff;

    cursor:pointer;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.staff-v3-actions > button:hover{
    transform:translateY(-2px);

    border-color:
        var(--dp-theme-border);

    box-shadow:
        0 8px 20px
        color-mix(
            in srgb,
            var(--dp-accent) 7%,
            transparent
        );
}

.staff-v3-actions > button > i{
    flex:0 0 auto;

    display:grid;
    place-items:center;

    width:40px;
    height:40px;

    border-radius:11px;

    font-style:normal;
    font-weight:900;

    color:
        var(--dp-accent-text);

    background:
        var(--dp-theme-soft);
}

.staff-v3-actions > button > span{
    flex:1;
    min-width:0;
}

.staff-v3-actions > button > span b{
    display:block;

    font-size:12px;

    color:#273244;
}

.staff-v3-actions > button > span small{
    display:block;

    margin-top:3px;

    font-size:10px;
    line-height:1.25;

    color:#8a96a5;
}

.staff-v3-actions > button > strong{
    color:
        var(--dp-accent-text);
}


/* ---------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------- */

@media (max-width:1200px){

    .staff-v3-kpis{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .staff-v3-actions{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}

@media (max-width:900px){

    .staff-v3-welcome{
        align-items:flex-start;
        flex-direction:column;
    }

    .staff-v3-date{
        align-items:flex-start;
    }

    .staff-quick-ops{
        grid-template-columns:1fr;
    }

}

@media (max-width:700px){

    .staff-v3-welcome{
        padding:20px;
    }

    .staff-v3-welcome h2{
        font-size:24px;
    }

    .staff-v3-kpis{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .staff-v3-timeline-list article{
        grid-template-columns:
            76px
            12px
            minmax(0,1fr);
    }

    .staff-v3-timeline-list article > em{
        grid-column:3;
        justify-self:start;
        margin-bottom:10px;
    }

}

@media (max-width:480px){

    .staff-v3-kpis{
        grid-template-columns:1fr;
    }

    .staff-v3-actions{
        grid-template-columns:1fr;
    }

    .staff-v3-section-head{
        align-items:flex-start;
        flex-direction:column;
    }

}


/* ---------------------------------------------------------
   PRINT / DAILY REPORT
   --------------------------------------------------------- */

@media print{

    .rail,
    .content > header,
    .developer-mode-bar,
    .staff-v3-actions,
    .staff-v3-section-head button,
    .staff-confirmation-actions{
        display:none !important;
    }

    .content{
        padding:0 !important;
    }

    .staff-dashboard-v2{
        gap:10px;
    }

    .staff-v3-welcome{
        color:#000 !important;
        background:#fff !important;
        border:1px solid #bbb !important;
        box-shadow:none !important;
    }

    .staff-v3-welcome h2,
    .staff-v3-welcome p,
    .staff-v3-welcome small,
    .staff-v3-date b,
    .staff-v3-date small{
        color:#000 !important;
    }

    .staff-v3-kpi,
    .staff-v3-live-panel,
    .staff-confirmation-card,
    .staff-next-reservations-card,
    .staff-v3-timeline{
        box-shadow:none !important;
    }

}



/* Court-status rules migrated to scoped Owner/Staff modules by KradPC 2B-13H-R4. */