/* Top-level primary-menu icon alignment.
   Loaded site-wide from functions.php (enqueued, so it is cache-busted by
   filemtime and survives Remove-Unused-CSS). DIRECT-CHILD selectors only
   (.primary-menu-menu > li > a > i), so the submenu icons are intentionally
   left exactly as they are.

   The icon <i> carries an inline style="margin-right:.45em" from the faicon
   menu walker in functions.php, plus Olympus core rules in css/main.css.
   Everything here is !important so it wins over both regardless of load order,
   without having to edit either file. */

.primary-menu-menu > li > a > i {
   margin-right: 9px !important;   /* roomier gap, beats the inline .45em */
   margin-top: 0 !important;       /* drop the 2px that pushed icons down */
   top: 0 !important;              /* was -2px in css/main.css */
   line-height: 14px !important;
}

/* Per-glyph corrections: the same font-size does not mean the same visual
   size, some FA glyphs sit higher or fill more of their em box. Tune these
   two numbers to taste. */
.primary-menu-menu > li > a > i.fa-music       { top: 1px !important; }         /* note glyph sits high, nudge down */
.primary-menu-menu > li > a > i.fa-paper-plane { font-size: 13px !important; }  /* plane glyph is chunky, shrink to match */

/* Dropdown caret (the small triangle on the four items with submenus): tuck it
   in a touch and drop it a hair so it reads as part of the label. Position only,
   the triangle SIZE stays as set in main-ukutabs.css (border-width).

   DESKTOP BAR ONLY. The responsive / hamburger menu positions this caret with
   its own media queries (right:15px at <=1006px in its toggle box, right:5px at
   <=1200px). A non-scoped !important would override those and shove the caret
   off-center on mobile, so this is gated to the wide bar (>1200px). */
@media (min-width: 1201px) {
   .primary-menu-menu > li.menu-item-has-children > a:after {
      right: 12px !important;
      margin-top: 1px !important;
   }
}