/* PharmaDevils Header Right Dock 1.5.0
 * Desktop-only, scoped to elements assigned by this plugin.
 * The existing header colours, text, logo and other navigation items are untouched.
 */
.pdhd-nav-row {
    --pdhd-gap: 10px;
}
.pdhd-nav-row.pdhd-flex-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}
.pdhd-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
    gap: var(--pdhd-gap) !important;
    margin-inline-start: auto !important;
    margin-inline-end: 0 !important;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    list-style: none !important;
    position: relative;
    z-index: 2;
}
.pdhd-actions > .pdhd-item,
.pdhd-actions > .pdhd-item-wrapper,
.pdhd-actions > .pdhd-item-list {
    flex: 0 0 auto !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    list-style: none !important;
}
.pdhd-actions .pdhd-item-list {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}
.pdhd-actions .pdhd-item-list > li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}
.pdhd-actions .pdhd-item.elementor-widget {
    position: static !important;
}
.pdhd-actions .pdhd-item img {
    max-height: 70px;
    max-width: 85px;
    width: auto;
    height: auto;
    object-fit: contain;
}
.pdhd-nav-row.pdhd-nav-list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
}
.pdhd-nav-row.pdhd-nav-list > .pdhd-first {
    margin-inline-start: auto !important;
}
.pdhd-nav-row.pdhd-nav-list > .pdhd-first,
.pdhd-nav-row.pdhd-nav-list > .pdhd-last {
    flex: 0 0 auto !important;
    list-style: none !important;
}
.pdhd-nav-row.pdhd-nav-list > .pdhd-first img,
.pdhd-nav-row.pdhd-nav-list > .pdhd-last img {
    max-height: 70px;
    max-width: 85px;
    width: auto;
    height: auto;
    object-fit: contain;
}
/* Never override the theme's mobile / tablet menu. JavaScript also restores
 * the original DOM arrangement when crossing the desktop breakpoint. */

/* Version 1.1: hide only repeated Devilsmart / Premium header units detected by the plugin. */
.pdhd-duplicate {
    display: none !important;
}

/* v1.2: keep the existing desktop menu in one tight, responsive white strip. */
    .pdhd-nav-row.pdhd-single-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: clamp(3px, .55vw, 9px) !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding-inline: clamp(3px, .5vw, 9px) !important;
        overflow: visible !important;
    }
    .pdhd-nav-row.pdhd-single-row > :not(.pdhd-actions) {
        margin-block: 0 !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: 0 1 auto !important;
        align-self: center !important;
    }
    .pdhd-nav-row.pdhd-single-row .pdhd-straighten {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        gap: clamp(3px, .5vw, 8px) !important;
    }
    .pdhd-nav-row.pdhd-single-row .elementor-nav-menu--main > ul,
    .pdhd-nav-row.pdhd-single-row .elementor-nav-menu--main > ul > li {
        white-space: nowrap !important;
        flex-wrap: nowrap !important;
    }
    .pdhd-nav-row.pdhd-single-row .pdhd-actions {
        margin-inline-start: auto !important;
        gap: clamp(4px, .65vw, 10px) !important;
    }
    .pdhd-nav-row.pdhd-single-row .pdhd-item img {
        max-height: 58px !important;
        max-width: 65px !important;
        object-fit: contain !important;
    }
    .pdhd-nav-row.pdhd-single-row .pdhd-stray-nav-item {
        flex: 0 0 auto !important;
        list-style: none !important;
    }
/* Hide only the visible name under these two icon links, without touching the images. */
.pdhd-icon-only { font-size: 0 !important; line-height: 0 !important; }
.pdhd-icon-only a { font-size: 0 !important; line-height: 0 !important; }
.pdhd-icon-only img { display: inline-block !important; vertical-align: middle !important; }
.pdhd-icon-only svg, .pdhd-icon-only i { font-size: 24px !important; line-height: 1 !important; }
.pdhd-icon-only .pdhd-hidden-caption { display: none !important; }
.pdhd-icon-only :is(figcaption, .widget-image-caption, .wp-caption-text,
  .elementor-image-box-title, .elementor-icon-box-title, .elementor-heading-title) {
    display: none !important;
}

/* Applied only to a header row that becomes empty after its buttons move. */
.pdhd-empty-row { display: none !important; }

/* v1.3 mockup-matched far-right icons. Applies only to the two docked links.
 * Existing Elementor logos, menu buttons and all other site elements stay unchanged.
 */
.pdhd-nav-row .pdhd-new-icon a.pdhd-icon-link {
    display: inline-flex !important;
    flex: 0 0 56px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: none !important;
    box-shadow: 0 2px 5px rgba(12, 20, 35, .22) !important;
    overflow: hidden !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: 0 !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    position: relative !important;
    transition: transform .15s ease, box-shadow .15s ease !important;
}
.pdhd-nav-row .pdhd-new-icon a.pdhd-icon-link > :not(.pdhd-brand-tile) {
    display: none !important;
}
.pdhd-nav-row .pdhd-new-icon a.pdhd-icon-link .pdhd-brand-tile {
    display: block !important;
    flex: 0 0 56px !important;
    width: 56px !important;
    height: 56px !important;
    border-radius: 11px !important;
    background-position: center !important;
    background-size: 56px 56px !important;
    background-repeat: no-repeat !important;
}
.pdhd-nav-row .pdhd-new-icon .pdhd-tile-smart {
    background-image: url('devilsmart-cart.svg') !important;
}
.pdhd-nav-row .pdhd-new-icon .pdhd-tile-premium {
    background-image: url('premium-crown.svg') !important;
}
.pdhd-nav-row .pdhd-new-icon a.pdhd-icon-link:hover,
.pdhd-nav-row .pdhd-new-icon a.pdhd-icon-link:focus-visible {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 9px rgba(12, 20, 35, .26) !important;
}
.pdhd-nav-row .pdhd-new-icon a.pdhd-icon-link:focus-visible {
    outline: 2px solid #2578ec !important;
    outline-offset: 2px !important;
}
.pdhd-nav-row.pdhd-single-row .pdhd-actions .pdhd-new-icon {
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    flex: 0 0 56px !important;
    padding: 0 !important;
    margin: 0 !important;
}
/* Hidden original image widgets remain available in the DOM for easy rollback. */
.pdhd-nav-row .pdhd-new-icon .widget-image-caption,
.pdhd-nav-row .pdhd-new-icon .elementor-image-box-title,
.pdhd-nav-row .pdhd-new-icon > .text,
.pdhd-nav-row .pdhd-new-icon > .elementor-heading-title { display:none !important; }

/* v1.4 Equal Spacing — distribute *every* desktop nav button with the
 * same free-space gap. The actions dock participates as two independent
 * flex items; otherwise the large margin before the pair creates a hole.
 * Only active when plugin has successfully detected the white nav row. */
.pdhd-nav-row.pdhd-single-row {
    --pdhd-equal-gap: clamp(8px, .85vw, 14px);
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    column-gap: var(--pdhd-equal-gap) !important;
    row-gap: 0 !important;
}
/* `display: contents` flattens the two icon widgets for flex distribution
 * while retaining their original accessible <a> elements and click targets. */
.pdhd-nav-row.pdhd-single-row > .pdhd-actions {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
}
.pdhd-nav-row.pdhd-single-row > .pdhd-actions > .pdhd-item,
.pdhd-nav-row.pdhd-single-row > .pdhd-actions > .pdhd-item-wrapper,
.pdhd-nav-row.pdhd-single-row > .pdhd-actions > .pdhd-item-list {
    margin-inline: 0 !important;
    flex: 0 1 auto !important;
    align-self: center !important;
}
/* A row represented as a <ul> uses two direct <li> buttons, no dock. */
.pdhd-nav-row.pdhd-single-row.pdhd-nav-list > .pdhd-first {
    margin-inline-start: 0 !important;
}
/* Normalize common Elementor nested navigation groups. Never target
 * submenu/dropdown items, which have a separate positioning system. */
.pdhd-nav-row.pdhd-single-row .pdhd-straighten:not(.sub-menu):not(.elementor-nav-menu--dropdown) {
    gap: var(--pdhd-equal-gap) !important;
    column-gap: var(--pdhd-equal-gap) !important;
}
.pdhd-nav-row.pdhd-single-row > :not(.pdhd-actions) {
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
}

/* v1.5 — left / centre / right header arrangement.
   Preserve the existing DOM and original Elementor links. Only the two
   repositioned icon widgets are absolutely anchored inside the nav row.
   All other navigation items stay in the natural flex flow and are centered
   as one group, with matching gap sizes. */
.pdhd-nav-row.pdhd-single-row {
    --pdhd-side-inset: clamp(4px, .65vw, 10px);
    --pdhd-center-gap: clamp(4px, .7vw, 12px);
    position: relative !important;
    justify-content: center !important;
    gap: var(--pdhd-center-gap) !important;
    column-gap: var(--pdhd-center-gap) !important;
    padding-inline: clamp(67px, 6.7vw, 86px) !important;
    box-sizing: border-box !important;
}
/* The docking container is layout-neutral. The original widget links
   remain where they belong in the DOM and retain their destinations. */
.pdhd-nav-row.pdhd-single-row.pdhd-flex-row > .pdhd-actions {
    display: contents !important;
}
/* Devilsmart: extreme LEFT corner of white header */
.pdhd-nav-row.pdhd-single-row.pdhd-flex-row > .pdhd-actions > :first-child,
.pdhd-nav-row.pdhd-single-row.pdhd-nav-list > .pdhd-first {
    position: absolute !important;
    left: var(--pdhd-side-inset) !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 5 !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* PharmaDevils Premium: extreme RIGHT corner of white header */
.pdhd-nav-row.pdhd-single-row.pdhd-flex-row > .pdhd-actions > :last-child,
.pdhd-nav-row.pdhd-single-row.pdhd-nav-list > .pdhd-last {
    position: absolute !important;
    right: var(--pdhd-side-inset) !important;
    left: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 5 !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* The original middle buttons are centered without a big margin after the
   last menu item; hidden duplicate widgets do not occupy any space. */
.pdhd-nav-row.pdhd-single-row > :not(.pdhd-actions):not(.pdhd-first):not(.pdhd-last) {
    margin-inline: 0 !important;
    align-self: center !important;
}
/* Leave WordPress / Elementor menu dropdown positioning alone. */
.pdhd-nav-row.pdhd-single-row .pdhd-straighten:not(.sub-menu):not(.elementor-nav-menu--dropdown) {
    gap: var(--pdhd-center-gap) !important;
}

/* 2026-11-13: show DevilSmart and Premium only as floating corner shortcuts. */
.pdhd-nav-row .pdhd-actions > .pdhd-item-list,
.pdhd-nav-row .pdhd-actions > .pdhd-item,
.pdhd-nav-row .pdhd-actions > .pdhd-item-wrapper,
.elementor-element-de1f8db .pd-hba-menu-item {
    display: none !important;
}