/*
 |--------------------------------------------------------------------------
 | V2 Visual Theme  (design-only re-skin)
 |--------------------------------------------------------------------------
 | Restores the legacy V2 look & feel on top of the V3 markup WITHOUT touching
 | any page structure, Alpine logic, routes or business rules. Loaded globally
 | from resources/views/v3/layouts/base.blade.php.
 |
 | What it does:
 |   1. Typography  -> V2 used 'Montserrat'  (V3 shipped 'Inter')
 |   2. Brand accent -> V3's indigo (#4f46e5) is remapped to V2's blue (#0080ff)
 |      across every Tailwind indigo utility (bg/text/border/ring/gradient +
 |      hover/focus variants). The navbar & footer were already V2-styled.
 |
 | Pure CSS. No V2 functionality, workflow or legacy code is reintroduced.
 */

:root {
    --v2-blue:        #0080ff;
    --v2-blue-dark:   #006ad6;
    --v2-blue-600:    #0080ff;
    --v2-navy:        #002b5b;
    --v2-navy-deep:   #010564;

    /* Redefine the Tailwind v4 indigo colour scale -> V2 blue family.
       v4 utilities reference these vars, so bg/text/border/ring/gradients
       all recolour automatically where the CDN/compiled build uses them. */
    --color-indigo-50:  #eef6ff;
    --color-indigo-100: #d6e8fb;
    --color-indigo-200: #b3d4f7;
    --color-indigo-300: #8cbef2;
    --color-indigo-400: #4d9bec;
    --color-indigo-500: #1a86ff;
    --color-indigo-600: #0080ff;
    --color-indigo-700: #006ad6;
    --color-indigo-800: #0056b3;
    --color-indigo-900: #003c80;
    --color-indigo-950: #002a5c;
}

/* 1) Typography & shared V2 design language (matches the home page) -------- */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #1E293B;
}

/* Playfair Display headings — the V2 "display" look used on the home page */
.font-display { font-family: 'Playfair Display', Georgia, serif; letter-spacing: -0.02em; }

/* V2 gradient text + buttons + card hover (same as the home page) */
.gradient-text {
    background: linear-gradient(135deg, #0080FF 0%, #002B5B 100%);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.btn-primary {
    background: linear-gradient(135deg, #0080FF 0%, #0066CC 100%);
    box-shadow: 0 4px 12px rgba(0, 128, 255, 0.3);
    transition: all 0.3s ease;
}
.btn-primary:hover { box-shadow: 0 8px 20px rgba(0, 128, 255, 0.4); transform: translateY(-2px); }
.card-hover { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
.card-hover:hover { transform: translateY(-8px); box-shadow: 0 20px 40px -12px rgba(0, 128, 255, 0.2); }

/* 2) Explicit utility overrides --------------------------------------------
   Guaranteed remap regardless of Tailwind version / CDN vs compiled build. */

/* backgrounds */
.bg-indigo-50  { background-color: #eef6ff !important; }
.bg-indigo-100 { background-color: #d6e8fb !important; }
.bg-indigo-500 { background-color: #1a86ff !important; }
.bg-indigo-600 { background-color: #0080ff !important; }
.bg-indigo-700 { background-color: #006ad6 !important; }
.hover\:bg-indigo-50:hover  { background-color: #eef6ff !important; }
.hover\:bg-indigo-100:hover { background-color: #d6e8fb !important; }
.hover\:bg-indigo-600:hover { background-color: #0080ff !important; }
.hover\:bg-indigo-700:hover { background-color: #006ad6 !important; }

/* text */
.text-indigo-100 { color: #d6e8fb !important; }
.text-indigo-400 { color: #4d9bec !important; }
.text-indigo-500 { color: #1a86ff !important; }
.text-indigo-600 { color: #0080ff !important; }
.text-indigo-700 { color: #006ad6 !important; }
.text-indigo-800 { color: #0056b3 !important; }
.text-indigo-900 { color: #003c80 !important; }
.hover\:text-indigo-600:hover { color: #0080ff !important; }
.hover\:text-indigo-700:hover { color: #006ad6 !important; }
.hover\:text-indigo-800:hover { color: #0056b3 !important; }
.hover\:text-indigo-900:hover { color: #003c80 !important; }

/* borders */
.border-indigo-200 { border-color: #b3d4f7 !important; }
.border-indigo-300 { border-color: #8cbef2 !important; }
.border-indigo-400 { border-color: #4d9bec !important; }
.border-indigo-500 { border-color: #0080ff !important; }
.hover\:border-indigo-300:hover { border-color: #8cbef2 !important; }
.hover\:border-indigo-400:hover { border-color: #4d9bec !important; }
.focus\:border-indigo-500:focus { border-color: #0080ff !important; }

/* rings (focus states) */
.ring-indigo-200 { --tw-ring-color: #b3d4f7 !important; }
.ring-indigo-500 { --tw-ring-color: #0080ff !important; }
.focus\:ring-indigo-500:focus { --tw-ring-color: #0080ff !important; }

/* gradients (hero buttons / banners) */
.from-indigo-50  { --tw-gradient-from: #eef6ff !important; }
.from-indigo-600 { --tw-gradient-from: #0080ff !important; }
.via-indigo-600  { --tw-gradient-via:  #0080ff !important; }
.to-indigo-50    { --tw-gradient-to:   #eef6ff !important; }
.to-indigo-600   { --tw-gradient-to:   #0080ff !important; }
.hover\:to-indigo-700:hover { --tw-gradient-to: #006ad6 !important; }

/* Accent-coloured native form controls (checkboxes/radios) -> V2 blue */
.text-indigo-600[type="checkbox"],
.text-indigo-600[type="radio"] { accent-color: #0080ff !important; }