:root {
  --primary-color: #b88a1e; /* الذهبي */
  --secondary-color: #009fda; /* الأزرق السماوي */
  --gray-bg: #f5f7fa;
  --text-color: #222;
  --font-ar: 'Noto Kufi Arabic', sans-serif;
  --font-en: 'Roboto', sans-serif;
}

body {
  background: var(--gray-bg);
  font-family: var(--font-ar);
  color: var(--text-color);
  margin: 0;
  padding: 0;
}

/* Buttons */
button, .btn {
  background: var(--primary-color);
  color: #fff;
  padding: 10px 20px;
  border: none;
  border-radius: 8px;
  font-weight: bold;
  cursor: pointer;
  transition: background 0.2s ease;
}
button:hover, .btn:hover { background: #967517; }

/* Inputs */
input, select, textarea {
  border: 1px solid #ddd;
  padding: 10px;
  border-radius: 8px;
  width: 100%;
  font-size: 14px;
  font-family: inherit;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--secondary-color);
  outline: none;
  box-shadow: 0 0 3px var(--secondary-color);
}

/* Form container */
.form-box {
  background: #fff;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  margin: 10px auto;
  max-width: 420px;
}

/* Steps nav */
.steps {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 15px 0;
}
.steps .step {
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 13px;
  background: #eee;
}
.steps .step.active { background: var(--primary-color); color: #fff; }

/* Ticket Box */
#ticket {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 20px;
  margin: 20px auto;
  text-align: center;
  max-width: 400px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
#ticket h2 { margin-bottom: 12px; }
#qrcode { margin-top: 12px; }

/* Seat Map */
.seat-map {
  display: grid;
  grid-template-columns: repeat(4, 50px);
  gap: 8px;
  margin: 20px 0;
}
.seat {
  padding: 10px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
}
.seat.available { background: #16a34a; color:#fff; }
.seat.booked { background: #9ca3af; color:#fff; cursor:not-allowed; }
.seat.selected { background: #2563eb; color:#fff; }

/* Trip Offers */
.trip-extra {
  font-size: 13px;
  color: #555;
  margin-top: 6px;
  display: flex;
  gap: 12px;
}
.trip-price {
  font-weight: bold;
  margin-top: 8px;
}

.logo { height: 60px; margin:10px auto; display:block; }
.site-header { background:#fff; padding:10px; text-align:center; border-bottom:1px solid #eee; }
.section { padding:30px 15px; background:#fff; margin:15px; border-radius:12px; box-shadow:0 2px 6px rgba(0,0,0,0.05); text-align:center; }
.section h2 { color:#b88a1e; margin-bottom:15px; }
.offer-card { background:#f5f7fa; padding:20px; border-radius:10px; font-size:18px; color:#b88a1e; font-weight:bold; }
.payment-icons img { height:32px; margin:0 5px; }
.footer { background:#f5f7fa; padding:30px 15px; text-align:center; font-size:14px; margin-top:20px; }
.footer .logo { height:40px; }