/* ==========================================================
   BuddySocial v10.52 - MOBILE/TABLET MENU ALL WHITE
   Complete geopende menu <=1100px: blauw vlak + witte tekst.
   ========================================================== */

@media (max-width:1100px){

  /* Whole menu surface */
  .main-nav-links{
    background:linear-gradient(180deg,#3b7fb6 0%,#2b679f 100%) !important;
    border-color:#245b8c !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* Section headers */
  .mobile-nav-section-title{
    background:linear-gradient(180deg,#4f94c9 0%,#397ab1 100%) !important;
    border-color:#2b679a !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    text-shadow:0 1px 1px rgba(0,0,0,.18) !important;
  }

  /* All primary navigation cards */
  .nav-primary > a,
  .nav-utilities > a.utility-link,
  .notification-nav-wrap > a.utility-link,
  .nav-more > summary,
  .nav-more-menu > a,
  .mobile-menu-account-actions > a,
  .nav-status-control,
  .nav-sound-toggle{
    background:linear-gradient(180deg,#4f94c9 0%,#3676ad 100%) !important;
    border-color:#2a6598 !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    text-shadow:0 1px 1px rgba(0,0,0,.18) !important;
  }

  /* Everything inside these cards remains white */
  .nav-primary > a *,
  .nav-utilities > a.utility-link *,
  .notification-nav-wrap > a.utility-link *,
  .nav-more > summary *,
  .nav-more-menu > a *,
  .mobile-menu-account-actions > a *,
  .nav-status-control *,
  .nav-sound-toggle *{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* Active / hover stays white text on orange */
  .nav-primary > a.active,
  .nav-primary > a:hover,
  .nav-utilities > a.utility-link.active,
  .nav-utilities > a.utility-link:hover,
  .notification-nav-wrap > a.utility-link.active,
  .notification-nav-wrap > a.utility-link:hover,
  .nav-more > summary:hover,
  .nav-more.active > summary,
  .nav-more-menu > a.active,
  .nav-more-menu > a:hover,
  .mobile-menu-account-actions > a:hover{
    background:linear-gradient(180deg,#f7ac29 0%,#e88d0a 100%) !important;
    border-color:#d57f02 !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  .nav-primary > a.active *,
  .nav-primary > a:hover *,
  .nav-utilities > a.utility-link.active *,
  .nav-utilities > a.utility-link:hover *,
  .notification-nav-wrap > a.utility-link.active *,
  .notification-nav-wrap > a.utility-link:hover *,
  .nav-more > summary:hover *,
  .nav-more.active > summary *,
  .nav-more-menu > a.active *,
  .nav-more-menu > a:hover *,
  .mobile-menu-account-actions > a:hover *{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* More-menu container */
  .nav-more-menu,
  .mobile-menu-account-actions{
    background:linear-gradient(180deg,#3476ad 0%,#285f96 100%) !important;
    border-color:#235789 !important;
  }

  .nav-more-menu::before,
  .mobile-menu-account-actions::before{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    opacity:.95 !important;
  }

  /* Status select itself */
  .menu-status-select{
    background:#397ab1 !important;
    border-color:#2a6598 !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    font-weight:800 !important;
  }

  .menu-status-select option{
    background:#2f6fa8 !important;
    color:#fff !important;
  }

  .nav-status-control > span{
    color:#7cff9e !important;
    -webkit-text-fill-color:#7cff9e !important;
  }

  /* Search block also matches the blue menu */
  .retro-search{
    background:linear-gradient(180deg,#3476ad 0%,#285f96 100%) !important;
    border-color:#235789 !important;
  }

  .retro-search input{
    background:#fff !important;
    color:#183f5d !important;
    -webkit-text-fill-color:#183f5d !important;
  }

  .retro-search input::placeholder{
    color:#6f8291 !important;
    -webkit-text-fill-color:#6f8291 !important;
  }

  .retro-search button{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* Notification popup must stay readable on its own white surface */
  .notification-dropdown{
    background:#fff !important;
    color:#183f5d !important;
    -webkit-text-fill-color:#183f5d !important;
  }

  .notification-dropdown *,
  .notification-dropdown a,
  .notification-dropdown b,
  .notification-dropdown small,
  .notification-dropdown span{
    color:#183f5d !important;
    -webkit-text-fill-color:#183f5d !important;
    text-shadow:none !important;
  }

  .notification-dropdown-head{
    background:linear-gradient(180deg,#edf7fc,#dcecf6) !important;
  }

  .notification-dropdown-footer{
    color:#225f8a !important;
    -webkit-text-fill-color:#225f8a !important;
  }

  /* Orange counters remain white */
  .nav-badge,
  .nav-badge *,
  .message-count-badge,
  .notification-count-badge{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* Logout */
  .mobile-menu-account-actions > a:last-child{
    background:linear-gradient(180deg,#e98548 0%,#c95b32 100%) !important;
    border-color:#b8512b !important;
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* Strong final override against earlier dark-text mobile patches */
  .main-nav-links .nav-primary a,
  .main-nav-links .nav-utilities > a,
  .main-nav-links .nav-more a,
  .main-nav-links .mobile-menu-account-actions a,
  .main-nav-links .nav-more summary,
  .main-nav-links .mobile-nav-section-title{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }
}