/* ==========================================================================
   THE PROJECT MBBS - RESPONSIVE ENHANCEMENTS & MOBILE OVERRIDES
   ========================================================================== */

@media (max-width: 640px) {
  /* Curved line removed on mobile screen */
  .public-hero .landing-atmosphere,
  .landing-atmosphere,
  .ambient-curve {
    display: none !important;
  }

  /* Mobile coordinate grid (dimmed, 40px) */
  #view-home::before {
    background-size: 40px 40px !important;
  }
  .theme-dark #view-home::before,
  html[data-portal-theme="dark"] #view-home::before,
  .app.theme-dark #view-home::before {
    background-image:
      linear-gradient(to right, rgba(244, 63, 94, 0.018) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(244, 63, 94, 0.018) 1px, transparent 1px) !important;
    background-size: 40px 40px !important;
  }
  .theme-navy #view-home::before,
  .theme-light #view-home::before,
  html[data-portal-theme="light"] #view-home::before,
  .app.theme-light #view-home::before,
  .app.theme-navy #view-home::before {
    background-image:
      linear-gradient(to right, rgba(19, 118, 108, 0.013) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(19, 118, 108, 0.013) 1px, transparent 1px) !important;
    background-size: 40px 40px !important;
  }

  /* Mobile Try MCQs button width equal to 'From 1st Year to Final Year MBBS' */
  .hero-cta-btn {
    width: 100% !important;
    max-width: 250px !important;
    justify-content: center !important;
  }
  .hero-cta-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  /* Mobile: Share your reviews button on right side */
  .landing-reviews .section-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .landing-reviews .reviews-controls,
  #landingReviews .reviews-controls {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-top: 12px !important;
    width: 100% !important;
  }
  .landing-reviews .reviews-arrows,
  #landingReviews .reviews-arrows {
    display: flex !important;
    gap: 8px !important;
    justify-content: flex-start !important;
  }
  .landing-reviews .reviews-btns,
  #landingReviews .reviews-btns {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    margin-top: 10px !important;
    gap: 8px !important;
  }
  .give-review-btn,
  #landingReviews .give-review-btn {
    margin-left: auto !important;
  }

  /* Mobile: Homepage Topbar items (Brand, Study space button, Theme, Profile) - 3% height increase */
  .app.landing .topbar {
    height: 62px !important;
    padding: 0 14px !important;
    gap: 8px !important;
  }
  .app.landing .main-shell {
    padding-top: 62px !important;
  }
  .app.landing .topbar .landing-links,
  .landing-links {
    display: none !important;
  }
  .app.landing .topbar .landing-brand {
    max-width: 135px !important;
  }
  .app.landing .topbar .landing-access {
    margin-left: auto !important;
    padding: 5px 9px !important;
    font-size: 8.5px !important;
    gap: 4px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
  .app.landing .topbar .top-actions {
    gap: 5px !important;
  }
  .app.landing .topbar .top-actions .theme-toggle-btn,
  .landing .topbar .top-actions .theme-toggle-btn {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    border-radius: 50% !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
  }
  .app.landing .topbar .top-actions .theme-toggle-btn svg,
  .landing .topbar .top-actions .theme-toggle-btn svg {
    width: 14px !important;
    height: 14px !important;
  }
  body.auth-logged-in .app.landing .topbar .top-actions #profileBtn,
  body.auth-logged-in .landing .topbar .top-actions #profileBtn,
  body.auth-logged-in .app.landing .topbar .top-actions .profile-dot,
  body.auth-logged-in .landing .topbar .top-actions .profile-dot {
    display: grid !important;
    place-items: center !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    border-radius: 50% !important;
    font-size: 10px !important;
  }
  body.auth-guest .app.landing .topbar .top-actions .profile-dot {
    display: none !important;
  }
  body.auth-guest .app.landing .topbar .top-actions .top-signin-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 26px !important;
    padding: 0 10px !important;
    font-size: 10px !important;
    border-radius: 999px !important;
  }
  body.auth-logged-in .app.landing .topbar .top-actions .top-signin-btn {
    display: none !important;
  }

  /* Mobile: 'What We Have Added' and 'Cooking' left-aligned with compact badges */
  .features-head, .cooking-head {
    text-align: left !important;
    align-items: flex-start !important;
  }
  .feature-card {
    text-align: left !important;
    align-items: flex-start !important;
  }
  .feature-count {
    font-size: 16px !important;
    text-align: left !important;
  }

  /* Mobile: Durood Shareef loading card & typography refinement */
  .durood-overlay {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    padding: 16px !important;
    gap: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }
  .durood-card {
    width: 90% !important;
    max-width: 320px !important;
    margin: 0 auto !important;
    padding: 24px 18px 20px !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
    box-shadow: 0 14px 35px -10px rgba(190, 60, 120, 0.22), 0 2px 10px rgba(190, 60, 120, 0.06) !important;
  }
  .durood-arabic {
    font-size: 19px !important;
    line-height: 1.8 !important;
    min-height: auto !important;
    margin: 0 0 8px !important;
  }
  .durood-english {
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    margin: 8px auto 0 !important;
    max-width: 100% !important;
  }
  .durood-divider {
    margin: 14px auto 0 !important;
    max-width: 170px !important;
  }
  .durood-ref {
    margin: 8px 0 0 !important;
    font-size: 9.5px !important;
    letter-spacing: 2.2px !important;
  }
  .durood-loader {
    width: min(240px, 70vw) !important;
    margin: 0 auto !important;
  }
  .durood-track {
    height: 4px !important;
  }
  .durood-loading {
    margin: 7px 0 0 !important;
    font-size: 9px !important;
    letter-spacing: 2.5px !important;
  }

  /* 'Medix is Providing:' mobile font matching desktop bold weight with 20% size reduction */
  .fun-title,
  #studyWaysTitle,
  .dashboard-essentials .fun-title,
  .dashboard-essentials #studyWaysTitle {
    font-family: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    -webkit-text-stroke: 0.35px currentColor;
    letter-spacing: -0.02em !important;
    gap: 8px !important;
    display: flex !important;
    align-items: center !important;
  }
  .fun-title .fun-grad,
  #studyWaysTitle .fun-grad {
    font-family: inherit !important;
    font-weight: 900 !important;
    -webkit-text-stroke: 0.35px transparent;
  }
  .fun-title .title-icon {
    width: 24px !important;
    height: 24px !important;
  }
}