/* Kavenio final notification overrides v2
   Add this CSS after all other CSS files on pages that show toast notifications. */

.kv-toast,
.toast,
.app-toast,
.dashboard-toast,
.checkout-toast {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2147483000 !important;
  width: auto !important;
  max-width: min(92vw, 480px) !important;
  min-width: min(86vw, 300px) !important;
  padding: 14px 18px !important;
  border-radius: 20px !important;
  background: rgba(15, 23, 42, 0.96) !important;
  color: #ffffff !important;
  box-shadow: 0 28px 90px rgba(2, 6, 23, 0.40) !important;
  text-align: center !important;
  font-weight: 900 !important;
  line-height: 1.7 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translate(-50%, -42%) scale(0.96) !important;
  transition: opacity 0.2s ease, transform 0.2s ease !important;
}

.kv-toast.is-visible,
.toast.is-visible,
.app-toast.is-visible,
.dashboard-toast.is-visible,
.checkout-toast.is-visible,
.kv-toast.show,
.toast.show,
.app-toast.show,
.dashboard-toast.show,
.checkout-toast.show {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

#paymentMessage.payment-message {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 2147483000 !important;
  width: min(92vw, 540px) !important;
  max-height: min(82vh, 560px) !important;
  overflow: auto !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  border-radius: 22px !important;
  box-shadow: 0 28px 90px rgba(2, 6, 23, 0.40) !important;
  transform: translate(-50%, -42%) scale(0.96) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  display: none !important;
}

#paymentMessage.payment-message.is-visible {
  display: block !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translate(-50%, -50%) scale(1) !important;
}


/* =====================================================
   v4 account pages scroll fix + mobile drawer safety
   ===================================================== */
@media (max-width: 768px) {
  html,
  body.resume-dashboard-body,
  body.phase5-dashboard {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
  }

  body.resume-dashboard-body.kv-drawer-open,
  body.phase5-dashboard.kv-drawer-open {
    overflow: hidden !important;
  }

  body.resume-dashboard-body .resume-dashboard-shell,
  body.phase5-dashboard .resume-dashboard-shell {
    min-height: auto !important;
    height: auto !important;
    overflow: visible !important;
    padding-bottom: 92px !important;
  }

  body.resume-dashboard-body .dashboard-stat-grid,
  body.resume-dashboard-body .dashboard-two-col,
  body.resume-dashboard-body .dashboard-panel,
  body.resume-dashboard-body .pricing-grid,
  body.resume-dashboard-body .pricing-card,
  body.phase5-dashboard .dashboard-stat-grid,
  body.phase5-dashboard .dashboard-two-col,
  body.phase5-dashboard .dashboard-panel,
  body.phase5-dashboard .pricing-grid,
  body.phase5-dashboard .pricing-card {
    overflow: visible !important;
    max-height: none !important;
  }

  .kv-mobile-drawer .kv-drawer-body {
    max-height: calc(100dvh - 72px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* Prevent any hidden admin action from leaking into generated mobile menus. */
body:not(.is-admin) .admin-only,
body:not(.is-admin) .admin-only *,
.admin-only[hidden],
.admin-only[hidden] * {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}


/* =====================================================
   FINAL: Builder mobile drawer auth visibility guard
   Fixes CSS display overrides that made Login + Logout appear together.
   ===================================================== */
#mobileDrawer [hidden],
#mobileDrawer .kv-auth-hidden,
#mobileDrawer [data-auth-only].kv-auth-hidden,
#mobileDrawer [data-guest-only].kv-auth-hidden,
body.is-authenticated #mobileDrawer [data-guest-only],
body.is-guest #mobileDrawer [data-auth-only] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.is-authenticated #mobileDrawer [data-auth-only]:not(.kv-auth-hidden):not([hidden]),
body.is-guest #mobileDrawer [data-guest-only]:not(.kv-auth-hidden):not([hidden]) {
  visibility: visible !important;
}

/* =====================================================
   Checkout current plan badge/button fix
   ===================================================== */

[data-package-code].is-current-plan {
  border: 2px solid #22c55e !important;
  box-shadow:
    0 0 0 4px rgba(34, 197, 94, 0.14),
    0 24px 70px rgba(15, 23, 42, 0.16) !important;
}

[data-package-code].is-current-plan::before {
  display: none !important;
  content: none !important;
}

[data-package-code].is-current-plan .badge,
[data-package-code].is-current-plan .plan-badge,
[data-package-code].is-current-plan .package-badge {
  background: #dcfce7 !important;
  color: #166534 !important;
  border: 1px solid rgba(34, 197, 94, 0.35) !important;
}

[data-package-code] .is-current-plan-button,
[data-package-code].is-current-plan [data-pay-button],
[data-package-code].is-current-plan .pay-btn,
[data-package-code].is-current-plan .btn-primary {
  pointer-events: none !important;
  cursor: default !important;
  opacity: 0.82 !important;
  background: #dcfce7 !important;
  color: #166534 !important;
  border-color: #bbf7d0 !important;
  box-shadow: none !important;
}

/* =====================================================
   Checkout current plan - clean final style
   ===================================================== */

#packagesBox .pricing-card.is-current-plan {
  position: relative !important;
  border: 2px solid #22c55e !important;
  box-shadow:
    0 0 0 5px rgba(34, 197, 94, 0.14),
    0 24px 70px rgba(15, 23, 42, 0.18) !important;
  transform: translateY(-4px) !important;
}

/* إلغاء الشارة القديمة التي كانت تظهر فوق البطاقة وتتداخل */
#packagesBox .pricing-card.is-current-plan::before,
#packagesBox .pricing-card.is-current-plan::after {
  display: none !important;
  content: none !important;
}

/* نفس شارة اشتراك تتحول إلى خطتك الحالية */
#packagesBox .pricing-card.is-current-plan .package-type {
  margin-inline-end: 0 !important;
  background: #dcfce7 !important;
  color: #166534 !important;
  border: 1px solid rgba(34, 197, 94, 0.35) !important;
}

/* زر الخطة الحالية غير قابل للضغط */
#packagesBox .pricing-card.is-current-plan .js-buy-package {
  pointer-events: none !important;
  cursor: default !important;
  opacity: 1 !important;
  background: #dcfce7 !important;
  color: #166534 !important;
  border-color: #bbf7d0 !important;
  box-shadow: none !important;
}

#packagesBox .pricing-card.is-current-plan .js-buy-package::before {
  content: "✓";
  margin-inline-end: 6px;
  font-weight: 950;
}

/* =====================================================
   Fix AI Assistant result panel covering other AI options
   ===================================================== */

body.cv-builder-page .kv-tab-panel[data-panel="ai"] .kv-ai-card-upgraded {
  display: grid !important;
  gap: 14px !important;
  overflow: visible !important;
}

body.cv-builder-page .kv-ai-result-panel,
body.cv-builder-page #aiResultPanel {
  position: static !important;
  top: auto !important;
  z-index: auto !important;
  transform: none !important;
  margin: 10px 0 12px !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* ترتيب العناصر داخل تبويب AI */
body.cv-builder-page .kv-ai-topbar {
  order: 1 !important;
}

body.cv-builder-page .kv-cv-import-box {
  order: 2 !important;
}

body.cv-builder-page .kv-ai-card-upgraded > p[data-i18n="aiHint"] {
  order: 3 !important;
}

body.cv-builder-page .kv-ai-inputs {
  order: 4 !important;
}

body.cv-builder-page .kv-ai-actions {
  order: 5 !important;
}

body.cv-builder-page .kv-ai-result-panel,
body.cv-builder-page #aiResultPanel {
  order: 6 !important;
}

body.cv-builder-page .kv-ai-note {
  order: 7 !important;
}

/* نتيجة المساعد تكون داخل صندوق قابل للتمرير بدون تغطية باقي الخيارات */
body.cv-builder-page .kv-ai-output,
body.cv-builder-page #aiOutput {
  max-height: 240px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* زر تطبيق الاقتراحات يبقى مرتب داخل رأس النتيجة */
body.cv-builder-page .kv-ai-result-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

body.cv-builder-page .kv-ai-result-head .kv-ai-apply {
  flex: 0 0 auto !important;
  max-width: 100% !important;
}

/* الهاتف */
@media (max-width: 760px) {
  body.cv-builder-page .kv-ai-result-panel,
  body.cv-builder-page #aiResultPanel {
    margin-top: 8px !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }

  body.cv-builder-page .kv-ai-output,
  body.cv-builder-page #aiOutput {
    max-height: 210px !important;
    font-size: 0.86rem !important;
  }

  body.cv-builder-page .kv-ai-result-head {
    align-items: stretch !important;
  }

  body.cv-builder-page .kv-ai-result-head .kv-ai-apply {
    width: 100% !important;
  }
}