/* =========================
   Header - Tick Optic v2
   Desktop: red, horizontal 3-col
   Mobile: red, accordion submenu
========================= */

/* ── پایه ───────────────────────────────── */
.site-header.tick-site-header,
#masthead.tick-site-header {
    background: var(--color-primary, #9b0008) !important;
    margin: 12px 50px 22px !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 24px rgba(155,0,8,.22) !important;
    position: relative !important;
    z-index: 9999 !important;
    overflow: visible !important;
}

.tick-header-inner {
    min-height: 88px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 30px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 24px;
    direction: rtl;
}

/* ── برند ────────────────────────────────── */
.tick-header-brand { justify-self: end; text-align: right; }
.tick-header-brand a { display: block; color: #fff !important; text-decoration: none !important; }
.tick-header-title { display: block; font-size: 28px; font-weight: 700; line-height: 1.35; white-space: nowrap; color: #fff !important; }
.tick-header-desc  { display: block; font-size: 14px; font-weight: 400; line-height: 1.7; white-space: nowrap; color: #fff !important; opacity: .9; }

/* ── منوی دسکتاپ ─────────────────────────── */
.tick-header-nav { display: flex; justify-content: center; align-items: center; }
.tick-menu { display: flex; align-items: center; justify-content: center; flex-wrap: nowrap; gap: 20px; margin: 0; padding: 0; list-style: none; }
.tick-menu li { margin: 0; padding: 0; list-style: none; position: relative; }
.tick-menu a { color: #fff !important; text-decoration: none !important; font-size: 14px; font-weight: 500; white-space: nowrap; transition: .2s; display: block; padding: 4px 0; }
.tick-menu a:hover { color: #ffe1e1 !important; }

/* dropdown دسکتاپ — fallback + standard WordPress menu classes */
.tick-has-dropdown,
.tick-menu .menu-item-has-children { position: relative; }

/* Invisible bridge prevents the menu closing while the pointer moves down. */
.tick-has-dropdown::after,
.tick-menu .menu-item-has-children::after {
    content: '';
    position: absolute;
    top: 100%;
    right: 0;
    width: max(100%, 190px);
    height: 18px;
}

.tick-dropdown,
.tick-menu .sub-menu {
    display: block;
    visibility: hidden;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    min-width: 210px;
    background: #fff;
    border: 1px solid #f1dddd;
    border-radius: 14px;
    box-shadow: 0 14px 34px rgba(80,0,7,.18);
    padding: 8px 0;
    list-style: none;
    margin: 0;
    z-index: 10000;
    direction: rtl;
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.tick-dropdown li,
.tick-menu .sub-menu li { margin: 0; padding: 0; width: 100%; }
.tick-dropdown a,
.tick-menu .sub-menu a {
    color: #222 !important;
    font-size: 13px;
    padding: 11px 18px;
    display: block;
    border-bottom: 1px solid #f5eeee;
}
.tick-dropdown a:hover,
.tick-menu .sub-menu a:hover { color: var(--color-primary, #9b0008) !important; background: #fff7f7; }
.tick-dropdown li:last-child a,
.tick-menu .sub-menu li:last-child a { border-bottom: none; }
.tick-has-dropdown:hover > .tick-dropdown,
.tick-has-dropdown:focus-within > .tick-dropdown,
.tick-menu .menu-item-has-children:hover > .sub-menu,
.tick-menu .menu-item-has-children:focus-within > .sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* ── آیکون‌های اکشن ─────────────────────── */
.tick-header-actions { display: flex; align-items: center; justify-content: flex-start; gap: 16px; justify-self: start; }
.tick-header-actions a { display: inline-flex; align-items: center; gap: 6px; color: #fff !important; text-decoration: none !important; font-size: 13px; white-space: nowrap; }
.tick-action-icon { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; color: #fff !important; }

/* دکمه همبرگری: پنهان در دسکتاپ */
.tick-mobile-menu-toggle { display: none; }
.tick-mobile-overlay, .tick-mobile-drawer { display: none; }

/* پنهان کردن هدر والد */
.desktop-header, .mobile-header, #banner_section { display: none !important; }

/* ── موبایل ──────────────────────────────── */
@media (max-width: 768px) {
    .site-header.tick-site-header,
    #masthead.tick-site-header {
        background: var(--color-primary, #9b0008) !important;
        margin: 0 0 14px !important;
        border-radius: 0 0 18px 18px !important;
        box-shadow: 0 4px 16px rgba(155,0,8,.28) !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 10000 !important;
    }

    .tick-header-inner {
        min-height: 68px;
        padding: 6px 14px;
        display: grid;
        grid-template-columns: 44px 1fr auto;
        gap: 10px;
        align-items: center;
    }

    .tick-header-nav { display: none !important; }

    .tick-mobile-menu-toggle {
        display: inline-flex !important;
        grid-column: 1;
        width: 42px; height: 42px;
        border: 0; padding: 0; margin: 0;
        border-radius: 12px;
        background: rgba(255,255,255,.2);
        align-items: center; justify-content: center;
        flex-direction: column; gap: 5px;
        cursor: pointer;
    }
    .tick-mobile-menu-toggle span { display: block; width: 20px; height: 2px; border-radius: 99px; background: #fff; }

    .tick-header-brand { grid-column: 2; justify-self: end; text-align: right; padding-top: 3px; }
    .tick-header-title { color: #fff !important; font-size: 20px; }
    .tick-header-desc { display: none; }

    .tick-header-actions { grid-column: 3; display: flex; gap: 6px; justify-self: start; }
    .tick-header-actions a {
        width: 36px; height: 36px;
        border-radius: 11px;
        background: rgba(255,255,255,.18);
        color: #fff !important;
        font-size: 0; gap: 0;
        display: flex; align-items: center; justify-content: center;
    }
    .tick-header-actions .tick-action-icon { color: #fff !important; font-size: 17px; width: auto; height: auto; }
    .tick-action-text { display: none; }

    /* overlay */
    .tick-mobile-overlay {
        display: block;
        position: fixed; inset: 0;
        background: rgba(0,0,0,.35);
        z-index: 10001;
        opacity: 0; visibility: hidden;
        transition: .2s ease;
    }

    /* drawer */
    .tick-mobile-drawer {
        display: block;
        position: fixed; top: 0; right: 0;
        width: min(84vw, 330px); height: 100vh;
        background: #fff;
        z-index: 10002;
        transform: translateX(105%);
        transition: .25s ease;
        box-shadow: -14px 0 32px rgba(0,0,0,.18);
        padding: 18px;
        overflow-y: auto;
        direction: rtl;
    }

    body.tick-menu-open { overflow: hidden; }
    body.tick-menu-open .tick-mobile-overlay { opacity: 1; visibility: visible; }
    body.tick-menu-open .tick-mobile-drawer { transform: translateX(0); }

    .tick-mobile-drawer-head {
        display: flex; align-items: center; justify-content: space-between; gap: 12px;
        padding-bottom: 16px; margin-bottom: 10px;
        border-bottom: 1px solid #eee;
    }
    .tick-mobile-drawer-head strong { font-size: 18px; color: var(--color-primary, #9b0008); }
    .tick-mobile-close { width: 34px !important; height: 34px !important; border: 0 !important; border-radius: 10px !important; background: #f5f5f5 !important; color: var(--color-primary, #9b0008) !important; font-size: 20px; line-height: 1; cursor: pointer; box-shadow: none !important; padding: 0 !important; }

    .tick-mobile-drawer nav { display: flex; flex-direction: column; }

    .tick-mobile-drawer nav > a,
    .tick-mobile-accordion-head {
        display: flex; align-items: center;
        min-height: 46px; padding: 10px 4px;
        border-bottom: 1px solid #f1f1f1;
        color: #222 !important;
        text-decoration: none !important;
        font-size: 15px;
    }
    .tick-mobile-drawer nav > a:hover { color: var(--color-primary, #9b0008) !important; }

    /* accordion */
    .tick-mobile-accordion { display: flex; flex-direction: column; }

    .tick-mobile-accordion-head {
        justify-content: space-between;
    }
    .tick-mobile-accordion-head > a {
        color: #222 !important;
        text-decoration: none !important;
        font-size: 15px;
        flex: 1;
        padding: 0;
        min-height: unset;
        border: none;
    }
    .tick-mobile-accordion-head > a:hover { color: var(--color-primary, #9b0008) !important; }

    .tick-accordion-toggle {
        width: 30px !important; height: 30px !important;
        border: none !important;
        background: transparent !important;
        border-radius: 8px !important;
        cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        color: #888 !important;
        transition: .2s;
        flex-shrink: 0;
        box-shadow: none !important;
        padding: 0 !important;
    }
    .tick-accordion-toggle svg { transition: transform .25s ease; }
    .tick-accordion-toggle[aria-expanded="true"] { background: transparent !important; color: var(--color-primary, #9b0008) !important; }
    .tick-accordion-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
    .tick-accordion-toggle[aria-expanded="true"] path { stroke: var(--color-primary, #9b0008); }

    .tick-mobile-submenu {
        display: none;
        flex-direction: column;
        background: #fdf5f5;
        border-right: 3px solid var(--color-primary, #9b0008);
        margin-right: 12px;
        border-radius: 0 0 10px 0;
    }
    .tick-mobile-submenu.open { display: flex; }
    .tick-mobile-submenu a {
        padding: 10px 14px;
        border-bottom: 1px solid #f1e5e5;
        color: #333 !important;
        text-decoration: none !important;
        font-size: 14px;
    }
    .tick-mobile-submenu a:last-child { border-bottom: none; }
    .tick-mobile-submenu a:hover { color: var(--color-primary, #9b0008) !important; }

    .tick-mobile-drawer-actions {
        margin: 0;
        padding: 0;
    }
    .tick-mobile-drawer-actions a {
        display: flex; align-items: center;
        min-height: 46px; padding: 10px 4px;
        border-bottom: 1px solid #f1f1f1;
        color: #222 !important; text-decoration: none !important; font-size: 15px;
    }
    .tick-mobile-drawer-actions a:hover { color: var(--color-primary, #9b0008) !important; }
}