/* =================================
   DATA CARDS
================================= */

.data-card{
transition:all .2s ease;
height:100%;
display:flex;
flex-direction:column;
cursor:pointer;
}

.data-card:hover{
transform:translateY(-3px);
box-shadow:0 8px 20px rgba(0,0,0,0.08);
border-color:#3b82f6;
}




/* =================================
   INFO COMPONENT
================================= */

.info-box{
display:flex;
gap:12px;
padding:14px 16px;
border-radius:10px;
font-size:14px;
line-height:1.5;
}

/* variants */

.info-primary{
background:#eff6ff;
border:1px solid #bfdbfe;
color:#1e3a8a;
}

.info-neutral{
background:#f8fafc;
border:1px solid #e5e7eb;
color:#334155;
}

.info-warning{
background:#fffbeb;
border:1px solid #fde68a;
color:#92400e;
}

/* icon */

.info-icon{
font-size:18px;
line-height:1;
margin-top:2px;
flex-shrink:0;
}



/* =================================
   TABLES
================================= */

.nimh-table{
border-collapse:separate;
border-spacing:0;
width:100%;
border-radius:12px;
overflow:hidden;
border:1px solid #e5e7eb;
}

.nimh-table thead th{
background:#f4f4f5;
font-weight:600;
text-align:left;
position:sticky;
top:0;
z-index:10;
}

.nimh-table th,
.nimh-table td{
padding:9px 12px;
border-right:1px solid #e5e7eb;
border-bottom:1px solid #e5e7eb;
font-size:14px;
text-align:left;
}

.nimh-table th:last-child,
.nimh-table td:last-child{
border-right:none;
}

.nimh-table tr:last-child td{
border-bottom:none;
}


.tooltip-wrap{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.tooltip-bubble{
    position:absolute;
    right:0;
    top:calc(100% + 8px);
    width:260px;
    background:#1e293b;
    color:#fff;
    font-size:12px;
    line-height:1.45;
    padding:10px 12px;
    border-radius:10px;
    box-shadow:0 10px 24px rgba(0,0,0,.18);
    opacity:0;
    visibility:hidden;
    transform:translateY(-4px);
    transition:all .18s ease;
    z-index:30;
}
.tooltip-wrap:hover .tooltip-bubble,
.tooltip-wrap:focus-within .tooltip-bubble{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}
.tooltip-icon{
    width:18px;
    height:18px;
    border-radius:9999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:700;
    background:#e2e8f0;
    color:#334155;
    cursor:help;
}




/* =================================
   TABLE SCROLL
================================= */

.table-scroll{
max-height:600px;
overflow-y:auto;
position:relative;
}



/* =================================
   DATEPICKER (FLATPICKR)
================================= */

.flatpickr-calendar{
border-radius:12px;
border:1px solid #e5e7eb;
box-shadow:0 12px 28px rgba(0,0,0,0.12);
}

.flatpickr-months{
background:#f4f4f5;
border-bottom:1px solid #e5e7eb;
}

.flatpickr-current-month{
color:#111827;
font-weight:600;
font-size:14px;
}

.flatpickr-prev-month,
.flatpickr-next-month{
color:#6b7280 !important;
}

.flatpickr-prev-month:hover,
.flatpickr-next-month:hover{
color:#111827 !important;
}

.flatpickr-weekdays{
background:#fafafa;
}

.flatpickr-weekday{
color:#6b7280;
font-weight:500;
}

.flatpickr-day{
border-radius:8px;
}

.flatpickr-day:hover{
background:#f4f4f5;
}

.flatpickr-day.selected{
background:hsl(212 100% 46%);
border-color:hsl(212 100% 46%);
color:white;
}



/* =================================
   SRI LEGEND
================================= */

.legend-bar{
display:grid;
grid-template-columns:repeat(7,1fr);
height:28px;
border-radius:6px;
overflow:hidden;
}

.legend-bar div:nth-child(1){background:#e11;}
.legend-bar div:nth-child(2){background:#ff5a00;}
.legend-bar div:nth-child(3){background:#ffee00;}
.legend-bar div:nth-child(4){background:#24c000;}
.legend-bar div:nth-child(5){background:#a7b9d9;}
.legend-bar div:nth-child(6){background:#6ea1d9;}
.legend-bar div:nth-child(7){background:#1b6fe3;}

.legend-labels{
display:grid;
grid-template-columns:repeat(7,1fr);
font-size:13px;
margin-top:6px;
text-align:center;
}