/* =================================================================
 * WebWorld – fix stretched icon-only nav items on condensed pages
 * (cart, register, checkout — body.lagom-layout-condensed).
 *
 * Root cause: .app-nav-condensed sets the nav <a> height to the full
 * bar height (~60px); the icon inside a .nav-item-icon-only <li>
 * inherits that height and the glyph renders large. On the portal
 * homepage (not condensed) a different code path sizes it correctly.
 *
 * Fix: cap the icon glyph and its container on .app-nav-condensed.
 * Scoped to .app-nav-condensed so nothing on the portal home changes.
 * ================================================================= */

/* 1. Override the CSS variable that Lagom uses for icon size */
.app-nav-condensed {
    --app-nav-top-menu-icon-size: 20px;
    --ui-icon-size: 20px;
}

/* 2. Constrain the <a> height for icon-only items */
.app-nav-condensed .nav-item-icon-only > a {
    height: auto !important;
    min-height: unset !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* 3. Pin the icon glyph to 20px regardless of container */
.app-nav-condensed .nav-item-icon-only > a > i,
.app-nav-condensed .nav-item-icon-only > a > .lm,
.app-nav-condensed .nav-item-icon-only > a > .ls {
    font-size: 20px !important;
    line-height: 20px !important;
    align-self: center !important;
    display: inline-block !important;
}

/* =================================================================
 * WebWorld – nav visual spec (matches owner "nice" screenshots)
 * Condensed top bar: cart, order-process, website/marketing pages
 * ================================================================= */

/* Text nav items: Hosting, Servers, Domains (and any hook items
   DNS Manager, Contracts, News, Support) */
.app-nav-condensed .nav-item-text-only > a,
.app-nav-condensed .nav-item-text-and-icon > a {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #374151 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 6px 8px !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

.app-nav-condensed .nav-item-text-only > a:hover,
.app-nav-condensed .nav-item-text-and-icon > a:hover {
    color: #111827 !important;
    background: rgba(0,0,0,0.04) !important;
}

/* Register – outline button (btn-outline btn-default) */
.app-nav-condensed .nav-item-btn .btn-outline,
.app-nav-condensed .nav-item-btn .btn-outline.btn-default {
    background: #fff !important;
    border: 1px solid #D1D5DB !important;
    color: #111827 !important;
    height: 36px !important;
    padding: 0 14px !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 36px !important;
    box-shadow: none !important;
    text-transform: none !important;
}

.app-nav-condensed .nav-item-btn .btn-outline:hover,
.app-nav-condensed .nav-item-btn .btn-outline.btn-default:hover {
    border-color: #9CA3AF !important;
    background: #F9FAFB !important;
    color: #111827 !important;
}

/* My Account – the ONLY red fill button */
.app-nav-condensed .nav-item-btn .btn-primary {
    background: #E10600 !important;
    border: 0 !important;
    color: #fff !important;
    height: 36px !important;
    padding: 0 16px !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 36px !important;
    box-shadow: none !important;
    text-transform: none !important;
}

.app-nav-condensed .nav-item-btn .btn-primary:hover {
    background: #c90000 !important;
}

/* Hide forbidden items on the top bar:
   Language selector tile, Mode Switcher, Currencies (when visible),
   Chat Now placeholder */
.app-nav-condensed .nav-item-language,
.app-nav-condensed .nav-item-mode-switcher,
.app-nav-condensed [class*="language-selector"]:not(.nav-item-cart) {
    display: none !important;
}

/* Hide text label inside cart icon - icon-only on top bar */
.app-nav-condensed .nav-item-cart .item-text,
.app-nav-condensed .nav-item-cart > a > span.item-text {
    display: none !important;
}

/* Override theme.css rule that forces item-text visible (.app-nav .menu.menu-primary > li > a > .item-text).
   Add .nav-item-cart class constraint to win on specificity. */
.app-nav .menu.menu-primary > .nav-item-cart > a > .item-text,
.app-nav-condensed .nav-item-cart > a > .item-text {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Restore dropdown chevron arrows (Lagom inline style hides them with display:none !important).
   Higher specificity override to show .ls-caret on primary condensed nav dropdown items. */
.app-nav-condensed .app-nav-menu .menu.menu-primary > li.dropdown > a .ls-caret,
.app-nav-condensed .menu.menu-primary > li.dropdown.dropdown-extended > a .ls-caret {
    display: inline-block !important;
}
