/* =====================================================
   KD HMS ADMIN DASHBOARD
===================================================== */

/* =========================
   GLOBAL ALIGNMENT
========================= */
.hms-container > * {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

/* =========================
   TITLE
========================= */
.hms-title {
    font-size: 28px;
    font-weight: 600;
}

.hms-sub {
    color: var(--hms-text-light);
    margin-bottom: 25px;
}

.hms-title,
.hms-sub,
.hms-container h3 {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

/* =========================
   PRO UPGRADE BOX
========================= */
.hms-dashboard-top{
display:grid;
grid-template-columns:1.2fr 1fr;
gap:30px;
background:#f8fafc;
padding:25px;
border-radius:10px;
margin-bottom:25px;
align-items:start;
border-left:4px solid #1e73be;
}

/* style the right column title */
.hms-dashboard-top div:nth-child(2) p{
margin-top:10px;
font-weight:600;
}

/* prevent child divs from stretching */
.hms-dashboard-top > div{
width:auto;
}

/* responsive */
@media (max-width:768px){
.hms-dashboard-top{
grid-template-columns:1fr;
}
}

.hms-dashboard-top ul{
padding-left:18px;
margin-top:10px;
}

.hms-dashboard-top li{
margin-bottom:6px;
}

.hms-dashboard-top div:nth-child(2) p{
margin-top:0;
font-weight:600;
}

.hms-dashboard-top .hms-btn{
margin-top:10px;
}

/* =========================
   STAT CARDS
========================= */
.hms-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;

    max-width: 900px;
    margin: 0 auto 30px;
}

.hms-card {
    text-align: center;
    padding: 25px;
    transition: all 0.2s ease;
}

.hms-card:hover {
    transform: translateY(-3px);
}

.stat-number {
    font-size: 28px;
    font-weight: 700;
    color: var(--hms-primary);
}

.stat-label {
    font-size: 14px;
    color: var(--hms-text-light);
    margin-top: 5px;
}

.hms-card.warning {
    border-left: 4px solid #f59e0b;
}

/* =========================
   QUICK ACTIONS
========================= */
.hms-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 30px;
    justify-content: center;
}

.hms-actions .hms-btn {
    background: #fff;
    border: 1px solid var(--hms-border);
}

.hms-actions .hms-btn:hover {
    background: var(--hms-primary);
    color: #fff;
}

/* =========================
   TABLE
========================= */
.table-wrapper {
    max-width: 900px;
    margin: 0 auto 30px;

    background: #fff;
    border-radius: var(--hms-radius);
    box-shadow: var(--hms-shadow);
    overflow-x: auto;
}

/* =========================
   STATUS BADGES
========================= */
.status {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

.status.pending {
    background: #fff4e5;
    color: #b26a00;
}

.status.approved {
    background: #e6f9f0;
    color: #1a7f4b;
}

.status.completed {
    background: #e6f0ff;
    color: #1f5ed6;
}

.status.cancelled {
    background: #ffe5e5;
    color: #b20000;
}

/* =========================
   SYSTEM STATUS
========================= */
.hms-stats{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px;
}

@media (max-width:900px){
.hms-stats{
grid-template-columns:repeat(2,1fr);
}
}

@media (max-width:500px){
.hms-stats{
grid-template-columns:1fr;
}
}



.hms-stat-card{
display:flex;
align-items:center;
gap:14px;
padding:22px;
border-radius:14px;
background:#ffffff;
box-shadow:0 12px 35px rgba(0,0,0,0.06);
transition:.25s;
}

.hms-stat-card:hover{
transform:translateY(-5px);
box-shadow:0 20px 50px rgba(0,0,0,0.08);
}

.hms-stat-icon{
width:44px;
height:44px;
display:flex;
align-items:center;
justify-content:center;
border-radius:10px;
font-size:22px;
background:#f1f5f9;
}

.hms-stat-right h3{
margin:0;
font-size:26px;
font-weight:700;
}

.hms-stat-right p{
margin:3px 0 0;
font-size:13px;
color:#64748b;
}

/* STAT COLORS */

.stat-blue{border-left:4px solid #2563eb;}
.stat-orange{border-left:4px solid #f59e0b;}
.stat-green{border-left:4px solid #16a34a;}
.stat-purple{border-left:4px solid #9333ea;}


/* =========================
   SPACING
========================= */
.hms-container h3 {
    margin-bottom: 15px;
    margin-top: 10px;
}

/* =========================
   WARNING TEXT
========================= */
.hms-warning-text {
    font-size: 13px;
    color: #b91c1c;
    margin-top: 8px;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 768px) {

    .hms-dashboard-top {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .hms-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .hms-actions {
        flex-direction: column;
    }
}

/* =========================
   PAGE BACKGROUND (SAFE)
========================= */
body.hms-active {
    background: #f5f7fb;
}

/* =====================================================
   REMOVE HEADER GAP (AFTER HIDING TITLE)
===================================================== */

/* Remove title container space */
body.hms-active .entry-header {
    display: none;
    margin: 0 !important;
    padding: 0 !important;
}

/* Remove extra spacing from content */
body.hms-active .site-main {
    padding-top: 0 !important;
}

body.hms-active .content-area {
    margin-top: 0 !important;
}

body.hms-active .entry-content {
    margin-top: 0 !important;
}