@import "tailwindcss";


body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow-x: hidden;


}


*,
*::before,
*::after {
    box-sizing: border-box;
}


input,
select {
    background-color: white;
}


input,
select,
button {
    width: 100%;
}


::-webkit-scrollbar {
    width: 6px;
}


::-webkit-scrollbar-thumb {
    border-radius: 10px;
}


button {
    cursor: pointer;
}


input::placeholder {
    color: rgb(76, 76, 76);
}






body {
background: linear-gradient(135deg, #f5f7ff, #f9fafb);
color: #1f2937;
font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}


/* Main containers */
.head-text,
.data-display-section,
.expense-section {
background: #ffffff;
border-radius: 18px;
box-shadow: 0 10px 30px rgba(31, 41, 55, 0.06);
border: 1px solid #eef2ff;
}


/* Head text slight accent */
.head-text {
background: linear-gradient(135deg, #eef2ff, #ffffff);
}


/* Summary cards with soft color tint */
.income-box {
background: linear-gradient(135deg, #ecfdf5, #ffffff);
border-left: 4px solid #10b981;
}


.expense-box {
background: linear-gradient(135deg, #fff1f2, #ffffff);
border-left: 4px solid #ef4444;
}


.total-balance-box {
background: linear-gradient(135deg, #eff6ff, #ffffff);
border-left: 4px solid #3b82f6;
}


/* Smooth hover effect */
.income-box,
.expense-box,
.total-balance-box {
transition: all 0.25s ease;
border-radius: 14px;
}


.income-box:hover,
.expense-box:hover,
.total-balance-box:hover {
transform: translateY(-3px);
box-shadow: 0 14px 35px rgba(0, 0, 0, 0.08);
}


/* Inputs */
input,
select {
border: 1px solid #e5e7eb !important;
border-radius: 12px !important;
background: #ffffff;
transition: all 0.2s ease;
}


input:focus,
select:focus {
border-color: #6366f1 !important;
box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12);
}


/* Button (subtle gradient, not loud) */
button {
border-radius: 12px;
transition: all 0.2s ease;
}




/* Expense list hover */
.expense-list div {
transition: background 0.2s ease;
}


.expense-list div:hover {
background: #f3f4f6;
}