/* ============================================================
   BTL Custom Visual Polish CSS
   Authorized scope ONLY: card shadows, hover lift, hover
   transitions, subtle scaling, border glow, icon circle
   styling, glass/translucent panels. Layout stays in Elementor.
   ============================================================ */

/* --- Card shadow + hover lift (Trusted Pathways, Partner Universities) --- */
.btl-card .elementor-icon-box-wrapper {
  background: #FFFFFF;
  border-radius: 10px;
  padding: 32px 24px;
  box-shadow: 0 2px 10px rgba(5,10,68,0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.btl-card .elementor-icon-box-wrapper:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 30px rgba(5,10,68,0.16);
}

/* --- Testimonial cards: border + subtle shadow on dark background --- */
.btl-testimonial-card .elementor-testimonial__content,
.btl-testimonial-card .elementor-testimonial {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 10px;
  padding: 28px;
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
.btl-testimonial-card:hover .elementor-testimonial__content,
.btl-testimonial-card:hover .elementor-testimonial {
  box-shadow: 0 10px 26px rgba(0,0,0,0.25);
  border-color: rgba(212,175,55,0.4);
}

/* --- Equal card heights within a row --- */
.btl-card { display: flex; }
.btl-card .elementor-widget-container { display: flex; width: 100%; }
.btl-card .elementor-icon-box-wrapper { width: 100%; display: flex; flex-direction: column; }
.btl-card .elementor-icon-box-content { flex-grow: 1; display: flex; flex-direction: column; }

/* --- Button hover lift (site-wide, complements Kit shadow already set) --- */
.elementor-button { transition: transform 0.2s ease, box-shadow 0.25s ease, background-color 0.3s ease; }
.elementor-button:hover { transform: translateY(-2px); }
/* --- Remove default browser underline on linked icon-box titles (pre-existing site-wide behavior, made visually obvious by larger circular cards) --- */
.elementor-icon-box-title a { text-decoration: none !important; }

/* --- Icon circles: final brand spec (64px/22px, green bg, gold icon, gold hover) --- */
.elementor-view-stacked.elementor-shape-circle .elementor-icon {
  width: 64px;
  height: 64px;
  background-color: rgba(105, 179, 76, 0.12) !important;
  border: 1px solid rgba(105, 179, 76, 0.35);
  box-shadow: 0 8px 24px rgba(14, 35, 68, 0.08);
  transition: all 250ms ease;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}
.elementor-view-stacked.elementor-shape-circle .elementor-icon svg,
.elementor-view-stacked.elementor-shape-circle .elementor-icon i {
  width: 22px;
  height: 22px;
  font-size: 22px;
  color: #69B34C !important;
  fill: #69B34C !important;
  transition: fill 250ms ease, color 250ms ease;
}
.btl-card:hover .elementor-view-stacked.elementor-shape-circle .elementor-icon,
.elementor-icon-box-wrapper:hover .elementor-view-stacked.elementor-shape-circle .elementor-icon {
  background-color: #BA9A30 !important;
  border-color: #BA9A30;
}
.btl-card:hover .elementor-view-stacked.elementor-shape-circle .elementor-icon svg,
.btl-card:hover .elementor-view-stacked.elementor-shape-circle .elementor-icon i,
.elementor-icon-box-wrapper:hover .elementor-view-stacked.elementor-shape-circle .elementor-icon svg,
.elementor-icon-box-wrapper:hover .elementor-view-stacked.elementor-shape-circle .elementor-icon i {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
.elementor-icon-box-title a { text-decoration: none !important; }
/* --- Hero rotating gallery: force positioning context, avoid ambiguity --- */
.btl-hero-gallery-wrap { position: absolute !important; top: 0; left: 0; right: 0; bottom: 0; }
.btl-hero-gallery-wrap .btl-hero-slide { position: absolute !important; top: 0; left: 0; right: 0; bottom: 0; }
.elementor-widget-html:has(.btl-hero-gallery-wrap) { position: static; }
.elementor-widget-html:has(.btl-hero-gallery-wrap) .elementor-widget-container { position: static; }

/* --- Mobile hero: constrain paragraph width, consistent CTA button spacing --- */
@media (max-width: 767px) {
  .elementor-element-e064c36 .elementor-widget-text-editor { max-width: 90%; margin-left: auto !important; margin-right: auto !important; }
  .elementor-element-5eeef0b { flex-direction: column !important; }
  .elementor-element-5eeef0b > .elementor-column { width: 100% !important; margin-bottom: 12px; }
  .elementor-element-5eeef0b > .elementor-column:last-child { margin-bottom: 0; }
}

/* --- New CTA menu items: prominent buttons in mobile drawer only, hidden on desktop --- */
.btl-mobile-cta-menu-item { display: none; }
@media (max-width: 767px) {
  .xpro-elementor-horizontal-menu-responsive-mobile .btl-mobile-cta-menu-item { display: block !important; margin: 8px 20px; }
  .xpro-elementor-horizontal-menu-responsive-mobile .btl-mobile-cta-menu-item > a { display: block !important; text-align: center !important; padding: 13px 16px !important; border-radius: 6px !important; min-height: 44px; font-weight: 600 !important; background: rgba(255,255,255,0.08); }
  .xpro-elementor-horizontal-menu-responsive-mobile li.btl-mobile-cta-menu-item:nth-last-child(2) > a { background: #D4AF37 !important; color: #050A44 !important; }
  .xpro-elementor-horizontal-menu-responsive-mobile li.btl-mobile-cta-menu-item:last-child > a { background: #D4AF37 !important; color: #050A44 !important; }
  .xpro-elementor-horizontal-menu-responsive-mobile .elementor-nav-menu--dropdown a, .xpro-elementor-horizontal-menu-responsive-mobile li a { min-height: 44px; display: flex; align-items: center; padding: 12px 20px !important; }
}

/* --- Fix: drawer panel cut off on the right edge (regression from header flex-wrap change) --- */
@media screen and (max-width: 767px) {
  body .xpro-elementor-horizontal-navbar-wrapper.xpro-push-right { width: 100vw !important; max-width: 100vw !important; left: 0 !important; right: 0 !important; }
  body .xpro-elementor-horizontal-navbar { width: 100% !important; max-width: 100% !important; }
}

/* --- Course category icons: fix invisible icons (missing view-stacked/shape-circle classes on older content) + centering --- */
.btl-coursecat-icon .elementor-icon-box-icon { border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.btl-coursecat-icon .elementor-icon { display: flex !important; align-items: center; justify-content: center; }
.btl-coursecat-icon .elementor-icon svg { width: 24px !important; height: 24px !important; fill: #0E5C4A !important; }
.btl-coursecat-icon .elementor-icon-box-content { text-align: center !important; }
.btl-coursecat-icon { text-align: center !important; }

/* --- Site-wide fix: circle icon-boxes with missing auto-generated Elementor classes (empty icon bug) --- */
.btl-icon-fix .elementor-icon-box-icon { border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.btl-icon-fix .elementor-icon { display: flex !important; align-items: center; justify-content: center; }
.btl-icon-fix .elementor-icon svg { width: 22px !important; height: 22px !important; fill: #0E5C4A !important; }
.btl-icon-fix .elementor-icon-box-content, .btl-icon-fix { text-align: center !important; }

/* Header: swap Login/SignUp vs My Account/Logout based on real login state */
body.logged-in .btl-guest-only { display: none !important; }
body:not(.logged-in) .btl-loggedin-only { display: none !important; }

/* Tutor LMS: rebrand primary color to Bang Ti Lenydoor navy/gold (CSS-only override, no template changes) */
:root {
  --tutor-color-primary: #050A44 !important;
  --tutor-color-primary-hover: #050A44 !important;
  --tutor-color-primary-rgb: 15, 42, 74 !important;
  --tutor-color-secondary: #D4AF37 !important;
  --tutor-color-success: #69B34C !important;
  --tutor-color-success-rgb: 105, 179, 76 !important;
  --tutor-color-danger: #DC2626 !important;
  --tutor-color-danger-rgb: 166, 50, 30 !important;
  --tutor-color-warning: #F59E0B !important;
  --tutor-color-warning-rgb: 184, 134, 11 !important;
  --tutor-color-brand: #050A44 !important;
}

/* Header: My Account dropdown (hover-reveal Logout) */
.btl-account-dropdown { position: relative; display: inline-block; }
.btl-account-trigger { display: inline-flex; align-items: center; gap: 4px; color: #050A44; font-family: Inter, sans-serif; font-weight: 600; font-size: 13px; padding: 9px 16px; border: 1px solid #050A44; border-radius: 3px; text-decoration: none; }
.btl-caret { font-size: 10px; line-height: 1; }
.btl-account-menu { display: none; position: absolute; top: 100%; right: 0; background: #050A44; border: 1px solid rgba(255,255,255,0.15); border-radius: 4px; min-width: 140px; padding: 6px 0; z-index: 999; margin-top: 4px; }
.btl-account-dropdown:hover .btl-account-menu, .btl-account-dropdown:focus-within .btl-account-menu { display: block; }
.btl-account-menu a.btl-logout-btn { display: block; padding: 8px 16px; color: #FFFFFF; font-family: Inter, sans-serif; font-size: 13px; text-decoration: none; }
.btl-account-menu a.btl-logout-btn:hover { background: rgba(255,255,255,0.08); color: #D4AF37; }

/* ===== HEADER COMPLETE FLEXBOX REBUILD (desktop only, >767px) ===== */
@media (min-width: 768px) {
  /* Apply Now must never clip */

  /* 4. Vertical centering + identical button heights everywhere in utility row */
  .elementor-element-6f33831 .elementor-widget-button .elementor-button,
  .elementor-element-6f33831 .btl-account-trigger {
    display: inline-flex !important;
    align-items: center !important;
    height: 38px !important;
    box-sizing: border-box !important;
  }
}


/* Mobile header: compact single-row logo + hamburger, matching clean mobile pattern */
@media (max-width: 767px) {
  .elementor-13 .elementor-element.elementor-element-cdd0db3 { display: none !important; }
  .elementor-13 .elementor-element.elementor-element-07616d4 { display: none !important; }
  .elementor-13 .elementor-element.elementor-element-43e39e9 { padding: 10px 16px !important; }
  .elementor-13 .elementor-element.elementor-element-1f3f30e { width: 100% !important; max-width: 100% !important; }
  .elementor-13 .elementor-element.elementor-element-df25011 { display: none !important; }
  .elementor-13 .elementor-element.elementor-element-1381c90 { width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; }
  .elementor-13 .elementor-element.elementor-element-56c3567 { padding: 4px 16px !important; }
}


/* Header: right-align the utility button cluster (Student Portal / Login / Sign Up / Apply Now) instead of centering it */
.elementor-13 .elementor-element.elementor-element-8c8d874 > .elementor-container {
  margin-left: auto !important;
  margin-right: 0 !important;
}


/* Header: fully collapse the inactive login-state column (was leaving an empty reserved slot -> big visual gap) */
body:not(.logged-in) .elementor-13 .elementor-element-cabea74 { display: none !important; }
body.logged-in .elementor-13 .elementor-element-1a0947e { display: none !important; }
body.logged-in .elementor-13 .elementor-element-497064e { display: none !important; }

/* Header: let the button cluster hug its content with a tight consistent gap instead of stretching across a fixed-width box */
.elementor-13 .elementor-element.elementor-element-8c8d874 > .elementor-container {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 14px !important;
  width: auto !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}
.elementor-13 .elementor-element.elementor-element-8c8d874 > .elementor-container > .elementor-column {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
}


/* ============================================================
   HOMEPAGE SCROLL-REVEAL: consistent fade+slide-up entrance
   for sections that previously had no animation set (27 of 42).
   Hero excluded intentionally (above the fold, no JS-gated content).
   Sections with a pre-existing native Elementor animation are
   left untouched to avoid double-animating.
   ============================================================ */
.elementor-9 .elementor-element-1eea505,
.elementor-9 .elementor-element-105c4b2,
.elementor-9 .elementor-element-b4118ce,
.elementor-9 .elementor-element-afae9c9,
.elementor-9 .elementor-element-196b325,
.elementor-9 .elementor-element-15e7a87,
.elementor-9 .elementor-element-ffc4f76,
.elementor-9 .elementor-element-0dc7784,
.elementor-9 .elementor-element-56e36ca,
.elementor-9 .elementor-element-cbf80fb,
.elementor-9 .elementor-element-0036ccc,
.elementor-9 .elementor-element-36b2563,
.elementor-9 .elementor-element-0f7f689,
.elementor-9 .elementor-element-bf02cff,
.elementor-9 .elementor-element-6a08077,
.elementor-9 .elementor-element-1e5497e,
.elementor-9 .elementor-element-2beb175,
.elementor-9 .elementor-element-2c61265,
.elementor-9 .elementor-element-122e89f,
.elementor-9 .elementor-element-c3f8532,
.elementor-9 .elementor-element-c6933c7,
.elementor-9 .elementor-element-0361d3d,
.elementor-9 .elementor-element-61fa88e,
.elementor-9 .elementor-element-cbdca9b,
.elementor-9 .elementor-element-3a20f0d,
.elementor-9 .elementor-element-24fa0da,
.elementor-9 .elementor-element-6c2f25b {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.elementor-9 .elementor-element-1eea505.btl-revealed,
.elementor-9 .elementor-element-105c4b2.btl-revealed,
.elementor-9 .elementor-element-b4118ce.btl-revealed,
.elementor-9 .elementor-element-afae9c9.btl-revealed,
.elementor-9 .elementor-element-196b325.btl-revealed,
.elementor-9 .elementor-element-15e7a87.btl-revealed,
.elementor-9 .elementor-element-ffc4f76.btl-revealed,
.elementor-9 .elementor-element-0dc7784.btl-revealed,
.elementor-9 .elementor-element-56e36ca.btl-revealed,
.elementor-9 .elementor-element-cbf80fb.btl-revealed,
.elementor-9 .elementor-element-0036ccc.btl-revealed,
.elementor-9 .elementor-element-36b2563.btl-revealed,
.elementor-9 .elementor-element-0f7f689.btl-revealed,
.elementor-9 .elementor-element-bf02cff.btl-revealed,
.elementor-9 .elementor-element-6a08077.btl-revealed,
.elementor-9 .elementor-element-1e5497e.btl-revealed,
.elementor-9 .elementor-element-2beb175.btl-revealed,
.elementor-9 .elementor-element-2c61265.btl-revealed,
.elementor-9 .elementor-element-122e89f.btl-revealed,
.elementor-9 .elementor-element-c3f8532.btl-revealed,
.elementor-9 .elementor-element-c6933c7.btl-revealed,
.elementor-9 .elementor-element-0361d3d.btl-revealed,
.elementor-9 .elementor-element-61fa88e.btl-revealed,
.elementor-9 .elementor-element-cbdca9b.btl-revealed,
.elementor-9 .elementor-element-3a20f0d.btl-revealed,
.elementor-9 .elementor-element-24fa0da.btl-revealed,
.elementor-9 .elementor-element-6c2f25b.btl-revealed {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .elementor-9 .elementor-element-1eea505,
.elementor-9 .elementor-element-105c4b2,
.elementor-9 .elementor-element-b4118ce,
.elementor-9 .elementor-element-afae9c9,
.elementor-9 .elementor-element-196b325,
.elementor-9 .elementor-element-15e7a87,
.elementor-9 .elementor-element-ffc4f76,
.elementor-9 .elementor-element-0dc7784,
.elementor-9 .elementor-element-56e36ca,
.elementor-9 .elementor-element-cbf80fb,
.elementor-9 .elementor-element-0036ccc,
.elementor-9 .elementor-element-36b2563,
.elementor-9 .elementor-element-0f7f689,
.elementor-9 .elementor-element-bf02cff,
.elementor-9 .elementor-element-6a08077,
.elementor-9 .elementor-element-1e5497e,
.elementor-9 .elementor-element-2beb175,
.elementor-9 .elementor-element-2c61265,
.elementor-9 .elementor-element-122e89f,
.elementor-9 .elementor-element-c3f8532,
.elementor-9 .elementor-element-c6933c7,
.elementor-9 .elementor-element-0361d3d,
.elementor-9 .elementor-element-61fa88e,
.elementor-9 .elementor-element-cbdca9b,
.elementor-9 .elementor-element-3a20f0d,
.elementor-9 .elementor-element-24fa0da,
.elementor-9 .elementor-element-6c2f25b {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* ============================================================
   WPFORMS: re-theme to match the site design system.
   Pure CSS custom-property overrides (WPForms 'modern markup'
   theming API) — no form content, fields, or logic touched.
   Was previously using WPForms defaults (generic blue #066aab
   button, generic red #d63637 error color), disconnected from
   the site's navy/gold/charcoal system.
   ============================================================ */
:root {
  --wpforms-field-border-radius: 6px !important;
  --wpforms-field-border-color: rgba(15, 42, 74, 0.2) !important;
  --wpforms-field-background-color: #FFFFFF !important;
  --wpforms-field-text-color: #2C2E3A !important;
  --wpforms-label-color: #050A44 !important;
  --wpforms-label-sublabel-color: #6B7280 !important;
  --wpforms-label-error-color: #DC2626 !important;
  --wpforms-button-border-radius: 6px !important;
  --wpforms-button-background-color: #D4AF37 !important;
  --wpforms-button-border-color: #D4AF37 !important;
  --wpforms-button-text-color: #050A44 !important;
  --wpforms-page-break-color: #D4AF37 !important;
  --wpforms-container-border-radius: 10px !important;
}

/* Submit button hover — matches the sitewide button hover-lift pattern */
.wpforms-container .wpforms-submit-container button.wpforms-submit,
.wpforms-container .wpforms-submit {
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
  box-shadow: 0 2px 10px rgba(5,10,68,0.12) !important;
}
.wpforms-container .wpforms-submit-container button.wpforms-submit:hover,
.wpforms-container .wpforms-submit:hover {
  background-color: #BA9A30 !important;
  border-color: #BA9A30 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(5,10,68,0.2) !important;
}

/* Accessible focus states (keyboard navigation) — visible navy focus ring */
.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus,
.wpforms-container .wpforms-submit:focus-visible {
  outline: 2px solid #050A44 !important;
  outline-offset: 2px !important;
}


/* ============================================================
   INLINE PROSE LINKS: brand color for plain text links inside
   body copy (article content, excerpts). Scoped narrowly so it
   never touches nav, buttons, or footer, which already have
   their own explicit widget-level styling. Astra theme had zero
   customization, meaning these were falling back to its stock
   default link color — same disconnected-default pattern found
   in WPForms earlier tonight.
   ============================================================ */
.elementor-widget-text-editor a,
.xpro-post-grid-excerpt a,
.entry-content a {
  color: #050A44;
  text-decoration: underline;
  text-decoration-color: rgba(15, 42, 74, 0.35);
  text-underline-offset: 2px;
  transition: color 0.2s ease, text-decoration-color 0.2s ease;
}
.elementor-widget-text-editor a:hover,
.elementor-widget-text-editor a:focus,
.xpro-post-grid-excerpt a:hover,
.entry-content a:hover,
.entry-content a:focus {
  color: #D4AF37;
  text-decoration-color: #D4AF37;
}


/* ============================================================
   CARD + BUTTON COLUMNS: when a column contains a .btl-card
   icon-box followed by a separate button widget, the button was
   landing at a different height per column since only the
   icon-box itself had equal-height treatment — the button below
   it wasn't accounted for. Stretch the icon-box to fill the
   column so every button in the row lands at the same height.
   ============================================================ */
.elementor-column:has(> .elementor-widget-wrap > .elementor-widget-icon-box.btl-card) > .elementor-widget-wrap {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}
.elementor-column:has(> .elementor-widget-wrap > .elementor-widget-icon-box.btl-card) > .elementor-widget-wrap > .elementor-widget-icon-box.btl-card {
  flex-grow: 1;
}


/* About page hero: give the overlay div a positioning context so position:absolute actually anchors to the hero, not some distant ancestor */
.elementor-element-0a62924 {
  position: relative !important;
  overflow: hidden !important;
}


/* Hero text legibility safety net now that overlay opacity is much lower — subtle shadow keeps white text readable against a busier, more visible photo */
.elementor-element-e064c36 .elementor-heading-title,
.elementor-element-e064c36 .elementor-widget-text-editor p,
.elementor-element-0a62924 .elementor-heading-title,
.elementor-element-0a62924 .elementor-widget-text-editor p {
  text-shadow: 0 2px 12px rgba(0,0,0,0.45);
}