/*
Theme Name:  BBA Institute
Theme URI:   https://bba.institute
Description: BBA Institute branded child theme for Astra. Dark navy header, blue accent, LearnDash rebrand.
Author:      HomeMāin Development
Template:    astra
Version:     1.0.0
*/

/* ============================================================
   BRAND TOKENS
   Primary dark:  #0a1f38
   Mid dark:      #0f2a48
   Blue:          #2563eb
   Blue hover:    #1d4ed8
   Text light:    #e2e8f0
   Text muted:    #94a3b8
   Body text:     #1f2937
   Headings:      #0f172a
   ============================================================ */

/* ============================================================
   1. GLOBAL CSS VARIABLES
   ============================================================ */
:root {
  --bba-dark:        #0a1f38;
  --bba-dark-mid:    #0f2a48;
  --bba-blue:        #2563eb;
  --bba-blue-hover:  #1d4ed8;
  --bba-text-light:  #e2e8f0;
  --bba-text-muted:  #94a3b8;

  /* Override Astra palette: yellow (#f7b500) → blue, old-blue (#1579e6) → brand blue */
  --ast-global-color-0: #2563eb;
  --ast-global-color-1: #2563eb;
  --ast-global-color-3: #334155;

  /* LearnDash colour tokens */
  --ldx-btn-primary-bg-color:              #2563eb;
  --ldx-btn-primary-bg-color-hover:        #1d4ed8;
  --ldx-btn-primary-text-color:            #ffffff;
  --ldx-btn-primary-text-color-hover:      #ffffff;
  --ldx-btn-standard-bg-color:             #2563eb;
  --ldx-btn-standard-bg-color-hover:       #1d4ed8;
  --ldx-btn-standard-text-color:           #ffffff;
  --ldx-btn-standard-text-color-hover:     #ffffff;
  --ldx-color-primary-dark:                #2563eb;
  --ldx-color-primary-light:               rgba(37,99,235,0.15);
  --ldx-login-panel-heading-color:         #2563eb;
  --ldx-content-lists-header-bg-color:     #0f2a48;
  --ldx-content-lists-header-text-color:   #ffffff;
  --ldx-tooltip-bg-color:                  #2563eb;
  --ldx-register-panel-bg-color:           #2563eb;
  --ldx-focus-mode-topmenu-bg-color:       #0a1f38;
  --ldx-focus-mode-topmenu-text-color:     #e2e8f0;
  --ldx-focus-mode-sidebar-course-bg-color:#0f2a48;
  --ldx-focus-mode-sidebar-course-text-color: #ffffff;
  --ldx-course-nav-link-text-color-hover:  #2563eb;
  --ldx-content-lists-lesson-text-color-hover: #2563eb;
  --ldx-grid-ribbon-enrolled-bg-color:     #2563eb;
  --ldx-grid-ribbon-enrolled-text-color:   #ffffff;
  --ldx-pagination-bg-color:               rgba(37,99,235,0.1);
}

/* ============================================================
   2. HEADER — Dark branded nav (all pages except homepage
      which uses a disabled Astra header + custom HTML nav)
   ============================================================ */
.main-header-bar,
.ast-primary-header-bar {
  background-color: var(--bba-dark) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

/* Desktop nav links */
.ast-desktop .main-header-menu > .menu-item > .menu-link,
.ast-builder-menu-1 .main-header-menu > .menu-item > .menu-link {
  color: var(--bba-text-light) !important;
}
.ast-desktop .main-header-menu > .menu-item > .menu-link:hover,
.ast-builder-menu-1 .main-header-menu > .menu-item:hover > .menu-link,
.main-header-menu > .current-menu-item > .menu-link,
.main-header-menu > .current-menu-ancestor > .menu-link {
  color: #ffffff !important;
}

/* Site title text */
.site-title a,
.site-title a:visited {
  color: #ffffff !important;
}

/* Header CTA button */
.ast-header-button-1 .ast-custom-button {
  background-color: var(--bba-blue) !important;
  color: #ffffff !important;
  border-color: var(--bba-blue) !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}
.ast-header-button-1 .ast-custom-button:hover {
  background-color: var(--bba-blue-hover) !important;
  border-color: var(--bba-blue-hover) !important;
}

/* Sub-menus */
.main-header-menu .sub-menu {
  background-color: var(--bba-dark-mid) !important;
  border-top: 2px solid var(--bba-blue) !important;
}
.main-header-menu .sub-menu .menu-link {
  color: var(--bba-text-light) !important;
}
.main-header-menu .sub-menu .menu-link:hover {
  color: #ffffff !important;
  background-color: rgba(255,255,255,0.06) !important;
}

/* Mobile hamburger icon */
.ast-mobile-menu-trigger-fill,
.mobile-menu-toggle-icon svg path,
.ast-button-wrap .menu-toggle.main-header-menu-toggle {
  fill: var(--bba-text-light) !important;
  color: var(--bba-text-light) !important;
}

/* Mobile drawer */
#ast-mobile-header .main-header-bar,
.ast-mobile-header-wrap .main-header-bar {
  background-color: var(--bba-dark) !important;
}
.ast-mobile-header-content .menu-link {
  color: var(--bba-text-light) !important;
  border-bottom-color: rgba(255,255,255,0.07) !important;
}

/* ============================================================
   3. FOOTER
   ============================================================ */
.site-footer,
.ast-small-footer,
#colophon {
  background-color: var(--bba-dark) !important;
  color: var(--bba-text-muted) !important;
}
.site-footer a,
.ast-small-footer a,
#colophon a {
  color: #60a5fa !important;
}
.site-footer a:hover,
.ast-small-footer a:hover,
#colophon a:hover {
  color: #93c5fd !important;
  text-decoration: underline;
}
.ast-footer-overlay {
  background-color: var(--bba-dark) !important;
}

/* ============================================================
   4. GLOBAL TYPOGRAPHY & LINKS
   ============================================================ */
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color: #1f2937;
}

h1, h2, h3, h4, h5, h6,
.entry-content :where(h1, h2, h3, h4, h5, h6) {
  color: #0f172a;
  font-weight: 700;
}

a {
  color: var(--bba-blue);
}
a:hover {
  color: var(--bba-blue-hover);
}

/* ============================================================
   5. BUTTONS — Global
   ============================================================ */
.ast-button-wrap .button,
.wp-element-button,
input[type="submit"],
button[type="submit"],
.elementor-button.elementor-size-sm,
.elementor-button.elementor-size-md,
.elementor-button.elementor-size-lg,
.elementor-button.elementor-size-xl {
  background-color: var(--bba-blue) !important;
  color: #ffffff !important;
  border-color: var(--bba-blue) !important;
  border-radius: 6px !important;
}
.ast-button-wrap .button:hover,
.wp-element-button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background-color: var(--bba-blue-hover) !important;
  border-color: var(--bba-blue-hover) !important;
}

/* ============================================================
   6. LEARNDASH — Full rebrand
   ============================================================ */

/* Progress bars */
.learndash-wrapper .ld-progress-bar .ld-progress-bar-percentage,
.ld-progress .ld-progress-bar-percentage {
  background-color: var(--bba-blue) !important;
}

/* Buttons */
.learndash-wrapper .ld-button,
.learndash-wrapper .btn-join,
.learndash-wrapper input[type="submit"],
.learndash-wrapper button[type="submit"],
.learndash-wrapper .ld-primary-background,
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-list-item-title a.ld-btn,
.ld-login-button {
  background-color: var(--bba-blue) !important;
  color: #ffffff !important;
  border-color: var(--bba-blue) !important;
  border-radius: 6px !important;
}
.learndash-wrapper .ld-button:hover,
.learndash-wrapper .btn-join:hover,
.ld-login-button:hover {
  background-color: var(--bba-blue-hover) !important;
  border-color: var(--bba-blue-hover) !important;
}

/* Focus mode top bar */
.ld-focus .ld-focus-header,
.ld-focus-header {
  background-color: var(--bba-dark) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}
.ld-focus .ld-focus-header .ld-focus-header-links a,
.ld-focus-header .ld-focus-header-links a {
  color: var(--bba-text-light) !important;
}

/* Focus mode sidebar */
.ld-focus .ld-focus-sidebar__header,
.ld-focus-sidebar__header {
  background-color: var(--bba-dark-mid) !important;
  color: #ffffff !important;
}

/* Course list headers */
.learndash-wrapper .ld-item-list .ld-item-list-heading,
.ld-item-list .ld-section-heading {
  background-color: var(--bba-dark-mid) !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.1) !important;
}

/* Active/enrolled ribbon */
.learndash-wrapper .ld-ribbon-enrolled,
.ld-ribbon-enrolled {
  background-color: var(--bba-blue) !important;
  color: #ffffff !important;
}

/* Course status badge */
.learndash-wrapper .ld-course-status .ld-course-status-action .ld-button {
  background-color: var(--bba-blue) !important;
}

/* Login panel */
.learndash-wrapper .ld-login-modal .ld-login-panel,
.ld-login-panel {
  border-color: var(--bba-blue) !important;
}
.learndash-wrapper .ld-login-modal .ld-login-panel__heading,
.ld-login-panel__heading {
  color: var(--bba-blue) !important;
}

/* Registration panel */
.learndash-wrapper .ld-login-modal .ld-register-panel,
.ld-register-panel {
  background-color: var(--bba-dark) !important;
}

/* Pagination */
.learndash-wrapper .ld-pagination .ld-page-item.ld-active .ld-page-link,
.ld-pagination .ld-page-item.ld-active .ld-page-link {
  background-color: var(--bba-blue) !important;
  color: #ffffff !important;
}

/* Quiz elements */
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionList label:hover,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_questionList .wpProQuiz_radio:checked + label {
  border-color: var(--bba-blue) !important;
}
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button,
.learndash-wrapper .wpProQuiz_content .wpProQuiz_button2 {
  background-color: var(--bba-blue) !important;
  border-color: var(--bba-blue) !important;
}

/* Alerts/notices */
.learndash-wrapper .ld-alert-success {
  border-color: #10b981 !important;
  color: #065f46 !important;
}
.learndash-wrapper .ld-alert-warning {
  border-color: #f59e0b !important;
}

/* Lesson/topic nav */
.learndash-wrapper .ld-item-list .ld-item-list-item:hover,
.ld-item-list-item:hover {
  color: var(--bba-blue) !important;
}
.learndash-wrapper .ld-item-list .ld-item-list-item .ld-item-name a:hover {
  color: var(--bba-blue) !important;
}

/* Completed items */
.learndash-wrapper .ld-item-list .ld-item-list-item.ld-is-complete .ld-status-icon,
.ld-status-complete .ld-icon {
  color: #10b981 !important;
  fill: #10b981 !important;
}

/* ============================================================
   7. WOOCOMMERCE (shop/checkout)
   ============================================================ */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button.alt,
.woocommerce a.button.alt {
  background-color: var(--bba-blue) !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover {
  background-color: var(--bba-blue-hover) !important;
}
.woocommerce .woocommerce-info {
  border-top-color: var(--bba-blue) !important;
}
.woocommerce .woocommerce-info::before {
  color: var(--bba-blue) !important;
}

/* ============================================================
   8. FORMS
   ============================================================ */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border-color: var(--bba-blue) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,0.15) !important;
  outline: none !important;
}

/* ============================================================
   9. ASTRA PAGE TITLE BANNER
   ============================================================ */
.ast-archive-description .ast-archive-title,
.entry-header .entry-title,
.page-title {
  color: #0f172a;
  font-weight: 800;
}

/* Override page title area bg if Astra sets yellow/blue */
.ast-banner-title-area {
  background-color: var(--bba-dark) !important;
}
.ast-banner-title-area .entry-title,
.ast-banner-title-area .page-title {
  color: #ffffff !important;
}

/* ============================================================
   10. CONTRAST FIXES (global)
   ============================================================ */
/* Any muted text on dark backgrounds */
.site-footer p,
.site-footer li {
  color: var(--bba-text-muted);
}

/* ============================================================
   11. LEARNDASH — Fix repeated access message + course UI
   ============================================================ */

/* Hide duplicate access restriction banners — show only first */
.ld-alert-warning ~ .ld-alert-warning,
.learndash-wrapper .ld-alert-warning + .ld-alert-warning,
#ld-content-message + #ld-content-message,
.learndash_access_denied + .learndash_access_denied {
  display: none !important;
}

/* Clean up the access denied message styling */
.learndash-wrapper .learndash_access_denied,
.ld-access-denied-message {
  background: #fef3c7 !important;
  border: 1px solid #f59e0b !important;
  color: #92400e !important;
  border-radius: 8px !important;
  padding: 12px 20px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
}

/* Course status bar */
.learndash-wrapper .ld-course-status {
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* ============================================================
   12. HEADER LOGO sizing
   ============================================================ */
.site-logo-img img,
.custom-logo {
  max-height: 60px !important;
  width: auto !important;
}

/* Ensure logo is visible on dark bg */
.main-header-bar .custom-logo-link img {
  filter: brightness(1) !important;
}
