/* ============ GLOBAL ============ */
:root {
  --primary: #1e40af;
  --primary-dark: #1e3a8a;
  --primary-light: #3b82f6;
  --accent: #f59e0b;
  --accent-dark: #d97706;
  --success: #10b981;
  --danger: #ef4444;
  --warning: #f59e0b;
  --dark: #1f2937;
  --gray: #6b7280;
  --light: #f3f4f6;
  --white: #ffffff;
  --shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1);
  --radius: 12px;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; color:var(--dark); line-height:1.6; }
a { text-decoration:none; color:inherit; }

/* ============ LANDING PAGE ============ */
.navbar { background:var(--white); padding:1rem 2rem; display:flex; align-items:center; justify-content:space-between; box-shadow:var(--shadow); position:sticky; top:0; z-index:100; }
.logo { font-size:1.5rem; font-weight:800; color:var(--primary); }
.logo span { color:var(--accent); }
.nav-phone { font-size:1.1rem; font-weight:700; color:var(--primary); }

.hero { background:linear-gradient(135deg,var(--primary),var(--primary-dark)); color:var(--white); padding:4rem 2rem; text-align:center; }
.hero h1 { font-size:2.8rem; font-weight:800; margin-bottom:1rem; max-width:800px; margin-left:auto; margin-right:auto; }
.hero p { font-size:1.2rem; opacity:.9; max-width:600px; margin:0 auto 2rem; }
.hero-badges { display:flex; justify-content:center; gap:1.5rem; flex-wrap:wrap; }
.hero-badge { background:rgba(255,255,255,.15); padding:.5rem 1rem; border-radius:50px; font-size:.9rem; }

.form-section { padding:3rem 2rem; background:var(--light); }
.form-container { max-width:600px; margin:-4rem auto 0; background:var(--white); padding:2.5rem; border-radius:var(--radius); box-shadow:var(--shadow-lg); position:relative; z-index:10; }
.form-container h2 { text-align:center; margin-bottom:.5rem; font-size:1.5rem; }
.subtitle { text-align:center; color:var(--gray); margin-bottom:2rem; }
.form-group { margin-bottom:1.2rem; }
.form-group label { display:block; font-weight:600; margin-bottom:.3rem; font-size:.9rem; }
.form-group input,.form-group select,.form-group textarea { width:100%; padding:.8rem 1rem; border:2px solid #e5e7eb; border-radius:8px; font-size:1rem; transition:border-color .2s; }
.form-group input:focus,.form-group select:focus,.form-group textarea:focus { outline:none; border-color:var(--primary-light); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.btn-submit { width:100%; padding:1rem; background:var(--accent); color:var(--dark); border:none; border-radius:8px; font-size:1.1rem; font-weight:700; cursor:pointer; transition:background .2s; }
.btn-submit:hover { background:var(--accent-dark); }
.btn-submit:disabled { opacity:.6; cursor:not-allowed; }
.form-note { text-align:center; color:var(--gray); font-size:.8rem; margin-top:1rem; }

.how-it-works { padding:4rem 2rem; text-align:center; }
.how-it-works h2 { font-size:2rem; margin-bottom:2.5rem; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; max-width:900px; margin:0 auto; }
.step { padding:2rem; }
.step-number { width:60px; height:60px; background:var(--primary); color:var(--white); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.5rem; font-weight:800; margin:0 auto 1rem; }
.step h3 { margin-bottom:.5rem; }
.step p { color:var(--gray); font-size:.95rem; }

.trust-section { background:var(--light); padding:3rem 2rem; text-align:center; }
.trust-badges { display:flex; justify-content:center; gap:3rem; flex-wrap:wrap; max-width:800px; margin:0 auto; }
.trust-badge .number { font-size:2.5rem; font-weight:800; color:var(--primary); }
.trust-badge .label { color:var(--gray); font-size:.9rem; }

.services { padding:4rem 2rem; text-align:center; }
.services h2 { font-size:2rem; margin-bottom:2.5rem; }
.service-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1.5rem; max-width:900px; margin:0 auto; }
.service-card { background:var(--white); border:2px solid #e5e7eb; padding:1.5rem; border-radius:var(--radius); transition:border-color .2s; }
.service-card:hover { border-color:var(--primary-light); box-shadow:var(--shadow); }
.service-icon { font-size:2.5rem; margin-bottom:.5rem; }

.footer { background:var(--dark); color:var(--white); padding:2rem; text-align:center; }
.footer p { opacity:.7; font-size:.9rem; }

.modal-overlay { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); z-index:1000; align-items:center; justify-content:center; }
.modal-overlay.active { display:flex; }
.modal { background:var(--white); padding:2.5rem; border-radius:var(--radius); text-align:center; max-width:450px; margin:1rem; }
.modal .checkmark { font-size:4rem; color:var(--success); margin-bottom:1rem; }
.modal h2 { margin-bottom:.5rem; }
.modal p { color:var(--gray); margin-bottom:1.5rem; }
.modal .btn-close { padding:.7rem 2rem; background:var(--primary); color:var(--white); border:none; border-radius:8px; cursor:pointer; font-size:1rem; }

@media(max-width:768px) {
  .hero h1 { font-size:1.8rem; }
  .steps { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .trust-badges { gap:1.5rem; }
}

/* ============ ADMIN ============ */
.login-page { min-height:100vh; background:var(--light); display:flex; align-items:center; justify-content:center; }
.login-box { background:var(--white); padding:2.5rem; border-radius:var(--radius); box-shadow:var(--shadow-lg); width:100%; max-width:400px; margin:1rem; }
.login-box h1 { text-align:center; margin-bottom:2rem; color:var(--primary); }
.login-error { color:var(--danger); text-align:center; margin-bottom:1rem; font-size:.9rem; display:none; }
.btn-login { width:100%; padding:.8rem; background:var(--primary); color:var(--white); border:none; border-radius:8px; font-size:1rem; font-weight:600; cursor:pointer; }
.btn-login:hover { background:var(--primary-dark); }

.admin-layout { display:flex; min-height:100vh; }

.sidebar { width:260px; background:var(--dark); color:var(--white); padding:1.5rem 0; display:flex; flex-direction:column; position:fixed; top:0; bottom:0; z-index:50; }
.sidebar-header { padding:0 1.5rem 1.5rem; border-bottom:1px solid rgba(255,255,255,.1); }
.sidebar-header h2 { font-size:1.2rem; }
.sidebar-header p { font-size:.8rem; opacity:.6; }
.sidebar-nav { flex:1; padding:1rem 0; }
.sidebar-nav a { display:flex; align-items:center; gap:.8rem; padding:.8rem 1.5rem; color:rgba(255,255,255,.7); transition:all .2s; font-size:.95rem; }
.sidebar-nav a:hover,.sidebar-nav a.active { background:rgba(255,255,255,.1); color:var(--white); }
.sidebar-nav a.active { border-left:3px solid var(--accent); }
.sidebar-footer { padding:1rem 1.5rem; border-top:1px solid rgba(255,255,255,.1); }
.sidebar-footer a { color:rgba(255,255,255,.5); font-size:.85rem; }
.sidebar-footer a:hover { color:var(--white); }

.main-content { margin-left:260px; flex:1; background:var(--light); min-height:100vh; }
.topbar { background:var(--white); padding:1rem 2rem; display:flex; align-items:center; justify-content:space-between; box-shadow:var(--shadow); }
.topbar h1 { font-size:1.3rem; }
.topbar-right { display:flex; align-items:center; gap:1rem; }
.content-area { padding:2rem; }

.stat-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.5rem; margin-bottom:2rem; }
.stat-card { background:var(--white); padding:1.5rem; border-radius:var(--radius); box-shadow:var(--shadow); }
.stat-card .stat-label { font-size:.85rem; color:var(--gray); text-transform:uppercase; letter-spacing:.5px; }
.stat-card .stat-value { font-size:2rem; font-weight:800; margin:.3rem 0; }
.stat-card.primary { border-left:4px solid var(--primary); }
.stat-card.success { border-left:4px solid var(--success); }
.stat-card.warning { border-left:4px solid var(--warning); }
.stat-card.danger { border-left:4px solid var(--danger); }

.table-container { background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; margin-bottom:1.5rem; }
.table-header { padding:1rem 1.5rem; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #e5e7eb; flex-wrap:wrap; gap:.5rem; }
.table-header h3 { font-size:1.1rem; }
.table-actions { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.table-actions input,.table-actions select { padding:.5rem .8rem; border:1px solid #e5e7eb; border-radius:6px; font-size:.9rem; }
table { width:100%; border-collapse:collapse; }
th { background:var(--light); padding:.8rem 1rem; text-align:left; font-size:.85rem; color:var(--gray); text-transform:uppercase; letter-spacing:.5px; }
td { padding:.8rem 1rem; border-bottom:1px solid #f3f4f6; font-size:.9rem; }
tr:hover { background:#f9fafb; }

.badge { padding:.25rem .6rem; border-radius:50px; font-size:.75rem; font-weight:600; display:inline-block; }
.badge-new { background:#dbeafe; color:#1d4ed8; }
.badge-forwarded { background:#fef3c7; color:#92400e; }
.badge-accepted { background:#d1fae5; color:#065f46; }
.badge-rejected { background:#fee2e2; color:#991b1b; }
.badge-completed { background:#e0e7ff; color:#3730a3; }
.badge-cancelled { background:#f3f4f6; color:#6b7280; }
.badge-priority { background:var(--primary); color:var(--white); width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; font-size:.8rem; }
.badge-active { background:#d1fae5; color:#065f46; }
.badge-inactive { background:#fee2e2; color:#991b1b; }

.btn { padding:.5rem 1rem; border:none; border-radius:6px; cursor:pointer; font-size:.85rem; font-weight:600; transition:all .2s; display:inline-flex; align-items:center; gap:.3rem; }
.btn-primary { background:var(--primary); color:var(--white); }
.btn-primary:hover { background:var(--primary-dark); }
.btn-success { background:var(--success); color:var(--white); }
.btn-danger { background:var(--danger); color:var(--white); }
.btn-warning { background:var(--warning); color:var(--dark); }
.btn-sm { padding:.3rem .6rem; font-size:.8rem; }
.btn-outline { background:transparent; border:1px solid #e5e7eb; color:var(--dark); }
.btn-outline:hover { background:var(--light); }

.admin-modal { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.5); z-index:200; align-items:flex-start; justify-content:center; padding:2rem; overflow-y:auto; }
.admin-modal.active { display:flex; }
.modal-content { background:var(--white); border-radius:var(--radius); width:100%; max-width:650px; box-shadow:var(--shadow-lg); margin-top:2rem; }
.modal-head { padding:1.2rem 1.5rem; border-bottom:1px solid #e5e7eb; display:flex; align-items:center; justify-content:space-between; }
.modal-head h3 { font-size:1.1rem; }
.modal-close { background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--gray); }
.modal-body { padding:1.5rem; }
.modal-foot { padding:1rem 1.5rem; border-top:1px solid #e5e7eb; display:flex; justify-content:flex-end; gap:.5rem; }

.pagination { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:1rem; }
.pagination button { padding:.4rem .8rem; border:1px solid #e5e7eb; border-radius:6px; background:var(--white); cursor:pointer; }
.pagination button.active { background:var(--primary); color:var(--white); border-color:var(--primary); }
.pagination button:disabled { opacity:.5; cursor:not-allowed; }

.chart-container { background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow); padding:1.5rem; margin-bottom:2rem; }
.chart-bars { display:flex; align-items:flex-end; gap:.5rem; height:200px; padding-top:1rem; }
.chart-bar { flex:1; background:var(--primary-light); border-radius:4px 4px 0 0; position:relative; min-height:4px; transition:height .3s; }
.chart-bar:hover { background:var(--primary); }
.chart-bar .chart-label { position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); font-size:.7rem; color:var(--gray); white-space:nowrap; }
.chart-bar .chart-value { position:absolute; top:-20px; left:50%; transform:translateX(-50%); font-size:.75rem; font-weight:600; }

.toast-container { position:fixed; top:1rem; right:1rem; z-index:9999; display:flex; flex-direction:column; gap:.5rem; }
.toast { padding:.8rem 1.2rem; border-radius:8px; color:var(--white); font-size:.9rem; animation:slideIn .3s ease; box-shadow:var(--shadow-lg); max-width:350px; }
.toast-success { background:var(--success); }
.toast-error { background:var(--danger); }
.toast-info { background:var(--primary); }
@keyframes slideIn { from { transform:translateX(100%); opacity:0; } to { transform:translateX(0); opacity:1; } }
@keyframes pulse { 0%,100% { opacity:1; } 50% { opacity:.3; } }

/* Balance badge */
.balance-display { font-weight:700; }
.balance-positive { color:var(--success); }
.balance-low { color:var(--warning); }
.balance-zero { color:var(--danger); }

/* Schedule grid */
.schedule-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:.3rem; margin-top:.5rem; }
.schedule-day { text-align:center; padding:.3rem; border:1px solid #e5e7eb; border-radius:4px; font-size:.75rem; }
.schedule-day.off { background:#fee2e2; }
.schedule-day label { font-weight:600; display:block; margin-bottom:.2rem; }
.schedule-day input { width:100%; font-size:.7rem; padding:.15rem; border:1px solid #e5e7eb; border-radius:3px; text-align:center; }

@media(max-width:768px) {
  .sidebar { transform:translateX(-100%); }
  .sidebar.open { transform:translateX(0); }
  .main-content { margin-left:0; }
  .stat-cards { grid-template-columns:1fr 1fr; }
  .schedule-grid { grid-template-columns:repeat(4,1fr); }
}