/*
Theme Name: ExamNotesPDF Child
Template: generatepress
Version: 1.0.0
*/

/* ══════════════════ UNIFIED DESIGN SYSTEM ══════════════════
   Canonical tokens (source: homepage.php's v4 system) — reused site-wide
   so every non-homepage page shares the same container/card/button/header language. */
:root{
  /* --ink3 was #94A3B8 — only ~2.6:1 against white/--page, failing WCAG AA
     (needs 4.5:1 for normal text). Every usage sitewide is on a light
     background (badges, breadcrumbs, meta text, secondary card text) — none
     on dark, so darkening it once here is a safe systemic fix. #64748B
     (Tailwind slate-500) gets ~4.76:1 against white, clearing AA with a
     small margin while staying visually "muted/secondary" below --ink2. */
  --ink:#1E293B; --ink2:#475569; --ink3:#64748B;
  --amber:#F59E0B; --amber-bg:#FFFBEB; --amber-bd:#FDE68A;
  --blue:#2563EB; --blue-bg:#EFF6FF;
  --page:#F8FAFC; --white:#fff;
  --bd:#E2E8F0; --bd2:#CBD5E1;
  --r:8px; --rl:12px;
  --sh:0 1px 3px rgba(0,0,0,.07),0 1px 2px rgba(0,0,0,.05);
}

/* Shared page container (matches homepage's .v4-wrap rhythm: 1180px, 24px inset) */
.enp-container-lg{max-width:1180px;margin:0 auto;padding:20px 24px;}

/* Shared card */
.enp-card{background:var(--white);border:1px solid var(--bd);border-radius:var(--rl);box-shadow:var(--sh);}

/* Tool page frame (/tools/<slug>/): pasted tool markup goes inside this. overflow-x:auto
   is a mobile safety net for any wide element (a table, a fixed-width canvas) an
   AI-generated tool ships despite the "no fixed widths" prompt rule, so it scrolls
   inside the card instead of breaking the page's own layout. */
.enp-tool-card{padding:28px;overflow-x:auto;}
.enp-tool-card img,.enp-tool-card table,.enp-tool-card canvas,.enp-tool-card svg{max-width:100%;}
@media(max-width:560px){
  /* Edge-to-edge on phones (2026-09-04): floating the card with its own
     gutter, border, radius and shadow wastes real width on an already-narrow
     screen. Padding moves onto the card itself instead, so fields don't
     touch the bezel, but there's no separate rectangle bled inward from it. */
  .enp-tool-page-shell .enp-tool-card{padding:14px 16px;border:none;border-radius:0;box-shadow:none;}
}

/* Shared buttons */
.enp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:var(--r);font-weight:700;font-size:13px;padding:10px 20px;cursor:pointer;text-decoration:none;font-family:'Inter',sans-serif;transition:.15s;}
.enp-btn-primary{background:var(--amber);color:var(--ink);}
.enp-btn-primary:hover{filter:brightness(.95);color:var(--ink);}
.enp-btn-outline{background:transparent;color:var(--ink);border:1px solid var(--bd2);}
.enp-btn-outline:hover{border-color:var(--ink);background:var(--page);color:var(--ink);}

/* Shared page header: Title + Subtitle + Breadcrumb (see enp_page_header() in functions.php) */
.enp-page-header{max-width:1180px;margin:0 auto;padding:20px 24px 4px;}
.enp-breadcrumb{font-size:.8rem;color:var(--ink3);display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-bottom:10px;}
.enp-breadcrumb a{color:var(--ink3);text-decoration:none;}
.enp-breadcrumb a:hover{color:var(--ink);}
.enp-breadcrumb i{font-size:.65rem;opacity:.5;}
.enp-breadcrumb span{color:var(--ink);}
.enp-page-header-title{font-size:clamp(22px,3vw,30px);font-weight:800;color:var(--ink);letter-spacing:-.5px;margin-bottom:4px;}
.enp-page-header-sub{font-size:13.5px;color:var(--ink2);margin:0;}
@media(max-width:560px){
  /* .enp-page-main's own 20px horizontal padding stacks on top of whatever
     inner container a page nests inside it (.enp-container-lg/.enp-container/
     .enp-practice-container etc. all already reduce their own padding to
     14px here) -- on a 360px phone that's 34px+ of combined padding on each
     side, nearly a fifth of the screen width lost before any content
     starts. Matches those containers' same 14px here instead of a new
     number, so there's one mobile gutter size site-wide, not stacked ones. */
  .enp-page-main{padding-left:14px;padding-right:14px;}
  .enp-container-lg{padding:14px;}
  .enp-page-header{padding:14px 14px 4px;}
  /* Tool pages (Age Calculator and any future tool using
     enp_render_tool_backlink()/the .enp-tool-page-shell wrapper) go fully
     edge-to-edge on phone: no container gutter, no card border/radius/shadow
     (see .enp-tool-card override above). Supersedes the earlier "small
     gutter, keep the card look" approach — on a 6.5" screen that margin plus
     the card's own chrome read as wasted space, not a deliberate frame. */
  .enp-tool-page-shell{padding-left:0 !important;padding-right:0 !important;}
  .enp-tool-page-shell .enp-container-lg{padding-left:0 !important;padding-right:0 !important;max-width:none !important;}
}
/* ══════════════════ END UNIFIED DESIGN SYSTEM ══════════════════ */

*{margin:0;padding:0;box-sizing:border-box}
/* Mobile-first safety net: this is a content site where every image comes
   from an upload (any aspect ratio, any resolution, no guarantees). One
   oversized/unusual image should never be able to widen the page and break
   layout — this caps every image site-wide and clips any accidental
   horizontal overflow at the document level, no matter what gets uploaded
   or which component renders it. */
html{overflow-x:hidden;max-width:100%}
body{overflow-x:hidden;max-width:100%}
img,svg,video{max-width:100%;height:auto}
.enp-page-main{max-width:1280px;margin:0 auto;padding:2rem 20px;min-height:20vh}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;background:#fff;color:#0a1a2f;line-height:1.5;-webkit-font-smoothing:antialiased;padding-bottom:0}
.enp-container{max-width:1280px;margin:0 auto;padding:0 20px}
.section-title{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:#0a1a2f;margin-bottom:.3rem}
.section-sub{font-size:.9rem;color:#5a6f8a;font-weight:400;margin-bottom:1.8rem}
.hr-light{border:none;border-top:1px solid #f0f4fc;margin:.5rem 0 2rem}

/* badges */
.badge-bestseller{background:#0a1a2f;color:#fff;font-size:.45rem;font-weight:600;letter-spacing:.04em;padding:.1rem .5rem;border-radius:40px;text-transform:uppercase;display:inline-block;position:absolute;top:6px;right:6px;box-shadow:0 2px 8px rgba(10,26,47,.1)}
.badge-offer{background:#e8edf8;color:#0a1a2f;font-size:.45rem;font-weight:600;letter-spacing:.03em;padding:.1rem .5rem;border-radius:40px;text-transform:uppercase;display:inline-block;position:absolute;top:6px;left:6px}

/* buttons — base classes stay as-is (also used on light cards, e.g. the WooCommerce
   thank-you page's "View Orders" button); dark-chrome contexts override below. */
.btn-primary{background:#0a1a2f;color:#fff;border:none;padding:.7rem 1.8rem;border-radius:40px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:8px;text-decoration:none;letter-spacing:-.01em}
.btn-primary i{font-size:.85rem}
.btn-primary:hover{background:#1a2f4a;transform:scale(.97);color:#fff}
.btn-outline{background:transparent;color:#0a1a2f;border:1px solid #d5dee9;padding:.7rem 1.8rem;border-radius:40px;font-weight:500;font-size:.9rem;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.btn-outline:hover{border-color:#0a1a2f;background:#f5f8fd;color:#0a1a2f}
.btn-small{padding:.35rem 1.1rem;font-size:.75rem;border-radius:30px;font-weight:600}

/* navbar — unified onto the homepage's dark slate + amber chrome so the nav/footer
   no longer flips from dark (homepage) to light (every other page) between clicks. */
.enp-navbar{padding:.8rem 0;background:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.15);position:sticky;top:0;z-index:50}
.enp-nav-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:10px}
.enp-logo{font-size:19px;font-weight:800;letter-spacing:-.3px;color:#fff;display:flex;align-items:center;gap:9px;text-decoration:none;white-space:nowrap;flex-shrink:0}
.enp-logo-box{width:34px;height:34px;background:var(--amber);border-radius:7px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.enp-logo-box i{color:var(--ink);font-size:18px}
.enp-logo:hover{color:#fff}
/* Nav now renders a fixed, admin-managed WP Menu (Exam/Tools/etc. parents with
   children nested under them — see enp_get_nav_tree()) instead of one dropdown
   per exam taxonomy term, so this row stays a handful of items and never needs
   to wrap or scroll. IMPORTANT: don't add overflow-x:auto here again — setting
   overflow-x to anything but visible forces overflow-y to compute as auto too
   (CSS spec quirk), which clips .enp-dropdown-content's absolute-positioned
   flyout and makes every dropdown silently fail to show on hover/click. */
.enp-nav-dropdowns{display:flex;gap:.4rem;flex-wrap:nowrap;align-items:center}
.enp-dropdown{position:relative;display:inline-block}
.enp-dropdown>a{text-decoration:none;color:rgba(255,255,255,.65);font-weight:500;font-size:.85rem;padding:.4rem .9rem;border-radius:30px;transition:.15s;display:flex;align-items:center;gap:4px}
.enp-dropdown>a i{font-size:.6rem;opacity:.5}
.enp-dropdown>a:hover{background:rgba(255,255,255,.1);color:#fff}
.enp-dropdown-content{display:none;position:absolute;top:100%;left:0;background:var(--ink);min-width:200px;box-shadow:0 12px 32px rgba(0,0,0,.3);border-radius:16px;padding:.5rem 0;border:1px solid rgba(255,255,255,.1);z-index:60;margin-top:0}
.enp-dropdown-content a{display:block;padding:.5rem 1.2rem;text-decoration:none;color:rgba(255,255,255,.65);font-size:.8rem;font-weight:450;transition:.1s}
.enp-dropdown-content a:hover{background:rgba(255,255,255,.08);color:#fff}
.enp-dropdown:hover>.enp-dropdown-content{display:block}
/* Depth 3+ (a menu item nested inside a dropdown that itself has children) —
   flyout opens to the right of its parent row instead of stacking below it. */
.enp-dropdown-sub{position:relative}
.enp-dropdown-sub>a{display:flex;align-items:center;justify-content:space-between;gap:8px}
.enp-dropdown-sub>a i{font-size:.6rem;opacity:.5}
.enp-dropdown-flyout{top:-.5rem;left:100%;margin-top:0;margin-left:0}
.enp-dropdown-sub:hover>.enp-dropdown-flyout{display:block}
.enp-mobile-drop{border-bottom:1px solid rgba(255,255,255,.08)}
.enp-mobile-drop summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:4px;padding:.5rem 0}
.enp-mobile-drop summary::-webkit-details-marker{display:none}
.enp-mobile-drop summary i{font-size:.65rem;opacity:.5;transition:.2s}
.enp-mobile-drop[open] summary i{transform:rotate(180deg)}
.enp-mobile-drop-content{padding-left:1rem}
.enp-mobile-drop-content .enp-mobile-drop{border-bottom:none}
.enp-mobile-link{display:block;padding:.5rem 0;font-size:.9rem;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.08)}
.enp-nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.enp-mobile-toggle{display:none;font-size:1.3rem;color:#fff;cursor:pointer;gap:14px;align-items:center}
/* Animated 3-line hamburger — was only on the homepage (.v4-hamburger);
   this is the same look applied site-wide so header.php/single-free_notes.php
   don't fall back to a plain fa-bars icon anymore. */
.enp-hamburger{display:flex;flex-direction:column;gap:4px;cursor:pointer;background:transparent;border:none;padding:4px}
.enp-hamburger span{display:block;width:20px;height:2px;background:rgba(255,255,255,.8);border-radius:2px;transition:.2s}

/* Cart/Account buttons inside the dark navbar, and the footer's "Submit Notes" button —
   scoped overrides only; the base .btn-primary/.btn-outline classes above are untouched
   since they're also used on light backgrounds elsewhere (e.g. thank-you page). */
.enp-navbar .btn-outline{background:transparent;color:rgba(255,255,255,.75);border-color:rgba(255,255,255,.2)}
.enp-navbar .btn-outline:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3);color:#fff}
.enp-navbar .btn-primary{background:var(--amber);color:var(--ink)}
.enp-navbar .btn-primary:hover{background:var(--amber);filter:brightness(.95);color:var(--ink);transform:none}
.enp-footer .btn-primary{background:var(--amber);color:var(--ink)}
.enp-footer .btn-primary:hover{background:var(--amber);filter:brightness(.95);color:var(--ink);transform:none}

/* Practice MCQ / One Shot / any other plain top-level link from the nav menu —
   sits directly on the dark navbar. */
.enp-nav-plain-link{text-decoration:none;color:rgba(255,255,255,.65);font-weight:500;font-size:.85rem;padding:.4rem .7rem;border-radius:30px;transition:.15s}
.enp-nav-plain-link:hover{background:rgba(255,255,255,.1);color:#fff}

/* "Premium Notes" nav CTA — matched by menu item title (enp_render_nav_items_desktop/
   _mobile), not URL, so renaming the linked page never silently drops the CTA styling. */
.enp-nav-plain-link.enp-nav-cta{font-weight:600;padding:.4rem .9rem;background:var(--amber);color:var(--ink)}
.enp-nav-plain-link.enp-nav-cta:hover{background:var(--amber);filter:brightness(.95);color:var(--ink)}

/* Cart badge — count now actually draws the eye instead of a plain "(1)"
   inline with the label. Hidden (not just 0) when cart is empty. */
.enp-cart-link{position:relative}
.enp-cart-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;background:#DC2626;color:#fff;font-size:.68rem;font-weight:800;border-radius:999px;margin-left:2px;line-height:1}

/* Mobile hamburger panel — overrides the inline styles in header.php/single-free_notes.php
   so the slide-down menu matches the dark navbar instead of staying a white panel. */
#enp-mobile-menu{background:var(--ink) !important;border-top-color:rgba(255,255,255,.1) !important}
#enp-mobile-menu a,#enp-mobile-menu summary{color:rgba(255,255,255,.75) !important}
#enp-mobile-menu .enp-mobile-cta{color:var(--amber) !important;font-weight:700 !important}

/* hero */
.enp-hero{padding:2.2rem 0 2.5rem;text-align:center}
.enp-hero h1{font-size:2.6rem;font-weight:800;letter-spacing:-.03em;line-height:1.1;color:#0a1a2f;max-width:780px;margin:0 auto .8rem}
.enp-hero p{font-size:1.05rem;color:#4a5a72;max-width:520px;margin:0 auto 1.8rem;font-weight:400}
.enp-hero-search{max-width:620px;margin:0 auto 1.6rem;display:flex;background:#fff;border:1px solid #e3e9f2;border-radius:60px;padding:.3rem .3rem .3rem 1.5rem;align-items:center;box-shadow:0 6px 18px rgba(10,26,47,.03);transition:.2s}
.enp-hero-search:focus-within{border-color:#0a1a2f;box-shadow:0 8px 24px rgba(10,26,47,.06)}
.enp-hero-search i{color:#7a8aa0;font-size:.95rem}
.enp-hero-search input{border:none;padding:.8rem .8rem;font-size:.95rem;flex:1;outline:none;background:transparent;font-weight:400;color:#0a1a2f}
.enp-hero-search input::placeholder{color:#a0b2c9}
.enp-hero-search .btn-primary{padding:.6rem 1.8rem;border-radius:40px}

/* countdown */
.enp-countdown-bar{background:#f6faff;border-radius:20px;padding:.8rem 1.2rem;margin:1rem 0 2.2rem;display:flex;align-items:center;gap:.8rem;border:1px solid #eef4fc;overflow-x:auto;scrollbar-width:none;flex-wrap:wrap}
.enp-countdown-bar::-webkit-scrollbar{display:none}
.enp-countdown-label{font-weight:700;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:#0a1a2f;white-space:nowrap;display:flex;align-items:center;gap:6px}
.enp-countdown-label i{color:#e74c3c;font-size:.7rem;animation:enp-pulse 1.2s infinite}
@keyframes enp-pulse{0%,100%{opacity:1}50%{opacity:.2}}
.enp-countdown-items{display:flex;gap:.6rem;flex-wrap:wrap;flex:1}
.enp-countdown-item{display:flex;align-items:center;gap:.5rem;background:#fff;border:1px solid #e3e9f2;border-radius:40px;padding:.35rem .9rem;white-space:nowrap}
.enp-countdown-item .enp-exam-name{font-size:.8rem;font-weight:600;color:#0a1a2f}
.enp-countdown-item .enp-days{font-size:.75rem;font-weight:700;color:#e74c3c;display:flex;align-items:center;gap:4px;border:1px solid currentColor;padding:.1rem .5rem;border-radius:20px}
.enp-blink-dot{width:7px;height:7px;border-radius:50%;display:inline-block;animation:enp-blink 1s infinite}
@keyframes enp-blink{0%,100%{opacity:1}50%{opacity:.1}}
.enp-countdown-item a{font-size:.7rem;font-weight:600;color:#0a1a2f;text-decoration:none;background:#eef4fd;padding:.1rem .6rem;border-radius:20px}
.enp-countdown-item a:hover{background:#0a1a2f;color:#fff}

/* articles + quiz */
.enp-articles-wrapper{display:flex;gap:2rem;margin:2rem 0 3rem;align-items:stretch}
.enp-articles-list{flex:2;display:flex;flex-direction:column;gap:1rem}
.enp-article{display:flex;gap:1rem;align-items:center;background:#fff;border:1px solid #f0f4fc;border-radius:16px;padding:.8rem 1.2rem;transition:.15s;text-decoration:none;color:inherit}
.enp-article:hover{border-color:#dce5f0;background:#fafcff}
.enp-article-icon{width:44px;height:44px;min-width:44px;background:#eef4fd;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#0a1a2f;font-size:1.1rem}
.enp-article-content{flex:1}
.enp-article-content h5{font-size:.9rem;font-weight:600;margin-bottom:.05rem;color:#0a1a2f}
.enp-article-content p{font-size:.8rem;color:#4a5a72;margin:0}
.enp-article-meta{font-size:.7rem;color:#7a8aa0;margin-top:.2rem;display:flex;gap:.6rem}
.enp-article-link{font-size:.8rem;font-weight:600;color:#0a1a2f;text-decoration:none;white-space:nowrap;margin-left:.5rem}

/* quiz */
.enp-quiz-card{flex:1;background:#fff;border-radius:24px;padding:1.8rem 1.5rem;border:1px solid #f0f4fc;box-shadow:0 4px 16px rgba(10,26,47,.03);display:flex;flex-direction:column;min-height:340px;justify-content:space-between}
.enp-quiz-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.2rem}
.enp-quiz-tag{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#0a1a2f;background:#e8edf8;display:inline-block;padding:.15rem .8rem;border-radius:30px}
.enp-quiz-progress{font-size:.8rem;font-weight:600;color:#4a5a72}
.enp-quiz-question{font-size:1.05rem;font-weight:600;color:#0a1a2f;margin-bottom:1.2rem;line-height:1.4;min-height:60px}
.enp-quiz-options{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}
.enp-quiz-option{display:flex;align-items:center;gap:10px;padding:.6rem 1rem;border:1px solid #e3e9f2;border-radius:12px;cursor:pointer;transition:all .15s;background:#fff;font-size:.9rem;color:#1f3349}
.enp-quiz-option:hover{border-color:#0a1a2f;background:#f5f8fd}
.enp-quiz-option.selected{border-color:#0a1a2f;background:#eef4fd}
.enp-option-letter{width:26px;height:26px;border-radius:50%;background:#f0f5fe;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;color:#0a1a2f;flex-shrink:0}
.enp-quiz-option.selected .enp-option-letter{background:#0a1a2f;color:#fff}
.enp-quiz-actions{display:flex;justify-content:flex-end;margin-top:.3rem}
.enp-quiz-result{display:none;text-align:center;padding:1rem 0}
.enp-score-number{font-size:3rem;font-weight:800;color:#0a1a2f}
.enp-score-label{font-size:1rem;color:#4a5a72;margin-top:.2rem}
.enp-score-message{font-size:.9rem;font-weight:500;margin-top:.8rem;padding:.5rem 1rem;background:#f0f5fe;border-radius:30px;display:inline-block}

/* premium notes */
.enp-featured-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:1.5rem 0 2.5rem}
.enp-note-card{background:#fff;border-radius:20px;padding:.7rem .7rem .9rem;box-shadow:0 4px 16px rgba(10,26,47,.03);border:1px solid #f0f4fc;transition:all .2s;position:relative;display:flex;flex-direction:column}
.enp-note-card:hover{box-shadow:0 10px 28px rgba(10,26,47,.06);transform:translateY(-2px);border-color:#dce5f0}
.enp-card-cover{width:100%;aspect-ratio:16/9;background:linear-gradient(145deg,#eef4fd,#dde6f5);border-radius:14px;margin-bottom:.5rem;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.enp-card-cover img{width:100%;height:100%;object-fit:cover;border-radius:14px}
.enp-card-cover i{font-size:1.6rem;opacity:.2;color:#0a1a2f}
.enp-cover-label{position:absolute;bottom:6px;right:8px;background:rgba(10,26,47,.4);backdrop-filter:blur(2px);color:#fff;font-size:.5rem;padding:.05rem .6rem;border-radius:30px}
.enp-note-title{font-weight:600;font-size:.85rem;color:#0a1a2f;margin-bottom:.05rem;line-height:1.2}
.enp-note-category{font-size:.6rem;font-weight:500;color:#4a5a72;text-transform:uppercase;letter-spacing:.02em}
.enp-note-meta{display:flex;justify-content:space-between;align-items:center;margin:.3rem 0 .2rem;font-size:.8rem}
.enp-note-price{font-weight:700;font-size:.95rem;color:#0a1a2f}
.enp-note-downloads{color:#6b7d96;font-size:.6rem;display:flex;align-items:center;gap:3px}
.enp-note-downloads i{font-size:.55rem}
.enp-note-actions{display:flex;gap:5px;margin-top:.4rem}
.enp-note-actions .btn-outline,.enp-note-actions .btn-primary{flex:1;justify-content:center;padding:.25rem 0;font-size:.65rem;border-radius:30px}

/* resources */
.enp-resource-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin:1.8rem 0 2.5rem}
.enp-resource-card{background:#f8faff;border-radius:24px;padding:1.5rem;border:1px solid #eef4fc;text-decoration:none;color:inherit;display:block;transition:.2s}
.enp-resource-card:hover{border-color:#dce5f0;background:#f0f5fe}
.enp-resource-card i{font-size:1.8rem;opacity:.5;margin-bottom:.4rem;color:#0a1a2f;display:block}
.enp-resource-card h4{font-weight:700;margin-bottom:.3rem;color:#0a1a2f}
.enp-resource-card p{color:#4a5a72;font-size:.9rem;margin-bottom:.6rem}
.enp-explore-link{font-weight:600;font-size:.85rem;color:#0a1a2f}

/* kit banner */
.enp-kit-banner{background:#f6faff;border-radius:28px;padding:1.8rem 2rem;border:1px solid #eef4fc;margin-bottom:2.5rem;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem}
.enp-kit-banner h3{font-weight:700;font-size:1.3rem}
.enp-kit-banner p{color:#4a5a72;font-size:.9rem}

/* section header */
.enp-section-header{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;margin-bottom:.2rem}
.enp-view-all{color:#4a5a72;font-size:.8rem;font-weight:500;text-decoration:none}
.enp-view-all:hover{color:#0a1a2f}

/* footer */
.enp-footer{background:var(--ink);padding:1.8rem 0 1.2rem;margin-top:1rem}
.enp-footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1.2rem}
.enp-footer-brand h4{font-size:14px;font-weight:800;display:flex;align-items:center;gap:7px;color:#fff}
.enp-footer-brand h4 .enp-logo-box{width:22px;height:22px}
.enp-footer-brand h4 .enp-logo-box i{font-size:12px}
.enp-footer-brand p{color:rgba(255,255,255,.5);font-size:.9rem;max-width:280px}
.enp-footer-newsletter{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.enp-footer-newsletter input{padding:.7rem 1.2rem;border:1px solid rgba(255,255,255,.15);border-radius:40px;font-size:.9rem;width:240px;background:rgba(255,255,255,.07);color:#fff;outline:none;transition:.15s}
.enp-footer-newsletter input::placeholder{color:rgba(255,255,255,.35)}
.enp-footer-newsletter input:focus{border-color:var(--amber)}
.enp-footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:2rem;padding-top:1.5rem;text-align:center;font-size:.8rem;color:rgba(255,255,255,.35)}

/* bottom nav */
.enp-bottom-nav{display:none;position:fixed;bottom:0;left:0;width:100%;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-top:1px solid #eaedf4;padding:.4rem 0 .6rem;z-index:100;justify-content:space-around;align-items:stretch;box-shadow:0 -4px 12px rgba(0,0,0,.02);box-sizing:border-box}
.enp-bottom-nav a{flex:1 1 25%;min-width:0;min-height:44px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:#6b7d96;font-size:.55rem;font-weight:500;gap:1px;transition:.1s}
.enp-bottom-nav a i{font-size:1.1rem;color:#6b7d96}
.enp-bottom-nav a .enp-bnav-emoji{font-style:normal;font-size:1.25rem;line-height:1}
.enp-bottom-nav a.active i,.enp-bottom-nav a.active{color:#0a1a2f;font-weight:600}

/* hide generatepress default header/footer on homepage */
body.home .site-header,body.home .site-footer,body.home .main-navigation{display:none!important}
body.home .site-content{padding:0!important}

/* responsive */
@media(max-width:1024px){.enp-nav-dropdowns{gap:.2rem}.enp-dropdown>a{font-size:.8rem;padding:.3rem .7rem}}
@media(max-width:820px){.enp-nav-dropdowns{display:none}.enp-mobile-toggle{display:flex}.enp-nav-actions .btn-outline{display:none}.enp-hero h1{font-size:2.2rem}.enp-articles-wrapper{flex-direction:column}.enp-quiz-card{min-height:auto}.enp-featured-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.enp-hero h1{font-size:1.8rem}.enp-hero p{font-size:.9rem}.enp-hero-search{flex-wrap:wrap;background:transparent;border:none;box-shadow:none;padding:0;gap:10px}.enp-hero-search input{background:#fff;border:1px solid #e3e9f2;border-radius:60px;padding:.8rem 1.2rem;width:100%}.enp-hero-search .btn-primary{width:100%;justify-content:center}.enp-resource-grid{grid-template-columns:1fr}.enp-bottom-nav{display:flex}
  /* Was 130px, guessed way past the bottom-nav's actual ~56px height —
     left a dead white gap between the footer and the nav bar on every
     page. Pages that need more (sticky buy/checkout bars) already add
     their own extra padding locally instead of relying on this. */
  body{padding-bottom:60px}
  /* Footer was a full desktop-sized block (brand blurb + newsletter row)
     stacked vertically — on a phone that's most of a screen's height for
     zero navigational value. Newsletter form (not a real lead-gen flow
     here) is dropped on mobile entirely; brand blurb + copyright compressed. */
  .enp-footer{padding:1.5rem 0 1rem}
  .enp-footer-inner{flex-direction:column;align-items:flex-start;gap:.4rem}
  .enp-footer-brand p{display:none}
  .enp-footer-newsletter{display:none}
  .enp-footer-bottom{margin-top:.8rem;padding-top:.8rem;font-size:.72rem}
}
@media(max-width:440px){.enp-featured-grid{grid-template-columns:1fr}}

/* premium shell — shared across homepage, note pages, practice MCQ, catalog */
.enp-premium-shell { margin: 24px 0; padding: 16px; border: 0.5px solid #e0e0e0; border-radius: 8px; }
.enp-premium-shell-heading { font-size: 1.1em; margin-bottom: 12px; color: #2d5016; }

/* Compact override for the [products] shortcode WooCommerce renders inside this shell —
   default WC product-loop markup is sized for a full shop page and looked oversized
   embedded under a widget (e.g. Practice MCQ). */
.enp-premium-shell ul.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin:0!important;padding:0;list-style:none}
.enp-premium-shell ul.products li.product{width:auto!important;margin:0!important;padding:0!important;text-align:left;background:var(--white,#fff);border:1px solid var(--bd,#e2e8f0);border-radius:var(--rl,12px);overflow:hidden;box-shadow:var(--sh,0 1px 3px rgba(0,0,0,.07))}
.enp-premium-shell ul.products li.product a{text-decoration:none;color:inherit;display:block}
.enp-premium-shell ul.products li.product img{width:100%;max-height:140px;height:auto;object-fit:contain;margin:0!important;display:block;border-radius:0;background:var(--page,#F8FAFC)}
.enp-premium-shell ul.products li.product .woocommerce-loop-product__title{font-size:12.5px;font-weight:700;color:var(--ink,#1e293b);padding:8px 10px 2px;margin:0!important;line-height:1.35}
.enp-premium-shell ul.products li.product .price{font-size:12px;padding:0 10px;display:block;color:var(--ink2,#475569)}
.enp-premium-shell ul.products li.product .price ins{text-decoration:none;font-weight:700;color:var(--ink,#1e293b)}
.enp-premium-shell ul.products li.product .price del{opacity:.5;font-size:11px}
.enp-premium-shell ul.products li.product .button{display:block;margin:8px 10px 10px!important;padding:6px 10px!important;font-size:11.5px!important;font-weight:700;text-align:center;background:var(--amber,#f59e0b)!important;color:var(--ink,#1e293b)!important;border-radius:var(--r,8px)!important;line-height:1.4}
.enp-premium-shell ul.products li.product .onsale{font-size:9px;padding:2px 7px;top:6px;left:6px;right:auto;min-height:auto;line-height:1.4;border-radius:10px;background:var(--amber,#f59e0b);color:var(--ink,#1e293b)}
.enp-premium-shell ul.products li.product .star-rating{display:none}

/* === ENP Shop grid === */
.enp-shop-page{max-width:1180px;margin:0 auto;padding:16px}
.enp-shop-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.enp-shop-count{font-size:.82em;color:#878787}
.enp-product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}

/* tile */
.enp-tile{display:flex;flex-direction:column;background:#fff;border-radius:4px;overflow:hidden;border:0.5px solid #e0e0e0;text-decoration:none;color:inherit;transition:box-shadow .15s}
.enp-tile:hover{box-shadow:0 2px 8px rgba(0,0,0,.12)}

/* tile image area — flex-centered, image sizes itself (no forced box shape),
   so tall poster-style covers can never get cropped on any screen size. */
.enp-tile-img{height:200px;position:relative;overflow:hidden;flex-shrink:0;background:var(--page);display:flex;align-items:center;justify-content:center}
.enp-tile-photo{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.enp-tile-badge{position:absolute;top:8px;left:0;background:#e53935;color:#fff;font-size:.62em;font-weight:700;padding:2px 8px;border-radius:0 3px 3px 0;z-index:2;letter-spacing:.03em}
/* Language pill — was unstyled (plain inline text), so it sat inside the
   now-flex-centered .enp-tile-img and got shoved into/over the image.
   Absolute-positioned like the other corner badges, so flex layout can't
   touch it regardless of what else changes in that container. */
.enp-tile-lang{position:absolute;top:8px;right:8px;z-index:2;background:rgba(255,255,255,.95);color:var(--ink,#1e293b);font-size:.62em;font-weight:700;padding:2px 8px;border-radius:10px;letter-spacing:.02em;box-shadow:0 1px 3px rgba(0,0,0,.1)}
/* "300+ Qs" / "Preview" tags below the title — were unstyled plain text. */
.enp-tile-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.enp-tile-tag{font-size:.68em;font-weight:600;color:var(--ink2,#475569);background:var(--page,#F8FAFC);border:1px solid var(--bd,#E2E8F0);padding:2px 7px;border-radius:20px;display:inline-flex;align-items:center;gap:4px}
.enp-tile-tag i{font-size:.85em;color:var(--ink3,#94A3B8)}

/* CSS fallback thumbnail — exam colours */
.enp-tile-fallback{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px}
.enp-tile--ctet    .enp-tile-fallback,.enp-tile--ctet    .enp-single-hero{background:#1a2a4e}
.enp-tile--dsssb   .enp-tile-fallback,.enp-tile--dsssb   .enp-single-hero{background:#1b4332}
.enp-tile--bpsc    .enp-tile-fallback,.enp-tile--bpsc    .enp-single-hero{background:#4a2804}
.enp-tile--deled   .enp-tile-fallback,.enp-tile--deled   .enp-single-hero{background:#311b92}
.enp-tile--uptet   .enp-tile-fallback,.enp-tile--uptet   .enp-single-hero{background:#0d3b2e}
.enp-tile--kvs     .enp-tile-fallback,.enp-tile--kvs     .enp-single-hero{background:#1a237e}
.enp-tile--general .enp-tile-fallback,.enp-tile--general .enp-single-hero{background:#263238}
.enp-tf-exam{font-size:.6em;font-weight:800;letter-spacing:.12em;color:rgba(255,255,255,.5);text-transform:uppercase}
.enp-tf-name{font-size:.75em;font-weight:700;color:#fff;text-align:center;line-height:1.25;max-width:130px}
.enp-tf-pill{background:#e9a800;color:#1a1000;font-size:.58em;font-weight:800;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:.04em;margin-top:2px}

/* tile body */
.enp-tile-body{padding:10px 10px 12px;display:flex;flex-direction:column;flex:1}
.enp-tile-name{font-size:.82em;color:#212121;font-weight:500;line-height:1.3;flex:1;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.enp-tile-sub{font-size:.72em;color:#878787;margin-bottom:6px}
.enp-tile-price-row{margin-bottom:8px;font-size:.95em;font-weight:700;color:#212121}
.enp-tile-price-row del{text-decoration:line-through;opacity:.6}
.enp-tile-price-row del .amount{color:#878787;font-weight:400;font-size:.85em}
.enp-tile-price-row ins{text-decoration:none}
.enp-tile-price-row .woocommerce-Price-amount{color:#212121}
.enp-tile-btn{background:var(--amber);color:var(--ink);border:none;border-radius:var(--r);padding:8px;font-size:.8em;font-weight:700;cursor:pointer;width:100%;letter-spacing:.02em;font-family:'Inter',sans-serif;}
.enp-tile-btn:hover{filter:brightness(.95);}

/* ══════════════════ SINGLE PRODUCT PAGE ══════════════════
   Layout: hero gallery (the product IS the hero) + buy box side-by-side on
   desktop, stacked on mobile with a sticky bottom CTA bar so the purchase
   action is always one tap away no matter how far the shopper scrolls. */
.enp-single{max-width:1180px;margin:0 auto;padding:16px;display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:start}
/* Grid/flex items default to min-width:auto — meaning a child can never
   shrink narrower than its own content's natural width, EVEN IF that child
   has its own overflow-x:auto scroller inside it (like the thumbnail strip
   below). That was silently forcing this whole grid column — and the page
   itself — wider than the phone screen. min-width:0 lets these items
   actually shrink to fit, letting the scroller do its job internally
   instead of blowing out the page. */
.enp-single-media,.enp-buybox{min-width:0}

/* -- Hero gallery -- */
.enp-single-media{position:relative}
.enp-single-hero{border-radius:var(--rl);overflow:hidden;height:420px;position:relative}
.enp-single-fallback{height:100%}
.enp-single-discount-badge{position:absolute;top:14px;left:14px;z-index:3;background:#DC2626;color:#fff;font-size:.78em;font-weight:800;letter-spacing:.02em;padding:.35em .8em;border-radius:30px;box-shadow:0 2px 8px rgba(220,38,38,.35)}
.enp-gallery{display:flex;flex-direction:column;gap:10px}
/* Flex-centered, no forced aspect-ratio box — a fixed-shape box + object-fit
   was quietly cropping tall poster-style covers (the box's aspect-ratio
   fought with max-height at different screen widths, and "contain" only
   guarantees no-crop when the box shape is actually respected). Letting the
   image size itself (capped by max-width/max-height only) can never crop,
   on any screen size, by construction. */
.enp-gallery-main{display:flex;align-items:center;justify-content:center;border-radius:var(--rl);overflow:hidden;background:var(--page);border:1px solid var(--bd);min-height:260px;max-height:520px}
.enp-gallery-main-img{display:none;max-width:100%;max-height:520px;width:auto;height:auto;object-fit:contain}
.enp-gallery-main-img.is-active{display:block}
.enp-gallery-thumbs{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px}
.enp-gallery-thumb{flex:0 0 auto;width:60px;height:60px;border-radius:8px;overflow:hidden;border:2px solid transparent;padding:0;cursor:pointer;background:var(--page);opacity:.6;transition:.15s}
.enp-gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.enp-gallery-thumb:hover{opacity:.85}
.enp-gallery-thumb.is-active{border-color:var(--amber);opacity:1}

/* -- Buy box -- */
.enp-buybox{background:var(--white);border:1px solid var(--bd);border-radius:var(--rl);box-shadow:var(--sh);padding:24px;position:sticky;top:84px}
.enp-single-exam{font-size:.72em;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);display:block;margin-bottom:8px}
.enp-single-title{font-size:1.5em;font-weight:800;color:var(--ink);margin-bottom:14px;line-height:1.35;letter-spacing:-.01em}
.enp-single-price-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:8px}
/* WooCommerce's get_price_html() returns the raw del/ins fragment here (no
   wrapping .price span in this context), so style the fragment directly —
   the markup/sale-price logic itself stays 100% WooCommerce's, this is
   presentation only. */
.enp-single-price{font-size:1.7em;font-weight:800;color:var(--ink)}
.enp-single-price del{text-decoration:line-through;opacity:.55}
.enp-single-price del .amount{color:var(--ink3);font-size:.6em;font-weight:400}
.enp-single-price ins{text-decoration:none}
.enp-social-proof{font-size:.78em;color:var(--ink2);display:flex;align-items:center;gap:6px;background:var(--page);padding:.4em .8em;border-radius:30px}
.enp-single-desc{font-size:.92em;color:var(--ink2);line-height:1.7;margin:14px 0}

/* "What you get" file list */
.enp-includes{margin:16px 0;padding:14px 16px;background:var(--amber-bg);border:1px solid var(--amber-bd);border-radius:var(--r)}
.enp-includes-title{display:block;font-size:.8em;color:var(--ink);margin-bottom:8px}
.enp-includes-list{list-style:none;display:flex;flex-direction:column;gap:6px}
.enp-includes-list li{font-size:.85em;color:var(--ink2);display:flex;align-items:center;gap:8px}
.enp-includes-list i{color:#DC2626}

/* Feature/trust cards */
.enp-feature-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.enp-feature-card{display:flex;align-items:flex-start;gap:10px;padding:12px;background:var(--page);border-radius:var(--r)}
.enp-feature-card i{color:var(--amber);font-size:1em;margin-top:2px}
.enp-feature-card strong{display:block;font-size:.82em;color:var(--ink);margin-bottom:2px}
.enp-feature-card span{display:block;font-size:.72em;color:var(--ink2);line-height:1.4}

/* CTA row — Buy Now (primary) + Add to Cart (secondary), side by side on desktop */
.enp-cta-row{display:flex;gap:10px;margin:18px 0 12px;flex-wrap:wrap}
.enp-btn-buynow{flex:1;min-width:140px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--amber);color:var(--ink);font-weight:800;font-size:.95em;padding:.9em 1.2em;border-radius:var(--r);text-decoration:none;transition:.15s}
.enp-btn-buynow:hover{filter:brightness(.95);color:var(--ink)}
.enp-addcart-form{flex:1;min-width:140px}
.enp-addcart-form form.cart{display:flex;align-items:stretch;gap:8px;height:100%}
/* WooCommerce core ships its own .woocommerce button.button rule (purple,
   #7f54b9) at equal specificity loaded after ours, so it was winning —
   these selectors match WC's own specificity + scope to force the brand
   button style instead of the WooCommerce default. */
.enp-addcart-form .quantity{display:flex}
.enp-addcart-form .quantity .qty{width:56px;height:auto;border:1px solid var(--bd2);border-radius:var(--r);text-align:center;font-size:.95em;color:var(--ink);padding:0;-moz-appearance:textfield}
.woocommerce .enp-addcart-form button.button.single_add_to_cart_button,
.woocommerce .enp-addcart-form a.button.single_add_to_cart_button,
.enp-addcart-form .button{flex:1;width:auto;background:var(--white);color:var(--ink);border:1px solid var(--bd2);font-weight:700;border-radius:var(--r);padding:.9em 1.2em;font-size:.95em;cursor:pointer;transition:.15s}
.woocommerce .enp-addcart-form button.button.single_add_to_cart_button:hover,
.enp-addcart-form .button:hover{background:var(--page);border-color:var(--ink3);color:var(--ink)}

.enp-trust-row{list-style:none;display:flex;flex-wrap:wrap;gap:14px;padding-top:12px;border-top:1px solid var(--bd)}
.enp-trust-row li{font-size:.75em;color:var(--ink2);display:flex;align-items:center;gap:6px}
.enp-trust-row i{color:var(--amber)}

/* -- More products / related rows -- */
.enp-related-wrap{background:var(--page);padding:8px 0 12px;margin-top:24px}
.enp-related-row{margin-bottom:22px}
.enp-related-row:last-child{margin-bottom:0}
.enp-related-row-title{font-size:1em;font-weight:700;color:var(--ink);margin-bottom:12px}
.enp-related-scroll{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity}
.enp-related-card{flex:0 0 auto;width:150px;scroll-snap-align:start;background:var(--white);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit;transition:box-shadow .15s}
.enp-related-card:hover{box-shadow:var(--sh)}
.enp-related-card-img{height:150px;background:var(--page);display:flex;align-items:center;justify-content:center;overflow:hidden}
.enp-related-card-img img{max-width:100%;max-height:100%;width:auto;height:auto;display:block}
.enp-related-card-name{font-size:.78em;color:var(--ink);font-weight:500;padding:8px 8px 2px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.enp-related-card-price{font-size:.78em;font-weight:700;color:var(--ink);padding:0 8px 10px}
.enp-related-card-price del{text-decoration:line-through;opacity:.6}
.enp-related-card-price ins{text-decoration:none}

/* -- Description -- */
.enp-full-desc{padding:8px 0 12px}
.enp-full-desc-body{font-size:.94em;color:var(--ink2);line-height:1.8;max-width:820px}
.enp-full-desc-body h2,.enp-full-desc-body h3{color:var(--ink);margin:20px 0 8px}
.enp-full-desc-body ul,.enp-full-desc-body ol{margin:10px 0 10px 22px}
.enp-full-desc-body p{margin-bottom:12px}

/* -- FAQ accordion -- */
.enp-faq{padding:8px 0 32px}
.enp-faq-list{max-width:820px;display:flex;flex-direction:column;gap:8px}
.enp-faq-item{background:var(--white);border:1px solid var(--bd);border-radius:var(--r);padding:14px 16px}
.enp-faq-item summary{cursor:pointer;font-weight:700;font-size:.92em;color:var(--ink);list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px}
.enp-faq-item summary::-webkit-details-marker{display:none}
.enp-faq-item summary i{font-size:.75em;color:var(--ink3);transition:transform .15s}
.enp-faq-item[open] summary i{transform:rotate(180deg)}
.enp-faq-item p{font-size:.86em;color:var(--ink2);line-height:1.6;margin-top:10px}

/* ══════════════════ WOOCOMMERCE NOTICES ══════════════════
   Replaces WooCommerce/GeneratePress's default plain box + olive top-border
   look with a card that matches the rest of the site (rounded, soft shadow,
   tinted background, brand pill button) — success/info/error each get their
   own accent color. Selectors match WC core's own classes so this wins
   without needing !important. */
.enp-notice-wrap{max-width:1180px;margin:14px auto 0;padding:0 24px}
.woocommerce-notices-wrapper:empty{display:none}
ul.woocommerce-message,ul.woocommerce-info,ul.woocommerce-error{
  list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:var(--white);border:1px solid var(--bd);border-left:4px solid #16A34A;border-radius:var(--r);
  box-shadow:var(--sh);padding:14px 18px;margin:0 0 16px;font-size:.9rem;color:var(--ink);
}
ul.woocommerce-message::before{font-family:"Font Awesome 6 Free";font-weight:900;content:"\f058";color:#16A34A;font-size:1.1em;margin-right:10px}
ul.woocommerce-info{border-left-color:var(--blue)}
ul.woocommerce-info::before{font-family:"Font Awesome 6 Free";font-weight:900;content:"\f05a";color:var(--blue);font-size:1.1em;margin-right:10px}
ul.woocommerce-error{border-left-color:#DC2626}
ul.woocommerce-error::before{font-family:"Font Awesome 6 Free";font-weight:900;content:"\f06a";color:#DC2626;font-size:1.1em;margin-right:10px}
ul.woocommerce-message li,ul.woocommerce-info li,ul.woocommerce-error li{flex:1;min-width:200px}
ul.woocommerce-message .button,ul.woocommerce-info .button,ul.woocommerce-error .button{
  background:var(--amber) !important;color:var(--ink) !important;border:none !important;border-radius:30px !important;
  padding:.55em 1.3em !important;font-weight:700 !important;font-size:.85em !important;text-decoration:none !important;
}
ul.woocommerce-message .button:hover,ul.woocommerce-info .button:hover,ul.woocommerce-error .button:hover{filter:brightness(.95)}

/* Some WC core notices (e.g. the "verify your email to see past orders"
   prompt on My Account > Orders) render as a plain <div class="woocommerce-info">
   with a floated .button.wc-forward ahead of the message text, not the
   <ul><li> structure styled above. WC's default float:right on that button
   wraps the message text around it mid-word at narrow widths (e.g. "Co" /
   [button] / "nfirm your email..."). Match the div variant with the same
   card look, and un-float + block the button so it always sits on its own
   line above the text instead of fighting it for space. */
div.woocommerce-message,div.woocommerce-info,div.woocommerce-error{
  background:var(--white);border:1px solid var(--bd);border-left:4px solid #16A34A;border-radius:var(--r);
  box-shadow:var(--sh);padding:14px 18px;margin:0 0 16px;font-size:.9rem;color:var(--ink);
}
div.woocommerce-info{border-left-color:var(--blue)}
div.woocommerce-error{border-left-color:#DC2626}
div.woocommerce-message .button,div.woocommerce-info .button,div.woocommerce-error .button{
  float:none !important;display:block;width:max-content;max-width:100%;
  background:var(--amber) !important;color:var(--ink) !important;border:none !important;border-radius:30px !important;
  padding:.55em 1.3em !important;font-weight:700 !important;font-size:.85em !important;text-decoration:none !important;
  margin:0 0 10px;
}
div.woocommerce-message .button:hover,div.woocommerce-info .button:hover,div.woocommerce-error .button:hover{filter:brightness(.95)}

/* -- Sticky mobile buy bar -- */
.enp-sticky-buy{display:none}

@media(max-width:900px){
  .enp-single{grid-template-columns:1fr;gap:16px}
  .enp-buybox{position:static;padding:18px}
  .enp-single-hero{height:320px}
  .enp-gallery-main{max-height:420px}
}
@media(max-width:560px){
  .enp-single{padding:12px;padding-bottom:140px}
  .enp-single-title{font-size:1.2em}
  .enp-feature-cards{grid-template-columns:1fr}
  .enp-cta-row .enp-btn-buynow,.enp-cta-row .enp-addcart-form{min-width:100%}
  /* bottom:60px (not 0) — .enp-bottom-nav is ALSO fixed at bottom:0 on every
     page ≤640px wide, including this one, so bottom:0 here made the two
     stack on top of each other. 60px clears the bottom-nav's height,
     matching the same offset #enp-sticky-checkout already uses on the cart
     page for the exact same reason. */
  .enp-sticky-buy{position:fixed;left:0;right:0;bottom:60px;z-index:80;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--white);border-top:1px solid var(--bd);box-shadow:0 -2px 12px rgba(0,0,0,.08);padding:10px 14px;padding-bottom:10px}
  .enp-sticky-buy-price .price{font-size:1.1em;font-weight:800;color:var(--ink)}
  .enp-sticky-buy-btn{background:var(--amber);color:var(--ink);font-weight:800;font-size:.9em;padding:.7em 1.4em;border-radius:30px;text-decoration:none;white-space:nowrap}
}

/* mobile — 2 tiles per row, always */
@media(max-width:600px){
  .enp-product-grid{grid-template-columns:1fr 1fr;gap:8px}
  .enp-tile-img{height:130px}
  .enp-tf-name{font-size:.68em;max-width:100px}
  .enp-tile-name{font-size:.78em}
  .enp-tile-btn{font-size:.75em;padding:7px}
  .enp-shop-page{padding:10px}
}
@media(max-width:320px){
  .enp-product-grid{grid-template-columns:1fr 1fr;gap:6px}
  .enp-tile-img{height:110px}
}

/* ── WooCommerce Checkout Optimisation ── */

/* Cart Drawer */
#enp-cart-drawer{display:none;position:fixed;inset:0;z-index:9000}
#enp-cart-drawer.enp-drawer-open{display:block}
#enp-cart-drawer-overlay{position:absolute;inset:0;background:rgba(10,26,47,.45);backdrop-filter:blur(2px)}
#enp-cart-drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(360px,92vw);background:#fff;padding:1.5rem;overflow-y:auto;box-shadow:-4px 0 32px rgba(10,26,47,.12);display:flex;flex-direction:column;gap:.8rem;transform:translateX(100%);transition:transform .28s cubic-bezier(.4,0,.2,1)}
#enp-cart-drawer.enp-drawer-open #enp-cart-drawer-panel{transform:translateX(0)}
body.enp-drawer-active{overflow:hidden}
#enp-cart-drawer-close{align-self:flex-end;background:none;border:none;font-size:1.2rem;color:#0a1a2f;cursor:pointer;padding:.2rem .4rem;border-radius:8px;transition:background .15s}
#enp-cart-drawer-close:hover{background:#f0f4fc}
.enp-drawer-heading{font-size:1rem;font-weight:700;color:#0a1a2f;letter-spacing:-.02em;display:flex;align-items:center;gap:8px}
.enp-drawer-empty{color:#7a8aa0;font-size:.9rem}
.enp-drawer-items{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.enp-drawer-item{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;padding:.6rem 0;border-bottom:1px solid #f0f4fc}
.enp-drawer-name{color:#0a1a2f;font-weight:500}
.enp-drawer-price{color:#5a6f8a;white-space:nowrap}
.enp-drawer-total{font-size:.95rem;color:#0a1a2f;padding:.8rem 0 .2rem;border-top:2px solid #0a1a2f;margin-top:auto}
.enp-drawer-total strong{font-weight:700}
.enp-drawer-checkout-btn{display:block;background:var(--amber);color:var(--ink);text-align:center;padding:.85rem 1.5rem;border-radius:40px;font-weight:700;font-size:1rem;text-decoration:none;letter-spacing:-.01em;transition:background .2s,transform .15s}
.enp-drawer-checkout-btn:hover{filter:brightness(.95);transform:scale(.98);color:var(--ink)}

/* Sticky Checkout Bar — mobile cart page only */
#enp-sticky-checkout{display:none;position:fixed;left:0;right:0;bottom:60px;z-index:8999;background:var(--amber);color:var(--ink);padding:.9rem 1.5rem;align-items:center;justify-content:space-between;cursor:pointer;font-weight:700;font-size:1rem;letter-spacing:-.01em;transition:background .2s}
#enp-sticky-checkout.enp-sticky-visible{display:flex}
#enp-sticky-checkout:hover{filter:brightness(.95)}
#enp-sticky-total{font-size:.9rem;opacity:.9}
@media(min-width:769px){#enp-sticky-checkout{display:none!important}}

/* Checkout form */
.woocommerce-checkout .form-row{margin-bottom:.8rem!important}
.woocommerce-checkout .form-row label{font-size:.82rem;font-weight:600;color:#0a1a2f;letter-spacing:-.01em}
.woocommerce-checkout .form-row input[type="text"],
.woocommerce-checkout .form-row input[type="email"],
.woocommerce-checkout .form-row input[type="tel"]{border:1px solid #d5dee9;border-radius:12px;padding:.75rem 1rem;font-size:.95rem;font-family:'Inter',sans-serif;width:100%;transition:border-color .15s}
.woocommerce-checkout .form-row input:focus{border-color:var(--amber);outline:none;box-shadow:0 0 0 3px rgba(245,158,11,.15)}
/* Brand colors (amber/navy), not the leftover purple — matches the rest
   of the site's CTAs instead of looking like a different, disconnected app
   right at the moment of payment. */
#place_order{background:var(--amber)!important;color:var(--ink)!important;width:100%!important;padding:1.1rem 2rem!important;font-size:1.1rem!important;font-weight:800!important;border-radius:40px!important;border:none!important;cursor:pointer!important;letter-spacing:-.01em!important;transition:filter .15s,transform .15s!important;font-family:'Inter',sans-serif!important}
#place_order:hover{filter:brightness(.95)!important;transform:scale(.99)!important}
.enp-checkout-privacy{font-size:.78rem;color:#7a8aa0;text-align:center;margin-bottom:.8rem;display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}
.enp-checkout-privacy .fa-lock{color:#27ae60}
.enp-checkout-privacy a{color:#7a8aa0;text-decoration:underline}
@media(min-width:769px){.woocommerce-checkout-review-order{position:sticky;top:80px}}

/* Cart table */
.woocommerce-cart table.shop_table{border-radius:16px;overflow:hidden;border:1px solid #eef4fc}
.woocommerce-cart .cart_totals{margin-top:1.5rem}

/* Thank-you page */
.enp-thankyou-block{background:#f6faff;border:1px solid #eef4fc;border-radius:20px;padding:2rem;margin-bottom:2rem;text-align:center}
.enp-thankyou-icon{font-size:3rem;color:#27ae60;margin-bottom:.8rem}
.enp-thankyou-heading{font-size:1.6rem;font-weight:800;color:#0a1a2f;letter-spacing:-.03em;margin-bottom:.4rem}
.enp-thankyou-sub{color:#5a6f8a;margin-bottom:1.4rem}
.enp-thankyou-downloads{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.4rem}
.enp-download-btn{display:inline-flex;align-items:center;gap:8px;background:var(--amber);color:var(--ink);padding:.75rem 1.8rem;border-radius:40px;font-weight:700;font-size:.95rem;text-decoration:none;transition:background .2s}
.enp-download-btn:hover{filter:brightness(.95);color:var(--ink)}
.enp-view-orders-btn{margin-top:.4rem}
.enp-thankyou-meta{font-size:.85rem;color:#5a6f8a;margin-bottom:1.2rem}
.enp-thankyou-support{font-size:.82rem;color:#7a8aa0;margin-top:1.2rem}
.enp-thankyou-support a{color:#7a8aa0;text-decoration:underline}
/* WooCommerce's own order-details table below our block is redundant —
   same order number/items/downloads, much heavier markup. Template file
   itself is untouched (still renders normally if this CSS is ever removed). */
body.woocommerce-order-received .woocommerce-order-details,
body.woocommerce-order-received .woocommerce-order-downloads,
body.woocommerce-order-received .woocommerce-customer-details{display:none}

/* ══════════════════ CONVERSION-FOCUSED CHECKOUT REDESIGN ══════════════════
   Cart/checkout/payment trust indicators, Buy Now "replace cart?" modal,
   and minimal-chrome header/footer on cart+checkout — see functions.php
   for the corresponding hooks (all pure hooks/filters, no template files
   were overridden; safe across WooCommerce core updates). */

/* -- Trust indicator rows (cart page + checkout, above the CTA) -- */
.enp-checkout-trust{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin:0 0 12px;padding:0}
.enp-checkout-trust li{font-size:.78rem;color:var(--ink2,#475569);display:flex;align-items:center;gap:6px}
.enp-checkout-trust i{color:var(--amber);font-size:.85em}
.enp-cart-trust{margin-bottom:14px}

/* -- Buy Now "replace cart?" modal -- */
.enp-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px}
.enp-modal.is-open{display:flex}
.enp-modal-overlay{position:absolute;inset:0;background:rgba(15,23,42,.55)}
.enp-modal-box{position:relative;background:var(--white,#fff);border-radius:var(--rl,16px);padding:24px;max-width:360px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25);text-align:center}
.enp-modal-box h3{font-size:1.1rem;font-weight:800;color:var(--ink,#1e293b);margin-bottom:8px}
.enp-modal-box p{font-size:.88rem;color:var(--ink2,#475569);margin-bottom:18px;line-height:1.5}
.enp-modal-actions{display:flex;gap:10px}
.enp-modal-actions button{flex:1;font-family:'Inter',sans-serif}
.enp-modal-actions .enp-btn-outline{background:transparent;border:1px solid var(--bd2,#CBD5E1);color:var(--ink,#1e293b);border-radius:var(--r,8px);padding:.75em 1em;font-weight:700;font-size:.9em;cursor:pointer}
.enp-modal-actions .enp-btn-buynow{border:none}

/* -- Minimal navbar/footer: cart + checkout only -- */
.enp-navbar-minimal .enp-nav-inner{justify-content:space-between}
.enp-footer-minimal .enp-container{padding-top:14px;padding-bottom:14px}
.enp-footer-minimal .enp-footer-bottom{font-size:.72rem;opacity:.7;text-align:center}

/* -- Cart page: strip to essentials -- */
body.woocommerce-cart .enp-page-header,
body.woocommerce-cart .enp-breadcrumb,
body.woocommerce-cart .entry-title,
body.woocommerce-cart .page-title{display:none}
body.woocommerce-cart .enp-page-main{padding-top:1rem}
body.woocommerce-cart table.shop_table thead{display:none}
body.woocommerce-cart td.product-thumbnail img{border-radius:8px}
.enp-cart-qty-fixed{font-size:.85em;color:var(--ink2,#475569);font-weight:600}

/* -- Checkout page: hide the (defaulted-to-India) country field + guest-login prompt -- */
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout .woocommerce-form-login-toggle{display:none}
body.woocommerce-checkout .checkout .col2-set,
body.woocommerce-checkout #customer_details{margin-bottom:.5rem}
/* ══════════════════ END CHECKOUT REDESIGN ══════════════════ */

/* ── Policy / Standard Pages ── */
.enp-policy-wrap{max-width:760px;margin:0 auto}
.enp-policy-title{font-size:2rem;font-weight:800;letter-spacing:-.03em;color:#0a1a2f;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #ede9fe}
.enp-policy-body{font-size:1rem;line-height:1.8;color:#1e293b}
.enp-policy-body h2{font-size:1.15rem;font-weight:700;color:#0a1a2f;margin:2rem 0 .6rem;padding-bottom:.3rem;border-bottom:1px solid #f0f4fc}
.enp-policy-body p{margin-bottom:1rem}
.enp-policy-body ul{margin:.5rem 0 1rem 1.4rem}
.enp-policy-body ul li{margin-bottom:.4rem}
.enp-policy-body a{color:#7c3aed;text-decoration:none;font-weight:500}
.enp-policy-body a:hover{text-decoration:underline}
.enp-policy-body hr{border:none;border-top:1px solid #f0f4fc;margin:1.5rem 0}
.enp-policy-body strong{color:#0a1a2f}
@media(max-width:600px){
  .enp-policy-title{font-size:1.5rem}
  .enp-policy-body{font-size:.95rem}
}

/* ── WooCommerce: Cart / Checkout / My Account (design-system unification) ──
   Scoped strictly to WC's own body classes so Shop/Product styling is untouched. */
.enp-policy-wrap--wide{max-width:1180px;}

/* Cart + Checkout blocks: adopt shared tokens for the primary action button only
   (wp-element-button is WooCommerce Blocks' own stable button class). */
body.woocommerce-cart .wp-element-button,
body.woocommerce-checkout .wp-element-button{
  background:var(--amber)!important;color:var(--ink)!important;border-radius:var(--r)!important;
  font-family:'Inter',sans-serif!important;font-weight:700!important;border:none!important;
}
body.woocommerce-cart .wp-element-button:hover,
body.woocommerce-checkout .wp-element-button:hover{filter:brightness(.95);}

/* My Account */
body.woocommerce-account .woocommerce-MyAccount-navigation ul{
  list-style:none;display:flex;flex-direction:column;gap:4px;background:var(--white);
  border:1px solid var(--bd);border-radius:var(--rl);box-shadow:var(--sh);padding:8px;margin-bottom:20px;
}
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a{
  display:block;padding:10px 14px;border-radius:var(--r);color:var(--ink2);
  text-decoration:none;font-weight:600;font-size:13.5px;
}
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover{background:var(--page);}
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{background:var(--amber-bg);color:var(--ink);}
@media(min-width:769px){
  body.woocommerce-account .enp-policy-wrap--wide{display:grid;grid-template-columns:220px 1fr;gap:24px;align-items:start;}
  body.woocommerce-account .enp-policy-wrap--wide .enp-page-header{grid-column:1/-1;max-width:none;margin:0;padding:0 0 4px;}
  /* Pages like lost-password/reset-password render no My Account sidebar nav
     (logged-out visitor, nothing to navigate to yet), so the grid's only
     child auto-fills the narrow 220px first track instead of the wide
     content track - squeezing the whole form into 220px with a big empty
     gap next to it. Make the content span both tracks whenever the nav
     sidebar isn't actually present. */
  body.woocommerce-account .enp-policy-wrap--wide:not(:has(.woocommerce-MyAccount-navigation)) .enp-policy-article{
    grid-column:1/-1;
  }
}
body.woocommerce-account .woocommerce-MyAccount-content table.shop_table{
  width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--bd);
  border-radius:var(--rl);overflow:hidden;box-shadow:var(--sh);
}
body.woocommerce-account .woocommerce-MyAccount-content table.shop_table th{
  background:var(--page);text-align:left;padding:10px 14px;font-size:12px;color:var(--ink2);
  text-transform:uppercase;letter-spacing:.4px;
}
body.woocommerce-account .woocommerce-MyAccount-content table.shop_table td{
  padding:12px 14px;border-top:1px solid var(--bd);font-size:13.5px;
}
body.woocommerce-account .woocommerce-form-login,
body.woocommerce-account .woocommerce-form-register,
body.woocommerce-account .woocommerce-ResetPassword{
  max-width:420px;margin:0 auto;background:var(--white);border:1px solid var(--bd);
  border-radius:var(--rl);box-shadow:var(--sh);padding:24px;
}
body.woocommerce-account .woocommerce-form-login .form-row label,
body.woocommerce-account .woocommerce-form-register .form-row label,
body.woocommerce-account .woocommerce-ResetPassword .form-row label{
  font-size:13px;font-weight:600;color:var(--ink);margin-bottom:4px;display:block;
}
body.woocommerce-account .woocommerce-form-login .form-row input,
body.woocommerce-account .woocommerce-form-register .form-row input,
body.woocommerce-account .woocommerce-ResetPassword .form-row input{
  width:100%;border:1px solid var(--bd2);border-radius:var(--r);padding:10px 12px;
  font-size:14px;font-family:'Inter',sans-serif;box-sizing:border-box;
}
body.woocommerce-account .woocommerce-ResetPassword .form-row{
  margin-bottom:16px;
}
body.woocommerce-account .woocommerce-form-login .woocommerce-button,
body.woocommerce-account .woocommerce-form-register .woocommerce-button,
body.woocommerce-account .woocommerce-ResetPassword .woocommerce-button,
body.woocommerce-account .woocommerce-MyAccount-content .button{
  background:var(--ink)!important;color:#fff!important;border:none!important;border-radius:var(--r)!important;
  padding:10px 20px!important;font-weight:700!important;font-size:13px!important;
  font-family:'Inter',sans-serif!important;cursor:pointer;text-decoration:none;
}
body.woocommerce-account .woocommerce-form-login .woocommerce-button:hover,
body.woocommerce-account .woocommerce-form-register .woocommerce-button:hover,
body.woocommerce-account .woocommerce-ResetPassword .woocommerce-button:hover,
body.woocommerce-account .woocommerce-MyAccount-content .button:hover{filter:brightness(1.2);}
