/* =====================================================================
   Button effects — public site only (loaded by includes/header.php after
   style.css / page CSS, so the admin panel keeps its own buttons).
   Colourful gradients, hover shine / fill sweeps, icon motion, press state,
   click ripple (assets/js/script.js) and a visible keyboard focus ring.
   ===================================================================== */
:root {
    --bt-red-grad: linear-gradient(120deg, #ff7a5c 0%, #eb4132 30%, #c8301f 55%, #f08a24 80%, #ffb347 100%);
    --bt-saffron-grad: linear-gradient(120deg, #ffc46b 0%, #f08a24 30%, #e2661a 55%, #eb4132 80%, #c8301f 100%);
    --bt-fill-grad: linear-gradient(120deg, #eb4132 0%, #f08a24 100%);
    --bt-ease: cubic-bezier(.22, .9, .3, 1.2);
}

/* ---------- Shared base for every text button ---------- */
.btn, .btn-primary, .btn-outline, .k-btn, .cab-check-btn, .ride-submit {
    position: relative; overflow: hidden; isolation: isolate;
    transition: transform .35s var(--bt-ease), box-shadow .35s ease, color .3s ease,
                border-color .3s ease, background-position .6s ease, background-color .3s ease;
    -webkit-tap-highlight-color: transparent;
}
.btn i, .btn-primary i, .btn-outline i, .k-btn i, .cab-check-btn i, .ride-submit i {
    transition: transform .35s var(--bt-ease);
}

/* ---------- Filled buttons: sliding multi-colour gradient + shine sweep ---------- */
.btn-primary, .cab-check-btn, .ride-submit, .k-btn-red {
    background-image: var(--bt-red-grad); background-size: 250% 100%; background-position: 0% 50%;
    color: #fff; border-color: transparent;
}
.k-btn-saffron {
    background-image: var(--bt-saffron-grad); background-size: 250% 100%; background-position: 0% 50%;
    color: #fff; border-color: transparent;
}
.btn-primary::before, .cab-check-btn::before, .ride-submit::before, .k-btn-red::before, .k-btn-saffron::before {
    content: ''; position: absolute; top: 0; left: 0; width: 45%; height: 100%; z-index: -1;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,.45), transparent);
    transform: translateX(-160%) skewX(-20deg); transition: transform .75s ease; pointer-events: none;
}
.btn-primary:hover, .cab-check-btn:hover, .ride-submit:hover, .k-btn-red:hover {
    background-position: 100% 50%; color: #fff; transform: translateY(-3px) scale(1.02);
    box-shadow: 0 14px 30px rgba(235,65,50,.38), 0 4px 12px rgba(240,138,36,.30);
}
.k-btn-saffron:hover {
    background-position: 100% 50%; color: #fff; transform: translateY(-3px) scale(1.02);
    box-shadow: 0 14px 30px rgba(240,138,36,.45), 0 4px 12px rgba(235,65,50,.28);
}
.btn-primary:hover::before, .cab-check-btn:hover::before, .ride-submit:hover::before,
.k-btn-red:hover::before, .k-btn-saffron:hover::before { transform: translateX(320%) skewX(-20deg); }

/* ---------- Outline & ghost buttons: gradient fill sweeps in from the left ---------- */
.btn-outline, .k-btn-outline, .k-btn-ghost { background-clip: padding-box; }
.btn-outline::before, .k-btn-outline::before, .k-btn-ghost::before {
    content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
    background: var(--bt-fill-grad); transform: scaleX(0); transform-origin: left center;
    transition: transform .45s cubic-bezier(.65, 0, .35, 1); pointer-events: none;
}
.k-btn-ghost::before { background: linear-gradient(120deg, #fff 0%, #fff4e4 100%); }
.btn-outline:hover, .k-btn-outline:hover {
    color: #fff; border-color: #f08a24; background: #fff; transform: translateY(-3px) scale(1.02);
    box-shadow: 0 12px 26px rgba(235,65,50,.28);
}
.k-btn-ghost:hover { color: #6b1a14; border-color: #fff; background: rgba(255,255,255,.08); transform: translateY(-3px) scale(1.02); box-shadow: 0 12px 28px rgba(0,0,0,.28); }
.btn-outline:hover::before, .k-btn-outline:hover::before, .k-btn-ghost:hover::before { transform: scaleX(1); }

/* ---------- Icon motion ---------- */
.btn:hover .fa-arrow-right, .btn-primary:hover .fa-arrow-right, .btn-outline:hover .fa-arrow-right,
.k-btn:hover .fa-arrow-right, .ride-submit:hover .fa-arrow-right, .cab-check-btn:hover .fa-arrow-right { transform: translateX(5px); }
.btn:hover i:not(.fa-arrow-right), .btn-primary:hover i:not(.fa-arrow-right), .btn-outline:hover i:not(.fa-arrow-right),
.k-btn:hover i:not(.fa-arrow-right), .ride-submit:hover i:not(.fa-arrow-right), .cab-check-btn:hover i:not(.fa-arrow-right) {
    transform: scale(1.18) rotate(-10deg);
}

/* ---------- Press & keyboard focus ---------- */
.btn:active, .btn-primary:active, .btn-outline:active, .k-btn:active, .cab-check-btn:active, .ride-submit:active {
    transform: translateY(0) scale(.96); transition-duration: .1s;
}
.btn:focus-visible, .btn-primary:focus-visible, .btn-outline:focus-visible, .k-btn:focus-visible,
.cab-check-btn:focus-visible, .ride-submit:focus-visible, .cab-swap-btn:focus-visible, .k-swap:focus-visible,
.back-to-top:focus-visible, .whatsapp-float:focus-visible, .footer-social a:focus-visible, .k-quick-tabs button:focus-visible {
    outline: 3px solid #f3c969; outline-offset: 3px;
}

/* ---------- Click ripple (span injected by script.js) ---------- */
.btn-ripple {
    position: absolute; border-radius: 50%; pointer-events: none; z-index: 0;
    background: rgba(255,255,255,.55); transform: scale(0); animation: bt-ripple .65s ease-out forwards;
}
.btn-outline .btn-ripple, .k-btn-outline .btn-ripple { background: rgba(255,255,255,.5); }
@keyframes bt-ripple { to { transform: scale(4); opacity: 0; } }

/* ---------- Header "Enquiry": gentle living gradient ---------- */
.enquiry-btn { animation: bt-drift 6s ease-in-out infinite; }
.enquiry-btn:hover { animation-play-state: paused; }
@keyframes bt-drift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

/* ---------- Round icon buttons ---------- */
.cab-swap-btn, .k-swap {
    transition: transform .45s var(--bt-ease), background .3s ease, color .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.cab-swap-btn:hover, .k-swap:hover {
    background: var(--bt-fill-grad); color: #fff; border-color: transparent;
    transform: rotate(180deg) scale(1.1); box-shadow: 0 8px 20px rgba(235,65,50,.35);
}
.back-to-top { transition: transform .35s var(--bt-ease), opacity .3s ease, visibility .3s ease, box-shadow .3s ease, background .3s ease; }
.back-to-top.show:hover {
    background: var(--bt-fill-grad); transform: translateY(-4px) scale(1.08); box-shadow: 0 12px 26px rgba(235,65,50,.4);
}
.back-to-top.show:hover i { animation: bt-bounce .6s ease infinite alternate; }
@keyframes bt-bounce { to { transform: translateY(-3px); } }

.whatsapp-float::after {
    content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25d366;
    animation: bt-pulse 2.4s ease-out infinite; pointer-events: none;
}
@keyframes bt-pulse { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.6); opacity: 0; } }
.whatsapp-float:hover { transform: scale(1.12) rotate(-8deg); box-shadow: 0 12px 28px rgba(37,211,102,.55); }

.footer-social a { transition: transform .35s var(--bt-ease), background .3s ease, border-color .3s ease, color .3s ease, box-shadow .3s ease; }
.footer-social a:hover {
    background: linear-gradient(135deg, #ffc46b, #f08a24 55%, #eb4132); border-color: transparent; color: #fff;
    transform: translateY(-4px) rotate(8deg) scale(1.08); box-shadow: 0 10px 22px rgba(240,138,36,.4);
}

.nav-toggle { transition: transform .3s ease, color .3s ease; }
.nav-toggle:hover { color: var(--red); transform: scale(1.12); }

/* ---------- Home quick-booking tabs & text links ---------- */
.k-quick-tabs button { transition: color .25s ease, border-color .25s ease, background .25s ease; border-radius: 10px 10px 0 0; }
.k-quick-tabs button:hover:not(.is-active) { color: #eb4132; background: #fff6ec; }
.k-quick-tabs button i { transition: transform .35s var(--bt-ease); }
.k-quick-tabs button:hover i { transform: scale(1.2) rotate(-8deg); }

.k-link, .tour-itinerary-link, .ride-back { position: relative; }
.k-link::after {
    content: ''; position: absolute; left: 0; bottom: -3px; width: 100%; height: 2px; border-radius: 2px;
    background: var(--bt-fill-grad); transform: scaleX(0); transform-origin: left; transition: transform .35s ease;
}
.k-place:hover .k-link::after, .k-beyond-card:hover .k-link::after, .k-link:hover::after { transform: scaleX(1); }

/* ---------- Respect reduced-motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
    .enquiry-btn, .whatsapp-float::after, .back-to-top.show:hover i, .btn-ripple { animation: none; }
    .btn, .btn-primary, .btn-outline, .k-btn, .cab-check-btn, .ride-submit, .cab-swap-btn, .k-swap,
    .btn::before, .btn-primary::before, .btn-outline::before, .k-btn::before, .cab-check-btn::before, .ride-submit::before {
        transition: none;
    }
    .btn:hover, .btn-primary:hover, .btn-outline:hover, .k-btn:hover, .cab-check-btn:hover, .ride-submit:hover,
    .cab-swap-btn:hover, .k-swap:hover, .whatsapp-float:hover, .footer-social a:hover { transform: none; }
}