body{font-family:'Cairo',sans-serif;background:#f0f4f8;}
.app-header{background:linear-gradient(135deg,#0d3b66,#1a6fc4);}
.app-sidebar{background:linear-gradient(180deg,#0d3b66,#1a6fc4);}
.brand-text{font-weight:900;color:#fff;}
.today-date{background:linear-gradient(135deg,#0d3b66,#1565c0);color:#fff;padding:6px 15px;border-radius:20px;font-weight:700;}
.card{border-radius:12px;box-shadow:0 2px 15px rgba(0,0,0,.08);border:none;}
.card-header.red{background:linear-gradient(135deg,#b71c1c,#c62828);color:white;}
.card-header.blue{background:linear-gradient(135deg,#0d3b66,#1565c0);color:white;}
.card-header.green{background:linear-gradient(135deg,#1b5e20,#2e7d32);color:white;}
.card-header.orange{background:linear-gradient(135deg,#e65100,#f57c00);color:white;}
.small-box{border-radius:12px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,.1);}
.progress{border-radius:20px;height:10px;}
.pond-east{border-top:4px solid #1976d2;}
.pond-west{border-top:4px solid #388e3c;}
.table th,.table td{font-family:'Cairo',sans-serif;vertical-align:middle;}
.table th{font-weight:700;font-size:.85rem;background:#f8fafc;color:#0d3b66;}
.badge{font-family:'Cairo',sans-serif;}
.btn{font-family:'Cairo',sans-serif;font-weight:600;border-radius:8px;}
.debt-item{border-bottom:1px solid #f8bbd0;padding:5px 0;display:flex;justify-content:space-between;}

/* Custom daily sales styles */
.form-control,.form-select{font-family:'Cairo',sans-serif;border-radius:8px;}
.shift-badge{padding:6px 16px;border-radius:20px;font-weight:700;font-size:.9rem;}
.summary-box{border-radius:12px;padding:15px;text-align:center;font-family:'Cairo';}

/* Custom pond styles */

.pond-visual{border-radius:16px;padding:25px;position:relative;overflow:hidden;}
.shaka-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:15px;}
.shaka-cell{height:35px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;color:white;cursor:pointer;transition:.2s;}
.shaka-cell:hover{transform:scale(1.1);}
.shaka-full{background:#1565c0;}
.shaka-partial{background:#f57c00;}
.shaka-empty{background:#e0e0e0;color:#757575;}
.shaka-salty{background:#c62828;}
.legend-item{display:flex;align-items:center;gap:8px;font-size:.8rem;}
.legend-dot{width:14px;height:14px;border-radius:4px;}
.progress{border-radius:20px;height:12px;}

/* Custom generator styles */

.gen-stat{border-radius:12px;padding:15px;text-align:center;}
.alert-maintenance{border-right:4px solid #f57c00;background:#fff8e1;}

/* Custom customers main styles */

.customer-card{border-radius:12px;border:none;box-shadow:0 2px 15px rgba(0,0,0,.08);transition:transform .2s;}
.customer-card:hover{transform:translateY(-3px);}
.avatar-circle{width:55px;height:55px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:900;color:white;}
.vehicle-tag{background:#e3f2fd;color:#1565c0;padding:3px 10px;border-radius:15px;font-size:.8rem;font-weight:600;display:inline-block;margin:2px;}

/*Custom customers small styles */ 

.cust-card{border-radius:12px;border:none;box-shadow:0 2px 15px rgba(0,0,0,.08);transition:transform .2s;border-top:3px solid #f57c00;}
.cust-card:hover{transform:translateY(-3px);}
.avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;font-weight:900;color:white;}

/*Custom customers walk styles */ 

.stat-box{border-radius:12px;padding:15px;text-align:center;}

/* Custom expenses styles */

.cat-box{border-radius:12px;padding:15px !important;text-align:center;cursor:pointer;transition:.2s; }
.cat-box.purple{background:linear-gradient(135deg,#f3e5f5,#e1bee7) !important;border-right:3px solid #6a1b9a !important;}
.cat-box:hover{transform:scale(1.03);}
.text-purple{color:#6a1b9a !important;}
.cat-box.red{background:linear-gradient(135deg,#fce4ec,#f8bbd0) !important;border-right:3px solid #c62828 !important;}
.cat-box.light-green{background:linear-gradient(135deg,#e8f5e9,#c8e6c9) !important;border-right:3px solid #2e7d32 !important;}
.cat-box.light-orange{background:linear-gradient(135deg,#fff3e0,#ffe0b2) !important;border-right:3px solid #e65100 !important;}
.cat-box.light-blue{background:linear-gradient(135deg,#e3f2fd,#bbdefb) !important;border-right:3px solid #1976d2 !important;}
.cat-box.light-gray{background:linear-gradient(135deg,#f8fafc,#e8ecf0) !important;border-right:3px solid #546e7a !important;}

/* Custom followup styles */

.debt-row-high{background:#fff5f5 !important;}
.debt-row-medium{background:#fffbf0 !important;}
.debt-row-ok{background:#f0fff4 !important;}
.summary-stat{border-radius:12px;padding:20px;text-align:center;}
/* Custom login styles */

.login{
  background: linear-gradient(135deg,#1565c0,#0d47a1);
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

.login-card{
  width:100%;
  max-width:420px;
  border:none;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 40px rgba(0,0,0,.3);
}

.login-header{
  background:linear-gradient(135deg,#1976d2,#0d47a1);
  color:#fff;
  text-align:center;
  padding:25px;
}
/* Custom reports-customer styles */

.customer-stat {
    border-radius: 12px;
    padding: 15px;
    text-align: center;
}

.stat-primary {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border-right: 4px solid #1976d2;
}

.stat-success {
    background: linear-gradient(135deg, #e8f5e9, #c8e6c9);
    border-right: 4px solid #2e7d32;
}

.stat-warning {
    background: linear-gradient(135deg, #fff8e1, #ffecb3) !important;
    border-right: 4px solid #f9a825 !important;
}

.stat-danger {
    background: linear-gradient(135deg, #fce4ec, #f8bbd0);
    border-right: 4px solid #c62828;
}

.ranking-card {
    border-top: 3px solid;
}

.rank-1 { border-top-color: #1565c0; }
.rank-2 { border-top-color: #2e7d32; }
.rank-3 { border-top-color: #e65100; }
.rank-4 { border-top-color: #6a1b9a; }
.rank-5 { border-top-color: #0d47a1; }
.rank-6 { border-top-color: #c62828; }

@media print {
  .app-sidebar, .app-header, .no-print {
    display: none !important;
  }
  .app-main {
    margin: 0 !important;
  }
}

/* Custom cashbox styles */

.treasury-box {
    border-radius: 12px;
    padding: 20px;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0,0,0,.1);
    transition: transform .2s;
}

.treasury-box:hover {
    transform: translateY(-2px);
}

.t-icon {
    font-size: 2rem;
    margin-bottom: 10px;
}

.t-label {
    font-weight: 600;
    margin-bottom: 8px;
    font-size: .9rem;
}

.t-value {
    font-size: 1.8rem;
    font-weight: 900;
    margin-bottom: 4px;
}

.t-sub {
    font-size: .75rem;
    opacity: .8;
}

.ledger-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    margin-bottom: 4px;
    border-radius: 6px;
    background: #f8f9fa;
}

.ledger-row.credit {
    background: linear-gradient(90deg, #e8f5e9, #f1f8e9);
    border-right: 3px solid #2e7d32;
}

.ledger-row.debit {
    background: linear-gradient(90deg, #ffebee, #fce4ec);
    border-right: 3px solid #c62828;
}

.ledger-row.neutral {
    background: linear-gradient(90deg, #fff3e0, #fff8e1);
    border-right: 3px solid #f57c00;
}

.ledger-row.total-row {
    background: linear-gradient(135deg, #0d3b66, #1565c0);
    color: white;
    font-weight: 700;
}

.tx-tab {
    padding: 6px 12px;
    border-radius: 20px;
    background: #f8f9fa;
    color: #6c757d;
    cursor: pointer;
    font-weight: 600;
    transition: all .2s;
}

.tx-tab.active {
    background: #0d6efd;
    color: white;
}
 

.login-header i{
  font-size:40px;
  margin-bottom:10px;
  display:block;
}

.form-control{
  border-radius:10px;
  padding:12px;
}

.btn-login{
  background:linear-gradient(135deg,#1976d2,#1565c0);
  border:none;
  border-radius:10px;
  padding:12px;
  font-weight:700;
}

.btn-login:hover{
  opacity:.9;
}

/* Custom register styles */

.register{
  background: linear-gradient(135deg,#1565c0,#0d47a1);
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
}

.register-card{
  width:100%;
  max-width:420px;
  border:none;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 40px rgba(0,0,0,.3);
}

.register-header{
  background:linear-gradient(135deg,#1565c0,#0d47a1);
  color:#fff;
  text-align:center;
  padding:25px;
}

.register-header i{
  font-size:40px;
  margin-bottom:10px;
  display:block;
}

.btn-register{
  background:linear-gradient(135deg,#1565c0,#0d47a1);
  border:none;
  border-radius:10px;
  padding:12px;
  font-weight:700;
}

.btn-register:hover{
  opacity:.9;
}

/* Custom bonds styles */


/* Quota card */
.quota-card{border-radius:14px;border:none;box-shadow:0 3px 18px rgba(0,0,0,.1);transition:transform .2s,box-shadow .2s;overflow:hidden;}
.quota-card:hover{transform:translateY(-4px);box-shadow:0 8px 28px rgba(0,0,0,.15);}
.quota-header{padding:16px 18px 10px;display:flex;align-items:center;gap:12px;}
.quota-avatar{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:900;color:white;flex-shrink:0;}
.quota-body{padding:0 18px 16px;}
.quota-bar-wrap{background:#f0f4f8;border-radius:20px;height:10px;margin:8px 0;}
.quota-bar{border-radius:20px;height:10px;transition:width .6s ease;}
.status-over{color:#2e7d32;font-weight:700;}
.status-under{color:#c62828;font-weight:700;}
.status-exact{color:#1565c0;font-weight:700;}
.diff-badge{border-radius:20px;padding:3px 12px;font-size:.8rem;font-weight:700;}
.diff-over{background:#e8f5e9;color:#2e7d32;}
.diff-under{background:#fce4ec;color:#c62828;}
.diff-exact{background:#e3f2fd;color:#1565c0;}

/* History table zebra */
.table-history tbody tr:nth-child(odd){background:#fafbfc;}
.pulse{animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.5;}}


/* Treasury box */
.treasury-box{border-radius:16px;padding:24px 20px;position:relative;overflow:hidden;}
.treasury-box .t-icon{position:absolute;left:-10px;bottom:-10px;font-size:5rem;opacity:.08;}
.treasury-box .t-label{font-size:.82rem;font-weight:700;opacity:.85;margin-bottom:4px;}
.treasury-box .t-value{font-size:2rem;font-weight:900;line-height:1.1;}
.treasury-box .t-sub{font-size:.75rem;opacity:.7;margin-top:4px;}

/* Ledger rows */
.ledger-row{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-bottom:1px solid #f0f4f8;font-family:'Cairo';}
.ledger-row:last-child{border-bottom:none;}
.ledger-row.total-row{background:linear-gradient(135deg,#0d3b66,#1565c0);border-radius:10px;color:white;margin-top:8px;padding:14px 16px;}
.ledger-row.credit{border-right:3px solid #2e7d32;}
.ledger-row.debit{border-right:3px solid #c62828;}
.ledger-row.neutral{border-right:3px solid #1976d2;}

/* Transaction type tabs */
.tx-tab{padding:8px 18px;border-radius:8px;font-weight:600;cursor:pointer;border:2px solid transparent;transition:.2s;}
.tx-tab.active{background:#0d3b66;color:white;border-color:#0d3b66;}
.tx-tab:not(.active){background:white;color:#0d3b66;border-color:#e0e0e0;}
.tx-tab:not(.active):hover{background:#e3f2fd;border-color:#1976d2;}

/* Cashflow row colors */
.cf-in{color:#2e7d32;}
.cf-out{color:#c62828;}

@media print{
  .app-sidebar,.app-header,.no-print{display:none!important;}
  .app-main{margin:0!important;}
}

/* customers report page */

.stat-box{border-radius:12px;padding:18px;text-align:center;}
.report-tab{cursor:pointer;padding:10px 20px;border-radius:8px;font-weight:600;transition:.2s;}
.report-tab.active{background:#0d3b66;color:white;}
.report-tab:not(.active):hover{background:#e3f2fd;}
@media print{
  .app-sidebar,.app-header,.no-print{display:none!important;}
  .app-main{margin:0!important;}
  .card{box-shadow:none!important;border:1px solid #ddd!important;}
}

/* salaries */

.worker-card{border-radius:12px;border:none;box-shadow:0 2px 15px rgba(0,0,0,.08);transition:transform .2s;}
.worker-card:hover{transform:translateY(-3px);}
.avatar{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;font-weight:900;color:white;}