/* =========================================================
   SEA LICENSING
   MEGA MENU READABILITY + FLAG ICON REFINEMENT
   ========================================================= */


/* ---------------------------------------------------------
   SHARED INTRO PANELS
   --------------------------------------------------------- */

.mega-menu[data-mega="flags"] .mega-intro h3,
.mega-menu[data-mega="digital"] .mega-intro h3 {
  font-size: 30px !important;
  line-height: 1.02 !important;
  letter-spacing: -0.04em !important;
}

.mega-menu[data-mega="flags"] .mega-intro p,
.mega-menu[data-mega="digital"] .mega-intro p {
  font-size: 12px !important;
  line-height: 1.6 !important;
  color: rgba(235,246,251,.84) !important;
}

.mega-menu[data-mega="flags"] .mega-intro a,
.mega-menu[data-mega="digital"] .mega-intro a {
  font-size: 10px !important;
}


/* ---------------------------------------------------------
   FLAG STATES + DIGITAL CARDS
   Larger text, centered content, less empty feel
   --------------------------------------------------------- */

.mega-menu[data-mega="flags"] .mega-grid.flags > a,
.mega-menu[data-mega="digital"] .mega-grid.digital-mega > a {
  padding: 18px 18px !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

.mega-menu[data-mega="flags"] .mega-grid.flags > a > span:last-child,
.mega-menu[data-mega="digital"] .mega-grid.digital-mega > a > span:last-child {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-self: center !important;
  min-height: 72px !important;
  max-width: calc(100% - 84px) !important;
}

.mega-menu[data-mega="flags"] .mega-grid.flags b,
.mega-menu[data-mega="digital"] .mega-grid.digital-mega b {
  font-size: 14px !important;
  line-height: 1.28 !important;
  font-weight: 800 !important;
  color: #0a2436 !important;
}

.mega-menu[data-mega="flags"] .mega-grid.flags small,
.mega-menu[data-mega="digital"] .mega-grid.digital-mega small {
  margin-top: 5px !important;
  font-size: 10.5px !important;
  line-height: 1.55 !important;
  color: #687f8b !important;
}

.mega-menu[data-mega="flags"] .mega-grid.flags > a:hover b,
.mega-menu[data-mega="flags"] .mega-grid.flags > a:hover small,
.mega-menu[data-mega="digital"] .mega-grid.digital-mega > a:hover b,
.mega-menu[data-mega="digital"] .mega-grid.digital-mega > a:hover small {
  color: #ffffff !important;
}


/* ---------------------------------------------------------
   DIGITAL CARDS ICONS
   --------------------------------------------------------- */

.mega-menu[data-mega="digital"] .mega-icon {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  border-radius: 9px !important;
  display: grid !important;
  place-items: center !important;
  align-self: center !important;
}

.mega-menu[data-mega="digital"] .mega-icon svg {
  width: 19px !important;
  height: 19px !important;
}


/* ---------------------------------------------------------
   FLAG STATES — use actual country flags instead of letters
   --------------------------------------------------------- */

.mega-menu[data-mega="flags"] .flag-mini > i {
  width: 54px !important;
  height: 40px !important;
  flex: 0 0 54px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 9px !important;
  border: 1px solid rgba(16,122,170,.14) !important;
  background: #ffffff !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 3px 10px rgba(10,56,78,.06) !important;

  overflow: hidden !important;
  position: relative !important;

  font-size: 0 !important;
  color: transparent !important;
  font-style: normal !important;
  line-height: 1 !important;
}

.mega-menu[data-mega="flags"] .flag-mini > i::before {
  display: block;
  font-size: 23px;
  line-height: 1;
}

.mega-menu[data-mega="flags"] .flag-mini[href*="panama"] > i::before {
  content: "🇵🇦";
}

.mega-menu[data-mega="flags"] .flag-mini[href*="liberia"] > i::before {
  content: "🇱🇷";
}

.mega-menu[data-mega="flags"] .flag-mini[href*="honduras"] > i::before {
  content: "🇭🇳";
}

.mega-menu[data-mega="flags"] .flag-mini[href*="belize"] > i::before {
  content: "🇧🇿";
}

.mega-menu[data-mega="flags"] .mega-grid.flags > a:hover i {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(124,230,252,.48) !important;
  box-shadow: none !important;
}


/* ---------------------------------------------------------
   Slightly better space usage in flag + digital layouts
   --------------------------------------------------------- */

.mega-menu[data-mega="flags"] .mega-layout,
.mega-menu[data-mega="digital"] .mega-layout {
  gap: 34px !important;
}

.mega-menu[data-mega="flags"] .mega-grid.flags {
  gap: 14px !important;
}

.mega-menu[data-mega="digital"] .mega-grid.digital-mega {
  gap: 14px !important;
}


/* ---------------------------------------------------------
   Responsive safety
   --------------------------------------------------------- */

@media (max-width: 1150px) {
  .mega-menu[data-mega="flags"] .mega-grid.flags b,
  .mega-menu[data-mega="digital"] .mega-grid.digital-mega b {
    font-size: 13px !important;
  }

  .mega-menu[data-mega="flags"] .mega-grid.flags small,
  .mega-menu[data-mega="digital"] .mega-grid.digital-mega small {
    font-size: 10px !important;
  }
}