/* ==========================================================
   PASADA – Modern White Theme (UI-only)
   Applies to: Admin + Passenger + Driver + Auth
   - Poppins only (300–400), no bold, no text stroke/outline
   - White + very light neutral surfaces
   - Soft neutral text palette, subtle (slightly darker) lines
   - Consistent radii, spacing, minimal shadows
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

:root{
  /* Typography */
  --pasada-font: "Poppins", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans";
  --pasada-font-size: 15px;

  /* Surfaces */
  --bg: #FFFFFF;
  --bg-soft: #F8FAFC;
  --bg-soft-2:#F9FAFB;

  /* Text */
  --text: #0F172A;
  --text-secondary: #64748B;
  --text-muted: #94A3B8;

  /* Lines / radius / shadows */
  --border-soft: rgba(15,23,42,0.22);
  --radius-card: 16px;
  --radius-control: 12px;
  --shadow-soft: 0 1px 3px rgba(15,23,42,0.04), 0 0 0 1px rgba(15,23,42,0.02);
  --shadow-soft-2: 0 12px 40px -8px rgba(15,23,42,0.10), 0 0 0 1px rgba(15,23,42,0.03);

  /* Accent */
  --primary: #2563EB;
  --primary-dark: #1D4ED8;
  --primary-tint: rgba(37, 99, 235, 0.10);
  --primary-tint-hover: rgba(37, 99, 235, 0.14);

  /* Focus */
  --focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.08);

  /* Soft semantic colors */
  --success-bg: rgba(34,197,94,0.16);
  --success-border: rgba(34,197,94,0.24);
  --success-text: #166534;

  --danger-bg: rgba(239,68,68,0.16);
  --danger-border: rgba(239,68,68,0.24);
  --danger-text: #991B1B;

  --warning-bg: rgba(245,158,11,0.18);
  --warning-border: rgba(245,158,11,0.26);
  --warning-text: #92400E;
}

html, body{
  font-family: var(--pasada-font) !important;
  font-size: var(--pasada-font-size);
  font-weight: 400 !important;
  color: var(--text);
  -webkit-text-stroke: 0 !important;
  text-shadow: none !important;
}
[data-bs-theme="light"] html, [data-bs-theme="light"] body {
  background: var(--bg-soft) !important;
}

body{ letter-spacing: normal; }

/* Use one font everywhere (but don't break icon fonts) */
button, input, textarea, select,
.form-control, .form-select,
.btn, .badge,
table, th, td, label, .dropdown-menu, .modal, .toast{
  font-family: var(--pasada-font) !important;
}

/* No bold anywhere */
h1,h2,h3,h4,h5,h6,
strong,b,
.fw-bold,.fw-semibold,.fw-bolder,
.badge, .btn,
.table thead th,
.page-title,.glass-card-title,.dash-title,
.brand-title,.brand-subtitle,
.nav-section-label,
.user-pill-name,
.psa-title,.psa-btn,.pasada-loader-text,
[class*="pasada-home-"],
[class*="driver-home-"],
[class*="req-"],
[class*="booking-"] {
  font-weight: 400 !important;
}

*,
*::before,
*::after{
  -webkit-text-stroke: 0 !important;
  text-shadow: none !important;
}

/* Softer text palette helpers */
.text-muted{ color: var(--text-muted) !important; }
.text-secondary{ color: var(--text-secondary) !important; }

/* ==========================================================
   App shell (Admin/Driver/Passenger shared layout)
   Keep layout/breakpoints intact – only visual polish
   ========================================================== */

.app-shell{
  background: var(--bg-soft) !important;
  color: var(--text) !important;
}

.app-sidebar{
  background: var(--bg) !important;
  border-right: 1px solid var(--border-soft) !important;
}

@media (max-width: 992px){
  .app-sidebar{
    border-right: none !important;
    border-bottom: 1px solid var(--border-soft) !important;
  }
}

/* Sidebar items */
.app-nav a{
  border-radius: 10px !important;
  border: 1px solid transparent !important;
  color: var(--text) !important;
  background: transparent !important;
}
.app-nav a:hover{
  background: var(--bg-soft) !important;
  border-color: var(--border-soft) !important;
}
.app-nav a.active{
  background: var(--primary-tint) !important;
  border-color: rgba(37,99,235,0.18) !important;
  color: var(--primary-dark) !important;
}

/* Header */
.page-subtitle{ color: var(--text-secondary) !important; }

/* Cards */
.glass-card,
.dash-panel,
.table-wrap,
.notif-menu,
.dropdown-menu,
.modal-content{
  background: var(--bg) !important;
  border: 1px solid rgba(15,23,42,0.18) !important;
  border-radius: var(--radius-card) !important;
  box-shadow: var(--shadow-soft) !important;
}

.section-divider,
.sidebar-divider{
  border-top: 1px solid var(--border-soft) !important;
}

/* Enrollment cards (keep structure, soften hover) */
.enroll-card{
  border-radius: var(--radius-card) !important;
  background: var(--bg-soft-2) !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: none !important;
}
.enroll-card:hover{
  transform: none !important;
  box-shadow: var(--shadow-soft) !important;
  border-color: rgba(37,99,235,0.20) !important;
}

/* Controls */
.form-control, .form-select,
.search-input{
  border-radius: var(--radius-control) !important;
  border: 1px solid var(--border-soft) !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  font-size: .95rem !important;
  min-height: 40px;
  padding: 10px 12px !important;
  box-shadow: none !important;
}
textarea.form-control{ border-radius: var(--radius-card) !important; }

.form-control::placeholder{ color: var(--text-muted) !important; }

.form-control:focus, .form-select:focus, .search-input:focus{
  border-color: rgba(37,99,235,0.40) !important;
  box-shadow: var(--focus-ring) !important;
  background: #ffffff !important;
}

/* Buttons */
.btn:not(.btn-link){
  border-radius: var(--radius-control) !important;
  font-size: .9rem !important;
  padding: 10px 16px !important;
  min-height: 40px;
  box-shadow: none !important;
  transition: all 0.2s cubic-bezier(.4,0,.2,1) !important;
  letter-spacing: 0.01em;
}

.btn:not(.btn-link):active{ transform: scale(0.97); }

.btn-primary{
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}
.btn-primary:hover{ background: #1d4ed8 !important; border-color: #1d4ed8 !important; }

.btn:disabled, .btn.disabled,
button[data-otp-verify]:disabled, button[data-driver-submit]:disabled {
  background: #ffffff !important;
  color: #94a3b8 !important;
  border: 1px solid #cbd5e1 !important;
  opacity: 0.75 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

.btn-success{
  background: #16a34a !important;
  border-color: #16a34a !important;
  color: #ffffff !important;
}
.btn-success:hover{ background: #15803d !important; border-color: #15803d !important; }

.btn-danger{
  background: #dc2626 !important;
  border-color: #dc2626 !important;
  color: #ffffff !important;
}
.btn-danger:hover{ background: #b91c1c !important; border-color: #b91c1c !important; }

.btn-warning{
  background: #d97706 !important;
  border-color: #d97706 !important;
  color: #ffffff !important;
}
.btn-warning:hover{ background: #b45309 !important; border-color: #b45309 !important; }

/* Light neutral "View" buttons */
.btn-info, .btn-secondary{
  background: #F1F5F9 !important;
  border-color: rgba(15,23,42,0.08) !important;
  color: #334155 !important;
}
.btn-info:hover, .btn-secondary:hover{
  background: #E2E8F0 !important;
  border-color: rgba(15,23,42,0.12) !important;
}

/* Table */
.table,
.table-dark-modern{
  color: var(--text) !important;
}
.table thead th,
.table-dark-modern thead tr{
  background: #F8FAFC !important;
  font-size: .78rem !important;
  color: #64748B !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.table th, .table td,
.table-dark-modern th, .table-dark-modern td{
  border-bottom: 1px solid rgba(15,23,42,0.04) !important;
  padding: 12px 16px !important;
  vertical-align: middle;
  font-size: .9rem !important;
}
.table tbody tr:hover,
.table-dark-modern tbody tr:hover{
  background: rgba(37,99,235,0.02) !important;
}

/* Status badges */
.badge,
.badge-status{
  border-radius: 999px !important;
  font-size: .72rem !important;
  padding: 4px 10px !important;
  border: none !important;
  background: #F1F5F9 !important;
  color: #475569 !important;
  letter-spacing: 0.02em;
}
.badge-pending{
  background: var(--warning-bg) !important;
  border-color: var(--warning-border) !important;
  color: var(--warning-text) !important;
}
.badge-approved{
  background: var(--success-bg) !important;
  border-color: var(--success-border) !important;
  color: var(--success-text) !important;
}
.badge-rejected{
  background: var(--danger-bg) !important;
  border-color: var(--danger-border) !important;
  color: var(--danger-text) !important;
}

/* Slightly darker lines for misc borders */
.border, .border-top, .border-bottom, .border-start, .border-end{
  border-color: var(--border-soft) !important;
}

/* Bottom nav (mobile) – keep behavior, just soften */
.bottom-nav{
  border-top: 1px solid var(--border-soft) !important;
  background: rgba(255,255,255,0.92) !important;
}
.bottom-nav a{ font-weight: 400 !important; }

/* ==========================================================
   Auth pages (login/register/forgot/reset/verify)
   Keep structure; modernize colors/shadows
   ========================================================== */

.auth-wrapper{
  background: var(--bg-soft) !important;
}
.auth-card{
  border-radius: var(--radius-card) !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: var(--shadow-soft) !important;
}

/* Custom login shell (login.php) */
.shell{
  background: var(--bg) !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: var(--shadow-soft-2) !important;
}


/* Extra no-bold guarantees for user flows */
.user-avatar,
.chat-topbar .who .name,
.chat-topbar .btn,
.service-change,
.nav-badge,
.kpi-main,
.perf-line strong,
.score-row strong{
  font-weight: 400 !important;
}

/* Ensure icons keep their font family */
.bi, .bi::before{ font-family: "bootstrap-icons" !important; }

/* Standalone (non-app-shell) pages: force Poppins + regular weight without changing layout */
body.reg-page, body.verify-page{
  font-family: var(--pasada-font) !important;
  font-weight: 400 !important;
}
body.reg-page *, body.verify-page *{
  font-family: var(--pasada-font) !important;
  font-weight: 400 !important;
}
body.reg-page .bi, body.reg-page .bi::before,
body.verify-page .bi, body.verify-page .bi::before{
  font-family: "bootstrap-icons" !important;
}

/* Login shell page (login.php) */
.shell, .shell *{
  font-family: var(--pasada-font) !important;
  font-weight: 400 !important;
}
.shell .bi, .shell .bi::before{ font-family:"bootstrap-icons" !important; }

/* Button sizing unification */
.btn.btn-sm:not(.btn-link),
.btn-tight:not(.btn-link){
  font-size: .95rem !important;
  padding: 10px 14px !important;
  min-height: 40px !important;
  border-radius: var(--radius-control) !important;
}

/* Standalone cards */
.reg-card, .cardx{
  border-radius: var(--radius-card);
  border: 1px solid rgba(15,23,42,0.18);
  box-shadow: var(--shadow-soft-2);
  background: var(--bg);
}

@media (max-width: 768px){
  body.reg-page{ background: #ffffff !important; }
  body.reg-page .page-shell{ padding: 0 !important; margin: 0 !important; max-width: 100% !important; }
  body.reg-page .reg-card{
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #ffffff !important;
  }
}

/* ==========================================================
   Polished Alert Messages
   ========================================================== */
.alert{
  border-radius: var(--radius-control) !important;
  font-size: .9rem !important;
  padding: .7rem 1rem !important;
  border: none !important;
}
.alert-success{
  background: rgba(34,197,94,0.06) !important;
  color: #166534 !important;
  border-left: 3px solid #16a34a !important;
}
.alert-danger{
  background: rgba(239,68,68,0.06) !important;
  color: #991B1B !important;
  border-left: 3px solid #dc2626 !important;
}
.alert-warning{
  background: rgba(245,158,11,0.06) !important;
  color: #92400E !important;
  border-left: 3px solid #d97706 !important;
}
.alert-info{
  background: rgba(37,99,235,0.04) !important;
  color: #1e40af !important;
  border-left: 3px solid #2563eb !important;
}
.alert-secondary{
  background: #F8FAFC !important;
  color: #475569 !important;
  border-left: 3px solid #94A3B8 !important;
}

/* Fix Browser Auto-Fill Dark/Blue Background Issue */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px #ffffff inset !important;
  -webkit-text-fill-color: #0f172a !important;
  transition: background-color 5000s ease-in-out 0s;
}
