/* HoverUp Academy — Frontend Styles v1.0.4 */

/* ===================== FULL WIDTH OVERRIDE ===================== */
/* Force the plugin to break out of any WordPress theme container */
.ha-wrap {
    --ha-bg: #0a0a0a;
    --ha-bg2: #141414;
    --ha-text: #f5f5f5;
    --ha-muted: #a0a0a0;
    --ha-teal: #1abc9c;
    --ha-blue: #4a89d3;
    --ha-border: #333;
    font-family: 'Outfit', 'Segoe UI', Arial, sans-serif !important;
    background-color: var(--ha-bg) !important;
    color: var(--ha-text) !important;
    line-height: 1.6 !important;
    position: relative !important;
    /* Full width breakout */
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    overflow-x: hidden !important;
    display: block !important;
    padding: 0 !important;
}

/* Reset all child elements inside plugin */
.ha-wrap *, .ha-wrap *::before, .ha-wrap *::after {
    box-sizing: border-box !important;
}

/* Override theme's text-transform on headings */
.ha-wrap h1, .ha-wrap h2, .ha-wrap h3, .ha-wrap h4,
.ha-wrap .ha-section-title, .ha-wrap .ha-form-title {
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ---- Scroll Animations ---- */
.scroll-animate { opacity: 0; transform: translateY(40px); transition: opacity 0.8s ease-out, transform 0.8s ease-out; }
.scroll-animate.ha-show { opacity: 1 !important; transform: translateY(0) !important; }

/* ---- Buttons ---- */
.ha-btn {
    display: inline-block !important;
    padding: 0.9rem 2rem !important;
    border-radius: 5px !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    font-family: inherit !important;
    line-height: 1 !important;
}
.ha-btn-primary {
    background-color: var(--ha-teal) !important;
    color: #000 !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(26,188,156,0.4) !important;
}
.ha-btn-primary:hover { background-color: #159f84 !important; transform: translateY(-2px) !important; color: #000 !important; }
.ha-btn-sleek {
    background-color: transparent !important;
    border: 1px solid var(--ha-blue) !important;
    color: var(--ha-blue) !important;
}
.ha-btn-sleek:hover { background-color: var(--ha-blue) !important; color: #000 !important; }

/* ---- Section Title ---- */
.ha-section-title {
    text-align: center !important;
    font-size: 2.2rem !important;
    margin-bottom: 3rem !important;
    font-weight: 600 !important;
    color: var(--ha-text) !important;
    text-transform: none !important;
}

/* ===================== HERO ===================== */
.ha-hero {
    height: 100vh !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    padding: 0 2rem !important;
    position: relative !important;
}
.ha-hero-content {
    max-width: 800px;
    padding-top: 5rem;
    width: 100%;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
.ha-hero-content h1 {
    width: 100%;
    text-align: center;
    font-size: 3.5rem !important;
    font-weight: 700 !important;
    margin-bottom: 1rem !important;
    line-height: 1.2 !important;
    color: #fff !important;
    text-transform: none !important;
}
.ha-hero-content h1 span {
    background: linear-gradient(90deg, var(--ha-teal), var(--ha-blue));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline;
}
.ha-hero-content > p { font-size: 1.1rem !important; color: var(--ha-muted) !important; margin-bottom: 1.5rem !important; }

/* CARC Badge in Hero */
.ha-carc-badge {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 0 1.5rem 0 !important;
}
.ha-carc-inner {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: rgba(26,188,156,0.1) !important;
    border: 1px solid rgba(26,188,156,0.4) !important;
    border-radius: 8px !important;
    padding: 10px 18px !important;
    backdrop-filter: blur(4px) !important;
}
.ha-carc-shield {
    font-size: 1.6rem !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}
.ha-carc-text { text-align: left !important; }
.ha-carc-text strong { display: block !important; color: var(--ha-teal) !important; font-size: 0.9rem !important; font-weight: 700 !important; line-height: 1.3 !important; }
.ha-carc-text small { display: block !important; color: var(--ha-muted) !important; font-size: 0.75rem !important; }

/* ===================== WHY ===================== */
.ha-why { padding: 6rem 5% !important; background-color: var(--ha-bg) !important; }
.ha-info-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 3rem !important;
}
.ha-glass-box {
    background: var(--ha-bg2) !important;
    border: 1px solid var(--ha-border) !important;
    border-radius: 12px !important;
    padding: 2.5rem !important;
}
.ha-glass-box h2 { font-size: 2rem !important; margin-bottom: 1.5rem !important; color: var(--ha-teal) !important; font-weight: 600 !important; text-transform: none !important; }
.ha-glass-box > p { color: var(--ha-muted) !important; font-size: 1rem !important; margin-bottom: 1rem !important; }
.ha-clean-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.ha-clean-list li { margin-bottom: 0.7rem !important; position: relative !important; padding-left: 1.5rem !important; color: var(--ha-muted) !important; font-size: 0.95rem !important; }
.ha-clean-list li::before { content: '✓' !important; color: var(--ha-blue) !important; position: absolute !important; left: 0 !important; font-weight: bold !important; }
.ha-closing-line { margin-top: 2rem !important; font-size: 1.2rem !important; color: #fff !important; font-weight: 700 !important; border-top: 1px solid var(--ha-border) !important; padding-top: 1.5rem !important; }

/* ===================== COURSES ===================== */
.ha-courses { padding: 5rem 5% !important; background-color: var(--ha-bg2) !important; }
.ha-course-container {
    display: flex !important;
    justify-content: center !important;
    gap: 2rem !important;
    flex-wrap: wrap !important;
    max-width: 1300px !important;
    margin: 0 auto !important;
}
.ha-glass-module {
    background-color: var(--ha-bg) !important;
    border: 1px solid var(--ha-border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    width: 400px !important;
    min-width: 300px !important;
    flex: 1 1 300px !important;
    max-width: 480px !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.3s, box-shadow 0.3s !important;
}
.ha-glass-module:hover { transform: translateY(-8px) !important; box-shadow: 0 10px 30px rgba(26,188,156,0.15) !important; border-color: var(--ha-teal) !important; }
.ha-premium-module { border-color: var(--ha-teal) !important; background-color: #0d0d0d !important; }
.ha-uas-module { border-color: rgba(74,137,211,0.5) !important; }
.ha-course-image { height: 200px !important; background-size: cover !important; background-position: center !important; flex-shrink: 0 !important; }
.ha-module-body { padding: 1.5rem !important; flex: 1 !important; display: flex !important; flex-direction: column !important; }
.ha-age-badge { background-color: rgba(74,137,211,0.15) !important; color: var(--ha-blue) !important; padding: 0.25rem 0.7rem !important; border-radius: 20px !important; font-size: 0.78rem !important; font-weight: 600 !important; display: inline-block !important; margin-bottom: 0.8rem !important; }
.ha-highlight-badge { color: var(--ha-blue) !important; background: rgba(74,137,211,0.15) !important; }
.ha-uas-badge { color: var(--ha-teal) !important; background: rgba(26,188,156,0.12) !important; }
.ha-glass-module h3 { font-size: 1.3rem !important; margin-bottom: 0.3rem !important; font-weight: 600 !important; color: var(--ha-text) !important; text-transform: none !important; }
.ha-tagline { font-style: italic !important; color: var(--ha-teal) !important; font-weight: 400 !important; margin-bottom: 1rem !important; font-size: 0.9rem !important; }
.ha-course-details { margin-bottom: 1rem !important; }
.ha-course-details p { font-size: 0.88rem !important; margin-bottom: 0.5rem !important; color: var(--ha-muted) !important; }
.ha-course-details p strong { color: var(--ha-text) !important; }
.ha-course-details h4 { margin-top: 1rem !important; margin-bottom: 0.4rem !important; font-size: 0.95rem !important; color: var(--ha-teal) !important; font-weight: 700 !important; text-transform: none !important; text-align: left !important; display: block !important; visibility: visible !important; opacity: 1 !important; line-height: 1.4 !important; }
.ha-course-details ul { padding-left: 1.2rem !important; color: var(--ha-muted) !important; font-size: 0.88rem !important; margin-bottom: 0.5rem !important; }
.ha-course-details ul li { margin-bottom: 0.3rem !important; }
.ha-enroll-btn { margin-top: auto !important; width: 100% !important; text-align: center !important; }

/* ===================== PRICING ===================== */
.ha-pricing { padding: 6rem 5% !important; background-color: var(--ha-bg) !important; }
.ha-pricing-container { display: flex !important; justify-content: center !important; gap: 2rem !important; flex-wrap: wrap !important; max-width: 1100px !important; margin: 0 auto !important; }
.ha-glass-pricing {
    background-color: var(--ha-bg2) !important;
    border: 1px solid var(--ha-border) !important;
    border-radius: 12px !important;
    padding: 2.5rem !important;
    width: 340px !important;
    flex: 1 1 280px !important;
    max-width: 400px !important;
    text-align: center !important;
    transition: transform 0.3s !important;
    position: relative !important;
    overflow: hidden !important;
}
.ha-glass-pricing:hover { transform: translateY(-8px) !important; border-color: var(--ha-blue) !important; }
.ha-premium-pricing { border-color: var(--ha-teal) !important; background-color: #0d0d0d !important; box-shadow: 0 10px 30px rgba(26,188,156,0.1) !important; }
.ha-popular-badge { position: absolute !important; top: 15px !important; right: -35px !important; background-color: var(--ha-teal) !important; color: #000 !important; padding: 5px 40px !important; font-size: 0.75rem !important; font-weight: bold !important; transform: rotate(45deg) !important; text-transform: none !important; }
.ha-glass-pricing h3 { font-size: 1.3rem !important; margin-bottom: 0.8rem !important; color: var(--ha-text) !important; margin-top: 0.5rem !important; text-transform: none !important; }
.ha-price-contact { padding: 0.8rem 0 1.2rem !important; }
.ha-price-icon { font-size: 1.6rem !important; display: block !important; margin-bottom: 0.4rem !important; }
.ha-price-contact p { color: var(--ha-muted) !important; font-size: 0.9rem !important; margin: 0 !important; }
.ha-pricing-features { list-style: none !important; margin-bottom: 1.5rem !important; padding: 0 !important; }
.ha-pricing-features li { margin-bottom: 0.8rem !important; color: var(--ha-muted) !important; padding-bottom: 0.5rem !important; border-bottom: 1px solid var(--ha-border) !important; font-size: 0.9rem !important; }
.ha-contact-btn { width: 100% !important; }
.ha-pricing-note { text-align: center !important; color: var(--ha-muted) !important; font-size: 0.82rem !important; margin-top: 2rem !important; font-style: italic !important; max-width: 600px !important; margin-left: auto !important; margin-right: auto !important; }

/* ===================== SCHEDULE ===================== */
.ha-schedule { padding: 6rem 5% !important; background-color: var(--ha-bg) !important; }
.ha-schedule-container { max-width: 900px !important; margin: 0 auto !important; }
.ha-start-banner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    background: rgba(26,188,156,0.08) !important;
    border: 1px solid rgba(26,188,156,0.2) !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    margin: 0 auto 2rem !important;
    max-width: 480px !important;
    color: var(--ha-teal) !important;
    font-size: 0.95rem !important;
}
.ha-start-icon { font-size: 1.1rem !important; }
.ha-glass-schedule-row {
    display: flex !important;
    align-items: center !important;
    background-color: var(--ha-bg) !important;
    border: 1px solid var(--ha-border) !important;
    border-radius: 8px !important;
    padding: 1.2rem 1.5rem !important;
    margin-bottom: 1rem !important;
    transition: transform 0.2s !important;
}
.ha-glass-schedule-row:hover { transform: scale(1.01) !important; border-color: var(--ha-blue) !important; }
.ha-date-col { flex: 0 0 90px !important; text-align: center !important; border-right: 2px solid var(--ha-teal) !important; padding-right: 1.2rem !important; margin-right: 1.2rem !important; }
.ha-month { display: block !important; font-size: 0.85rem !important; color: var(--ha-teal) !important; font-weight: bold !important; text-transform: uppercase !important; }
.ha-day { display: block !important; font-size: 1.8rem !important; font-weight: 700 !important; color: #fff !important; line-height: 1 !important; }
.ha-details-col { flex: 1 !important; }
.ha-details-col h4 { font-size: 1.1rem !important; margin-bottom: 0.3rem !important; color: var(--ha-text) !important; font-weight: 600 !important; text-transform: none !important; }
.ha-details-col p { color: var(--ha-muted) !important; font-size: 0.88rem !important; margin: 0 !important; }
.ha-action-col { flex: 0 0 140px !important; text-align: right !important; }

/* ===================== FAQ ===================== */
.ha-faq { padding: 6rem 5% !important; background-color: var(--ha-bg) !important; }
.ha-faq-container { max-width: 800px !important; margin: 0 auto !important; }
.ha-glass-faq-item { background-color: var(--ha-bg2) !important; border: 1px solid var(--ha-border) !important; border-radius: 8px !important; margin-bottom: 1rem !important; overflow: hidden !important; }
.ha-glass-faq-item summary { padding: 1.3rem 1.5rem !important; font-size: 1rem !important; font-weight: 600 !important; cursor: pointer !important; list-style: none !important; outline: none !important; display: flex !important; justify-content: space-between !important; align-items: center !important; color: var(--ha-text) !important; text-transform: none !important; }
.ha-glass-faq-item summary::-webkit-details-marker { display: none !important; }
.ha-glass-faq-item summary::after { content: '+' !important; font-size: 1.4rem !important; color: var(--ha-teal) !important; font-weight: 300 !important; }
.ha-glass-faq-item[open] summary::after { content: '-' !important; }
.ha-faq-content { padding: 0 1.5rem 1.3rem !important; color: var(--ha-muted) !important; font-size: 0.95rem !important; border-top: 1px solid var(--ha-border) !important; padding-top: 1rem !important; margin-top: 0.5rem !important; }

/* ===================== MODAL ===================== */
.ha-modal { display: none !important; position: fixed !important; z-index: 99999 !important; left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; overflow: auto !important; background-color: rgba(0,0,0,0.88) !important; backdrop-filter: blur(8px) !important; opacity: 0 !important; transition: opacity 0.3s ease !important; }
.ha-modal.ha-show { display: flex !important; opacity: 1 !important; align-items: center !important; justify-content: center !important; }
.ha-glass-modal { background-color: var(--ha-bg2) !important; border: 1px solid var(--ha-border) !important; border-top: 4px solid var(--ha-teal) !important; margin: auto !important; padding: 2.5rem !important; width: 90% !important; max-width: 620px !important; border-radius: 12px !important; position: relative !important; transform: translateY(-20px) !important; transition: transform 0.3s ease !important; max-height: 92vh !important; overflow-y: auto !important; }
.ha-modal.ha-show .ha-glass-modal { transform: translateY(0) !important; }
.ha-close-btn { color: var(--ha-muted) !important; float: right !important; font-size: 28px !important; font-weight: bold !important; cursor: pointer !important; line-height: 1 !important; background: none !important; border: none !important; }
.ha-close-btn:hover { color: #fff !important; }
.ha-form-title { margin-bottom: 1.5rem !important; font-size: 1.8rem !important; color: #fff !important; clear: both !important; text-transform: none !important; }
.ha-form-group { margin-bottom: 1.5rem !important; }
.ha-form-row { display: flex !important; gap: 1.5rem !important; }
.ha-form-row .ha-col { flex: 1 !important; }
.ha-wrap label { display: block !important; margin-bottom: 0.5rem !important; color: var(--ha-muted) !important; font-size: 0.88rem !important; font-weight: 500 !important; }
.ha-clean-input { width: 100% !important; padding: 0.8rem 1rem !important; background-color: #1a1a1a !important; border: 1px solid var(--ha-border) !important; border-radius: 5px !important; color: #fff !important; font-family: 'Outfit', sans-serif !important; font-size: 1rem !important; transition: border-color 0.3s !important; }
.ha-clean-input:focus { outline: none !important; border-color: var(--ha-blue) !important; }
select.ha-clean-input option { background-color: #1a1a1a !important; color: #fff !important; }
.ha-consent-box { background-color: rgba(231,76,60,0.08) !important; border: 1px solid rgba(231,76,60,0.3) !important; border-left: 3px solid #e74c3c !important; padding: 1rem !important; border-radius: 5px !important; }
.ha-consent-label { color: #e74c3c !important; font-weight: 600 !important; display: block !important; margin-bottom: 4px !important; }
.ha-consent-desc { font-size: 0.85rem !important; color: var(--ha-muted) !important; margin-bottom: 0.8rem !important; }
.ha-pay-btn { width: 100% !important; margin-top: 1rem !important; padding: 1rem !important; font-size: 1rem !important; }
.ha-checkbox-container { display: block !important; position: relative !important; padding-left: 30px !important; cursor: pointer !important; font-size: 0.9rem !important; user-select: none !important; color: #fff !important; }
.ha-checkbox-container input { position: absolute !important; opacity: 0 !important; cursor: pointer !important; height: 0 !important; width: 0 !important; }
.ha-checkmark { position: absolute !important; top: 0 !important; left: 0 !important; height: 20px !important; width: 20px !important; background-color: #1a1a1a !important; border: 1px solid #555 !important; border-radius: 4px !important; }
.ha-checkbox-container input:checked ~ .ha-checkmark { background-color: var(--ha-teal) !important; border-color: var(--ha-teal) !important; }
.ha-checkmark:after { content: "" !important; position: absolute !important; display: none !important; left: 7px !important; top: 3px !important; width: 5px !important; height: 10px !important; border: solid #000 !important; border-width: 0 2px 2px 0 !important; transform: rotate(45deg) !important; }
.ha-checkbox-container input:checked ~ .ha-checkmark:after { display: block !important; }
.ha-upload-box { display: flex !important; align-items: center !important; gap: 12px !important; background-color: #1a1a1a !important; border: 2px dashed var(--ha-border) !important; border-radius: 5px !important; padding: 1rem !important; cursor: pointer !important; transition: all 0.3s !important; position: relative !important; }
.ha-upload-box:hover, label.ha-upload-box:hover { border-color: var(--ha-blue) !important; }
.ha-upload-box.ha-has-file { border-color: var(--ha-teal) !important; border-style: solid !important; }
.ha-file-input { position: absolute !important; inset: 0 !important; opacity: 0 !important; cursor: pointer !important; width: 100% !important; height: 100% !important; }
.ha-upload-icon { font-size: 1.3rem !important; flex-shrink: 0 !important; }
.ha-upload-label { color: var(--ha-muted) !important; font-size: 0.88rem !important; }
.ha-field-hint { color: var(--ha-muted) !important; font-size: 0.78rem !important; margin-top: 5px !important; display: block !important; }
.ha-required-star { color: #e74c3c !important; }
.ha-form-message { padding: 0.8rem 1rem !important; border-radius: 5px !important; font-size: 0.9rem !important; margin-bottom: 1rem !important; }
.ha-form-message.ha-success { background: rgba(26,188,156,0.1) !important; border: 1px solid rgba(26,188,156,0.3) !important; color: var(--ha-teal) !important; }
.ha-form-message.ha-error { background: rgba(231,76,60,0.1) !important; border: 1px solid rgba(231,76,60,0.3) !important; color: #e74c3c !important; }

/* ===================== RTL ===================== */
.ha-wrap[dir="rtl"] .ha-clean-list li { padding-left: 0 !important; padding-right: 1.5rem !important; }
.ha-wrap[dir="rtl"] .ha-clean-list li::before { left: auto !important; right: 0 !important; }
.ha-wrap[dir="rtl"] .ha-date-col { border-right: none !important; border-left: 2px solid var(--ha-teal) !important; padding-right: 0 !important; margin-right: 0 !important; padding-left: 1.2rem !important; margin-left: 1.2rem !important; }
.ha-wrap[dir="rtl"] .ha-action-col { text-align: left !important; }
.ha-wrap[dir="rtl"] .ha-consent-box { border-left: none !important; border-right: 3px solid #e74c3c !important; }
.ha-wrap[dir="rtl"] .ha-checkbox-container { padding-left: 0 !important; padding-right: 30px !important; }
.ha-wrap[dir="rtl"] .ha-checkmark { left: auto !important; right: 0 !important; }
.ha-wrap[dir="rtl"] .ha-close-btn { float: left !important; }
.ha-wrap[dir="rtl"] .ha-carc-text { text-align: right !important; }

/* ===================== RESPONSIVE ===================== */
@media (max-width: 1024px) {
    .ha-info-container { grid-template-columns: 1fr !important; gap: 2rem !important; }
    .ha-glass-module { max-width: 100% !important; width: 100% !important; }
}
@media (max-width: 768px) {
    .ha-hero-content h1 { font-size: 2.2rem !important; }
    .ha-section-title { font-size: 1.7rem !important; }
    .ha-form-row { flex-direction: column !important; gap: 0 !important; }
    .ha-glass-schedule-row { flex-direction: column !important; text-align: center !important; gap: 1rem !important; }
    .ha-date-col { border-right: none !important; border-left: none !important; border-bottom: 1px solid var(--ha-border) !important; padding: 0 0 1rem !important; margin: 0 0 0 !important; width: 100% !important; }
    .ha-action-col { flex: none !important; width: 100% !important; text-align: center !important; }
    .ha-glass-pricing { width: 100% !important; max-width: 100% !important; }
}

/* ===== FPV Prerequisite Notice ===== */
.ha-fpv-notice {
    gap: 12px !important;
    background: rgba(234, 179, 8, 0.08) !important;
    border: 1px solid rgba(234, 179, 8, 0.35) !important;
    border-left: 4px solid #eab308 !important;
    border-radius: 8px !important;
    padding: 1rem 1.2rem !important;
    margin-bottom: 1.5rem !important;
    align-items: flex-start !important;
}
.ha-fpv-notice.ha-visible {
    display: flex !important;
}
.ha-fpv-notice-icon { font-size: 1.3rem !important; flex-shrink: 0 !important; margin-top: 2px !important; }
.ha-fpv-notice strong { display: block !important; color: #eab308 !important; font-size: 0.95rem !important; margin-bottom: 4px !important; }
.ha-fpv-notice p { color: var(--ha-muted) !important; font-size: 0.85rem !important; margin: 0 !important; line-height: 1.5 !important; }

/* UAS cert upload box — teal accent */
.ha-upload-box-uas { border-color: rgba(26,188,156,0.3) !important; }
.ha-upload-box-uas:hover { border-color: var(--ha-teal) !important; }

/* Submit note below button */
.ha-submit-note { text-align: center !important; color: var(--ha-muted) !important; font-size: 0.8rem !important; margin-top: 0.8rem !important; font-style: italic !important; }