/* AYAN AIR buttons — style "C" (chosen 4 Oct 2026): flat navy, 8px corners, bold, gold arrow that slides on hover, firm press.
   Gold only on dark backgrounds / the most important action. Danger (red) and WhatsApp (green) keep their colour, new shape only.
   Loaded last on the website and in both panels; changes buttons only. */
:root { --ab-navy: #0A2240; --ab-navy-2: #1B3A63; --ab-gold: #C9A55C; --ab-gold-2: #B89148; --ab-soft: #EAF2FA; --ab-soft-2: #DCE9F7; }

/* ---------- website (B2C) ---------- */
.btn { border-radius: 8px; font-weight: 800; letter-spacing: .01em; box-shadow: none; transition: background .15s, box-shadow .15s, transform .08s; }
.btn:active { transform: translateY(1px) scale(.99); }
.btn:focus-visible { outline: 3px solid #7FB2E5; outline-offset: 2px; }
.btn-lg { border-radius: 8px; }
.btn-primary, .btn-navy { background: var(--ab-navy); color: #fff; box-shadow: none; }
.btn-primary:hover, .btn-navy:hover { background: var(--ab-navy-2); }
.btn-primary::after, .btn-navy::after { content: "→"; color: var(--ab-gold); font-weight: 800; margin-inline-start: 2px; transition: transform .15s; }
[dir="rtl"] .btn-primary::after, [dir="rtl"] .btn-navy::after { content: "←"; }
.btn-primary:hover::after, .btn-navy:hover::after { transform: translateX(3px); }
[dir="rtl"] .btn-primary:hover::after, [dir="rtl"] .btn-navy:hover::after { transform: translateX(-3px); }
.btn-light, .btn-soft, .btn-outline { background: var(--ab-soft); color: var(--ab-navy); border: 0; box-shadow: none; }
.btn-light:hover, .btn-soft:hover, .btn-outline:hover { background: var(--ab-soft-2); border-color: transparent; }
/* on navy surfaces the main button turns gold */
.offer-dark .btn-primary, .ph .btn-primary, .hero .btn-primary:not(.search .btn-primary) { background: var(--ab-gold); color: #06172E; }
.offer-dark .btn-primary:hover, .ph .btn-primary:hover { background: var(--ab-gold-2); }
.offer-dark .btn-primary::after, .ph .btn-primary::after { color: #06172E; }
.ph .btn-light { background: rgba(255,255,255,.12); color: #fff; }
.ph .btn-light:hover { background: rgba(255,255,255,.2); }
.btn-wa { border-radius: 8px; }
.nav-cta { border-radius: 8px; }

/* ---------- panels (agency + staff) ---------- */
.fi-btn { border-radius: 8px !important; font-weight: 700; transition: background .15s, box-shadow .15s, transform .08s; }
.fi-btn:active { transform: translateY(1px) scale(.99); }
.fi-btn.fi-color-primary:not(.fi-outlined) { background: var(--ab-navy) !important; color: #fff !important; box-shadow: none !important; }
.fi-btn.fi-color-primary:not(.fi-outlined):hover { background: var(--ab-navy-2) !important; }
.fi-btn.fi-color-primary:not(.fi-outlined) .fi-icon { color: var(--ab-gold) !important; }
.fi-btn.fi-color-primary.fi-outlined { box-shadow: inset 0 0 0 2px var(--ab-navy) !important; color: var(--ab-navy) !important; }
.fi-btn.fi-color-gray:not(.fi-outlined) { background: var(--ab-soft) !important; color: var(--ab-navy) !important; box-shadow: none !important; }
.fi-btn.fi-color-gray:not(.fi-outlined):hover { background: var(--ab-soft-2) !important; }
.fi-btn.fi-color-gray:not(.fi-outlined) .fi-icon { color: var(--ab-navy) !important; }
/* panel gold call-to-action (Search flights etc.) */
.fz-gold { border-radius: 8px !important; background: var(--ab-gold) !important; color: #06172E !important; box-shadow: none !important; font-weight: 800; transition: background .15s, transform .08s; }
.fz-gold:hover { background: var(--ab-gold-2) !important; transform: none; }
.fz-gold:active { transform: translateY(1px) scale(.99); }

/* Toggle buttons (e.g. Class control): only the chosen option is filled; the others are white with a grey line (update-16). */
.fi-fo-toggle-buttons-input:not(:checked) + .fi-btn.fi-color-primary { background: #fff !important; color: #24324A !important; box-shadow: inset 0 0 0 1px #CBD5E1 !important; }
.fi-fo-toggle-buttons-input:not(:checked) + .fi-btn.fi-color-primary .fi-icon { color: #64748B !important; }
.fi-fo-toggle-buttons-input:not(:checked) + .fi-btn.fi-color-primary:hover { background: #F4F7FB !important; }
