/* =========================================================
   GTS II DISPATCH — GLOBAL PROFESSIONAL THEME
   Carefree Luxury Service
   ========================================================= */

:root{
  --gts-navy:#0b172a;
  --gts-navy-light:#14243d;
  --gts-blue:#2563eb;
  --gts-blue-light:#eff6ff;
  --gts-gold:#c58a1c;
  --gts-gold-light:#fff8e7;
  --gts-green:#059669;
  --gts-green-light:#ecfdf5;
  --gts-orange:#d97706;
  --gts-orange-light:#fff7ed;
  --gts-red:#dc2626;
  --gts-red-light:#fef2f2;

  --gts-background:#f3f6fa;
  --gts-surface:#ffffff;
  --gts-border:#dfe5ec;
  --gts-text:#162033;
  --gts-muted:#64748b;

  --gts-radius:10px;
  --gts-shadow:0 6px 20px rgba(15,23,42,.07);
}

/* ---------- Base ---------- */

body{
  background:var(--gts-background);
  color:var(--gts-text);
}

input,
select,
textarea{
  border:1px solid var(--gts-border);
  border-radius:7px;
  background:#fff;
  color:var(--gts-text);
  transition:border-color .15s, box-shadow .15s, background .15s;
}

input:focus,
select:focus,
textarea:focus{
  outline:none;
  border-color:var(--gts-blue);
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}

/* ---------- Navigation ---------- */

.sidebar,
header,
.topbar{
  background:var(--gts-navy);
}

.nav-link{
  color:#cbd5e1;
}

.nav-link:hover{
  background:rgba(255,255,255,.07);
  color:#fff;
}

.nav-link.active{
  background:var(--gts-blue);
  color:#fff;
}

.nav-label{
  color:#94a3b8;
}

/* ---------- Main panels ---------- */

.panel,
.card,
.table-panel,
.form-panel{
  background:var(--gts-surface);
  border:1px solid var(--gts-border);
  border-radius:var(--gts-radius);
  box-shadow:var(--gts-shadow);
}

/* ---------- Section headers ---------- */

.panel-header,
.card-header{
  border-bottom:1px solid var(--gts-border);
}

.panel-header h2,
.panel-header h3,
.card-header h2,
.card-header h3{
  color:var(--gts-text);
}

/* ---------- Buttons ---------- */

button.primary,
.primary{
  background:var(--gts-blue);
  color:#fff;
  border:1px solid var(--gts-blue);
  border-radius:7px;
}

button.primary:hover,
.primary:hover{
  background:#1d4ed8;
}

button.secondary,
.secondary{
  background:#fff;
  color:var(--gts-text);
  border:1px solid var(--gts-border);
  border-radius:7px;
}

button.secondary:hover,
.secondary:hover{
  background:#f8fafc;
  border-color:#cbd5e1;
}

/* ---------- Important / VIP information ---------- */

.vip,
.vip-field,
.vip-number,
[data-field="vip_number"]{
  border-color:var(--gts-gold);
}

#passenger_vip_number{
  background:var(--gts-gold-light);
  border-color:#d6a64a;
  font-weight:600;
}

label[for="passenger_vip_number"]{
  color:#946200;
  font-weight:700;
}

/* ---------- Required fields ---------- */

.required,
.required-field{
  border-left:3px solid var(--gts-gold);
}

/* ---------- Status ---------- */

.success{
  color:var(--gts-green);
}

.error{
  color:var(--gts-red);
}

.success-box{
  background:var(--gts-green-light);
  border:1px solid #a7f3d0;
  color:#047857;
}

.warning,
.warning-box{
  background:var(--gts-orange-light);
  border:1px solid #fed7aa;
  color:#b45309;
}

.error-box{
  background:var(--gts-red-light);
  border:1px solid #fecaca;
  color:#b91c1c;
}

/* ---------- Tables ---------- */

table{
  border-collapse:collapse;
}

th{
  background:#f8fafc;
  color:#475569;
  font-weight:700;
  border-bottom:2px solid var(--gts-border);
}

td{
  border-bottom:1px solid var(--gts-border);
}

tbody tr:hover{
  background:#f8fbff;
}

/* ---------- Account / passenger information ---------- */

#requires_vip_number{
  accent-color:var(--gts-gold);
}

#requires_universal_id,
#requires_budget_code,
#requires_allocation,
#requires_po{
  accent-color:var(--gts-blue);
}

/* ---------- Messages ---------- */

.message.success{
  color:var(--gts-green);
}

.message.error{
  color:var(--gts-red);
}

/* ---------- Links ---------- */

a{
  color:var(--gts-blue);
}

a:hover{
  color:#1d4ed8;
}

/* ---------- Badges ---------- */

.badge.active,
.status-active{
  background:var(--gts-green-light);
  color:var(--gts-green);
}

.badge.warning,
.status-warning{
  background:var(--gts-orange-light);
  color:var(--gts-orange);
}

.badge.error,
.status-error{
  background:var(--gts-red-light);
  color:var(--gts-red);
}

/* ---------- GTS branding ---------- */

.gts-brand,
.brand{
  color:#fff;
}

.gts-accent{
  color:var(--gts-gold);
}

/* =========================================================
   GTS II — PROFESSIONAL UI ENHANCEMENT
   Global visual layer — no application logic changes
   ========================================================= */

/* ---------- Overall typography ---------- */

body{
  font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.01em;
}

/* ---------- Main page titles ---------- */

.page-heading h1,
.page-heading h2,
.page-title,
h1{
  color:var(--gts-navy);
  font-weight:700;
}

/* ---------- Section labels ---------- */

label{
  color:#334155;
  font-weight:600;
}

legend{
  color:var(--gts-navy);
  font-weight:700;
}

/* ---------- Form fields ---------- */

input,
select,
textarea{
  min-height:38px;
  box-sizing:border-box;
}

textarea{
  min-height:80px;
}

input:hover,
select:hover,
textarea:hover{
  border-color:#b8c4d4;
}

/* ---------- Field groups ---------- */

.field,
.check{
  position:relative;
}

/* ---------- Corporate requirement checkboxes ---------- */

#requires_po,
#requires_budget_code,
#requires_allocation,
#requires_universal_id,
#requires_vip_number{
  width:16px;
  height:16px;
  cursor:pointer;
}

/* Make requirement labels easier to scan */

label[for="requires_po"],
label[for="requires_budget_code"],
label[for="requires_allocation"],
label[for="requires_universal_id"],
label[for="requires_vip_number"]{
  font-size:13px;
}

/* VIP requirement gets special visual priority */

label[for="requires_vip_number"]{
  color:#8a5a00;
}

/* ---------- VIP passenger field ---------- */

#passenger_vip_number{
  background:#fffaf0;
  border:1.5px solid #d6a64a;
  color:#6f4900;
  font-weight:700;
  box-shadow:inset 3px 0 0 #c58a1c;
}

#passenger_vip_number:focus{
  border-color:#c58a1c;
  box-shadow:
    inset 3px 0 0 #c58a1c,
    0 0 0 3px rgba(197,138,28,.14);
}

#passenger_vip_number::placeholder{
  color:#b08a45;
}

/* ---------- Panels ---------- */

.panel,
.card,
.table-panel,
.form-panel{
  overflow:hidden;
}

/* ---------- Financial sections ---------- */

fieldset{
  border-color:#d8e0ea;
  border-radius:8px;
}

fieldset legend{
  padding:0 8px;
}

/* ---------- Buttons ---------- */

button{
  font-family:inherit;
  font-weight:600;
  transition:
    background .15s ease,
    border-color .15s ease,
    box-shadow .15s ease,
    transform .05s ease;
}

button:active{
  transform:translateY(1px);
}

button.primary,
button[type="submit"]{
  box-shadow:0 2px 5px rgba(37,99,235,.18);
}

button.primary:hover,
button[type="submit"]:hover{
  box-shadow:0 4px 10px rgba(37,99,235,.22);
}

/* ---------- Tables ---------- */

table{
  width:100%;
}

thead th{
  background:var(--gts-navy);
  color:#fff;
  border-bottom:0;
  padding:10px 12px;
  text-align:left;
}

tbody td{
  padding:9px 12px;
}

tbody tr:nth-child(even){
  background:#fafcff;
}

tbody tr:hover{
  background:#eff6ff;
}

/* ---------- Status badges ---------- */

.badge,
.status,
.status-active,
.status-warning,
.status-error{
  border-radius:999px;
  padding:3px 9px;
  font-size:11px;
  font-weight:700;
  display:inline-block;
}

/* ---------- Messages ---------- */

.message{
  font-weight:600;
}

.message.success{
  background:#ecfdf5;
  border-radius:6px;
  padding:6px 9px;
}

.message.error{
  background:#fef2f2;
  border-radius:6px;
  padding:6px 9px;
}

/* ---------- Search fields ---------- */

input[type="search"]{
  background:#f8fafc;
}

input[type="search"]:focus{
  background:#fff;
}

/* ---------- Links ---------- */

a{
  text-decoration:none;
}

/* ---------- Scrollbars ---------- */

*{
  scrollbar-width:thin;
  scrollbar-color:#cbd5e1 transparent;
}

*::-webkit-scrollbar{
  width:8px;
  height:8px;
}

*::-webkit-scrollbar-track{
  background:transparent;
}

*::-webkit-scrollbar-thumb{
  background:#cbd5e1;
  border-radius:10px;
}

/* ---------- GTS brand accent ---------- */

.gts-accent{
  color:var(--gts-gold);
}

/* ---------- Required-field visual cue ---------- */

input:required,
select:required,
textarea:required{
  box-shadow:inset 2px 0 0 var(--gts-gold);
}

/* ---------- Disabled fields ---------- */

input:disabled,
select:disabled,
textarea:disabled{
  background:#f1f5f9;
  color:#64748b;
  cursor:not-allowed;
}

/* ---------- Professional focus accessibility ---------- */

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid rgba(37,99,235,.20);
  outline-offset:1px;
}

/* ---------- Mobile ---------- */

@media(max-width:700px){

  .panel,
  .card,
  .table-panel,
  .form-panel{
    border-radius:8px;
  }

  thead th,
  tbody td{
    padding:8px;
  }

}

