/* ===========================================================================
   Anuh Pharma — Investor Relations (WordPress) header + footer skin
   Makes the /investor-relations/ WordPress page's header & footer match the
   live static site (NAVY-GREY theme). FULLY SCOPED: every rule is prefixed
   with .anuh-skin / #anuh-hdr / #anuh-foot so it CANNOT touch the Elementor
   page body or the 574-document boxes. Palette mirrors site/css/theme.css.
   ========================================================================= */

/* hide the old Elementor header when the new skin is active */
body.anuh-skinned .elementor-location-header{display:none !important;}
/* The old Elementor FOOTER template holds, in order: (1) "Investor Grievances"
   heading, (2) the investor contacts (Compliance Officer / CFO / Company
   Secretary + Registrar/Bigshare), then (3) address/links, (4) footer menu,
   (5) copyright. KEEP the first two (real content); hide the rest (old chrome
   — replaced by the new footer). */
body.anuh-skinned .elementor-location-footer > *:nth-child(n+3){display:none !important;}
body.anuh-skinned .elementor-location-footer{margin-bottom:0 !important;padding-bottom:8px;}

/* the page's first section used a -125px "overlap-wrapper" margin to tuck
   under the OLD Elementor header; cancel it so content sits below the new one */
body.anuh-skinned .elementor [class*="overlap"]{margin-top:0 !important;}
body.anuh-skinned .page-content{padding-top:14px;}

/* design tokens (scoped to the skin containers only) — NAVY-GREY */
.anuh-skin{
  --navy:#04193a; --navy-2:#0a2c5c; --red:#123f74; --red-2:#1e5aa0;
  --ink:#0f2036; --muted:#42536a; --bg:#dde2e8; --white:#fff;
  --pc:#dde2e8; --pc2:#d5dae1; --tx:#0f2036; --tx2:#42536a; --tx3:#7a889a;
  --bd:rgba(10,30,60,.12); --cardbd:#cdd4dc;
  font-family:Inter,system-ui,Arial,sans-serif;
}
.anuh-skin *{box-sizing:border-box;}
.anuh-skin a{text-decoration:none;color:inherit;}
.anuh-skin img{max-width:100%;display:block;}
.anuh-skin .container{width:100%;max-width:1220px;margin:0 auto;padding:0 26px;}
.anuh-skin .btn{display:inline-flex;align-items:center;gap:.55rem;font-family:Poppins,system-ui,sans-serif;font-weight:600;font-size:.95rem;padding:.8rem 1.5rem;border-radius:8px;border:2px solid transparent;transition:.25s;cursor:pointer;}
.anuh-skin .btn svg{width:18px;height:18px;}
.anuh-skin .btn-red{background:var(--red);color:#fff;box-shadow:0 12px 30px -10px rgba(18,63,116,.5);}
.anuh-skin .btn-red:hover{background:#fff;color:var(--red);border-color:var(--red);transform:translateY(-2px);}
.anuh-skin .eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-family:Space Grotesk,system-ui,sans-serif;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.86rem;color:var(--red);margin-bottom:1.1rem;}
.anuh-skin .eyebrow:before{content:"";width:32px;height:3px;border-radius:2px;background:var(--red);display:inline-block;}

/* ---- HEADER (light royal-purple, matches the live site) ---- */
#anuh-hdr{position:sticky;top:0;left:0;right:0;z-index:60;background:var(--pc);box-shadow:0 6px 20px -16px rgba(10,30,60,.35);}
#anuh-hdr .topbar{background:var(--pc);color:var(--tx2);font-size:.8rem;border-bottom:1px solid var(--bd);}
#anuh-hdr .topbar .tb{display:flex;align-items:center;justify-content:space-between;height:40px;}
#anuh-hdr .topbar .tag{font-family:Space Grotesk,sans-serif;font-weight:600;letter-spacing:.16em;text-transform:uppercase;font-size:.68rem;color:var(--tx);}
#anuh-hdr .topbar .tbc{display:flex;gap:26px;}
#anuh-hdr .topbar .tbc a{display:inline-flex;align-items:center;gap:.5rem;color:var(--tx2);}
#anuh-hdr .topbar .tbc a:hover{color:var(--tx);}
#anuh-hdr .topbar .tbc a b{color:var(--tx);font-weight:600;}
#anuh-hdr .topbar .tbc svg{width:15px;height:15px;stroke:var(--red);fill:none;stroke-width:1.8;}
#anuh-hdr .nav{display:flex;align-items:center;justify-content:space-between;height:84px;}
#anuh-hdr .nav .logo-d{height:52px;display:block;width:auto;}
#anuh-hdr .menu{display:flex;gap:2.1rem;list-style:none;margin:0;padding:0;font-family:Poppins,system-ui,sans-serif;font-weight:500;font-size:.94rem;}
#anuh-hdr .menu>li{position:relative;}
#anuh-hdr .menu a{color:var(--ink);padding:.4rem 0;position:relative;transition:.2s;display:inline-block;}
#anuh-hdr .menu>li>a:after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background:var(--red);transition:.25s;}
#anuh-hdr .menu>li>a:hover:after{width:100%;}
#anuh-hdr .menu a:hover{color:var(--red);}
#anuh-hdr .menu .sub{position:absolute;top:calc(100% + 11px);left:-14px;background:#fff;min-width:230px;border-radius:10px;box-shadow:0 24px 50px -20px rgba(10,30,60,.4);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.22s;list-style:none;margin:0;z-index:70;}
#anuh-hdr .menu li:hover .sub{opacity:1;visibility:visible;transform:translateY(0);}
#anuh-hdr .menu .sub li{display:block;}
#anuh-hdr .menu .sub a{display:block;padding:10px 14px;border-radius:7px;color:var(--ink);font-size:.9rem;}
#anuh-hdr .menu .sub a:after{display:none;}
#anuh-hdr .menu .sub a:hover{background:var(--bg);color:var(--red);}
#anuh-hdr .has-sub::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;}

/* ---- hamburger + mobile drawer ---- */
#anuh-hdr .navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;background:none;border:0;cursor:pointer;}
#anuh-hdr .navtoggle span{display:block;height:2px;width:100%;background:var(--navy);border-radius:2px;transition:.28s;}
#anuh-hdr .navtoggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
#anuh-hdr .navtoggle.open span:nth-child(2){opacity:0;}
#anuh-hdr .navtoggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.anuh-mnav{position:fixed;inset:0 0 0 auto;width:min(86vw,360px);background:#fff;box-shadow:-20px 0 60px -20px rgba(10,30,60,.5);transform:translateX(100%);transition:transform .3s ease;z-index:120;padding:26px 22px;overflow-y:auto;}
.anuh-mnav.open{transform:none;}
.anuh-mnav-ov{position:fixed;inset:0;background:rgba(15,32,54,.5);opacity:0;visibility:hidden;transition:.3s;z-index:110;}
.anuh-mnav-ov.open{opacity:1;visibility:visible;}
.anuh-mnav ul{list-style:none;margin:0;padding:0;}
.anuh-mnav>ul>li{border-bottom:1px solid var(--bg);}
.anuh-mnav a{display:block;padding:13px 4px;color:var(--ink);font-family:Poppins,system-ui,sans-serif;font-weight:600;font-size:1.02rem;}
.anuh-mnav .has-sub>a{display:flex;align-items:center;justify-content:space-between;}
.anuh-mnav .msub-caret{width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:.28s;}
.anuh-mnav .has-sub.open>a .msub-caret{transform:rotate(-135deg);}
.anuh-mnav .sub{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.anuh-mnav .has-sub.open>.sub{max-height:520px;}
.anuh-mnav .sub a{padding:8px 2px 8px 16px;font-weight:500;font-size:.95rem;color:var(--muted);}
.anuh-mnav .btn{margin-top:18px;width:100%;justify-content:center;}

@media(max-width:940px){
  #anuh-hdr .menu,#anuh-hdr .nav>.btn{display:none;}
  #anuh-hdr .navtoggle{display:inline-flex;}
  #anuh-hdr .topbar .tag{display:none;}
  #anuh-hdr .topbar .tbc{gap:16px;}
  #anuh-hdr .topbar .tbc a b{display:none;}
}

/* ---- FOOTER (light royal-purple, matches the live site) ---- */
#anuh-foot{background:var(--pc2);color:var(--tx3);padding:76px 0 26px;font-size:.92rem;font-family:Inter,system-ui,Arial,sans-serif;}
#anuh-foot .fgrid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:40px;}
#anuh-foot h5{font-family:Poppins,system-ui,sans-serif;color:var(--tx);font-size:.9rem;letter-spacing:.08em;text-transform:uppercase;margin:0 0 1.1rem;}
#anuh-foot p{margin:.2rem 0 0;line-height:1.65;color:var(--tx2);}
#anuh-foot a{color:var(--tx3);transition:.2s;}
#anuh-foot a:hover{color:var(--tx);}
#anuh-foot ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem;}
#anuh-foot .fbot{border-top:1px solid var(--bd);margin-top:48px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:var(--tx3);font-size:.85rem;}
@media(max-width:860px){#anuh-foot .fgrid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){#anuh-foot .fgrid{grid-template-columns:1fr;}}

/* ===========================================================================
   ROYAL RE-TINT of the WordPress PAGE BODY (colours only, never layout).
   Remaps the old corporate palette on the visible page elements to royal:
     navy  #041e42  -> #04193a   (the category nav-menu "boxes" + bands)
     teal  #46c2ca  -> #1e5aa0   (menu hover/active state — Elementor global)
     red   #ed1c24  -> #123f74   (Elementor buttons e.g. "Get a Quote")
     blue  #4268c1  -> #123f74   (JetSearch submit)
   Every rule is gated on body.anuh-skinned and only touches background/border/
   colour — it changes ZERO markup, layout, JetEngine/Toolset behaviour, the
   document post type, or the wp-admin upload workflow. Purely cosmetic.
   ========================================================================= */
/* remap the one custom Elementor global colour (the teal hover/active) */
body.anuh-skinned{--e-global-color-b0426de:#1e5aa0 !important;}

/* category nav-menu "boxes" styled like the Investor-Grievances cards:
   light-purple fill, purple border, royal-purple text — INVERTING to filled
   royal (white text) on hover / open. Sub-menus are plain rows (no boxing). */
/* top-level boxes = the card (flex column so the link stretches to fill height) */
body.anuh-skinned ul.elementor-nav-menu > li.menu-item{
  background-color:#eef1f4 !important;border:2px solid rgba(18,63,116,.40) !important;
  border-radius:14px !important;overflow:hidden !important;
  display:flex !important;flex-direction:column !important;
  transition:background-color .2s ease,border-color .2s ease !important;}
/* the link fills the whole box (fixes the light strip below short links) */
body.anuh-skinned ul.elementor-nav-menu > li.menu-item > a.elementor-item{flex:1 1 auto !important;}
/* every menu link: royal-purple text, transparent fill, NO Elementor pointer overlay
   (::before/::after removed — they were the framed border / blue hover underline) */
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item .elementor-item-title{background-color:transparent !important;color:#0f2036 !important;}
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item::before,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item::after{display:none !important;background-color:transparent !important;border:0 !important;}
/* caret: fill the icon svg AND its inner path (path had an explicit white fill) */
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item svg,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item svg path,
body.anuh-skinned .elementor-nav-menu .sub-arrow svg,
body.anuh-skinned .elementor-nav-menu .sub-arrow svg path{fill:#0f2036 !important;stroke:#0f2036 !important;}
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item i{color:#0f2036 !important;}
/* sub-menus = plain rows, no inner boxes/borders/shadows (kills the blue divider/bar).
   Borders/shadows killed on all states; background handled separately below. */
body.anuh-skinned .elementor-nav-menu ul.sub-menu,
body.anuh-skinned .elementor-nav-menu ul.sub-menu li.menu-item{background-color:transparent !important;}
body.anuh-skinned .elementor-nav-menu ul.sub-menu,
body.anuh-skinned .elementor-nav-menu ul.sub-menu li.menu-item,
body.anuh-skinned .elementor-nav-menu ul.sub-menu a.elementor-sub-item,
body.anuh-skinned .elementor-nav-menu ul.sub-menu a.elementor-sub-item:hover,
body.anuh-skinned .elementor-nav-menu ul.sub-menu a.elementor-sub-item:focus{border:0 !important;border-radius:0 !important;box-shadow:none !important;}
/* sub-menu links use the .elementor-sub-item class (not .elementor-item) — give
   them the royal-purple text so they're legible on the light panel, invert on hover */
body.anuh-skinned .elementor-nav-menu a.elementor-sub-item{background-color:transparent !important;color:#0f2036 !important;}
body.anuh-skinned .elementor-nav-menu a.elementor-sub-item:hover,
body.anuh-skinned .elementor-nav-menu a.elementor-sub-item:focus,
body.anuh-skinned .elementor-nav-menu a.elementor-sub-item.highlighted,
body.anuh-skinned .elementor-nav-menu a.elementor-sub-item.elementor-item-active{background-color:#04193a !important;color:#fff !important;}
/* INVERT: the link fills royal + white text on hover / open / active */
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item:hover,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item:focus,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item.highlighted,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item.elementor-item-active{background-color:#04193a !important;color:#fff !important;box-shadow:none !important;}
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item:hover svg,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item:hover svg path,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item.highlighted svg,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item.highlighted svg path,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item.elementor-item-active svg,
body.anuh-skinned .elementor-nav-menu li.menu-item a.elementor-item.elementor-item-active svg path{fill:#fff !important;stroke:#fff !important;}
/* top-level card border follows the invert */
body.anuh-skinned ul.elementor-nav-menu > li.menu-item:hover,
body.anuh-skinned ul.elementor-nav-menu > li.menu-item:focus-within{border-color:#04193a !important;}

/* Elementor buttons (red / navy) + JetSearch submit -> royal accent */
body.anuh-skinned .elementor-button,
body.anuh-skinned .jet-ajax-search__submit,
body.anuh-skinned .jet-search-filter__submit-button{background-color:#123f74 !important;border-color:#123f74 !important;color:#fff !important;}
body.anuh-skinned .elementor-button:hover,
body.anuh-skinned .jet-ajax-search__submit:hover{background-color:#04193a !important;border-color:#04193a !important;}

/* any full-width navy bands that remain visible in the page body -> royal navy */
body.anuh-skinned .investor-spa-wrapper h1 a span.post-date{color:#1e5aa0 !important;}

/* ---- INNER category / archive pages (each category's document list). The skin
   header+footer already apply here; these bring the DOCUMENT-LIST body to royal
   too. Generic class-based selectors so every category is covered. Colours only
   — the Toolset/JetEngine listing, the document links & downloads still work. */
/* teal document / year / heading links in the doc lists -> royal accent
   (broad, so it catches every list link on every category; buttons excluded) */
body.anuh-skinned .investor-spa-wrapper a:not(.btn),
body.anuh-skinned [class*="list-style"] a{color:#123f74 !important;}
/* the category page title (h1) -> dark royal (extra specificity to beat the
   broad :not(.btn) link rule above) */
body.anuh-skinned .elementor-widget-container .investor-spa-wrapper h1,
body.anuh-skinned .elementor-widget-container .investor-spa-wrapper h1 a{color:#0f2036 !important;}
/* the "document type" pills (e.g. "Annual Report") -> royal navy */
body.anuh-skinned .post-cta,
body.anuh-skinned span.post-cta{background-color:#04193a !important;color:#fff !important;}
/* the "View / Download" buttons -> royal navy, accent on hover (was navy/teal) */
body.anuh-skinned .investor-spa-wrapper a.btn{background-color:#04193a !important;color:#fff !important;}
body.anuh-skinned .investor-spa-wrapper a.btn:hover{background-color:#123f74 !important;color:#fff !important;}
/* misc blue/teal accents (loader rects, etc.) -> royal accent */
body.anuh-skinned .investor-spa-wrapper .rect,
body.anuh-skinned .investor-spa-wrapper [class*="rect-"]{background-color:#123f74 !important;}
/* categories shown as document ACCORDIONS (Notices, etc.): navy toggle
   headers -> royal navy; teal hover title -> light lavender */
body.anuh-skinned .anuh-listing-toggle .elementor-toggle .elementor-tab-title{background-color:#04193a !important;border-color:#04193a !important;}
body.anuh-skinned .anuh-listing-toggle .elementor-widget-toggle .elementor-tab-title:hover .elementor-toggle-title{color:#b9c4d4 !important;}
/* the OPEN (active) accordion header turned its title + icon teal -> keep white */
body.anuh-skinned .anuh-listing-toggle .elementor-tab-title.elementor-active .elementor-toggle-title,
body.anuh-skinned .anuh-listing-toggle .elementor-tab-title.elementor-active .elementor-toggle-icon,
body.anuh-skinned .anuh-listing-toggle .elementor-tab-title.elementor-active i,
body.anuh-skinned .anuh-listing-toggle .elementor-tab-title.elementor-active *{color:#fff !important;}
/* child-category navigation "boxes" on parent-category pages -> royal navy,
   accent on hover (same look as the main-page category boxes) */
body.anuh-skinned ul.child-categories a,
body.anuh-skinned .child-categories li a{background-color:#04193a !important;color:#fff !important;}
body.anuh-skinned ul.child-categories a:hover,
body.anuh-skinned .child-categories li a:hover{background-color:#123f74 !important;color:#fff !important;}

/* --- "Investor Grievances" band (the kept Elementor footer sections 1-2:
       heading + the 3 investor-contact cards). Colours only; content/markup
       untouched. High specificity to beat Elementor's per-element !important. */
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-cf3c2a2 .elementor-heading-title,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-cf3c2a2{color:#0f2036 !important;}
/* the 3 contact cards styled like the site buttons: page-background fill,
   purple border, dark-purple text — INVERTING to filled royal on hover. */
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-c0e5a65,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-4d254f1,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-0730663{
  background-color:#eef1f4 !important;border:2px solid rgba(18,63,116,.40) !important;
  border-radius:14px !important;transition:background-color .25s ease,border-color .25s ease !important;}
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-c0e5a65 *,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-4d254f1 *,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-0730663 *{color:#0f2036 !important;}
/* invert on hover */
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-c0e5a65:hover,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-4d254f1:hover,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-0730663:hover{
  background-color:#04193a !important;border-color:#04193a !important;}
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-c0e5a65:hover *,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-4d254f1:hover *,
body.anuh-skinned .elementor.elementor-63 .elementor-element.elementor-element-0730663:hover *{color:#ffffff !important;}

/* cookie bar (cookie.js injects royal colours) -> navy, on the IR page */
body.anuh-skinned #anuh-cookie{background:#04193a !important;color:#dbe3ee !important}
body.anuh-skinned #anuh-cookie a{color:#8fb0dd !important}
body.anuh-skinned #anuh-cookie .ck-accept{background:#123f74 !important;color:#fff !important}
body.anuh-skinned #anuh-cookie .ck-accept:hover{background:#0a2c5c !important}
body.anuh-skinned #anuh-cookie .ck-reject{color:#dbe3ee !important;border-color:rgba(255,255,255,.45) !important}
