:root{
  --bg:#000;           /* Full dark background */
  --card:#121826;      /* Card dark color */
  --accent:#6366f1;    /* Violet accent */
  --text:#e5e7eb;
  --muted:#9ca3af;
  --danger:#ef4444;
  --success:#10b981;
}
html,body{
  margin:0;
  font-family:Inter,system-ui,Segoe UI,Roboto,Arial,Helvetica,sans-serif;
  background:var(--bg);
  color:var(--text);
}

}
*{box-sizing:border-box}
html,body{margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);}
a{color:var(--accent);text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:24px}
.nav{display:flex;align-items:center;justify-content:space-between;padding:18px 0}
.nav a.logo{font-weight:800;letter-spacing:.5px;color:#fff}
.nav .links a{margin:0 12px;color:var(--muted)}
.btn{display:inline-block;padding:12px 16px;border-radius:12px;background:var(--accent);color:white;font-weight:600;border:none;cursor:pointer}
.btn.secondary{background:#1f2937}
.btn.danger{background:var(--danger)}
.btn.success{background:var(--success)}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center;padding:40px 0}
.card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:20px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.grid{display:grid;gap:20px}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
h1{font-size:42px;margin:0 0 14px}
h2{font-size:28px;margin:12px 0}
h3{font-size:20px;margin:10px 0;color:#cbd5e1}
p{color:#cbd5e1;line-height:1.7}
footer{padding:30px 0;color:var(--muted)}
.form-group{margin-bottom:14px}
label{display:block;margin-bottom:6px;color:#cbd5e1}
input,textarea,select{width:100%;padding:12px;border-radius:10px;border:1px solid #1f2937;background:#0f1624;color:#e5e7eb}
table{width:100%;border-collapse:collapse}
th,td{padding:12px;border-bottom:1px solid #1f2937;text-align:left}
.badge{padding:4px 10px;border-radius:999px;background:#0f172a;color:#cbd5e1;border:1px solid #1f2937;font-size:12px}
.header-img{width:100%;border-radius:14px;object-fit:cover;max-height:420px}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.kpi{background:linear-gradient(180deg,#121826, #0d1424);border:1px solid #1d2434;border-radius:14px;padding:16px;text-align:center}
.kpi .num{font-size:28px;font-weight:800}
.alert{padding:12px;border-radius:10px;margin-bottom:16px;background:#10203e;border:1px solid #1d3a67}
.alert.error{background:#2a0e10;border-color:#4e1b20;color:#ffd1d1}
.admin-layout{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.sidebar{background:#0a1222;border-right:1px solid #162032;padding:20px}
.sidebar a{display:block;color:#cbd5e1;padding:10px;border-radius:10px;margin:6px 0}
.sidebar a.active,.sidebar a:hover{background:#111a2e}
.logo-img{height:48px;border-radius:10px}
@media(max-width:900px){
  .hero{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .grid.cols-3{grid-template-columns:1fr}
  .admin-layout{grid-template-columns:1fr}
  .sidebar{display:flex;gap:10px;overflow:auto}
}




.booking-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 20px 0;
}

.card {
  background: var(--card) !important;   /* instead of #fff */
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3); /* stronger shadow on dark */
}
.kpi {
  background:#121826 !important;
  border:1px solid #1d2434;
  border-radius:14px;
  padding:16px;
  text-align:center;
  
}

h2 {
  margin-bottom: 15px;
  font-size: 1.4rem;
}

.form-group {
  margin-bottom: 15px;
}

.form-group label {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 1rem;
}

.btn {
  width: 100%;
  background: var(--accent, #0077ff);
  color: #fff;
  border: none;
  padding: 12px;
  border-radius: 6px;
  font-size: 1rem;a
  cursor: pointer;
}
.btn:hover {
  background: #005fcc;
}

.alert {
  padding: 10px;
  border-radius: 6px;
  margin-bottom: 15px;
  font-size: 0.95rem;
}
.alert.success {
  background: #e6f9ed;
  color: #2d7a46;
  border: 1px solid #b8e6c3;
}
.alert.error {
  background: #ffe6e6;
  color: #a83232;
  border: 1px solid #f1b0b0;
}

.header-img {
  max-width: 100%;
  border-radius: 8px;
  margin-top: 15px;
}

/* Responsive */
@media(max-width: 768px) {
  .booking-container {
    grid-template-columns: 1fr;
  }
  .btn {
    font-size: 1rem;
    padding: 14px;
  }
}