/*
Theme Name: UiCore Pro Child — RKT India
Theme URI: https://rktindia.in
Template: uicore-pro
Author: ClicksMedia
Author URI: https://clicksmedia.in
Description: Child theme for rktindia.in. Holds every RKT-specific customization that used to live directly in the parent UiCore Pro theme's functions.php, so the parent stays stock and update-safe. See context/14-change-log.md and context/13-known-issues.md #34.
Version: 1.0.0
Text Domain: uicore-pro-child
*/

/* RKT Page Title Override — hide UiCore's duplicate dark header-title stripe so custom Elementor hero banners lead each page. */
.uicore-page-title {
    display: none !important;
}

/* RKT Header Branding & Logo sizing */
.uicore-branding {
    width: auto !important;
    max-width: 170px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
}
.uicore-branding a {
    display: inline-flex !important;
    align-items: center !important;
    height: 48px !important;
}
.uicore-branding img.uicore-logo {
    display: none !important;
}
.uicore-branding img.uicore-main {
    display: inline-block !important;
    height: 38px !important;
    max-height: 38px !important;
    width: auto !important;
    object-fit: contain !important;
    opacity: 1 !important;
    visibility: visible !important;
}
@media (min-width: 992px) {
    .uicore-branding img.uicore-main {
        height: 48px !important;
        max-height: 48px !important;
    }
}

/* RKT Button Contrast Overrides — see known-issues #34 origin */
.elementor a.e-button-base,
a.e-button-base {
    color: #FFFFFF !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}
#hero-cta-quote,
#cta-band-quote {
    background-color: #C83E0E !important;
    color: #FFFFFF !important;
    border: 2px solid #C83E0E !important;
    border-radius: 6px !important;
    padding: 14px 28px !important;
    transition: all 0.25s ease !important;
}
#hero-cta-quote:hover,
#cta-band-quote:hover {
    background-color: #A3320B !important;
    border-color: #A3320B !important;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}
#hero-cta-call,
#cta-band-call {
    background-color: #154A93 !important;
    color: #FFFFFF !important;
    border: 2px solid #154A93 !important;
    border-radius: 6px !important;
    padding: 14px 28px !important;
    transition: all 0.25s ease !important;
}
#hero-cta-call:hover,
#cta-band-call:hover {
    background-color: #0d3266 !important;
    border-color: #0d3266 !important;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

/* ============================================================
   RKT Header — Floating "Island" Nav (desktop + mobile) + Quote CTA
   Added 2026-09-11, extended to mobile + submenu fix 2026-09-11 (v2).
   Reskins the native UiCore header markup
   (#wrapper-navbar > .uicore-header-wrapper > nav.uicore-container);
   no template override, no JS added or removed. See
   context/14-change-log.md for the structure this was built against.
   ============================================================ */

/* Header CTA button — "Quote" (text set in functions.php via the
   header_ctatext theme option). Brand orange, but the accessible
   #C83E0E variant, not the display-only #F05A26 (see tokens/rkt-tokens.css
   and CLAUDE.md) — white text on #F05A26 fails AA. Applies at every
   width — the mobile bar uses the same markup. */
.uicore-cta-wrapper a.uicore-btn {
    background-color: #C83E0E !important;
    color: #FFFFFF !important;
    border-radius: 999px !important;
    font-weight: 600 !important;
    transition: background-color 0.2s ease, transform 0.2s ease !important;
}
.uicore-cta-wrapper a.uicore-btn:hover {
    background-color: #A3320B !important;
    color: #FFFFFF !important;
    transform: translateY(-1px);
}

/* --- Island shell: applies at every width, mobile first. ---
   #wrapper-navbar is the outer positioned element; .uicore-header-wrapper
   (inside it) stays position:relative from the plugin's own base CSS and
   is only the visual card — confirmed by reading uicore-framework's
   header.css rather than assumed. */
#wrapper-navbar.uicore-navbar {
    position: fixed;
    top: 12px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 24px);
    max-width: 1176px;
    z-index: 999;
}
/* uicore-sticky is added by the theme's own scroll-direction JS; without
   this it would jump from fixed/top:12px to sticky/top:0. */
#wrapper-navbar.uicore-navbar.uicore-sticky {
    position: fixed;
    top: 12px;
}

#wrapper-navbar .uicore-header-wrapper {
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(10, 34, 67, 0.18), 0 2px 8px rgba(10, 34, 67, 0.08);
    /* NOT overflow:hidden — that was clipping the desktop dropdown
       sub-menus to the pill's own height (found + fixed 2026-09-11 v2).
       The glass background below has its own border-radius, so clipping
       isn't needed for rounded corners; nothing else here needs it. */
}

/* Frosted-glass background. The plugin already renders a `:before` layer
   here (see uicore-framework/assets/css/global/header.css) but normally
   only fades it in once `.uicore-scrolled` is added by JS — before that
   it's opacity:0 so the transparent header shows the hero straight
   through. Force it visible always, so the island reads as a solid glass
   card even sitting over the dark hero pre-scroll. */
#wrapper-navbar .uicore-header-wrapper:before {
    opacity: 1 !important;
    background-color: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: inherit;
}

/* Menu/hamburger text colour: the plugin swaps these two CSS custom
   properties to white for "transparent, not yet scrolled" headers, on the
   assumption the bar is see-through over a photo/dark hero. Since the
   glass card above is now always light, put dark text back. */
#wrapper-navbar.uicore-transparent:not(.uicore-scrolled) {
    --uicore-header--menu-typo-c: #231F20;
    --uicore-header--menu-typo-ch: #154A93;
}

#wrapper-navbar nav.uicore.uicore-container {
    padding: 6px 16px;
}

/* Sub-menu dropdowns (desktop hover menus): the plugin renders these with
   box-shadow already; make sure they sit visually detached from the glass
   card rather than looking fused to it, and confirm no ancestor between
   here and #wrapper-navbar can reintroduce clipping. */
#wrapper-navbar .uicore-menu .sub-menu {
    margin-top: 10px;
    border-radius: 12px;
    background-color: #FFFFFF;
}

/* The header used to be position:sticky, which stays in normal document
   flow and reserves its own height at the top of the page. Making it
   position:fixed (above) takes it OUT of flow, so every page's own first
   section would start at y:0, underneath the floating island — confirmed
   on /about/, where the hero eyebrow rendered partially hidden behind the
   pill. Compensate by reserving that space on the shared content wrapper,
   scaled per breakpoint below. Home V2 (page 543) is excluded: it uses
   the Elementor "header_footer" canvas template and already has 150px of
   its own hero padding that clears the island fine — adding this here too
   would just stack unnecessary extra whitespace on top of that. */
body:not(.page-template-elementor_header_footer) #content.uicore-content {
    padding-top: 96px;
}

@media (min-width: 1025px) {
    #wrapper-navbar.uicore-navbar {
        top: 18px;
        width: calc(100% - 48px);
    }
    #wrapper-navbar.uicore-navbar.uicore-sticky {
        top: 18px;
    }
    #wrapper-navbar .uicore-header-wrapper {
        border-radius: 20px;
    }
    #wrapper-navbar nav.uicore.uicore-container {
        padding: 8px 24px;
    }
    body:not(.page-template-elementor_header_footer) #content.uicore-content {
        padding-top: 140px;
    }
}

/* Mobile full-screen menu drawer (.uicore-navigation-wrapper — a separate
   element from #wrapper-navbar, opened by the hamburger). Pre-existing
   bug, found while testing the island on mobile: its background is RKT
   navy (#0A2243, set via the theme's mobile_menu_bg option) but its menu
   text color variable was still "Headline" (#231F20, near-black) — both
   dark, so every link and the hamburger/close bars were nearly invisible.
   Not caused by the island CSS (confirmed: the variable is defined on
   `body` and this element is a sibling of #wrapper-navbar, not a
   descendant, so the top-bar override above never reached it) — just
   newly noticed because this is the first time this session opened the
   mobile drawer. Same fix pattern as the top bar: override the CSS custom
   properties every consumer already reads, rather than styling each
   consumer separately. Accent orange for hover passes AA here — the
   3.39:1 contrast that fails for small/normal text (CLAUDE.md) clears the
   3:1 large-text threshold at this menu's bold weight and size. */
.uicore-navigation-wrapper.uicore-mobile-menu-wrapper {
    /* Must match or beat the plugin's own selector specificity here —
       `.uicore-navbar.uicore-mobile-menu-wrapper` (2 classes) inside its
       own max-width:1025px media query — or this loses the cascade even
       though it loads later. Confirmed via the live generated CSS, not
       assumed. */
    --uicore-header--menu-typo-c: #FFFFFF !important;
    --uicore-header--menu-typo-ch: #F05A26 !important;
}
