/* ==========================================================================
   Lvalues Premium Shell — site-wide primitives + footer (Phase: site-wide rollout)
   Loaded on every frontend page. Styles are namespaced under .lv-shell so they
   never leak into legacy page CSS. Depends on design-tokens.css.
   The premium header styles are appended here when the header is built.
   ========================================================================== */

.lv-shell { font-family: var(--lv-font-body); }
.lv-shell *, .lv-shell *::before, .lv-shell *::after { box-sizing: border-box; }
.lv-shell a { text-decoration: none; }
.lv-shell .lv-container { width:100%; max-width: var(--lv-container); margin-inline:auto; padding-inline: var(--lv-gutter); }
@media (min-width:768px){ .lv-shell .lv-container { padding-inline: var(--lv-gutter-lg); } }

/* buttons (shared) */
.lv-shell .lv-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--lv-font-body); font-weight:var(--lv-fw-semibold); font-size:1rem; padding:13px 22px;
  border-radius:var(--lv-radius-sm); border:1px solid transparent; cursor:pointer;
  transition:all var(--lv-dur) var(--lv-ease); line-height:1; white-space:nowrap; }
.lv-shell .lv-btn:focus-visible { outline:none; box-shadow:var(--lv-ring); }
.lv-shell .lv-btn-primary { background:var(--lv-primary); color:#fff; }
.lv-shell .lv-btn-primary:hover { background:var(--lv-primary-600); color:#fff; transform:translateY(-1px); box-shadow:var(--lv-shadow); }
.lv-shell .lv-btn-ghost { background:#fff; color:var(--lv-primary); border-color:var(--lv-border-strong); }
.lv-shell .lv-btn-ghost:hover { border-color:var(--lv-primary); background:var(--lv-sky-100); }
.lv-shell .lv-btn-sm { padding:9px 16px; font-size:.875rem; }

/* ===== Premium footer (site-wide) ===== */
.lv-shell-footer { background: var(--lv-navy); color: rgba(255,255,255,.75); padding: clamp(40px,5vw,64px) 0 24px; }
.lv-shell-footer .lv-container { width:100%; max-width: var(--lv-container); margin-inline:auto; padding-inline: var(--lv-gutter); }
@media (min-width:768px){ .lv-shell-footer .lv-container { padding-inline: var(--lv-gutter-lg); } }
.lv-shell-footer a { text-decoration:none; }
.lv-shell-footer__grid { display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap:32px; }
@media (max-width:860px){ .lv-shell-footer__grid { grid-template-columns: 1fr 1fr; gap:24px; } }
@media (max-width:480px){ .lv-shell-footer__grid { grid-template-columns: 1fr; } }
.lv-shell-footer h4 { color:#fff; font-family:var(--lv-font-head); font-size:.95rem; font-weight:var(--lv-fw-bold); margin:0 0 14px; letter-spacing:.02em; }
.lv-shell-footer a:not(.lv-shell-footer__social a) { color: rgba(255,255,255,.72); display:block; padding:5px 0; font-size:.9rem; }
.lv-shell-footer a:hover { color:#fff; }
.lv-shell-footer p { color: rgba(255,255,255,.75); font-size:.9rem; margin:0; }
.lv-shell-footer__brand img { height:40px; margin-bottom:14px; background:#fff; padding:6px 10px; border-radius:10px; }
.lv-shell-footer__social { display:flex; gap:10px; margin-top:14px; }
.lv-shell-footer__social a { width:38px; height:38px; border-radius:10px; background:rgba(255,255,255,.08); display:grid; place-items:center; color:#fff; padding:0; }
.lv-shell-footer__social a:hover { background: var(--lv-primary); }
.lv-shell-footer__bar { border-top:1px solid rgba(255,255,255,.12); margin-top:32px; padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:.82rem; }
.lv-shell-footer__bar a { display:inline; padding:0; }

/* ===== Premium header (site-wide) ===== */
.lv-shell-header { position:sticky; top:0; z-index:1030; background:#fff; border-bottom:1px solid var(--lv-border); }
.lv-shell-header.is-stuck { box-shadow:0 6px 24px rgba(23,43,70,.08); }

/* Top bar */
.lv-shell-topbar { background:var(--lv-navy); color:rgba(255,255,255,.82); font-size:.8rem; }
.lv-shell-topbar__row { display:flex; align-items:center; justify-content:space-between; min-height:38px; gap:12px; }
.lv-shell-topbar a { color:rgba(255,255,255,.82); }
.lv-shell-topbar a:hover { color:#fff; }
.lv-shell-topbar__contact { display:flex; gap:20px; flex-wrap:wrap; }
.lv-shell-topbar__contact i { opacity:.8; margin-right:4px; }
.lv-shell-topbar__meta { display:flex; align-items:center; gap:14px; }
.lv-shell-topbar__meta a { display:inline-grid; place-items:center; }
.lv-shell-topbar__lang select { background:rgba(255,255,255,.1); color:#fff; border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:3px 10px; font-size:.78rem; }
.lv-shell-topbar__lang select option { color:#172b46; }
@media (max-width:640px){ .lv-shell-topbar__contact a:not(:first-child){ display:none; } .lv-shell-topbar__meta .lv-shell-topbar__lang{ display:none; } }

/* Nav row */
.lv-shell-nav__row { display:flex; align-items:center; gap:18px; min-height:68px; }
.lv-shell-nav__brand img { height:42px; width:auto; display:block; }
.lv-shell-nav__spacer { flex:1 1 auto; }

/* Menu */
.lv-shell-nav__menu { display:flex; align-items:center; gap:2px; list-style:none; margin:0; padding:0; }
.lv-shell-nav__item { position:relative; }
.lv-shell-nav__link { display:inline-flex; align-items:center; gap:6px; background:none; border:0; cursor:pointer;
  font-family:var(--lv-font-body); font-weight:var(--lv-fw-semibold); font-size:.94rem; color:var(--lv-ink); padding:10px 13px; border-radius:var(--lv-radius-sm); text-decoration:none; white-space:nowrap; transition:color .15s, background .15s; }
.lv-shell-nav__link i { font-size:10px; opacity:.6; transition:transform .2s; }
.lv-shell-nav__item:hover > .lv-shell-nav__link,
.lv-shell-nav__item.is-open > .lv-shell-nav__link { color:var(--lv-primary); background:var(--lv-sky-100); }
.lv-shell-nav__item:hover > .lv-shell-nav__link i,
.lv-shell-nav__item.is-open > .lv-shell-nav__link i { transform:rotate(180deg); }

/* Dropdowns */
.lv-shell-nav__dd { position:absolute; top:calc(100% + 6px); left:0; min-width:230px; background:#fff; border:1px solid var(--lv-border); border-radius:var(--lv-radius); box-shadow:0 18px 44px rgba(23,33,58,.15); padding:10px; opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .16s, transform .16s, visibility .16s; z-index:1200; }
.lv-shell-nav__item:hover > .lv-shell-nav__dd,
.lv-shell-nav__item.is-open > .lv-shell-nav__dd { opacity:1; visibility:visible; transform:translateY(0); }
.lv-shell-nav__dd--right { left:auto; right:0; }
.lv-shell-nav__dd--mega { display:grid; grid-template-columns:repeat(3,minmax(170px,1fr)); gap:4px 18px; min-width:620px; }
.lv-shell-nav__ddcol { display:flex; flex-direction:column; }
.lv-shell-nav__ddhead { font-size:10.5px; font-weight:var(--lv-fw-extrabold); color:#98a1b3; text-transform:uppercase; letter-spacing:.4px; padding:9px 10px 4px; }
.lv-shell-nav__dd a { display:flex; align-items:center; gap:9px; padding:8px 10px; border-radius:8px; color:var(--lv-ink); font-weight:var(--lv-fw-medium); font-size:.875rem; text-decoration:none; white-space:nowrap; }
.lv-shell-nav__dd a i { width:16px; text-align:center; opacity:.7; }
.lv-shell-nav__dd a:hover { background:var(--lv-sky-100); color:var(--lv-primary); }
.lv-shell-nav__ddall { margin-top:4px; border-top:1px solid var(--lv-border); padding-top:10px !important; font-weight:var(--lv-fw-semibold) !important; }

/* Search */
.lv-shell-nav__search { display:flex; align-items:center; gap:8px; background:var(--lv-surface,#f4f7fb); border:1px solid var(--lv-border); border-radius:999px; padding:8px 15px; min-width:180px; max-width:240px; }
.lv-shell-nav__search i { color:#8894a8; font-size:.9rem; }
.lv-shell-nav__search input { border:0; background:none; outline:none; font-size:.9rem; width:100%; color:var(--lv-ink); }

/* Actions / widgets */
.lv-shell-nav__actions { display:flex; align-items:center; gap:14px; }
.lv-shell-nav__widget { position:relative; display:flex; align-items:center; }
.lv-shell-nav .menu_pro_cart_tgl i, .lv-shell-nav .menu_wisth_tgl i, .lv-shell-nav #headerNotification i { font-size:1.15rem; color:var(--lv-ink); cursor:pointer; }
.lv-shell-nav .menu_pro_cart_tgl:hover i, .lv-shell-nav .menu_wisth_tgl:hover i { color:var(--lv-primary); }
.lv-shell-nav .menu_pro_tgl img { width:38px; height:38px; border-radius:50%; object-fit:cover; border:2px solid var(--lv-border); }
.lv-shell-nav__login { font-weight:var(--lv-fw-semibold); color:var(--lv-ink); text-decoration:none; font-size:.94rem; padding:6px 4px; }
.lv-shell-nav__login:hover { color:var(--lv-primary); }

/* Mobile triggers hidden on desktop */
.lv-shell-nav__msearch, .lv-shell-nav__burger { display:none; background:none; border:0; cursor:pointer; font-size:1.3rem; color:var(--lv-ink); text-decoration:none; padding:4px 6px; }
.lv-shell-nav__msearchbar { display:none; }

/* ---- Responsive: tablet/mobile ---- */
@media (max-width:991px){
  .lv-shell-nav__menu, .lv-shell-nav__search { display:none; }
  .lv-shell-nav__spacer { display:none; }
  .lv-shell-nav__row { gap:10px; justify-content:space-between; }
  .lv-shell-nav__brand { margin-right:auto; }
  .lv-shell-nav__msearch, .lv-shell-nav__burger { display:inline-flex; align-items:center; }
  /* On mobile, hide login text + wishlist/notification to reduce clutter; cart + account + burger remain */
  .lv-shell-nav__login { display:none; }
  .lv-shell-nav__msearchbar { padding:0 var(--lv-gutter) 12px; max-height:0; overflow:hidden; transition:max-height .2s; }
  .lv-shell-nav__msearchbar.is-open { display:flex; align-items:center; gap:8px; max-height:70px; padding-top:4px; }
  .lv-shell-nav__msearchbar input { flex:1; border:1px solid var(--lv-border); border-radius:999px; padding:9px 14px; font-size:.9rem; outline:none; }
  .lv-shell-nav__msearchbar button { background:var(--lv-primary); color:#fff; border:0; border-radius:50%; width:38px; height:38px; cursor:pointer; }
}
@media (min-width:992px){ .lv-shell-nav__msearchbar { display:none !important; } }

/* ===== Premium interior breadcrumb band =====
   Only applied when the premium shell is active (egurukula / premium_shell=on).
   Replaces the legacy purple stock banner with a brand navy band so interior
   pages read as one system. lvalues.com (no .lv-shell-header) keeps legacy. */
body:has(.lv-shell-header) .bread-crumb {
  background: linear-gradient(118deg, #12223d 0%, #1b4a80 60%, #2F6FB5 100%);
  padding: clamp(26px,4vw,44px) 0;
  position: relative; overflow: hidden;
}
body:has(.lv-shell-header) .bread-crumb .breadcrumb { margin-bottom: 10px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
body:has(.lv-shell-header) .bread-crumb .breadcrumb a,
body:has(.lv-shell-header) .bread-crumb .breadcrumb span { color: rgba(255,255,255,.78); font-weight: var(--lv-fw-semibold); font-size:.85rem; text-decoration:none; }
body:has(.lv-shell-header) .bread-crumb .breadcrumb a:hover { color:#fff; }
body:has(.lv-shell-header) .bread-crumb .breadcrumb .active span { color:#fff; }
body:has(.lv-shell-header) .bread-crumb .breadcrumb li i { color: rgba(255,255,255,.5); font-size:10px; }
body:has(.lv-shell-header) .bread-crumb .brd-home { filter: brightness(0) invert(1); opacity:.85; }
body:has(.lv-shell-header) .bread-crumb h1 { color:#fff; font-family: var(--lv-font-head); font-weight: var(--lv-fw-extrabold); font-size: clamp(1.6rem,3vw,2.3rem); margin:0; line-height:1.15; }
/* Retire the floating stock book graphic for a cleaner premium band */
body:has(.lv-shell-header) .bread-crumb .book-img { display:none; }
