/* ============================================================
LVK Books — CSS store dùng chung (header/footer/home/shop/product...)
Dựng từ thiết kế Claude Design (LVK Books.dc.html, BookCover.dc.html)
Màu thương hiệu: #bf0000 · Font: Be Vietnam Pro
============================================================ */
:root{
--lvk-red:#bf0000;
--lvk-red-dark:#7a0000;
--lvk-ink:#111;
--lvk-rule:#ececec;
--lvk-muted-strong:#666;
--lvk-form-error:oklch(78% .13 25);
--lvk-form-success:oklch(83% .12 145);
--lvk-form-status-bg:oklch(18% .015 25);
--lvk-form-status-border:oklch(38% .03 25);
--lvk-form-focus-light:oklch(96% .006 25);
--lvk-form-gap:10px;
--lvk-form-gap-small:8px;
--lvk-dur-micro:120ms;
--lvk-ease-out:cubic-bezier(.16,1,.3,1);
--lvk-ease-in:cubic-bezier(.7,0,.84,0);
}
.lvk-site, .lvk-site *{ box-sizing:border-box; }
.lvk-site{
font-family:'Be Vietnam Pro',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
color:#1a1a1a; background:#fff; -webkit-font-smoothing:antialiased; line-height:1.5;
}
.lvk-site a{ text-decoration:none; color:inherit; }
.lvk-site img{ max-width:100%; }
body.lvk-body{ margin:0; background:#fff; }
/* Chặn tràn ngang trên mobile (overflow-x:clip KHÔNG phá position:sticky của header). */
html, body{ overflow-x:clip; }
/* ẩn admin bar đẩy layout vẫn ok */
.lvk-wide{ width:1176px; max-width:calc(100% - 40px); margin:0 auto; }
/* ---------- TOPBAR ---------- */
.lvk-topbar{ background:#000; color:#bdbdbd; font-size:12.5px; min-height:38px; display:flex; align-items:center; justify-content:center; }
.lvk-topbar .lvk-wide{ display:flex; align-items:center; justify-content:space-between; gap:16px; }
.lvk-topbar b{ color:#fff; }
.lvk-topbar-links{ display:flex; gap:22px; align-items:center; }
.lvk-topbar-links a:hover{ color:#fff; }
.lvk-topbar .lang{ color:#fff; cursor:pointer; }
/* ---------- HEADER ---------- */
.lvk-header{ position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid #ececec; }
.lvk-header-main{ display:flex; align-items:center; gap:30px; padding:16px 0; }
.lvk-logo{ display:flex; align-items:center; gap:13px; flex:none; text-decoration:none; }
.lvk-logo-icon{ width:54px; height:54px; background:var(--lvk-red); border-radius:13px; display:flex; align-items:center; justify-content:center; flex:none; }
.lvk-logo-textwrap{ display:inline-flex; flex-direction:column; line-height:1; }
.lvk-logo-name{ font-weight:800; font-size:26px; color:#111; letter-spacing:-.02em; }
.lvk-logo-name span{ color:var(--lvk-red); }
.lvk-logo-sub{ font-size:7.4px; color:#9a9a9a; font-weight:500; text-align:justify; text-align-last:justify; margin-top:6px; white-space:nowrap; }
.lvk-search{ flex:1; display:flex; align-items:center; background:#fff; border:1.5px solid rgba(0,0,0,.15); border-radius:8px; height:48px; padding:0 16px; margin:0 !important; }
.lvk-search input{ border:none !important; background:transparent !important; box-shadow:none !important; outline:none !important; flex:1; font-size:14px; color:#333; font-family:inherit; height:auto !important; min-height:0 !important; margin:0 !important; padding:0 !important; border-radius:0 !important; }
.lvk-search input:focus{ border:none !important; box-shadow:none !important; outline:none !important; }
/* Bỏ viền/đổ bóng mặc định của Flatsome cho các input tuỳ biến khác */
.lvk-cta-form input, .lvk-help-hero .box input, .lvk-blog-news input{ border:none !important; box-shadow:none !important; outline:none !important; }
.lvk-cta-form input:focus, .lvk-help-hero .box input:focus, .lvk-blog-news input:focus{ box-shadow:none !important; outline:none !important; }
.lvk-search button{ border:none; background:transparent; cursor:pointer; display:flex; align-items:center; padding:0 !important; margin:0 !important; min-height:0 !important; height:auto !important; box-shadow:none !important; }
/* Triệt tiêu margin-bottom:1em mặc định của Flatsome trên mọi nút tuỳ biến */
.lvk-add, .lvk-buy, .lvk-wishbtn, .lvk-btn, .lvk-btn-red, .lvk-btn-outline, .lvk-nav button, .lvk-qty button, .lvk-help-hero .box button, .lvk-cta-form .lvk-btn{ margin-bottom:0 !important; }
.lvk-actions{ display:flex; align-items:center; gap:24px; flex:none; }
.lvk-iconlink{ display:flex; flex-direction:column; align-items:center; gap:3px; position:relative; color:#222; }
.lvk-iconlink span{ font-size:11px; color:#444; }
.lvk-iconlink .lvk-badge-count{ position:absolute; top:-6px; right:2px; background:var(--lvk-red); color:#fff !important; font-size:10px; font-weight:700; border-radius:9px; min-width:17px; height:17px; display:flex; align-items:center; justify-content:center; padding:0 4px; }
.lvk-account{ display:flex; flex-direction:column; align-items:flex-start; gap:5px; margin-left:6px; }
.lvk-account .btn{ background:var(--lvk-red); color:#fff; font-weight:700; font-size:14px; padding:11px 22px; border-radius:7px; white-space:nowrap; }
.lvk-account .sub{ font-size:12px; color:#555; white-space:nowrap; }
.lvk-account .sub .login{ color:var(--lvk-red); font-weight:600; text-decoration:underline; }
/* ---------- MENU ---------- */
.lvk-menu{ border-top:1px solid #f0f0f0; position:relative; }
.lvk-menu-row{ display:flex; align-items:center; gap:30px; height:48px; font-size:14px; font-weight:500; color:#2a2a2a; }
.lvk-menu-item{ height:48px; display:flex; align-items:center; }
.lvk-menu-item > a{ display:inline-flex; align-items:center; gap:8px; height:48px; border-bottom:3px solid transparent; margin-bottom:-1px; color:#2a2a2a; }
.lvk-menu-item.has-mega:hover > a{ color:var(--lvk-red); border-bottom-color:var(--lvk-red); }
.lvk-menu-item.has-mega:hover > a svg{ stroke:var(--lvk-red); }
.lvk-menu-row .cats{ font-weight:600; color:#111; }
.lvk-menu-link{ display:inline-flex; align-items:center; gap:8px; }
.lvk-menu-link:hover{ color:var(--lvk-red); }
.lvk-menu-link.promo{ color:var(--lvk-red); }
.lvk-menu-row .spacer{ flex:1; }
.lvk-menu-row .right{ color:#666; }
/* ---------- MEGA MENU ---------- */
.lvk-menu-item.has-mega{ position:relative; }
.lvk-mega{ display:none; position:absolute; left:0; top:100%; width:280px; max-width:calc(100vw - 32px); z-index:60; }
.lvk-menu-item.has-mega:hover .lvk-mega,.lvk-menu-item.has-mega:focus-within .lvk-mega{ display:block; }
.lvk-mega-overlay{ display:none; }
.lvk-mega-panel{ width:100%; background:#fff; border:1px solid #eee; border-radius:0 0 8px 8px; box-shadow:0 8px 24px rgba(0,0,0,.12); }
.lvk-mega-panel > .lvk-wide{ display:block!important; width:100%; min-width:0; padding:8px 16px!important; }
.lvk-mega-c1{ flex:1; }
.lvk-mega-c2,.lvk-mega-h{ display:none; }
.lvk-mega-h{ font-size:12px; letter-spacing:.14em; color:#999; font-weight:700; text-transform:uppercase; margin-bottom:16px; }
.lvk-mega-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:0; }
.lvk-mega-grid a{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; font-size:14px; color:#333; border-bottom:1px solid #f4f4f4; }
.lvk-mega-grid a:hover{ color:var(--lvk-red); }
.lvk-mega-grid .cnt{ font-size:12px; color:#bbb; }
.lvk-mega-c2 > a{ display:flex; align-items:center; gap:12px; padding:11px 0; }
.lvk-mega-c2 .ic{ width:34px; height:34px; border-radius:9px; background:#fbeeec; color:var(--lvk-red); display:flex; align-items:center; justify-content:center; font-size:16px; flex:none; }
.lvk-mega-c2 .tx b{ display:block; font-size:14px; font-weight:600; color:#222; }
.lvk-mega-c2 .tx i{ display:block; font-size:12px; color:#999; margin-top:1px; font-style:normal; }
/* ---------- HERO ---------- */
.lvk-hero{ background:linear-gradient(115deg,var(--lvk-red) 0%,var(--lvk-red-dark) 100%); color:#fff; position:relative; overflow:hidden; }
.lvk-hero .ring{ position:absolute; border:2px solid rgba(255,255,255,.12); border-radius:50%; }
.lvk-hero .ring.r1{ right:-60px; top:-80px; width:380px; height:380px; }
.lvk-hero .ring.r2{ right:120px; bottom:-120px; width:240px; height:240px; border-color:rgba(255,255,255,.1); }
.lvk-hero .lvk-wide{ display:flex; align-items:center; gap:40px; padding:56px 0; position:relative; z-index:2; }
.lvk-hero-text{ flex:1; }
.lvk-hero-eyebrow{ font-size:12px; letter-spacing:.26em; opacity:.85; font-weight:600; }
.lvk-hero-title{ font-size:50px; font-weight:700; line-height:1.06; margin-top:16px; }
.lvk-hero-sub{ font-size:16px; opacity:.92; margin-top:18px; max-width:440px; line-height:1.6; }
.lvk-hero-cta{ display:flex; gap:14px; margin-top:30px; flex-wrap:wrap; }
.lvk-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; font-size:14.5px; padding:14px 28px; border-radius:8px; cursor:pointer; border:none; text-transform:none !important; white-space:nowrap; }
.lvk-btn-white{ background:#fff; color:var(--lvk-red); }
.lvk-btn-ghost{ background:rgba(0,0,0,.3); color:#fff; font-weight:600; border:1.5px solid rgba(255,255,255,.75); }
.lvk-hero-stats{ display:flex; gap:28px; margin-top:34px; font-size:13px; opacity:.9; flex-wrap:wrap; }
.lvk-hero-covers{ flex:none; display:flex; align-items:center; gap:16px; }
/* ---------- SECTION ---------- */
.lvk-section{ width:1176px; max-width:calc(100% - 40px); margin:56px auto 0; }
.lvk-section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
.lvk-section-title{ font-size:26px; font-weight:700; color:#111; }
.lvk-section-sub{ font-size:13.5px; color:#888; margin-top:5px; }
.lvk-section-head .titlewrap{ display:flex; align-items:center; gap:12px; }
.lvk-tag-pill{ background:var(--lvk-red); color:#fff; font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px; }
.lvk-nav{ display:flex; gap:10px; }
.lvk-nav button{ width:40px; height:40px; border-radius:50%; border:1.5px solid #dddddd; display:flex; align-items:center; justify-content:center; cursor:pointer; background:#fff; }
.lvk-nav button:hover{ border-color:#bbb; }
.lvk-nav button:disabled{ opacity:.35; cursor:default; }
/* ---------- CAROUSEL ---------- */
.lvk-carousel{ overflow:hidden; margin-top:22px; }
.lvk-carousel-track{ display:flex; gap:24px; transition:transform .5s cubic-bezier(.22,1,.36,1); }
/* ---------- BOOK CARD ---------- */
.lvk-bookcard{ flex:none; width:216px; display:block; }
.lvk-grid .lvk-bookcard{ width:auto; }
.lvk-bookcard-cover{ position:relative; }
.lvk-bookcard-title{ font-size:14px; font-weight:600; color:#111; margin-top:12px; line-height:1.32; height:37px; overflow:hidden; }
.lvk-bookcard-subtitle{ min-height:32px; margin-top:3px; font-size:12px; line-height:1.35; color:#666; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lvk-bookcard-author{ font-size:12px; color:#999; margin-top:3px; }
.lvk-stars{ font-size:12px; color:#f5a623; margin-top:6px; }
.lvk-stars span{ color:#aaa; }
.lvk-bookcard-price{ display:flex; align-items:baseline; gap:8px; margin-top:7px; }
.lvk-bookcard-price .now{ font-size:17px; font-weight:700; color:var(--lvk-red); }
.lvk-bookcard-price .now .amount{ font-size:17px; font-weight:700; color:var(--lvk-red); }
.lvk-bookcard-price .was{ font-size:12px; color:#bbb; text-decoration:line-through; }
.lvk-bookcard-price .was .amount{ color:#bbb; }
.lvk-bookcard-formats{ font-size:11px; color:#777; margin-top:4px; }
.lvk-audio-pill{ position:absolute; bottom:12px; left:12px; background:rgba(0,0,0,.62); color:#fff; font-size:11px; font-weight:600; padding:5px 11px; border-radius:20px; display:flex; align-items:center; gap:6px; }
/* ---------- BOOK COVER (placeholder) ---------- */
.lvk-cover{ position:relative; border-radius:3px; overflow:hidden; isolation:isolate; box-shadow:0 4px 10px rgba(0,0,0,.18); display:flex; flex-direction:column; justify-content:space-between; }
.lvk-cover-spine{ position:absolute; left:0; top:0; bottom:0; width:7px; background:rgba(0,0,0,.22); z-index:2; }
.lvk-cover-sheen{ position:absolute; inset:0; pointer-events:none; z-index:1; }
.lvk-cover-top{ position:relative; z-index:3; padding:14px 14px 14px 18px; display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.lvk-cover-genre{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; opacity:.7; }
.lvk-cover-badge{ font-size:9px; font-weight:700; letter-spacing:.08em; border:1px solid; opacity:.85; border-radius:2px; padding:2px 5px; }
.lvk-cover-mid{ position:relative; z-index:3; padding:0 16px 0 18px; flex:1; display:flex; flex-direction:column; justify-content:center; }
.lvk-cover-title{ font-weight:600; line-height:1.12; }
.lvk-cover-bot{ position:relative; z-index:3; padding:14px 16px 16px 18px; }
.lvk-cover-author{ font-size:11px; font-weight:600; letter-spacing:.04em; opacity:.85; }
.lvk-cover-brand{ font-size:9px; letter-spacing:.22em; text-transform:uppercase; opacity:.55; margin-top:4px; }
/* ---------- HERO BANNER (ảnh thiết kế Canva) ---------- */
.lvk-hero-banner{ display:block; border-radius:14px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.12); transition:transform .2s ease, box-shadow .2s ease; }
.lvk-hero-banner img{ display:block; width:100%; height:auto; }
.lvk-hero-banner:hover{ transform:translateY(-2px); box-shadow:0 16px 42px rgba(0,0,0,.20); }
/* ---------- BANNER (Unlimited - cũ, không còn dùng) ---------- */
.lvk-banner-dark{ background:#000; border-radius:14px; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:38px 48px; position:relative; }
.lvk-banner-dark .glow{ position:absolute; right:280px; top:-40px; width:200px; height:200px; background:radial-gradient(circle,rgba(191,0,0,.5),transparent 70%); }
.lvk-banner-dark .txt{ color:#fff; position:relative; z-index:2; }
.lvk-banner-label{ font-size:12px; letter-spacing:.26em; color:#ff6b6b; font-weight:600; }
.lvk-banner-title{ font-size:30px; font-weight:700; margin-top:10px; }
.lvk-banner-sub{ font-size:14.5px; color:#bbb; margin-top:8px; }
.lvk-banner-sub b{ color:#fff; }
.lvk-banner-dark .lvk-btn{ position:relative; z-index:2; background:var(--lvk-red); color:#fff; }
/* ---------- FEATURE (mới phát hành / đề xuất) ---------- */
.lvk-feature{ background:#f2f2f2; border:1px solid #e9e9e9; border-radius:16px; display:flex; gap:44px; padding:40px 44px; align-items:center; }
.lvk-feature-cover{ flex:none; position:relative; }
.lvk-feature-cover .new{ position:absolute; top:-10px; left:-10px; z-index:3; background:var(--lvk-red); color:#fff; font-size:11px; font-weight:700; letter-spacing:.1em; padding:6px 12px; border-radius:6px; box-shadow:0 4px 10px rgba(191,0,0,.35); }
.lvk-feature-body{ flex:1; }
.lvk-feature-eyebrow{ font-size:12px; letter-spacing:.24em; color:var(--lvk-red); font-weight:600; }
.lvk-feature-title{ font-size:34px; font-weight:700; color:#111; margin-top:10px; line-height:1.15; }
.lvk-feature-author{ font-size:14px; color:#777; margin-top:6px; }
.lvk-feature-author b{ color:#444; }
.lvk-feature-meta{ display:flex; align-items:center; gap:12px; margin-top:10px; font-size:13px; color:#999; }
.lvk-feature-meta .stars{ color:#f5a623; }
.lvk-feature-intro{ font-size:14.5px; color:#555; margin-top:16px; line-height:1.7; max-width:560px; }
.lvk-price-boxes{ display:flex; gap:14px; margin-top:22px; flex-wrap:wrap; }
.lvk-price-box{ border:1.5px solid #dddddd; background:#fff; border-radius:10px; padding:10px 18px; text-align:center; }
.lvk-price-box .lbl{ font-size:10.5px; color:#999; letter-spacing:.06em; }
.lvk-price-box .val{ font-size:16px; font-weight:700; color:var(--lvk-red); margin-top:2px; }
.lvk-feature-cta{ display:flex; gap:12px; margin-top:24px; flex-wrap:wrap; }
.lvk-btn-red{ background:var(--lvk-red); color:#fff; font-weight:700; font-size:14px; padding:14px 28px; border-radius:9px; }
.lvk-btn-outline{ border:1.5px solid rgba(0,0,0,.15); color:#444; font-weight:600; font-size:14px; padding:14px 24px; border-radius:9px; display:inline-flex; align-items:center; gap:8px; background:#fff; }
/* ---------- NEWSLETTER CTA ---------- */
.lvk-cta{ background:#000; border-radius:16px; padding:50px; display:flex; align-items:center; justify-content:space-between; gap:24px; position:relative; overflow:hidden; }
.lvk-cta .ring{ position:absolute; left:-60px; bottom:-80px; width:260px; height:260px; border:2px solid rgba(191,0,0,.4); border-radius:50%; }
.lvk-cta-txt{ color:#fff; position:relative; z-index:2; max-width:560px; }
.lvk-cta-label{ font-size:11.5px; letter-spacing:.24em; color:#ff7a7a; font-weight:600; margin-bottom:10px; }
.lvk-cta-title{ font-size:32px; font-weight:700; line-height:1.2; }
.lvk-cta-sub{ font-size:14.5px; color:#bbb; margin-top:12px; }
.lvk-cta-form{ position:relative; z-index:2; display:flex; gap:10px; margin:0; }
.lvk-cta-form input{ border:none; outline:none; height:52px !important; min-height:52px; border-radius:9px !important; padding:0 20px !important; margin:0 !important; box-shadow:none !important; box-sizing:border-box; font-size:14px; width:280px; font-family:inherit; vertical-align:top; }
.lvk-cta-form .lvk-btn{ flex:none; background:var(--lvk-red); color:#fff; height:52px; padding:0 30px; }
/* Hallmark · component: newsletter form · genre: editorial · theme: LVK red/ink
* states: default · hover · focus · active · disabled · loading · error · success
* contrast: pass (46–50)
*/
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V4 */
.lvk-cta .wpcf7, .lvk-blog-news .wpcf7{ position:relative; z-index:2; width:100%; max-width:440px; }
.lvk-cta .wpcf7{ flex:0 1 440px; }
.lvk-cta-form{ --lvk-newsletter-height:52px; display:block; width:100%; margin:0; }
.lvk-newsletter-controls{ display:block; width:100%; }
.lvk-newsletter-controls > p{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:var(--lvk-form-gap); width:100%; margin:0; }
.lvk-newsletter-controls .wpcf7-form-control-wrap{ display:block; min-width:0; padding-block-end:22px; }
.lvk-newsletter-controls input[type="email"]{ width:100%; min-width:0; }
.lvk-newsletter-controls input.lvk-btn{ width:auto; min-width:116px; white-space:nowrap; background-image:none; color:var(--lvk-form-focus-light); transition:background-color var(--lvk-dur-micro) var(--lvk-ease-out), transform var(--lvk-dur-micro) var(--lvk-ease-out), opacity var(--lvk-dur-micro) var(--lvk-ease-out); }
.lvk-newsletter-controls input.lvk-btn:hover{ background-image:none; transform:none; }
@media (hover:hover) and (pointer:fine){
.lvk-newsletter-controls input.lvk-btn:hover{ background-color:var(--lvk-red-dark); transform:translateY(-1px); }
}
.lvk-newsletter-controls input.lvk-btn:focus-visible{ outline:3px solid var(--lvk-form-focus-light) !important; outline-offset:3px; }
.lvk-newsletter-controls input.lvk-btn:active{ background-color:var(--lvk-red-dark); transform:translateY(1px); transition-timing-function:var(--lvk-ease-in); }
.lvk-newsletter-controls input.lvk-btn:disabled{ cursor:not-allowed; opacity:.55; transform:none; }
.lvk-newsletter-controls input[type="email"]:focus-visible{ outline:3px solid var(--lvk-red) !important; outline-offset:2px; }
.lvk-cta-form .wpcf7-spinner{ display:none; }
.lvk-cta-form .wpcf7-not-valid{ outline:2px solid var(--lvk-form-error) !important; outline-offset:2px; }
.lvk-cta-form .wpcf7-not-valid-tip{ position:absolute; inset-block-start:calc(var(--lvk-newsletter-height) + 5px); inset-inline-start:0; color:var(--lvk-form-error); font-size:12px; font-weight:500; line-height:1.35; margin:0; white-space:nowrap; }
.lvk-cta .wpcf7 form.lvk-cta-form .wpcf7-response-output, .lvk-blog-news .wpcf7 form.lvk-cta-form .wpcf7-response-output{ border:1px solid var(--lvk-form-status-border); border-radius:8px; background:var(--lvk-form-status-bg); color:var(--lvk-form-focus-light); font-size:13px; line-height:1.45; margin:0; padding:10px 12px; }
.lvk-cta .wpcf7 form.lvk-cta-form.invalid .wpcf7-response-output, .lvk-blog-news .wpcf7 form.lvk-cta-form.invalid .wpcf7-response-output{ display:none; }
.lvk-cta-form.sent .wpcf7-response-output{ color:var(--lvk-form-success); }
.lvk-cta-form.sent .wpcf7-response-output::before{ content:"✓"; margin-inline-end:7px; font-weight:700; }
.lvk-cta-form.failed .wpcf7-response-output, .lvk-cta-form.aborted .wpcf7-response-output, .lvk-cta-form.spam .wpcf7-response-output{ color:var(--lvk-form-error); }
.lvk-cta-form.submitting .lvk-btn{ cursor:wait; opacity:.72; transform:none; }
/* ---------- FOOTER ---------- */
.lvk-footer{ background:#111; color:#bdbdbd; margin-top:64px; padding:54px 0 0; }
.lvk-footer-top{ display:flex; gap:48px; padding-bottom:44px; border-bottom:1px solid #262626; flex-wrap:wrap; }
.lvk-footer-brandcol{ flex:1.4; min-width:240px; }
.lvk-footer-brand{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.lvk-footer-badge{ width:40px; height:40px; background:var(--lvk-red); border-radius:10px; display:flex; align-items:center; justify-content:center; flex:none; }
.lvk-footer-namewrap{ display:inline-flex; flex-direction:column; line-height:1; }
.lvk-footer-name{ font-weight:800; font-size:19px; color:#fff; letter-spacing:-.02em; }
.lvk-footer-name span{ color:#ff5a5a; }
.lvk-footer-sub{ font-size:6px; color:#999; font-weight:500; text-align:justify; text-align-last:justify; margin-top:5px; white-space:nowrap; }
.lvk-footer-slogan{ color:#fff; font-size:15px; margin-bottom:10px; }
.lvk-footer-desc{ font-size:13px; line-height:1.7; max-width:280px; }
.lvk-footer-col{ flex:1; min-width:150px; }
.lvk-footer-col h4{ color:#fff; font-weight:600; font-size:14px; margin:0 0 14px; }
.lvk-footer-col .links{ display:flex; flex-direction:column; gap:10px; font-size:13px; }
.lvk-footer-col .links a:hover{ color:#fff; }
.lvk-footer-app{ border:1.5px solid #333; border-radius:8px; padding:9px 14px; font-size:12px; color:#ddd; margin-bottom:10px; }
.lvk-footer-bottom{ display:flex; justify-content:space-between; padding:20px 0; font-size:12px; color:#777; gap:16px; flex-wrap:wrap; }
.lvk-footer-bottom .links{ display:flex; gap:20px; }
/* ---------- PRODUCT (single) ---------- */
.lvk-product{ padding-bottom:10px; }
.lvk-product-grid{ display:flex; gap:40px; margin-top:24px; align-items:flex-start; }
.lvk-product-cover{ flex:none; width:300px; position:sticky; top:128px; }
.lvk-readbtn{ display:flex; align-items:center; justify-content:center; gap:8px; border:1.5px solid rgba(0,0,0,.15); color:#333; font-weight:600; font-size:13.5px; height:46px; border-radius:9px; margin-top:16px; }
.lvk-readbtn:hover{ border-color:#bf0000; color:#bf0000; }
.lvk-product-info{ flex:1; min-width:0; }
.lvk-product-eyebrow{ font-size:11px; letter-spacing:.18em; color:#666; font-weight:600; text-transform:uppercase; }
.lvk-product-title{ font-size:30px; font-weight:700; color:#111; line-height:1.2; margin:8px 0 0; }
.lvk-product-author{ font-size:15px; color:#666; margin-top:10px; }
.lvk-product-author b{ color:#111; }
.lvk-product-rate{ display:flex; align-items:center; gap:14px; margin-top:12px; flex-wrap:wrap; }
.lvk-product-rate .stars{ font-size:15px; color:#f5a623; }
.lvk-product-rate .num{ font-size:14px; color:#333; font-weight:600; }
.lvk-product-rate .cnt{ font-size:13px; color:#999; }
.lvk-product-rate .stock{ font-size:13px; color:#1f8a5b; font-weight:600; }
.lvk-hr{ height:1px; background:#eee; margin:26px 0; }
.lvk-product-h{ font-size:20px; font-weight:700; color:#111; margin-bottom:14px; }
.lvk-product-desc{ font-size:15px; line-height:1.85; color:#444; }
.lvk-product-desc p{ margin:0 0 16px; text-align:justify; }
.lvk-product-desc em{ font-style:italic; }
.lvk-specs{ display:grid; grid-template-columns:1fr 1fr; gap:0 40px; max-width:640px; }
.lvk-specs .spec{ display:flex; justify-content:space-between; padding:11px 0; border-bottom:1px solid #f0f0f0; }
.lvk-specs .k{ font-size:13.5px; color:#999; }
.lvk-specs .v{ font-size:13.5px; color:#333; font-weight:500; text-align:right; }
.lvk-product-buy{ flex:none; width:330px; position:sticky; top:128px; }
.lvk-buybox{ border:1px solid #ececec; border-radius:16px; padding:22px; box-shadow:0 8px 28px rgba(0,0,0,.06); background:#fff; }
.lvk-buybox-label{ font-size:13px; font-weight:600; color:#444; margin-bottom:10px; }
.lvk-format{ display:flex; align-items:center; gap:12px; border:1px solid #e2e2e2; background:#fff; border-radius:11px; padding:12px 14px; margin-bottom:10px; cursor:pointer; }
.lvk-format .radio{ width:18px; height:18px; border-radius:50%; border:2px solid #ccc; display:flex; align-items:center; justify-content:center; flex:none; }
.lvk-format .radio .dot{ width:9px; height:9px; border-radius:50%; background:transparent; }
.lvk-format .meta{ flex:1; min-width:0; }
.lvk-format .lbl{ display:block; font-size:13.5px; font-weight:700; color:#333; }
.lvk-format .note{ display:block; font-size:11px; color:#999; }
.lvk-format .price{ font-size:14.5px; font-weight:700; color:var(--lvk-red); }
.lvk-format .price .amount{ color:var(--lvk-red); }
.lvk-format.on{ border-color:var(--lvk-red); background:#fff6f6; }
.lvk-format.on .radio{ border-color:var(--lvk-red); }
.lvk-format.on .radio .dot{ background:var(--lvk-red); }
.lvk-format.on .lbl{ color:var(--lvk-red); }
.lvk-bigprice{ display:flex; align-items:baseline; gap:10px; margin:18px 0 6px; flex-wrap:wrap; }
.lvk-bigprice .now{ font-size:24px; font-weight:700; color:var(--lvk-red); }
.lvk-bigprice .now .amount{ font-size:24px; font-weight:700; color:var(--lvk-red); }
.lvk-bigprice .was{ font-size:12px; color:#bbb; text-decoration:line-through; }
.lvk-bigprice .was .amount{ color:#bbb; }
.lvk-bigprice .off{ background:#fde8e8; color:var(--lvk-red); font-size:12px; font-weight:700; padding:3px 8px; border-radius:6px; }
.lvk-qty-row{ display:flex; align-items:center; justify-content:space-between; margin:14px 0; font-size:13.5px; color:#555; }
.lvk-qty{ display:flex; align-items:center; border:1.5px solid rgba(0,0,0,.15); border-radius:9px; height:44px; overflow:hidden; }
.lvk-qty button{ width:42px; height:100%; border:none; background:#fff; cursor:pointer; font-size:19px; color:#444; }
.lvk-qty span{ width:42px; text-align:center; font-size:15px; font-weight:600; }
.lvk-add{ background:#333; border:2px solid #333; color:#fff; font-weight:700; font-size:15px; height:50px; width:100%; display:flex; align-items:center; justify-content:center; gap:9px; border-radius:10px; cursor:pointer; margin-top:8px; }
.lvk-add:hover{ background:#000; }
.lvk-add:disabled{ cursor:wait; opacity:.82; }
.lvk-add.is-added, .lvk-add.is-added:hover{ background:#177245; border-color:#177245; color:#fff; opacity:1; }
.lvk-buy{ background:var(--lvk-red); color:#fff; font-weight:700; font-size:15px; height:50px; width:100%; border:none; display:flex; align-items:center; justify-content:center; border-radius:10px; cursor:pointer; margin-top:10px; }
.lvk-buy:hover{ background:#a00000; }
.lvk-wishbtn{ height:46px; width:100%; display:flex; align-items:center; justify-content:center; gap:8px; border-radius:10px; cursor:pointer; margin-top:10px; color:#666; font-weight:600; font-size:14px; background:#fff; border:none; }
.lvk-wishbtn.is-active{ color:var(--lvk-red); }
.lvk-wishbtn.is-active svg{ fill:var(--lvk-red); }
.lvk-added{ display:flex; align-items:center; justify-content:center; gap:8px; background:#eafaf1; border:1px solid #b8e6cd; color:#1f8a5b; font-size:13px; font-weight:600; height:42px; border-radius:9px; margin-top:12px; }
.lvk-trust{ border-top:1px solid #f0f0f0; margin-top:18px; padding-top:16px; display:flex; flex-direction:column; gap:12px; }
.lvk-trust div{ display:flex; gap:10px; align-items:center; font-size:12.5px; color:#666; }
.lvk-product-related{ margin-top:56px; }
.lvk-related-row{ display:grid; grid-template-columns:repeat(6,1fr); gap:24px; }
.lvk-related-card .t{ font-size:14px; font-weight:600; color:#111; margin-top:12px; line-height:1.3; height:37px; overflow:hidden; }
.lvk-related-card .sub{ min-height:32px; margin-top:3px; font-size:12px; line-height:1.35; color:#666; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lvk-related-card .p{ font-size:16px; font-weight:700; color:var(--lvk-red); margin-top:6px; }
.lvk-related-card .p .amount{ color:var(--lvk-red); }
/* ---------- HELP / TRỢ GIÚP ---------- */
.lvk-help-hero{ background:linear-gradient(120deg,var(--lvk-red),var(--lvk-red-dark)); padding:48px 0; text-align:center; color:#fff; }
.lvk-help-hero .h{ font-size:30px; font-weight:700; }
.lvk-help-hero .s{ font-size:14.5px; opacity:.9; margin-top:8px; }
.lvk-help-hero .box{ max-width:620px; margin:24px auto 0; display:flex; align-items:center; background:#fff; border-radius:12px; height:56px; padding:0 8px 0 20px; }
.lvk-help-hero .box input{ border:none; outline:none; flex:1; font-size:15px; padding:0 14px; color:#333; font-family:inherit; }
.lvk-help-hero .box button{ background:var(--lvk-red); color:#fff; font-weight:700; font-size:14px; height:42px; padding:0 22px; border:none; border-radius:8px; cursor:pointer; }
.lvk-help-tiles{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-bottom:48px; }
.lvk-help-tiles .tile{ border:1px solid #ececec; border-radius:14px; padding:24px; text-align:center; }
.lvk-help-tiles .ic{ width:52px; height:52px; border-radius:12px; background:#fbeeec; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; }
.lvk-help-tiles .t{ font-size:15px; font-weight:700; color:#111; }
.lvk-help-tiles .d{ font-size:12.5px; color:#999; margin-top:6px; line-height:1.5; }
.lvk-help-main{ display:flex; gap:40px; align-items:flex-start; }
.lvk-faq{ flex:1; min-width:0; }
.lvk-help-h{ font-size:24px; font-weight:700; color:#111; margin-bottom:6px; }
.lvk-help-sub{ font-size:13.5px; color:#888; margin-bottom:22px; }
.lvk-faq-item{ border:1px solid #ececec; border-radius:12px; margin-bottom:12px; overflow:hidden; cursor:pointer; }
.lvk-faq-item .q{ display:flex; align-items:center; justify-content:space-between; padding:18px 20px; }
.lvk-faq-item .q span{ font-size:15px; font-weight:600; color:#222; }
.lvk-faq-item .q i{ font-size:22px; color:var(--lvk-red); line-height:1; font-style:normal; transition:transform .2s; }
.lvk-faq-item .a{ max-height:0; overflow:hidden; transition:max-height .3s; }
.lvk-faq-item .a .inner{ padding:4px 20px 20px; font-size:14px; color:#555; line-height:1.75; }
.lvk-faq-item.open .q{ background:#fbeeec; }
.lvk-faq-item.open .q i{ transform:rotate(45deg); }
.lvk-faq-item.open .a{ max-height:320px; }
.lvk-help-side{ flex:none; width:340px; }
.lvk-help-side .card{ border:1px solid #ececec; border-radius:16px; padding:26px; }
.lvk-help-side .card>.h{ font-size:17px; font-weight:700; color:#111; margin-bottom:16px; }
.lvk-help-side .rows{ display:flex; flex-direction:column; gap:14px; }
.lvk-help-side .row{ display:flex; gap:13px; align-items:center; }
.lvk-help-side .row .ic{ width:42px; height:42px; border-radius:10px; background:#fbeeec; display:flex; align-items:center; justify-content:center; flex:none; }
.lvk-help-side .row .t{ font-size:13px; font-weight:600; color:#222; }
.lvk-help-side .row .v{ font-size:13px; color:var(--lvk-red); font-weight:600; }
.lvk-help-side .row .n{ font-size:11.5px; color:#999; }
@media (max-width:900px){ .lvk-help-tiles{ grid-template-columns:repeat(2,1fr); } .lvk-help-main{ flex-direction:column; } .lvk-help-side{ width:100%; } }
/* ---------- MY LIBRARY (tài khoản) ---------- */
.lvk-profile-banner{ display:flex; align-items:center; gap:22px; background:#f2f2f2; border:1px solid #e1e1e1; border-radius:16px; padding:24px 26px; margin-bottom:26px; flex-wrap:wrap; }
.lvk-profile-banner .ava{ width:72px; height:72px; border-radius:50%; background:var(--lvk-red); color:#fff; display:flex; align-items:center; justify-content:center; font-size:30px; font-weight:700; }
.lvk-profile-banner .info{ flex:1; min-width:160px; }
.lvk-profile-banner .info .n{ font-size:24px; font-weight:700; color:#111; }
.lvk-profile-banner .info .e{ font-size:13.5px; color:#888; margin-top:4px; }
.lvk-profile-banner .stats{ display:flex; gap:30px; }
.lvk-profile-banner .stat{ text-align:center; }
.lvk-profile-banner .stat .num{ font-size:24px; font-weight:700; color:#111; }
.lvk-profile-banner .stat .lbl{ font-size:12px; color:#999; margin-top:2px; }
body.logged-in .lvk-wc-page.lvk-account-wide .woocommerce-account .woocommerce{ display:flex; gap:30px; align-items:flex-start; }
.lvk-wish-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.lvk-wish-card .t{ font-size:14px; font-weight:600; color:#111; margin-top:10px; line-height:1.3; }
.lvk-wish-card .p, .lvk-wish-card .p .amount{ font-size:16px; font-weight:700; color:var(--lvk-red); margin-top:4px; }
.lvk-wish-empty{ background:#fff; border:1px solid #ececec; border-radius:14px; padding:60px; text-align:center; grid-column:1/-1; }
.lvk-wish-empty .h{ font-size:20px; color:#444; font-weight:600; }
@media (max-width:768px){ .lvk-wish-grid{ grid-template-columns:repeat(2,1fr); } }
/* ---------- BLOG (danh sách bài viết) ---------- */
.lvk-blog{ padding:30px 0 24px; }
.lvk-blog-chips{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:28px; }
.lvk-blog-chips .chip{ border:1.5px solid rgba(0,0,0,.15); background:#fff; color:#555; border-radius:24px; padding:9px 18px; font-size:13px; font-weight:500; }
.lvk-blog-chips .chip.on, .lvk-blog-chips .chip:hover{ border-color:var(--lvk-red); background:var(--lvk-red); color:#fff; }
.lvk-blog-feat{ display:flex; gap:32px; background:#fff; border:1px solid #ececec; border-radius:16px; overflow:hidden; margin-bottom:40px; }
.lvk-blog-feat .cover{ flex:none; width:520px; height:320px; position:relative; display:flex; align-items:flex-end; padding:28px; background-size:cover; background-position:center; }
.lvk-blog-feat .cover .tag{ position:absolute; top:20px; left:20px; background:#fff; color:var(--lvk-red); font-size:11px; font-weight:700; letter-spacing:.08em; padding:6px 12px; border-radius:6px; }
.lvk-blog-feat .cover .kicker{ color:#fff; font-size:13px; opacity:.9; text-shadow:0 1px 4px rgba(0,0,0,.4); }
.lvk-blog-feat .body{ flex:1; padding:34px 36px 34px 0; display:flex; flex-direction:column; justify-content:center; }
.lvk-blog-feat .eyebrow{ font-size:12px; letter-spacing:.14em; color:var(--lvk-red); font-weight:600; text-transform:uppercase; }
.lvk-blog-feat .title{ font-size:30px; font-weight:700; color:#111; line-height:1.2; margin-top:12px; }
.lvk-blog-feat .excerpt{ font-size:15px; color:#666; line-height:1.7; margin-top:14px; }
.lvk-blog-feat .author{ display:flex; align-items:center; gap:10px; margin-top:22px; }
.lvk-blog-feat .author .ava{ width:36px; height:36px; border-radius:50%; background:var(--lvk-red); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; }
.lvk-blog-feat .author .n{ font-size:13px; font-weight:600; color:#222; }
.lvk-blog-feat .author .r{ font-size:12px; color:#999; }
.lvk-blog-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px 24px; }
.lvk-blog-card{ display:flex; flex-direction:column; border:1px solid #ececec; border-radius:14px; overflow:hidden; background:#fff; transition:box-shadow .15s, transform .15s; }
.lvk-blog-card:hover{ box-shadow:0 8px 24px rgba(0,0,0,.08); transform:translateY(-2px); }
.lvk-blog-card .cover{ height:184px; position:relative; background-size:cover; background-position:center; }
.lvk-blog-card .cover .tag{ position:absolute; top:14px; left:14px; background:rgba(255,255,255,.92); color:var(--lvk-red); font-size:11px; font-weight:700; padding:5px 11px; border-radius:6px; }
.lvk-blog-card .body{ padding:18px 20px 22px; display:flex; flex-direction:column; flex:1; }
.lvk-blog-card .date{ font-size:11.5px; color:#999; }
.lvk-blog-card .title{ font-size:17px; font-weight:700; color:#111; line-height:1.32; margin-top:8px; }
.lvk-blog-card .subtitle{ font-size:13px; color:#666; line-height:1.45; margin-top:4px; }
.lvk-blog-card .excerpt{ font-size:13.5px; color:#666; line-height:1.6; margin-top:8px; }
.lvk-blog-card .meta{ margin-top:auto; padding-top:16px; display:flex; align-items:center; justify-content:space-between; }
.lvk-blog-card .meta .au{ font-size:12px; color:#888; }
.lvk-blog-card .meta .more{ font-size:12.5px; color:var(--lvk-red); font-weight:600; }
.lvk-blog-news{ background:#111; border-radius:16px; padding:40px 44px; margin-top:44px; display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.lvk-blog-news .h{ font-size:22px; font-weight:700; color:#fff; }
.lvk-blog-news .s{ font-size:14px; color:#bbb; margin-top:8px; }
@media (max-width:1024px){ .lvk-blog-grid{ grid-template-columns:repeat(3,1fr); } .lvk-blog-feat{ flex-direction:column; } .lvk-blog-feat .cover{ width:100%; } .lvk-blog-feat .body{ padding:0 28px 28px; } }
@media (max-width:768px){ .lvk-blog-grid{ grid-template-columns:repeat(2,1fr); } }
/* ---------- WOOCOMMERCE PAGES (cart/checkout/account/order) ---------- */
.lvk-wc-page{ padding:40px 0 70px; }
.lvk-wc-page .woocommerce{ font-family:inherit; }
.lvk-wc-page h1, .lvk-wc-page h2, .lvk-wc-page h3{ font-weight:700; color:#111; }
.lvk-wc-page a{ color:var(--lvk-red); }
.lvk-wc-page .woocommerce-message, .lvk-wc-page .woocommerce-info, .lvk-wc-page .woocommerce-notices-wrapper .woocommerce-message{
border-top-color:var(--lvk-red); background:#fff6f6; border-radius:10px; }
.lvk-wc-page .button, .lvk-wc-page button, .lvk-wc-page input[type=submit]{
background:#333 !important; color:#fff !important; border:none !important; border-radius:9px !important;
font-weight:700 !important; padding:13px 26px !important; font-family:inherit !important; box-shadow:none !important; text-shadow:none !important; }
.lvk-wc-page .button:hover, .lvk-wc-page button:hover{ background:#000 !important; }
.lvk-wc-page .checkout-button, .lvk-wc-page #place_order, .lvk-wc-page .wc-proceed-to-checkout .button{
background:var(--lvk-red) !important; font-size:16px !important; width:100%; }
.lvk-wc-page .checkout-button:hover, .lvk-wc-page #place_order:hover{ background:#a00000 !important; }
.lvk-wc-page table.shop_table{ border:1px solid #ececec; border-radius:14px; border-collapse:separate; overflow:hidden; }
.lvk-wc-page table.shop_table th{ background:#f7f7f7; color:#333; font-size:13px; padding:14px; }
.lvk-wc-page table.shop_table td{ padding:16px 14px; border-top:1px solid #efefef; }
.lvk-wc-page .product-thumbnail img{ width:56px; border-radius:4px; }
.lvk-wc-page .cart_totals{ border:1px solid #ececec; border-radius:14px; padding:20px; }
.lvk-wc-page .amount{ color:var(--lvk-red); font-weight:700; }
.lvk-wc-page input[type=text], .lvk-wc-page input[type=email], .lvk-wc-page input[type=tel],
.lvk-wc-page input[type=password], .lvk-wc-page textarea, .lvk-wc-page select, .lvk-wc-page .select2-selection{
border:1.5px solid rgba(0,0,0,.15) !important; border-radius:9px !important; min-height:46px; padding:0 14px; font-family:inherit; }
.lvk-wc-page #customer_details{ gap:30px; }
.lvk-wc-page #payment{ background:#f7f7f7; border-radius:14px; }
.lvk-wc-page .woocommerce-order{ text-align:center; }
.lvk-wc-page .woocommerce-thankyou-order-received{ font-size:26px; font-weight:700; color:#1f8a5b; }
.lvk-wc-page .woocommerce-MyAccount-navigation ul{ list-style:none; padding:0; margin:0; border:1px solid #ececec; border-radius:14px; overflow:hidden; }
.lvk-wc-page .woocommerce-MyAccount-navigation li a{ display:block; padding:13px 18px; border-bottom:1px solid #efefef; color:#333; font-weight:500; }
.lvk-wc-page .woocommerce-MyAccount-navigation li.is-active a{ background:#fff6f6; color:var(--lvk-red); font-weight:700; }
.lvk-wc-page .woocommerce-form-login, .lvk-wc-page .woocommerce-form-register{ border:0; border-radius:0; padding:0; }
/* ---------- SHOP / ARCHIVE ---------- */
.lvk-shop-head{ background:#f2f2f2; border-bottom:1px solid #e9e9e9; }
.lvk-shop-head .lvk-wide{ padding:26px 0; }
.lvk-shop-title{ font-size:30px; font-weight:700; color:#111; margin-top:8px; }
.lvk-shop-sub{ font-size:13.5px; color:#888; margin-top:4px; }
.lvk-shop{ display:flex; gap:34px; align-items:flex-start; padding:30px 0 60px; }
.lvk-shop-side{ flex:none; width:248px; position:sticky; top:130px; }
.lvk-filter-box{ border:1px solid #ececec; border-radius:14px; padding:22px; margin-bottom:18px; }
.lvk-filter-h{ font-size:15px; font-weight:700; color:#111; margin-bottom:14px; }
.lvk-filter-row{ display:flex; align-items:center; gap:10px; padding:7px 0; }
.lvk-filter-row .lbl{ font-size:13.5px; color:#444; font-weight:500; flex:1; }
.lvk-filter-row .cnt{ font-size:12px; color:#bbb; }
.lvk-filter-row:hover .lbl{ color:var(--lvk-red); }
.lvk-filter-row.on .lbl{ color:var(--lvk-red); font-weight:700; }
.lvk-filter-clear{ display:block; margin-top:16px; text-align:center; font-size:13px; color:var(--lvk-red); font-weight:600; }
.lvk-shop-main{ flex:1; min-width:0; }
.lvk-shop-bar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; gap:12px; flex-wrap:wrap; }
.lvk-shop-bar .cnt{ font-size:14px; color:#777; }
.lvk-shop-bar .cnt b{ color:#222; }
.lvk-shop-bar .sorts{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.lvk-shop-bar .sorts .lbl{ font-size:13px; color:#888; }
.lvk-shop-bar .sort{ font-size:13px; font-weight:500; color:#666; border:1.5px solid #dddddd; border-radius:20px; padding:6px 14px; }
.lvk-shop-bar .sort.on{ font-weight:700; color:var(--lvk-red); border-color:var(--lvk-red); }
.lvk-shop-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px 22px; }
.lvk-shop-card{ min-width:0; }
.lvk-shop-card .cover{ display:block; }
.lvk-shop-card .t{ font-size:14px; font-weight:600; color:#111; margin-top:12px; line-height:1.32; height:37px; overflow:hidden; }
.lvk-shop-card .sub{ min-height:32px; margin-top:3px; font-size:12px; line-height:1.35; color:#666; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.lvk-shop-card .a{ font-size:12px; color:#999; margin-top:3px; }
.lvk-shop-card .price{ display:flex; align-items:baseline; gap:8px; margin-top:7px; }
.lvk-shop-card .price .now, .lvk-shop-card .price .now .amount{ font-size:17px; font-weight:700; color:var(--lvk-red); }
.lvk-shop-card .price .was, .lvk-shop-card .price .was .amount{ font-size:12px; color:#bbb; text-decoration:line-through; }
.lvk-shop-card .formats{ font-size:11px; color:#777; margin-top:4px; }
.lvk-pagination{ display:flex; justify-content:center; gap:8px; margin-top:44px; }
.lvk-pagination .page-numbers{ min-width:40px; height:40px; border:1.5px solid #dddddd; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:14px; color:#444; padding:0 6px; }
.lvk-pagination .page-numbers.current{ background:var(--lvk-red); color:#fff; border-color:var(--lvk-red); font-weight:600; }
.lvk-noresults{ text-align:center; padding:70px 0; color:#999; }
.lvk-noresults .h{ font-size:22px; color:#444; }
/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
.lvk-shop-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:820px){
.lvk-shop{ flex-direction:column; }
.lvk-shop-side{ position:static; width:100%; display:flex; gap:16px; flex-wrap:wrap; }
.lvk-filter-box{ flex:1; min-width:200px; }
.lvk-shop-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:980px){
.lvk-product-grid{ flex-direction:column; }
.lvk-product-cover, .lvk-product-buy{ position:static; width:100%; max-width:340px; }
.lvk-related-row{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1024px){
.lvk-hero-title{ font-size:38px; }
.lvk-hero-covers{ display:none; }
.lvk-feature{ flex-direction:column; align-items:flex-start; }
}
@media (max-width:768px){
.lvk-header-main{ flex-wrap:wrap; gap:14px; }
.lvk-search{ order:3; flex-basis:100%; }
.lvk-menu-row{ gap:16px; overflow-x:auto; }
.lvk-banner-dark, .lvk-cta{ flex-direction:column; align-items:flex-start; }
.lvk-cta-form input{ width:200px; }
.lvk-hero-title{ font-size:30px; }
}
/* ===========================================================================
* HIỆU ỨNG TƯƠNG TÁC (hover/transition) — bám sát style-hover của Claude Design
* ========================================================================= */
/* Header: nút Tạo tài khoản / Tài khoản */
.lvk-account .btn{ border:2px solid var(--lvk-red); transition:background .18s ease, color .18s ease, border-color .18s ease; }
.lvk-account .btn:hover{ background:#fff; color:var(--lvk-red); border-color:var(--lvk-red); }
/* Header: ô tìm kiếm sáng viền đỏ khi focus */
.lvk-search{ transition:border-color .18s ease, box-shadow .18s ease; }
.lvk-search:focus-within{ border-color:var(--lvk-red); box-shadow:0 0 0 3px rgba(191,0,0,.08); }
/* Header: icon Yêu thích / Giỏ hàng */
.lvk-iconlink{ transition:transform .12s ease; }
.lvk-iconlink:hover span:not(.lvk-badge-count){ color:var(--lvk-red); }
.lvk-iconlink:hover svg{ stroke:var(--lvk-red); }
/* Menu + topbar + footer link: chuyển màu mượt */
.lvk-menu-row a, .lvk-topbar-links a, .lvk-footer-col .links a{ transition:color .15s ease; }
/* Nút điều hướng carousel */
.lvk-nav button{ transition:border-color .15s ease, background .15s ease, color .15s ease; }
.lvk-nav button:hover{ border-color:var(--lvk-red); background:#fdf5f5; }
.lvk-nav button:hover svg{ stroke:var(--lvk-red); }
/* Trang sản phẩm — buy box */
.lvk-readbtn{ transition:border-color .18s ease, color .18s ease, background .18s ease; }
.lvk-readbtn:hover{ border-color:var(--lvk-red); color:var(--lvk-red); background:#fdf5f5; }
.lvk-format{ transition:border-color .15s ease, background .15s ease; }
.lvk-format:not(.on):hover{ border-color:#c7c7c7; background:#fafafa; }
.lvk-qty button{ transition:background .15s ease; }
.lvk-qty button:hover{ background:#f2f2f2; }
/* Nút nền ĐẶC → hover đảo thành đường viền (line), giữ nguyên màu chủ đạo */
.lvk-add{ transition:background .18s ease, color .18s ease, border-color .18s ease; }
.lvk-add:hover{ background:#fff; color:#333; border-color:#333; transform:none; box-shadow:none; }
.lvk-add:hover svg{ stroke:#333; }
.lvk-buy{ border:2px solid var(--lvk-red); transition:background .18s ease, color .18s ease, border-color .18s ease; }
.lvk-buy:hover{ background:#fff; color:var(--lvk-red); border-color:var(--lvk-red); transform:none; box-shadow:none; }
.lvk-wishbtn{ transition:background .18s ease, color .18s ease; }
.lvk-wishbtn:hover{ background:#f7f2f2; }
/* Thẻ sản phẩm/sách liên quan: nhấc nhẹ khi hover */
.lvk-related-card, .lvk-shop-card .cover, .lvk-product-card{ transition:transform .15s ease, box-shadow .15s ease; }
.lvk-related-card:hover, .lvk-shop-card:hover .cover{ transform:translateY(-3px); }
.lvk-related-card:hover .lvk-cover, .lvk-shop-card:hover .lvk-cover{ box-shadow:0 14px 30px rgba(0,0,0,.16); }
.lvk-related-card .lvk-cover, .lvk-shop-card .lvk-cover{ transition:box-shadow .18s ease; }
/* Nút đỏ nằm TRÊN NỀN MÀU KHÁC (thẻ xám/đen/đỏ) → hover SÁNG hơn kiểu Kobo,
* giữ nền đỏ + chữ trắng (không đảo trắng để khỏi chìm vào nền). */
.lvk-btn-red, .lvk-cta-form .lvk-btn, .lvk-blog-news .lvk-btn, .lvk-banner-dark .lvk-btn, .lvk-help-hero .box button{
color:#fff;
transition:background-image .18s ease, box-shadow .18s ease, transform .12s ease;
}
.lvk-btn-red:hover, .lvk-cta-form .lvk-btn:hover, .lvk-blog-news .lvk-btn:hover, .lvk-banner-dark .lvk-btn:hover, .lvk-help-hero .box button:hover{
background-image:linear-gradient(0deg, rgba(255,255,255,.16), rgba(255,255,255,.16));
color:#fff;
transform:translateY(-1px);
}
/* Nút viền sẵn (outline) giữ kiểu line khi hover */
.lvk-btn-outline{ transition:background .18s ease, color .18s ease, border-color .18s ease; }
.lvk-btn-outline:hover{ border-color:var(--lvk-red); color:var(--lvk-red); background:#fdf5f5; }
/* Hero: nút trắng & ghost nhấc nhẹ (không phải nền đặc màu) */
.lvk-btn-white, .lvk-btn-ghost{ transition:transform .12s ease, box-shadow .18s ease, background .18s ease; }
.lvk-btn-white:hover{ box-shadow:0 8px 20px rgba(0,0,0,.18); transform:translateY(-1px); }
.lvk-btn-ghost:hover{ background:rgba(255,255,255,.16); }
/* WooCommerce (cart/checkout/account): nút nền đặc → hover line */
.lvk-wc-page .button, .lvk-wc-page button, .lvk-wc-page input[type=submit]{ border:2px solid #333 !important; transition:background .18s ease, color .18s ease, border-color .18s ease !important; }
.lvk-wc-page .button:hover, .lvk-wc-page button:hover, .lvk-wc-page input[type=submit]:hover{ background:#fff !important; color:#333 !important; border-color:#333 !important; }
.lvk-wc-page .checkout-button, .lvk-wc-page #place_order, .lvk-wc-page .wc-proceed-to-checkout .button{ border-color:var(--lvk-red) !important; }
.lvk-wc-page .checkout-button:hover, .lvk-wc-page #place_order:hover, .lvk-wc-page .wc-proceed-to-checkout .button:hover{ background:#fff !important; color:var(--lvk-red) !important; border-color:var(--lvk-red) !important; }
/* ===== FIX: màu chữ nút phải THẮNG .lvk-site a{color:inherit} =====
* (.lvk-site a có specificity cao hơn .lvk-btn-* nên đè màu → ép bằng !important) */
.lvk-btn-white{ color:var(--lvk-red) !important; }
.lvk-btn-ghost{ color:#fff !important; }
.lvk-btn-red{ color:#fff !important; }
.lvk-btn-outline{ color:#444 !important; }
.lvk-btn-outline:hover{ color:var(--lvk-red) !important; }
/* Hover sách ở trang chủ (carousel) — giống hover trang danh mục */
.lvk-bookcard .lvk-bookcard-cover{ transition:transform .15s ease; }
.lvk-bookcard .lvk-cover{ transition:box-shadow .15s ease; }
.lvk-bookcard:hover .lvk-bookcard-cover{ transform:translateY(-3px); }
.lvk-bookcard:hover .lvk-cover{ box-shadow:0 14px 30px rgba(0,0,0,.16); }
/* ============ GIỎ HÀNG TUỲ BIẾN (Cart.dc.html) ============ */
.lvk-cart-bg{ background:#fff; }
.lvk-cart-page{ padding:36px 0 60px; }
.lvk-cart-title{ font-size:32px; font-weight:700; color:#111; margin:0 0 6px; }
.lvk-cart-count{ font-size:14px; color:#888; margin-bottom:24px; }
.lvk-cart-count b{ color:var(--lvk-red); }
.lvk-cart-grid{ display:flex; gap:28px; align-items:flex-start; }
.lvk-cart-items{ flex:1; background:#fff; border-radius:14px; border:1px solid #ececec; overflow:hidden; }
.lvk-cart-thead{ display:flex; padding:14px 24px; border-bottom:1px solid #ececec; font-size:12px; font-weight:600; color:#999; letter-spacing:.04em; }
.lvk-cart-thead .c-prod, .lvk-cart-row .c-prod{ flex:1; }
.lvk-cart-thead .c-price, .lvk-cart-row .c-price{ width:120px; text-align:center; }
.lvk-cart-thead .c-qty, .lvk-cart-row .c-qty{ width:130px; display:flex; justify-content:center; }
.lvk-cart-thead .c-line, .lvk-cart-row .c-line{ width:120px; text-align:right; }
.lvk-cart-thead .c-rm, .lvk-cart-row .c-rm{ width:40px; text-align:right; }
.lvk-cart-row{ display:flex; align-items:center; padding:20px 24px; border-top:1px solid #f0f0f0; }
.lvk-cart-row .c-prod{ display:flex; gap:16px; align-items:center; min-width:0; }
.lvk-cart-row .meta{ min-width:0; }
.lvk-cart-row .meta .t{ font-size:15px; font-weight:600; color:#111; line-height:1.35; display:block; }
.lvk-cart-row .meta .a{ font-size:12.5px; color:#999; margin-top:3px; }
.lvk-cart-row .fmt-pill{ display:inline-block; margin-top:7px; font-size:11px; font-weight:600; color:var(--lvk-red); background:#fde8e8; padding:3px 9px; border-radius:5px; }
.lvk-cart-row .c-price, .lvk-cart-row .c-price .amount{ font-size:14px; color:#555; font-weight:400; }
.lvk-cart-row .c-line, .lvk-cart-row .c-line .amount{ font-size:15px; font-weight:700; color:var(--lvk-red); }
.lvk-qtybox{ display:inline-flex; align-items:center; width:max-content; border:1.5px solid #dddddd; border-radius:8px; overflow:hidden; background:#fff; }
.lvk-qtybox button{ width:34px !important; min-width:0 !important; height:36px !important; flex:none; border:none !important; margin:0 !important; padding:0 !important; background:#fff; cursor:pointer; color:#666; font-size:18px; line-height:1; box-shadow:none !important; border-radius:0; }
.lvk-qtybox button:hover{ background:#f4f4f4; }
.lvk-qtybox .qty{ width:40px !important; min-width:0 !important; max-width:40px; flex:none; height:36px !important; min-height:0 !important; line-height:36px; text-align:center; border:none !important; margin:0 !important; padding:0 !important; font-size:14px; font-weight:600; color:#222; background:transparent !important; box-shadow:none !important; border-radius:0; -moz-appearance:textfield; }
.lvk-qtybox .qty::-webkit-outer-spin-button, .lvk-qtybox .qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.lvk-cart-row .digital{ font-size:13px; color:#999; }
.lvk-cart-row .rm{ display:inline-flex; }
.lvk-cart-summary{ flex:none; width:340px; position:sticky; top:24px; }
.lvk-cart-summary .card{ background:#fff; border-radius:14px; border:1px solid #ececec; padding:24px; }
.lvk-cart-summary>.card>.h{ font-size:17px; font-weight:700; color:#111; margin-bottom:18px; }
.lvk-cart-summary .row{ display:flex; flex-wrap:nowrap; justify-content:space-between; align-items:baseline; font-size:14px; color:#555; margin-bottom:12px; }
.lvk-cart-summary .row::before, .lvk-cart-summary .row::after{ content:none !important; display:none !important; } /* huỷ pseudo clearfix của .row (Flatsome) làm lệch giá trị */
.lvk-cart-summary .row .v, .lvk-cart-summary .row .v .amount{ font-weight:600; color:#222; }
.lvk-cart-summary .coupon{ display:flex; gap:8px; margin:16px 0; }
.lvk-cart-summary .coupon input{ flex:1; border:1.5px solid #dddddd !important; border-radius:8px; height:42px; padding:0 14px; font-size:13px; outline:none; font-family:inherit; box-shadow:none !important; }
.lvk-cart-summary .coupon button{ background:#111; color:#fff; font-size:13px; font-weight:600; padding:0 18px; height:42px; border:none; border-radius:8px; cursor:pointer; }
.lvk-cart-summary .coupon button:hover{ background:#000; }
.lvk-cart-summary .total{ border-top:1px solid #eee; padding-top:16px; display:flex; justify-content:space-between; align-items:baseline; }
.lvk-cart-summary .total > span:first-child{ font-size:15px; font-weight:600; color:#111; }
.lvk-cart-summary .total .big, .lvk-cart-summary .total .big .amount{ font-size:26px; font-weight:700; color:var(--lvk-red); }
.lvk-cart-checkout{ display:flex; align-items:center; justify-content:center; background:var(--lvk-red); color:#fff !important; font-weight:700; font-size:15px; height:52px; border-radius:9px; margin-top:18px; }
.lvk-cart-checkout:hover{ background:#a30000; }
.lvk-cart-summary .note{ font-size:12px; color:#999; text-align:center; margin-top:12px; line-height:1.6; }
.lvk-cart-empty{ background:#fff; border-radius:14px; border:1px solid #ececec; padding:70px; text-align:center; }
.lvk-cart-empty .ic{ width:90px; height:90px; border-radius:50%; background:#f2f2f2; display:flex; align-items:center; justify-content:center; margin:0 auto 22px; }
.lvk-cart-empty .h{ font-size:24px; font-weight:700; color:#111; }
.lvk-cart-empty .s{ font-size:14px; color:#888; margin-top:8px; }
.lvk-cart-cta{ display:inline-block; background:var(--lvk-red); color:#fff !important; font-weight:700; font-size:14px; padding:14px 30px; border-radius:9px; margin-top:24px; }
.lvk-cart-cta:hover{ background:#a30000; }
@media(max-width:820px){ .lvk-cart-grid{ flex-direction:column; } .lvk-cart-summary{ width:100%; position:static; } }
/* Thu gọn giới thiệu sách (Product) */
.lvk-product-descbox{ position:relative; overflow:hidden; transition:max-height .3s ease; }
.lvk-product-descbox[data-collapsed="1"]{ max-height:210px; }
.lvk-product-descbox[data-collapsed="0"]{ max-height:3000px; }
.lvk-desc-fade{ position:absolute; left:0; right:0; bottom:0; height:64px; background:linear-gradient(transparent,#fff); pointer-events:none; }
.lvk-product-descbox[data-collapsed="0"] .lvk-desc-fade{ display:none; }
.lvk-desc-toggle{ display:inline-flex; align-items:center; gap:6px; margin-top:8px; color:var(--lvk-red); font-weight:600; font-size:14px; cursor:pointer; background:none; border:none; padding:0; font-family:inherit; }
.lvk-desc-toggle svg{ transition:transform .2s; }
.lvk-desc-toggle.open svg{ transform:rotate(180deg); }
/* Shop — chế độ xem Danh sách (list) + toggle */
.lvk-viewtoggle{ display:inline-flex; gap:4px; margin-left:8px; }
.lvk-viewtoggle a{ width:32px; height:32px; display:flex; align-items:center; justify-content:center; border-radius:7px; color:#bbb; border:1.5px solid #dddddd; }
.lvk-viewtoggle a.on{ color:var(--lvk-red); border-color:var(--lvk-red); background:#fdf5f5; }
.lvk-shop-list{ display:flex; flex-direction:column; gap:16px; }
.lvk-listcard{ border:1px solid #ececec; border-radius:14px; padding:20px; background:#fff; transition:box-shadow .15s; }
.lvk-listcard:hover{ box-shadow:0 8px 24px rgba(0,0,0,.08); }
.lvk-listcard-main{ display:flex; gap:24px; }
.lvk-listcard .lc-cover{ flex:none; display:block; }
.lvk-listcard .lvk-cover{ width:173px !important; height:260px !important; flex:none; border-radius:4px; }
.lvk-listcard .body{ flex:1; min-width:0; display:flex; flex-direction:column; }
.lvk-listcard .g{ font-size:11px; letter-spacing:.14em; color:#666; font-weight:600; text-transform:uppercase; }
.lvk-listcard .t{ font-size:21px; font-weight:700; color:#111 !important; margin-top:6px; line-height:1.25; display:block; text-decoration:none; }
.lvk-listcard .sub{ font-size:14px; color:#555; line-height:1.45; margin-top:4px; }
.lvk-listcard .a{ font-size:13px; color:#999; margin-top:5px; }
.lvk-listcard .lvk-stars{ margin-top:8px; }
.lvk-listcard .price{ display:flex; align-items:baseline; gap:12px; margin-top:14px; flex-wrap:wrap; }
.lvk-listcard .price .now, .lvk-listcard .price .now .amount{ font-size:18px; font-weight:700; color:var(--lvk-red); }
.lvk-listcard .price .was, .lvk-listcard .price .was .amount{ font-size:13px; color:#bbb; text-decoration:line-through; }
.lvk-listcard .price .fm{ font-size:12px; color:#777; }
/* Mô tả sổ xuống (Xem mô tả / Ẩn mô tả) */
.lvk-listcard .intro{ font-size:13.5px; color:#555; line-height:1.65; margin-top:12px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.lvk-listcard-syn{ border-top:1px solid #eeeeee; margin-top:16px; display:none; }
.lvk-syn-toggle{ width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; background:none; border:none; padding:13px 0 0; cursor:pointer; font-family:inherit; font-size:14px; font-weight:600; color:#444; text-transform:none !important; letter-spacing:normal !important; }
.lvk-syn-toggle .chev{ flex:none; color:#999; transition:transform .22s ease; }
.lvk-listcard.syn-open .lvk-syn-toggle .chev{ transform:rotate(180deg); }
.lvk-syn-body{ display:none; font-size:13.5px; color:#555; line-height:1.7; padding-top:10px; }
.lvk-listcard.syn-open .lvk-syn-body{ display:block; }
.lvk-syn-body .more{ color:var(--lvk-red) !important; font-weight:600; white-space:nowrap; }
@media(max-width:680px){
.lvk-listcard-main{ gap:14px; }
.lvk-listcard .lvk-cover{ width:108px !important; height:162px !important; }
.lvk-listcard .t{ font-size:17px; }
}
/* Thư viện của tôi (My Library) */
.lvk-lib-h{ font-size:26px; font-weight:700; color:#111; margin:0 0 18px; }
/* "Sách của tôi" chia 2 khu vực: Ebook / Sách nói */
.lvk-lib-sec{ margin:0 0 34px; }
.lvk-lib-sec-h{ font-size:18px; font-weight:700; color:#111; margin:0 0 16px; display:flex; align-items:center; gap:9px; }
.lvk-lib-sec-h .cnt{ font-size:12.5px; font-weight:700; color:#777; background:#f0f0f0; border-radius:20px; padding:1px 10px; }
.lvk-lib-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr)); gap:32px 24px; align-items:stretch; }
.lvk-lib-card{ display:flex; flex-direction:column; min-width:0; height:100%; }
/* Khung bìa theo tỉ lệ 2:3 (aspect-ratio đặt inline trên .lvk-cover) — bỏ cao
cố định 236px + fit contain cũ vốn gây vệt trắng 2 bên, đồng nhất trang chủ. */
.lvk-lib-card .cover{ display:block; position:relative; }
.lvk-lib-card .cover .lvk-cover{ box-shadow:0 8px 20px rgba(0,0,0,.22); }
/* Badge định dạng (Ebook / Sách nói) — phân biệt rõ trên mỗi thẻ */
.lvk-lib-card .lib-fmt{ position:absolute; top:6px; left:6px; z-index:6; font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:3px 8px; border-radius:6px; background:rgba(17,17,17,.82); color:#fff; }
.lvk-lib-card .lib-fmt.is-audio{ background:rgba(191,0,0,.92); }
.lvk-lib-card .status{ font-size:11px; letter-spacing:.08em; color:#888; font-weight:600; text-transform:uppercase; margin-top:12px; }
.lvk-lib-card .t{ font-size:15px; font-weight:700; color:#111; margin-top:6px; line-height:1.3; display:block; min-width:0; overflow-wrap:anywhere; word-break:break-word; }
.lvk-lib-card .sub{ min-height:36px; font-size:13px; color:#666; line-height:1.4; margin-top:5px; margin-bottom:14px; min-width:0; overflow-wrap:anywhere; }
.lvk-lib-card .btn{ margin-top:auto; margin-bottom:0; border:1.5px solid #333; color:#111 !important; font-weight:600; font-size:13px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:2px; transition:background .15s,color .15s; }
.lvk-lib-card .btn:hover{ background:#111; color:#fff !important; }
.lvk-lib-empty{ background:#fff; border:1px solid #ececec; border-radius:14px; padding:60px; text-align:center; }
.lvk-lib-empty .h{ font-size:20px; font-weight:700; color:#444; }
.lvk-lib-empty .s{ font-size:14px; color:#999; margin-top:6px; }
@media(max-width:768px){ .lvk-lib-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
/* Tài khoản: banner full + sidebar nav trái + nội dung phải (My Library.dc.html) */
/* Layout 2 cột (sidebar + nội dung) CHỈ khi ĐÃ đăng nhập — tránh áp lên trang
đăng nhập/đăng ký (logged-out) làm vỡ khung .lvk-auth-wrap (panel xám lệch). */
body.logged-in.woocommerce-account .lvk-wc-page .woocommerce{ display:flex; flex-wrap:wrap; gap:0 30px; align-items:flex-start; }
body.woocommerce-account .lvk-profile-banner{ width:100%; }
body.woocommerce-account .woocommerce-MyAccount-navigation{ width:240px; flex:none; background:#fff; border:1px solid #ececec; border-radius:14px; padding:12px; }
body.woocommerce-account .woocommerce-MyAccount-content{ flex:1; min-width:0; }
body.woocommerce-account .woocommerce-MyAccount-navigation ul{ border:none; }
body.woocommerce-account .woocommerce-MyAccount-navigation li a{ border-radius:10px; border-bottom:none; }
body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{ background:var(--lvk-red); color:#fff; }
/* ============ CHECKOUT TUỲ BIẾN (Checkout.dc.html) ============ */
body.woocommerce-checkout .lvk-site{ background:#f2f2f2; }
body.woocommerce-checkout .lvk-wc-page{ padding:36px 0 60px; }
.lvk-checkout-title{ font-size:32px; font-weight:700; color:#111; margin:0 0 24px; }
.lvk-checkout-grid{ display:flex; gap:28px; align-items:flex-start; }
.lvk-checkout-left{ flex:1; min-width:0; }
.lvk-checkout-right{ flex:none; width:380px; position:sticky; top:24px; }
.lvk-co-card{ background:#fff; border-radius:14px; border:1px solid #ececec; padding:28px; margin-bottom:20px; }
.lvk-checkout-right .lvk-co-card{ padding:24px; margin-bottom:0; }
.lvk-co-h{ font-size:17px; font-weight:700; color:#111; margin-bottom:18px; }
/* Fields */
.lvk-co-fields{ display:flex; flex-wrap:wrap; gap:14px; }
.lvk-co-fields .form-row{ margin:0; padding:0; width:100%; }
.lvk-co-fields .form-row-first, .lvk-co-fields .form-row-last{ width:calc(50% - 7px); }
.lvk-co-fields .lvk-hidden{ display:none !important; }
.lvk-co-fields label{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.lvk-co-fields .required{ display:none; }
.lvk-co-fields input, .lvk-co-fields select, .lvk-co-fields textarea, .lvk-co-fields .select2-selection{ border:1.5px solid #dddddd !important; border-radius:9px !important; height:48px !important; min-height:48px; padding:0 16px !important; font-size:14px; width:100%; background:#fff !important; box-shadow:none !important; color:#333; font-family:inherit; }
.lvk-co-fields textarea{ height:84px !important; padding:12px 16px !important; resize:none; }
.lvk-co-fields input:focus, .lvk-co-fields select:focus, .lvk-co-fields textarea:focus{ border-color:var(--lvk-red) !important; }
.lvk-co-fields .select2-container .select2-selection--single{ display:flex; align-items:center; }
.lvk-co-fields .select2-container--default .select2-selection--single .select2-selection__arrow{ height:46px; }
/* Combobox "gõ để tìm" cho Tỉnh/Thành phố + Phường/Xã (lvk-address.js) */
.lvk-cb{ position:relative; width:100%; }
.lvk-cb-input{ width:100%; cursor:text; background-image:url("data:image/svg+xml;utf8,"); background-repeat:no-repeat; background-position:right 14px center; padding-right:38px !important; }
/* Ngoài checkout (trang tài khoản) chưa có .lvk-co-fields → cấp style nền cho input */
.lvk-cb-input{ border:1.5px solid #ddd; border-radius:9px; height:48px; padding:0 38px 0 16px; font-size:14px; color:#333; background-color:#fff; font-family:inherit; box-sizing:border-box; }
.lvk-cb-input:focus{ border-color:var(--lvk-red); outline:none; }
.lvk-cb-list{ display:none; position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:60; max-height:280px; overflow-y:auto; background:#fff; border:1px solid #e0e0e0; border-radius:10px; box-shadow:0 12px 30px rgba(0,0,0,.14); padding:6px; }
.lvk-cb-list.open{ display:block; }
.lvk-cb-item{ padding:10px 12px; border-radius:7px; font-size:14px; color:#222; cursor:pointer; line-height:1.3; }
.lvk-cb-item:hover{ background:#fbeaea; color:var(--lvk-red); }
.lvk-cb-empty{ padding:10px 12px; font-size:13px; color:#999; }
/* Trên checkout, rule `.lvk-co-fields input` (!important) đè nền/padding → khôi phục mũi tên + chừa chỗ cho combobox */
.lvk-co-fields .lvk-cb-input{ background-image:url("data:image/svg+xml;utf8,") !important; background-repeat:no-repeat !important; background-position:right 14px center !important; padding-right:40px !important; }
/* Payment methods → thẻ */
.lvk-payment .payment_methods{ list-style:none; margin:0; padding:0; }
.lvk-payment .wc_payment_method{ border:1.5px solid #e2e2e2; background:#fff; border-radius:11px; padding:16px 18px; margin-bottom:12px; list-style:none; }
.lvk-payment .wc_payment_method > label{ display:flex; align-items:center; gap:14px; cursor:pointer; font-size:14.5px; font-weight:600; color:#222; margin:0 !important; }
.lvk-payment .wc_payment_method > label img{ display:none; }
.lvk-payment .wc_payment_method input[type=radio]{ width:20px; height:20px; accent-color:var(--lvk-red); flex:none; margin:0; }
.lvk-payment .wc_payment_method:has(input:checked){ border-color:var(--lvk-red); background:#fff6f6; }
.lvk-payment .payment_box{ font-size:12.5px; color:#888; margin:10px 0 0 34px !important; padding:0 !important; background:none !important; line-height:1.6; }
.lvk-payment .payment_box:before{ display:none !important; }
/* Tóm tắt đơn */
.lvk-co-item{ display:flex; gap:12px; align-items:center; margin-bottom:16px; }
.lvk-co-item .cover{ position:relative; flex:none; }
.lvk-co-item .cover .lvk-cover{ width:46px; height:69px; }
.lvk-co-item .cover .q{ position:absolute; top:-7px; right:-7px; background:var(--lvk-red); color:#fff; font-size:10px; font-weight:700; width:19px; height:19px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.lvk-co-item .meta{ flex:1; min-width:0; }
.lvk-co-item .meta .t{ font-size:13px; font-weight:600; color:#222; line-height:1.3; }
.lvk-co-item .meta .f{ font-size:11.5px; color:var(--lvk-red); margin-top:3px; }
.lvk-co-item .lt, .lvk-co-item .lt .amount{ font-size:13.5px; font-weight:600; color:#333; }
.lvk-co-totals{ border-top:1px solid #eee; padding-top:16px; margin-top:6px; }
.lvk-co-totals .row{ display:flex; justify-content:space-between; font-size:14px; color:#555; margin-bottom:10px; }
.lvk-co-totals .row .v, .lvk-co-totals .row .v .amount{ color:#222; }
.lvk-co-totals .grand{ display:flex; justify-content:space-between; align-items:baseline; border-top:1px solid #eee; padding-top:14px; margin-top:6px; }
.lvk-co-totals .grand > span:first-child{ font-size:15px; font-weight:600; color:#111; }
.lvk-co-totals .grand .big, .lvk-co-totals .grand .big .amount{ font-size:25px; font-weight:700; color:var(--lvk-red); }
.lvk-place-order{ display:flex !important; align-items:center; justify-content:center; width:100%; background:var(--lvk-red) !important; color:#fff !important; font-weight:700 !important; font-size:15px !important; height:54px !important; border-radius:9px !important; border:none !important; margin-top:18px !important; cursor:pointer; box-shadow:none !important; }
.lvk-place-order:hover{ background:#a30000 !important; }
.lvk-co-terms{ font-size:12px; color:#999; text-align:center; margin-top:12px; line-height:1.6; }
@media(max-width:860px){ .lvk-checkout-grid{ flex-direction:column; } .lvk-checkout-right{ width:100%; position:static; } }
/* Checkout: ẩn coupon toggle (thiết kế không có; mã giảm giá ở trang giỏ) */
body.woocommerce-checkout .woocommerce-form-coupon-toggle, body.woocommerce-checkout form.checkout_coupon{ display:none !important; }
body.woocommerce-checkout .woocommerce-notices-wrapper:empty{ display:none; }
/* FIX checkout: 2 field cùng hàng (space-between + 48.5%, tránh khít 100% bị wrap) */
.lvk-co-fields{ justify-content:space-between; gap:0; row-gap:14px; }
.lvk-co-fields .form-row{ float:none !important; clear:none !important; }
.lvk-co-fields .form-row-first, .lvk-co-fields .form-row-last{ width:48.5% !important; }
.lvk-co-fields .form-row-wide{ width:100% !important; }
/* FIX: #customer_details (id) bị Flatsome ép column → ép lại row bằng specificity id+class */
#customer_details.lvk-co-fields{ display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; justify-content:space-between; align-items:flex-start; row-gap:14px; column-gap:0; }
#customer_details.lvk-co-fields .form-row-first, #customer_details.lvk-co-fields .form-row-last{ width:48.5% !important; float:none !important; }
#customer_details.lvk-co-fields .form-row-wide, #customer_details.lvk-co-fields .notes{ width:100% !important; }
/* TÀI KHOẢN → Sửa địa chỉ: form gọn 2 cột (dùng .lvk-co-fields như checkout) */
.lvk-edit-address{ max-width:640px; }
.lvk-edit-address .lvk-lib-h{ font-size:22px; margin:0 0 18px; }
.lvk-edit-address .woocommerce-address-fields__field-wrapper{ margin:0; }
.lvk-edit-address-actions{ margin:22px 0 0; }
.lvk-edit-address-actions .lvk-btn-red{ display:inline-block; border:none; cursor:pointer; }
.lvk-same-billing{ display:flex; align-items:center; gap:9px; font-size:14px; color:#333; font-weight:500; margin:0 0 16px; cursor:pointer; }
.lvk-same-billing input[type=checkbox]{ width:18px; height:18px; accent-color:var(--lvk-red); margin:0; cursor:pointer; flex:none; }
/* FIX phương thức thanh toán: radio trái căn giữa + tiêu đề/note bên phải, note LUÔN hiện */
.lvk-payment .wc_payment_method{ display:grid !important; grid-template-columns:auto 1fr; align-items:center; column-gap:14px; row-gap:3px; border:1.5px solid #e2e2e2; background:#fff; border-radius:11px; padding:16px 18px; margin-bottom:12px; list-style:none; }
.lvk-payment .wc_payment_method input[type=radio]{ grid-column:1; grid-row:1 / span 2; align-self:center; width:20px; height:20px; accent-color:var(--lvk-red); margin:0; }
.lvk-payment .wc_payment_method > label{ grid-column:2; grid-row:1; font-size:14.5px !important; font-weight:600 !important; color:#222 !important; margin:0 !important; padding:0 !important; cursor:pointer; display:block; }
.lvk-payment .wc_payment_method > label img, .lvk-payment .wc_payment_method > label .about_paypal{ display:none; }
.lvk-payment .wc_payment_method .payment_box{ grid-column:2; grid-row:2; display:block !important; font-size:12.5px; color:#999; margin:0 !important; padding:0 !important; background:none !important; line-height:1.5; }
.lvk-payment .wc_payment_method .payment_box p{ margin:0; padding:0; }
.lvk-payment .wc_payment_method .payment_box:before{ display:none !important; }
.lvk-payment .wc_payment_method:has(input:checked){ border-color:var(--lvk-red); background:#fff6f6; }
.lvk-payment .wc_payment_method.lvk-pay-soon{ opacity:.7; }
.lvk-payment .wc_payment_method.lvk-pay-soon input{ cursor:not-allowed; }
/* cache-bust 2a370a95 */
/* cb e1438cda */
/* cb ea3f69d5 */
/* cb 0c5f2346 */
/* cb 97553a97 */
/* ============ Thanh độ mạnh mật khẩu đăng ký (LVK) ============ */
.woocommerce-password-strength, .woocommerce-password-hint{ display:none !important; }
.lvk-pwmeter{ margin:6px 0 4px; }
.lvk-pw-bar{ display:flex; gap:6px; }
.lvk-pw-bar .seg{ flex:1; height:6px; border-radius:99px; background:#e2e2e2; transition:background .15s; }
.lvk-pwmeter[data-s="weak"] .seg.on{ background:#bf0000; }
.lvk-pwmeter[data-s="mid"] .seg.on{ background:#cf8a00; }
.lvk-pwmeter[data-s="strong"] .seg.on{ background:#1f8a5b; }
.lvk-pw-lbl{ font-size:13px; font-weight:600; margin-top:7px; color:#888; }
.lvk-pwmeter[data-s="weak"] .lvk-pw-lbl{ color:#bf0000; }
.lvk-pwmeter[data-s="mid"] .lvk-pw-lbl{ color:#cf8a00; }
.lvk-pwmeter[data-s="strong"] .lvk-pw-lbl{ color:#1f8a5b; }
.lvk-pw-msg{ margin-top:10px; padding:10px 13px; border-radius:9px; font-size:13px; line-height:1.55; }
.lvk-pw-msg.bad{ background:#fdecec; color:#a11; }
.lvk-pw-msg.good{ background:#e9f7f0; color:#177a4e; }
.lvk-pw-msg b{ font-weight:700; }
.lvk-pw-rules{ display:grid; gap:7px; margin-top:11px; }
.lvk-pw-rules .rl{ display:flex; align-items:center; gap:9px; font-size:13px; color:#777; }
.lvk-pw-rules .rl i{ width:18px; height:18px; flex:none; border-radius:50%; border:1.5px solid #d2d2d2; display:flex; align-items:center; justify-content:center; font-style:normal; font-size:11px; color:transparent; }
.lvk-pw-rules .rl.ok{ color:#222; }
.lvk-pw-rules .rl.ok i{ border-color:#1f8a5b; background:#1f8a5b; color:#fff; }
.lvk-pw-rules .rl.ok i:before{ content:"✓"; }
button.lvk-pw-block{ background:#c7c7c7 !important; cursor:not-allowed !important; opacity:1 !important; }
/* ============ Nút hiện/ẩn mật khẩu: icon mắt trần, không nền đen ============
Áp cho cả form đăng nhập (.woocommerce-form) LẪN form sửa tài khoản
(.woocommerce-EditAccountForm — class này KHÔNG có .woocommerce-form, nên nếu
chỉ nhắm .woocommerce-form thì nút .show-password-input ở trang đổi mật khẩu
sẽ rơi vào style nút đen .lvk-wc-page button → ô vuông đen lệch). */
.woocommerce-form .password-input,
.woocommerce-EditAccountForm .password-input{ position:relative; display:block; }
.woocommerce-form .password-input > input,
.woocommerce-EditAccountForm .password-input > input{ padding-right:44px !important; }
.woocommerce-form .show-password-input,
.woocommerce-EditAccountForm .show-password-input{
position:absolute !important; right:14px; top:50%; transform:translateY(-50%);
width:24px !important; min-width:0 !important; height:24px !important; min-height:0 !important;
padding:0 !important; margin:0 !important; background:transparent !important;
border:none !important; box-shadow:none !important; line-height:1; cursor:pointer;
display:flex; align-items:center; justify-content:center;
}
.woocommerce-form .show-password-input:hover,
.woocommerce-EditAccountForm .show-password-input:hover{ background:transparent !important; }
.woocommerce-form .show-password-input::after,
.woocommerce-EditAccountForm .show-password-input::after{ color:#8a8a8a !important; font-size:18px !important; }
.woocommerce-form .show-password-input.display-password::after,
.woocommerce-EditAccountForm .show-password-input.display-password::after{ color:#bf0000 !important; }
/* Ẩn nút hiện mật khẩu mặc định của trình duyệt (Edge/IE) — tránh 2 con mắt */
.woocommerce-form input[type=password]::-ms-reveal,
.woocommerce-form input[type=password]::-ms-clear,
.woocommerce-EditAccountForm input[type=password]::-ms-reveal,
.woocommerce-EditAccountForm input[type=password]::-ms-clear{ display:none !important; width:0; height:0; }
/* Đổi icon con mắt theme sang kiểu NÉT MẢNH (outline) giống nút native, chạy mọi trình duyệt */
.woocommerce-form .show-password-input::after,
.woocommerce-EditAccountForm .show-password-input::after{
content:"" !important; width:22px; height:22px; font-size:0 !important;
background-repeat:no-repeat; background-position:center; background-size:22px 22px;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}
.woocommerce-form .show-password-input.display-password::after,
.woocommerce-EditAccountForm .show-password-input.display-password::after{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23bf0000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18'/%3E%3Cpath d='M10.6 10.6a3 3 0 0 0 4.2 4.2'/%3E%3Cpath d='M9.9 4.24A9.1 9.1 0 0 1 12 4c6.5 0 10 7 10 7a13.2 13.2 0 0 1-2.2 3M6.1 6.1A13.3 13.3 0 0 0 2 11s3.5 7 10 7a9.7 9.7 0 0 0 4-.8'/%3E%3C/svg%3E");
}
/* Canh giữa icon con mắt: đưa margin của input ra ngoài wrapper để wrapper = đúng chiều cao ô */
.woocommerce-form .password-input > input,
.woocommerce-EditAccountForm .password-input > input{ margin-bottom:0 !important; }
.woocommerce-form .password-input,
.woocommerce-EditAccountForm .password-input{ margin-bottom:16px; }
/* ===========================================================================
* RESPONSIVE — Header mobile (hamburger + drawer), footer, polish
* ========================================================================= */
.lvk-burger{ display:none; }
.lvk-drawer{ display:none; }
.lvk-drawer-overlay{ display:none; }
/* QUAN TRỌNG: media query mobile bên dưới đặt display:block cho overlay, sẽ ĐÈ
* style [hidden] mặc định của trình duyệt → lớp phủ trong suốt (opacity:0,
* z-index:1290) phủ kín màn hình và NUỐT MỌI CÚ CHẠM trên mobile (burger, menu,
* carousel... đều không bấm được). Selector này (đặc hiệu cao hơn) đảm bảo
* overlay thật sự ẩn khi drawer đóng. */
.lvk-drawer-overlay[hidden]{ display:none !important; }
@media (max-width:900px){
.lvk-topbar{ display:none; }
.lvk-header-main{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 14px; padding:11px 0; }
.lvk-burger{ display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; width:40px; height:40px; background:none; border:none; padding:0; cursor:pointer; flex:none; }
.lvk-burger span{ display:block; width:23px; height:2px; background:#222; border-radius:2px; transition:.2s; }
.lvk-logo{ gap:9px; margin-right:auto; }
.lvk-logo-icon{ width:40px !important; height:40px !important; }
.lvk-logo-sub{ display:none; }
.lvk-logo-name{ font-size:21px !important; }
.lvk-actions{ gap:18px; }
.lvk-iconlink > span:not(.lvk-badge-count){ display:none; }
.lvk-iconlink svg{ width:25px; height:25px; }
.lvk-account{ display:none; }
.lvk-search{ flex-basis:100%; order:5; margin:0; max-width:none; }
.lvk-menu{ display:none; }
.lvk-drawer{ display:flex; flex-direction:column; position:fixed; top:0; left:0; height:100%; width:320px; max-width:87vw; background:#fff; z-index:1300; transform:translateX(-100%); transition:transform .26s ease; overflow-y:auto; -webkit-overflow-scrolling:touch; box-shadow:2px 0 24px rgba(0,0,0,.14); }
.lvk-drawer.open{ transform:translateX(0); }
.lvk-drawer-overlay{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1290; opacity:0; transition:opacity .26s ease; }
.lvk-drawer-overlay.show{ opacity:1; }
body.lvk-noscroll{ overflow:hidden; }
.lvk-drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:18px 20px; border-bottom:1px solid #eee; }
.lvk-drawer-head span{ font-size:20px; font-weight:700; color:#111; }
.lvk-drawer-close{ background:none; border:none; font-size:21px; line-height:1; color:#444; cursor:pointer; padding:4px 6px; }
.lvk-drawer-search{ display:flex; align-items:center; margin:14px 18px 4px; border:1.5px solid #dddddd; border-radius:9px; overflow:hidden; }
.lvk-drawer-search input{ flex:1; border:none !important; height:42px; padding:0 14px !important; font-size:14px; background:none !important; outline:none; box-shadow:none !important; }
.lvk-drawer-search button{ background:none; border:none; padding:0 12px; cursor:pointer; display:flex; align-items:center; }
.lvk-drawer-nav{ padding:6px 0 36px; }
.lvk-drawer-nav > a{ display:flex; align-items:center; justify-content:space-between; padding:13px 20px; font-size:15px; color:#222; font-weight:500; border-bottom:1px solid #f2f2f2; text-decoration:none; }
.lvk-drawer-nav > a.promo{ color:var(--lvk-red); }
.lvk-drawer-nav > a.acc{ flex-direction:column; align-items:flex-start; gap:2px; background:#fff6f6; border-bottom:1px solid #f0dede; }
.lvk-drawer-nav > a.acc b{ font-size:15px; color:var(--lvk-red); font-weight:700; }
.lvk-drawer-nav > a.acc i{ font-size:12px; color:#888; font-style:normal; }
.lvk-drawer-h{ font-size:12px; text-transform:uppercase; letter-spacing:.09em; color:#999; padding:18px 20px 6px; font-weight:600; }
.lvk-drawer-nav > a.sub{ padding:10px 20px; font-size:14px; font-weight:400; color:#555; border-bottom:1px solid #f5f5f5; }
.lvk-drawer-nav > a.sub span{ font-size:12px; color:#b3b3b3; }
.lvk-drawer-sep{ height:1px; background:#ececec; margin:14px 20px; }
.lvk-drawer-hotline{ display:block; padding:12px 20px 0; font-size:13px; color:#888; }
}
@media (max-width:768px){
.lvk-footer-top{ flex-direction:column; gap:30px; }
.lvk-footer-bottom{ flex-direction:column; align-items:center; gap:10px; text-align:center; }
.lvk-footer-links{ justify-content:center; }
}
@media (max-width:560px){
.lvk-shop-grid{ grid-template-columns:repeat(2,1fr) !important; gap:14px; }
.lvk-lib-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
.lvk-related-row{ grid-template-columns:repeat(2,1fr) !important; }
.lvk-blog-grid{ grid-template-columns:1fr !important; }
.lvk-wish-grid{ grid-template-columns:repeat(2,1fr) !important; }
.lvk-hero-title{ font-size:26px !important; }
.lvk-section-title{ font-size:21px !important; }
}
/* ===========================================================================
* DRAWER — menu con dạng panel trượt (tham khảo Kobo)
* ========================================================================= */
@media (max-width:900px){
.lvk-drawer{ overflow:hidden; }
.lvk-dpanel{ position:absolute; inset:0; display:flex; flex-direction:column; background:#fff; transform:translateX(100%); transition:transform .27s ease; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.lvk-dpanel-main{ transform:translateX(0); }
.lvk-dpanel.is-active{ transform:translateX(0); }
.lvk-dpanel .lvk-drawer-head{ flex:none; }
.lvk-drawer-nav > .lvk-dsub-open{ display:flex; align-items:center; justify-content:space-between; width:100%; padding:13px 20px; font-size:15px; font-weight:500; color:#222; background:none; border:none; border-bottom:1px solid #f2f2f2; cursor:pointer; text-align:left; font-family:inherit; }
.lvk-drawer-nav > .lvk-dsub-open .chev{ flex:none; }
.lvk-dback{ background:none; border:none; padding:2px 8px 2px 0; cursor:pointer; display:flex; align-items:center; }
.lvk-dpills{ display:flex; flex-wrap:wrap; gap:9px; padding:16px 18px 8px; }
.lvk-dpills a{ display:inline-block; padding:9px 16px; background:#efefef; border-radius:99px; font-size:13.5px; color:#333; text-decoration:none; }
.lvk-dpills a:active{ background:#e3e3e3; }
.lvk-drawer-nav > a.allcats{ color:var(--lvk-red); font-weight:700; }
}
@media (max-width:900px){
.lvk-dpanel .lvk-drawer-nav{ flex:none; }
}
/* DANH MỤC SÁCH / SÁCH NÓI là