/*
Theme Name: 1991files
Theme URI: https://1991files.com/
Author: Vo Vinh Lac
Author URI: https://vovinhlac.com/
Description: International WordPress marketplace theme for the 1991files digital resource platform
Version: 1.2.3
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: larxvo
*/
/* ===== RESET & BASE ===== */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* v74: blog single article layout inspired by compact commerce editorial pages */
.lv-blog-detail-page.lv-blog-detail-page-v16{
background:#fff!important;
color:#111827!important;
padding:18px 0 54px!important;
}
.lv-blog-detail-page-v16 .lv-blog-detail-shell{
width:min(1120px, calc(100% - 32px))!important;
max-width:1120px!important;
margin:0 auto!important;
padding:0!important;
}
.lv-blog-detail-page-v16 .lv-blog-breadcrumb{
display:flex!important;
align-items:center!important;
gap:8px!important;
margin:12px 0 14px!important;
color:#7a8599!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-blog-breadcrumb a{
color:#2563eb!important;
font-weight:400!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-blog-single-nav{
display:flex!important;
align-items:center!important;
gap:10px!important;
overflow-x:auto!important;
scrollbar-width:none!important;
margin:0 0 18px!important;
padding:8px 0 10px!important;
border-top:1px solid #eef2f7!important;
border-bottom:1px solid #eef2f7!important;
}
.lv-blog-detail-page-v16 .lv-blog-single-nav::-webkit-scrollbar{
display:none!important;
}
.lv-blog-detail-page-v16 .lv-blog-single-nav a{
flex:0 0 auto!important;
display:inline-flex!important;
align-items:center!important;
gap:7px!important;
min-height:30px!important;
padding:0 12px!important;
border-radius:999px!important;
color:#4b5563!important;
background:transparent!important;
font-size:13px!important;
font-weight:400!important;
text-decoration:none!important;
white-space:nowrap!important;
}
.lv-blog-detail-page-v16 .lv-blog-single-nav a:hover,
.lv-blog-detail-page-v16 .lv-blog-single-nav a.is-active{
color:#ef233c!important;
background:#fff1f2!important;
}
.lv-blog-detail-page-v16 .lv-post-hero{
display:grid!important;
grid-template-columns:minmax(0, 520px) minmax(0, 1fr)!important;
gap:26px!important;
align-items:center!important;
width:min(920px, 100%)!important;
margin:0 auto 30px!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page-v16 .lv-post-hero-media{
height:auto!important;
aspect-ratio:16/9!important;
border-radius:10px!important;
overflow:hidden!important;
background:#f3f6fb!important;
box-shadow:0 12px 30px rgba(15,23,42,.08)!important;
}
.lv-blog-detail-page-v16 .lv-post-hero-media img{
display:block!important;
width:100%!important;
height:100%!important;
object-fit:cover!important;
}
.lv-blog-detail-page-v16 .lv-post-hero-placeholder{
display:grid!important;
place-items:center!important;
width:100%!important;
height:100%!important;
color:#9aa6b8!important;
font-size:42px!important;
}
.lv-blog-detail-page-v16 .lv-post-title-card{
padding:0!important;
background:transparent!important;
border:0!important;
border-radius:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page-v16 .lv-post-kicker-row,
.lv-blog-detail-page-v16 .lv-post-meta,
.lv-blog-detail-page-v16 .lv-post-share-row{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:9px!important;
}
.lv-blog-detail-page-v16 .lv-post-kicker-row{
margin-bottom:8px!important;
color:#6b7280!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-cat{
display:inline-flex!important;
align-items:center!important;
min-height:24px!important;
padding:0 10px!important;
border-radius:999px!important;
color:#ef233c!important;
background:#fff1f2!important;
font-size:12px!important;
font-weight:500!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-post-title-card h1{
margin:0!important;
color:#121826!important;
font-size:34px!important;
line-height:1.16!important;
letter-spacing:0!important;
font-weight:700!important;
}
.lv-blog-detail-page-v16 .lv-post-excerpt{
margin:12px 0 14px!important;
color:#4b5563!important;
font-size:15px!important;
line-height:1.62!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-meta{
color:#667085!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-meta img{
width:36px!important;
height:36px!important;
border-radius:50%!important;
}
.lv-blog-detail-page-v16 .lv-post-share-row{
margin-top:14px!important;
color:#7b8495!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-share-row a,
.lv-blog-detail-page-v16 .lv-post-share-row button{
display:inline-grid!important;
place-items:center!important;
width:30px!important;
height:30px!important;
padding:0!important;
border:1px solid #e5eaf2!important;
border-radius:50%!important;
background:#fff!important;
color:#2563eb!important;
box-shadow:0 6px 16px rgba(15,23,42,.06)!important;
cursor:pointer!important;
}
.lv-blog-detail-page-v16 .lv-post-share-row button.is-copied{
color:#16a34a!important;
border-color:#bbf7d0!important;
background:#f0fdf4!important;
}
.lv-blog-detail-page-v16 .lv-post-reader-grid{
display:grid!important;
grid-template-columns:180px minmax(0, 650px)!important;
justify-content:center!important;
align-items:start!important;
gap:24px!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card{
position:sticky!important;
top:104px!important;
width:180px!important;
padding:10px!important;
border:1px solid #edf0f5!important;
border-radius:10px!important;
background:#f8fafc!important;
box-shadow:0 10px 26px rgba(15,23,42,.06)!important;
}
.admin-bar .lv-blog-detail-page-v16 .lv-post-toc-card{
top:136px!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-tabs{
display:grid!important;
grid-template-columns:1fr 1fr!important;
margin-bottom:8px!important;
overflow:hidden!important;
border-radius:8px!important;
background:#fff!important;
border:1px solid #e5eaf2!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-tabs span{
display:grid!important;
place-items:center!important;
min-height:30px!important;
color:#6b7280!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-tabs span.is-active{
color:#fff!important;
background:#ef233c!important;
font-weight:500!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card nav{
display:flex!important;
flex-direction:column!important;
gap:2px!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card nav a{
display:block!important;
padding:8px 9px!important;
border-radius:7px!important;
color:#475569!important;
font-size:12.5px!important;
line-height:1.35!important;
font-weight:400!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card nav a.is-sub{
padding-left:18px!important;
color:#64748b!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card nav a:hover{
color:#ef233c!important;
background:#fff!important;
}
.lv-blog-detail-page-v16 .lv-post-article{
width:100%!important;
max-width:650px!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page-v16 .lv-post-content{
width:100%!important;
color:#1f2937!important;
font-size:16px!important;
line-height:1.78!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-content > *{
max-width:100%!important;
}
.lv-blog-detail-page-v16 .lv-post-content p{
margin:0 0 17px!important;
color:#1f2937!important;
font-size:16px!important;
line-height:1.78!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-content h2{
margin:28px 0 12px!important;
color:#111827!important;
font-size:22px!important;
line-height:1.32!important;
font-weight:600!important;
}
.lv-blog-detail-page-v16 .lv-post-content h3{
margin:24px 0 10px!important;
color:#111827!important;
font-size:18px!important;
line-height:1.38!important;
font-weight:600!important;
}
.lv-blog-detail-page-v16 .lv-post-content a{
color:#2563eb!important;
font-weight:500!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-post-content img,
.lv-blog-detail-page-v16 .lv-post-content figure img{
display:block!important;
width:100%!important;
max-width:100%!important;
height:auto!important;
margin:18px auto!important;
border-radius:9px!important;
}
.lv-blog-detail-page-v16 .lv-post-content figcaption,
.lv-blog-detail-page-v16 .wp-caption-text{
margin:-8px 0 18px!important;
color:#667085!important;
text-align:center!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-end-card{
display:grid!important;
gap:16px!important;
margin:28px 0 0!important;
padding:16px!important;
border:1px solid #eef2f7!important;
border-radius:12px!important;
background:#fbfdff!important;
}
.lv-blog-detail-page-v16 .lv-post-end-tags{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:8px!important;
}
.lv-blog-detail-page-v16 .lv-post-end-tags span{
color:#6b7280!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-end-tags a{
display:inline-flex!important;
align-items:center!important;
min-height:26px!important;
padding:0 10px!important;
border-radius:999px!important;
color:#475569!important;
background:#f1f5f9!important;
font-size:13px!important;
font-weight:400!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-box{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:16px!important;
padding:0!important;
border:0!important;
background:transparent!important;
box-shadow:none!important;
text-align:left!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-copy{
display:grid!important;
gap:3px!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-copy strong{
color:#111827!important;
font-size:14px!important;
font-weight:500!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-copy small{
color:#7b8495!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-stars{
display:flex!important;
gap:4px!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-stars button{
width:26px!important;
height:26px!important;
padding:0!important;
border:0!important;
background:transparent!important;
color:#d0d7e2!important;
font-size:22px!important;
line-height:1!important;
cursor:pointer!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-stars button.is-active,
.lv-blog-detail-page-v16 .lv-post-rating-stars button:hover{
color:#f59e0b!important;
}
.lv-blog-detail-page-v16 .lv-post-rating-message{
grid-column:1 / -1!important;
color:#16a34a!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-blog-detail-page-v16 .lv-post-comments,
.lv-blog-detail-page-v16 .lv-post-related-below{
width:min(1040px, 100%)!important;
margin:34px auto 0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page-v16 .lv-post-comments .lv-comments-area{
max-width:650px!important;
margin:0 auto!important;
}
.lv-blog-detail-page-v16 .lv-section-title-row{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:16px!important;
margin-bottom:14px!important;
}
.lv-blog-detail-page-v16 .lv-section-title-row h2{
margin:0!important;
color:#111827!important;
font-size:22px!important;
line-height:1.3!important;
font-weight:600!important;
}
.lv-blog-detail-page-v16 .lv-section-title-row a{
color:#64748b!important;
font-size:13px!important;
font-weight:400!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-post-related-grid{
display:grid!important;
grid-template-columns:repeat(5, minmax(0, 1fr))!important;
gap:16px!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card{
display:block!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
color:#111827!important;
text-decoration:none!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card > span{
display:block!important;
width:100%!important;
aspect-ratio:16/10!important;
overflow:hidden!important;
border-radius:8px!important;
background:#f1f5f9!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
margin:0!important;
border-radius:0!important;
transition:transform .18s ease!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card:hover img{
transform:scale(1.035)!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card strong{
display:-webkit-box!important;
-webkit-line-clamp:2!important;
-webkit-box-orient:vertical!important;
overflow:hidden!important;
margin:9px 0 4px!important;
color:#111827!important;
font-size:13px!important;
line-height:1.35!important;
font-weight:500!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card small{
color:#7b8495!important;
font-size:12px!important;
font-weight:400!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16{
background:#070d1a!important;
color:#e6edf9!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-blog-single-nav,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-end-card{
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-blog-single-nav a,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-blog-breadcrumb,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-kicker-row,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-meta,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-excerpt,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-content p{
color:#a8b4c7!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-blog-single-nav a:hover,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-blog-single-nav a.is-active,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-cat{
color:#ff8a98!important;
background:rgba(239,35,60,.14)!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-title-card h1,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-content,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-content h2,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-content h3,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-section-title-row h2,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-related-card strong,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-rating-copy strong{
color:#eef5ff!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-toc-card,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-end-card{
background:rgba(15,23,42,.78)!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-toc-tabs,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-share-row a,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-share-row button{
background:rgba(30,41,59,.86)!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-toc-card nav a,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-end-tags span,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-rating-copy small,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-related-card small{
color:#a8b4c7!important;
}
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-toc-card nav a:hover,
html.lv-theme-dark .lv-blog-detail-page-v16 .lv-post-end-tags a{
background:rgba(30,41,59,.8)!important;
color:#dce8ff!important;
}
@media (max-width:1100px){
.lv-blog-detail-page-v16 .lv-post-reader-grid{
grid-template-columns:minmax(0, 650px)!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card{
position:relative!important;
top:auto!important;
width:100%!important;
max-width:650px!important;
margin:0 auto 18px!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card nav{
display:grid!important;
grid-template-columns:repeat(2, minmax(0, 1fr))!important;
gap:4px!important;
}
}
@media (max-width:900px){
.lv-blog-detail-page-v16 .lv-post-hero{
grid-template-columns:1fr!important;
width:min(650px, 100%)!important;
gap:16px!important;
}
.lv-blog-detail-page-v16 .lv-post-title-card h1{
font-size:28px!important;
}
.lv-blog-detail-page-v16 .lv-post-related-grid{
grid-template-columns:repeat(3, minmax(0, 1fr))!important;
}
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16{
padding:12px 0 36px!important;
}
.lv-blog-detail-page-v16 .lv-blog-detail-shell{
width:calc(100% - 24px)!important;
}
.lv-blog-detail-page-v16 .lv-blog-breadcrumb{
margin-top:8px!important;
overflow-x:auto!important;
white-space:nowrap!important;
}
.lv-blog-detail-page-v16 .lv-blog-single-nav{
margin-bottom:14px!important;
}
.lv-blog-detail-page-v16 .lv-post-title-card h1{
font-size:25px!important;
}
.lv-blog-detail-page-v16 .lv-post-content,
.lv-blog-detail-page-v16 .lv-post-content p{
font-size:15px!important;
line-height:1.72!important;
}
.lv-blog-detail-page-v16 .lv-post-content h2{
font-size:20px!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-card nav{
grid-template-columns:1fr!important;
}
.lv-blog-detail-page-v16 .lv-post-end-card,
.lv-blog-detail-page-v16 .lv-post-rating-box{
display:grid!important;
}
.lv-blog-detail-page-v16 .lv-post-related-grid{
grid-template-columns:repeat(2, minmax(0, 1fr))!important;
gap:14px!important;
}
.lv-blog-detail-page-v16 .lv-post-related-card strong{
font-size:12.5px!important;
}
}
:root {
--color-primary: #ffa727;
--color-primary-hover: #ffa727;
--color-secondary: #ffc176;
--color-danger: #e74c3c;
--color-text: #1f222d;
--color-text-light: #e8f0ff;
--color-border: #e5e7eb;
--color-bg: #ffffff;
--color-bg-light: #f9fafb;
--color-top: #f8faff;
--spacing-xs: 0.5rem;
--spacing-sm: 1rem;
--spacing-md: 1.5rem;
--spacing-lg: 2rem;
--spacing-xl: 3rem;
}
body {
background: var(--color-bg);
color: var(--color-text);
font-family: 'Be Vietnam Pro';
font-size: 16px;
line-height: 1.6;
margin: 0;
padding: 0;
}
a {
color: var(--color-text);
text-decoration: none;
transition: color 0.3s ease;
}
a:hover {
color: var(--color-primary);
}
img {
max-width: 100%;
height: auto;
display: block;
}
button {
cursor: pointer;
border: none;
font-family: inherit;
transition: all 0.3s ease;
}
input, textarea, select {
font-family: inherit;
font-size: inherit;
}
ul {
list-style: none;
}
/* Comment List - Remove all markers */
.comment-list,
.comment-list * {
list-style: none !important;
list-style-type: none !important;
}
.comment-list li::marker,
.comment-list li::before,
.comment-list ol li::marker,
.comment-list ol li::before,
.comment-list ul li::marker,
.comment-list ul li::before {
display: none !important;
content: '' !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
font-size: 0 !important;
opacity: 0 !important;
}
ol.comment-list,
ul.comment-list {
list-style: none !important;
padding-left: 0 !important;
}
ol.comment-list li,
ul.comment-list li {
list-style: none !important;
list-style-type: none !important;
}
/* ===== LAYOUT ===== */
.container {
width: 100%;
max-width: 100%;
margin: 0 auto;
padding: 0 var(--spacing-md);
}
.site-wrapper {
min-height: 100vh;
display: flex;
flex-direction: column;
}
.site-main {
flex: 1;
padding-top: 168px; /* Space for top menu + header */
}
/* ===== TOP MENU ===== */
.top-menu {
background: var(--color-top);
color: #fff;
font-size: 0.85rem;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1001;
border-bottom: 1px solid #edf1fa;
}
/* Admin Bar Adjustment for Top Menu */
.admin-bar .top-menu {
top: 32px;
}
@media screen and (max-width: 782px) {
.admin-bar .top-menu {
top: 46px;
}
}
@media screen and (max-width: 600px) {
.admin-bar .top-menu {
top: 0;
}
}
.top-menu .container {
max-width: 100%;
padding: 0 var(--spacing-lg);
}
.top-navigation ul {
display: flex;
gap: 10px;
align-items: center;
justify-content: flex-start;
padding: 0.6rem 0;
flex-wrap: wrap;
}
.top-navigation a {
color: #5f6b84;
font-weight: 500;
padding: 0.25rem 0.5rem;
transition: opacity 0.3s;
}
.top-navigation a:hover {
opacity: 0.8;
color:#376fe5;
}
/* ===== HEADER ===== */
.site-header {
border-bottom: 1px solid #e7ebf4;
position: fixed;
top: 41px; /* Below top menu */
left: 0;
right: 0;
z-index: 1000;
box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06) !important;
overflow: visible;
background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
}
/* Admin Bar Adjustment */
.admin-bar .site-header {
top: 70px; /* 32px admin bar + 41px top menu */
}
@media screen and (max-width: 782px) {
.admin-bar .site-header {
top: 84px; /* 46px admin bar + 41px top menu */
}
}
@media screen and (max-width: 600px) {
.admin-bar .site-header {
top: 38px; /* Only top menu on mobile */
}
}
.header-top {
display: flex;
align-items: center;
justify-content: space-between;
padding: var(--spacing-md) 0;
gap: 1rem;
}
.site-logo {
display: flex;
align-items: center;
font-size: 1.5rem;
font-weight: 700;
color: var(--color-primary);
white-space: nowrap;
}
.site-logo img {
max-height: 40px;
width: auto;
}
.secondary-navigation {
display: none;
gap: var(--spacing-md);
flex-shrink: 0;
}
.secondary-navigation ul,
.secondary-navigation .menu {
display: flex;
gap: var(--spacing-md);
align-items: center;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
}
.secondary-navigation li {
display: inline-block;
margin: 0;
padding: 0;
}
.secondary-navigation a {
font-size: 0.95rem;
font-weight: 500;
padding: 0.5rem 0;
display: inline-block;
}
.secondary-navigation a:hover {
color: var(--color-primary);
}
.main-navigation {
display: flex;
gap: var(--spacing-md);
}
.main-navigation ul {
display: flex;
gap: var(--spacing-md);
align-items: center;
flex-wrap: wrap;
}
.main-navigation a {
font-size: 0.95rem;
font-weight: 500;
padding: 0.5rem 0;
}
.main-navigation a:hover {
color: var(--color-primary);
}
.header-search {
flex: 1;
max-width: none;
min-width: 0;
}
.search-form {
position: relative;
width: 100%;
display: flex;
gap: 0.5rem;
align-items: center;
}
.search-type-wrapper {
position: relative;
display: flex;
align-items: center;
}
.search-type-icon {
position: absolute;
left: 0.75rem;
color: var(--color-primary);
pointer-events: none;
z-index: 1;
}
.search-form .search-type-select {
padding: 0.75rem 2.5rem 0.75rem 2.75rem;
border: 1px solid var(--color-border);
border-radius: 8px;
font-size: 0.9rem;
outline: none;
background: #fff url('data:image/svg+xml;utf8,') no-repeat;
background-position: right 0.75rem center;
cursor: pointer;
min-width: 150px;
transition: border-color 0.3s;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
}
.search-form .search-type-select:focus {
border-color: var(--color-primary);
}
/* Custom Dropdown Styles */
.search-type-wrapper.custom-select {
position: relative;
}
.search-type-wrapper.custom-select .search-type-select {
display: none;
}
.custom-select-trigger {
position: relative;
display: flex;
align-items: center;
padding: 0.6075rem 2.5rem 0.6075rem 2.75rem;
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
cursor: pointer;
min-width: 150px;
white-space: nowrap;
transition: all 0.3s ease;
user-select: none;
}
.custom-select-trigger:hover {
border-color: var(--color-primary);
}
.custom-select-trigger.active {
border-color: var(--color-primary);
}
.custom-select-arrow {
position: absolute;
right: 0.75rem;
top: 50%;
transform: translateY(-50%);
width: 12px;
height: 8px;
pointer-events: none;
transition: transform 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.custom-select-arrow svg {
width: 100%;
height: 100%;
display: block;
}
.custom-select-trigger.active .custom-select-arrow {
transform: translateY(-50%) rotate(180deg);
}
.custom-select-options {
position: absolute;
top: calc(100% + 7px);
left: 0;
right: 0;
background: #fff;
border: 1px solid var(--color-border);
border-radius: 0 0 10px 10px;
box-shadow: -1px 15px 20px rgba(0, 0, 0, 0.1);
max-height: 0;
overflow: hidden;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
z-index: 100;
}
.custom-select-options.active {
max-height: 300px;
opacity: 1;
visibility: visible;
overflow-y: auto;
}
.custom-select-option {
padding: 0.75rem 1rem;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
cursor: pointer;
transition: all 0.2s ease;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: relative;
}
.custom-select-option:hover {
background: var(--color-bg-light);
color: var(--color-primary);
}
.custom-select-option.selected {
background: rgba(37, 123, 233, 0.1);
color: var(--color-primary);
font-weight: 600;
}
.search-form label {
position: relative;
flex: 1;
}
.search-form input[type="search"] {
width: 100%;
padding: 0.75rem 3rem 0.75rem 1rem;
border: 1px solid var(--color-border);
border-radius: 8px;
font-size: 0.95rem;
outline: none;
transition: border-color 0.3s;
}
.search-form input[type="search"]:focus {
border-color: var(--color-primary);
}
.search-form button {
position: absolute;
right: 0.5rem;
top: 50%;
transform: translateY(-50%);
background: transparent;
padding: 0.5rem;
color: var(--color-text-light);
border: none;
cursor: pointer;
}
.search-form button svg {
stroke: var(--color-text) !important;
fill: none !important;
}
.search-submit svg {
stroke: var(--color-text) !important;
fill: none !important;
}
/* Search Input Wrapper */
.search-input-wrapper {
position: relative;
flex: 1;
}
/* Search Autocomplete Dropdown */
.search-autocomplete-dropdown {
display: none;
position: absolute;
top: calc(100% + 8px);
left: 0;
right: 0;
background: #fff;
border: none;
border-radius: 8px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
max-height: 500px;
overflow-y: auto;
z-index: 1000;
}
.autocomplete-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.5rem 1rem;
margin-bottom: 0.5rem;
}
.autocomplete-title {
font-size: 0.85rem;
font-weight: 600;
color: var(--color-text);
display: flex;
align-items: center;
gap: 0.5rem;
}
.autocomplete-title svg {
width: 16px;
height: 16px;
opacity: 0.7;
}
.clear-history {
font-size: 0.8rem;
color: var(--color-danger);
background: none;
border: none;
cursor: pointer;
padding: 0.25rem 0.5rem;
border-radius: 4px;
transition: background 0.2s;
}
.clear-history:hover {
background: rgba(231, 76, 60, 0.1);
}
.autocomplete-item {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
cursor: pointer;
transition: background 0.2s;
text-decoration: none;
color: var(--color-text);
}
.autocomplete-item:hover {
background: var(--color-bg-light);
}
.history-item {
font-size: 0.9rem;
}
.history-item svg {
width: 16px;
height: 16px;
color: var(--color-text-light);
flex-shrink: 0;
}
.post-item {
border-bottom: 1px solid var(--color-border);
}
.post-item:last-child {
border-bottom: none;
}
.post-thumb {
width: 60px;
height: 60px;
border-radius: 6px;
overflow: hidden;
flex-shrink: 0;
background: var(--color-bg-light);
display: flex;
align-items: center;
justify-content: center;
}
.post-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
}
.post-thumb.no-thumb {
color: var(--color-text-light);
}
.post-thumb.no-thumb svg {
width: 24px;
height: 24px;
}
.post-info {
flex: 1;
min-width: 0;
}
.post-title {
font-size: 0.9rem;
font-weight: 600;
color: var(--color-text);
margin-bottom: 0.25rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.post-meta {
display: flex;
gap: 0.5rem;
font-size: 0.75rem;
color: var(--color-text-light);
}
.meta-item {
padding: 0.2rem 0.5rem;
background: var(--color-bg-light);
color: var(--color-primary);
border-radius: 4px;
}
/* Tag items in autocomplete */
.tag-item {
border-bottom: 1px solid var(--color-border);
}
.tag-item:last-child {
border-bottom: none;
}
.tag-item svg {
width: 18px;
height: 18px;
color: var(--color-primary);
flex-shrink: 0;
}
.tag-item .tag-info {
flex: 1;
min-width: 0;
}
.tag-item .tag-name {
display: block;
font-size: 0.9rem;
font-weight: 600;
color: var(--color-text);
margin-bottom: 0.2rem;
}
.tag-item .tag-meta {
display: block;
font-size: 0.75rem;
color: var(--color-text-light);
}
.tag-item:hover {
background: linear-gradient(135deg, rgba(47, 132, 245, 0.05) 0%, rgba(39, 82, 174, 0.05) 100%);
}
.tag-item:hover .tag-name {
color: var(--color-primary);
}
.autocomplete-view-all {
display: block;
text-align: center;
background: var(--color-bg-light);
color: var(--color-primary);
font-size: 0.9rem;
font-weight: 600;
text-decoration: none;
border-top: 1px solid var(--color-border);
transition: background 0.2s;
}
.autocomplete-view-all:hover {
background: #2a68e9;color: var(--color-text-light);
}
.autocomplete-loading,
.autocomplete-empty,
.autocomplete-error {
padding: 2rem 1rem;
text-align: center;
color: var(--color-text-light);
font-size: 0.9rem;
}
.autocomplete-error {
color: var(--color-danger);
}
.header-actions {
display: flex;
gap: var(--spacing-sm);
align-items: center;
flex-shrink: 0;
margin-left: 0.5rem;
}
/* Hide mobile-only elements on desktop */
.mobile-menu-header,
.mobile-menu-close,
.search-toggle-btn {
display: none;
}
/* Mobile menu toggle - show by default */
.mobile-menu-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.5rem;
background: none;
border: none;
cursor: pointer;
margin-left: 0px;
height: 40px;
width: 40px;
border-radius: 8px;
}
.mobile-menu-toggle svg {
width: 24px;
height: 24px;
stroke: var(--color-text);
}
/* Hide mobile menu toggle on desktop */
@media (min-width: 769px) {
.mobile-menu-toggle {
display: none !important;
}
}
.btn {
padding: 0.625rem 1.25rem;
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
white-space: nowrap;
transition: all 0.3s;
}
.btn-primary {
background: linear-gradient(45deg, #4ba9f9 0%, #2a68e9 50%, #0e5bfb 100%) !important;
color: #fff;
box-shadow: 0 8px 18px rgba(0, 55, 200, 0.24) !important;display: flex;
}
.btn-primary:hover {
background: linear-gradient(90deg, #2398fb 0%, #0858ff 50%, #2d70f9 100%) !important;
color: #fff;
transform: translateY(-1px);
}
.btn-outline {
background: transparent;
border: 1px solid var(--color-border);
color: var(--color-text);
display: inline-flex;
align-items: center;
gap: 0.5rem;
}
.btn-outline:hover {
border-color: var(--color-primary);
color: var(--color-primary);
}
.btn-outline svg {
flex-shrink: 0;
}
.user-account-btn {
display: inline-flex;
align-items: center;
gap: 0.5rem;
height: 44px;
padding: 0.5rem 0.75rem;
border-radius: 8px;
}
.user-account-btn:hover {
color:#2a68e9;
}
/* Avatar Styling - Bo tròn tất cả avatar */
.avatar,
img.avatar,
.avatar-32,
.avatar-24,
.avatar-20,
.avatar-18,
.user-avatar-icon {
border-radius: 50% !important;
object-fit: cover;
}
.user-avatar-icon {
width: 35px;
height: 35px;
flex-shrink: 0;
}
.dropdown-arrow {
flex-shrink: 0;
transition: transform 0.3s;
}
.user-account-dropdown {
position: relative;
}
.user-account-dropdown:hover .dropdown-arrow {
transform: rotate(180deg);
}
.account-dropdown-menu {
position: absolute;
top: calc(100% + 0.5rem);
right: 0;
background: #fff;
border-radius: 8px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
min-width: 220px;
padding: 0.5rem 0;
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 1000;
}
.user-account-dropdown:hover .account-dropdown-menu {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.dropdown-item {
display: flex;
align-items: center;
gap: 0.75rem;
padding: 0.75rem 1.25rem;
color: var(--color-text);
font-size: 0.9rem;
transition: all 0.3s;
white-space: nowrap;
}
.dropdown-item:hover {
background: var(--color-bg-light);
color: var(--color-primary);
}
.dropdown-item svg {
flex-shrink: 0;
stroke: currentColor;
}
.dropdown-divider {
height: 1px;
background: var(--color-border);
margin: 0.5rem 0;
}
.dropdown-item.logout {
color: var(--color-danger);
}
.dropdown-item.logout:hover {
background: rgba(231, 76, 60, 0.1);
color: var(--color-danger);
}
/* ===== CATEGORY BAR ===== */
.category-bar {
background: #fff;
border-bottom: 1px solid var(--color-border);
padding: 70px 0;
}
.category-bar .container {
max-width: 1400px;
padding: 0 var(--spacing-lg);
}
.category-tags {
display: flex;
gap: var(--spacing-sm);
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.category-tag {
padding: 0.5rem 1rem;
background: var(--color-bg-light);
border-radius: 20px;
font-size: 0.9rem;
color: var(--color-text);
white-space: nowrap;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
transition: all 0.5s;
display: inline-flex;
align-items: center;
gap: 0.5rem;
height: 36px;
border: none;
}
.category-tag i {
font-size: 0.9rem;
}
.category-tag.has-custom-color {
background: linear-gradient(135deg, var(--cat-bg) 0%, var(--cat-bg-dark) 100%);
color: var(--cat-text);
}
.category-tag:hover {
background: var(--color-primary) !important;
color: #fff !important;
transform: translateY(-2px);
box-shadow: 0 2px 4px rgba(33, 89, 94, 0.3);
}
.category-tag.active {
background: var(--color-primary);
color: #fff;
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(112, 174, 253, 0.4);
font-weight: 600;
}
/* ===== MAIN CONTENT LAYOUT ===== */
.content-layout {
display: grid;
grid-template-columns: 250px 1fr;
gap: 1.5rem;
padding: 1.5rem 0;
max-width: 100%;
}
/* No sidebar layout - full width */
.content-layout.no-sidebar {
grid-template-columns: 1fr;
max-width: 1400px;
margin: 0 auto;
}
.content-layout.no-sidebar .main-content {
max-width: 100%;
}
/* Hide sidebar toggle button on desktop */
.sidebar-toggle-btn {
display: none;
}
/* ===== SIDEBAR ===== */
.sidebar {
position: sticky;
top: 170px; /* Below top menu + header */
height: fit-content;
border-right: 1px solid var(--color-border);
padding-right: var(--spacing-md);
}
/* Hide mobile sidebar header on desktop */
.sidebar-mobile-header {
display: none;
}
/* Hide sidebar overlay on desktop */
.sidebar-overlay {
display: none;
}
.filter-section {
background: #fff;
border: none;
border-radius: 12px;
padding: 0 5px;
margin-bottom: var(--spacing-md);
transition: all 0.3s ease;
}
/* Active filter section - khi Ä‘ang lá»c */
.filter-section[style*="dashed"] {
background: linear-gradient(45deg, #4ba9f9 0%, #2a68e9 50%, #0e5bfb 100%) !important;
border: 2px solid var(--color-primary) !important;
border-style: solid !important;
box-shadow: 0 4px 12px rgba(46, 204, 113, 0.15) !important;
}
.filter-section h3 {
font-size: 0.95rem;
font-weight: 600;
margin-bottom: var(--spacing-sm);
color: var(--color-text);
padding-top: 15px;
}
/* Active filters header */
.filter-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0.75rem;
}
.filter-header h3 {
margin-bottom: 0;
padding-top: 0;
display: flex;
align-items: center;
flex: 1;
}
.filter-header .clear-filters-btn {
background: transparent;
border: none;
color: var(--color-text);
cursor: pointer;
padding: 0.4rem 0.75rem;
display: flex;
align-items: center;
justify-content: center;
border-radius: 6px;
transition: all 0.2s ease;
flex-shrink: 0;
margin: 0;
width: auto;
box-shadow: none;
font-size: 0.85rem;
font-weight: 500;
}
.filter-header .clear-filters-btn:hover {
background: var(--color-danger);
color: #fff;
transform: translateY(-1px);
box-shadow: 0 2px 6px rgba(231, 76, 60, 0.25);
}
.filter-header .clear-filters-btn::before {
display: none;
}
/* Filter tags */
.filter-tag {
display: inline-flex !important;
align-items: center !important;
gap: 0.4rem !important;
padding: 0.45rem 0.85rem !important;
background: #fff !important;
border: 1.5px solid var(--color-border) !important;
border-radius: 20px !important;
font-size: 0.8rem !important;
font-weight: 500 !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
color: var(--color-text) !important;
}
.filter-tag:hover {
background: var(--color-primary) !important;
color: #fff !important;
border-color: var(--color-primary) !important;
transform: translateY(-1px) !important;
box-shadow: 0 3px 10px rgba(35, 81, 233, 0.116) !important;
}
.filter-tag span:last-child {
color: var(--color-text-light) !important;
font-weight: bold !important;
font-size: 1rem !important;
line-height: 1 !important;
transition: all 0.2s ease !important;
}
.filter-tag:hover span:last-child {
color: #fff !important;
transform: scale(1.15) !important;
}
.selected-filters {
display: flex !important;
flex-wrap: wrap !important;
gap: 0.5rem !important;
margin-bottom: 0 !important;
}
.filter-options {
display: flex;
flex-direction: column;
gap: 0.625rem;
}
.filter-option {
display: flex;
align-items: center;
gap: 0.5rem;
}
.filter-option input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 18px;
height: 18px;
border: 2px solid #d1d5db;
border-radius: 4px;
cursor: pointer;
position: relative;
transition: all 0.2s ease;
background-color: #fff;
}
.filter-option input[type="checkbox"]:hover {
border-color: #9ca3af;
}
.filter-option input[type="checkbox"]:checked {
background-color: var(--color-primary);
border-color: var(--color-primary);
}
.filter-option input[type="checkbox"]:checked::after {
content: "✓";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
font-size: 14px;
font-weight: bold;
line-height: 1;
}
.filter-option label {
font-size: 0.9rem;
cursor: pointer;
color: var(--color-text);
}
.color-palette {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 0.5rem;
}
.color-swatch-wrapper {
cursor: pointer;
}
.color-swatch {
width: 100%;
aspect-ratio: 1;
border-radius: 6px;
cursor: pointer;
border: 3px solid transparent;
transition: all 0.2s;
position: relative;
}
.color-swatch:hover {
transform: scale(1.1);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.color-swatch.selected {
transform: scale(1.05);
}
.color-swatch.selected::after {
content: "✓";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
font-weight: bold;
font-size: 1.2em;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}
/* ===== TAGS FILTER CLOUD ===== */
.tags-filter-cloud {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
align-items: center;
}
.tag-filter-item {
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.4rem 0.75rem;
background: #fff;
border: 1.5px solid var(--color-border);
border-radius: 20px;
cursor: pointer;
transition: all 0.25s ease;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
font-weight: 500;
line-height: 1.2;
}
.tag-filter-item:hover {
background: linear-gradient(135deg, var(--color-primary) 0%, #122c79 100%);
border-color: var(--color-primary);
transform: translateY(-1px);
box-shadow: 0 3px 10px rgba(25, 47, 240, 0.137);
}
.tag-filter-item:hover .tag-name,
.tag-filter-item:hover .tag-count {
color: #fff;
}
.tag-filter-item.selected {
background: linear-gradient(135deg, var(--color-primary) 0%, #122c79 100%);
border-color: var(--color-primary);
box-shadow: 0 3px 10px rgba(35, 81, 233, 0.116);
}
.tag-filter-item.selected .tag-name,
.tag-filter-item.selected .tag-count {
color: #fff;
}
.tag-filter-item .tag-name {
color: var(--color-text);
transition: color 0.25s ease;
}
.tag-filter-item .tag-count {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 20px;
height: 20px;
padding: 0 0.35rem;
background: var(--color-bg-light);
border-radius: 10px;
font-size: 0.7rem;
font-weight: 600;
color: var(--color-text-light);
transition: all 0.25s ease;
}
.tag-filter-item:hover .tag-count,
.tag-filter-item.selected .tag-count {
background: rgba(255, 255, 255, 0.25);
color: #fff;
}
.category-list {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.category-item {
padding: 0.5rem;
border-radius: 6px;
font-size: 0.9rem;
transition: background 0.2s;
}
.category-item:hover {
background: var(--color-bg-light);
}
.clear-filters-btn {
width: 100%;
padding: 0.7rem 0.875rem;
background: linear-gradient(135deg, var(--color-danger) 0%, #c0392b 100%);
color: #fff;
border: none;
border-radius: 8px;
font-weight: 600;
font-size: 0.875rem;
cursor: pointer;
margin-bottom: var(--spacing-md);
transition: all 0.3s ease;
box-shadow: 0 2px 6px rgba(231, 76, 60, 0.18);
position: relative;
overflow: hidden;
}
.clear-filters-btn::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.2);
transition: left 0.3s ease;
}
.clear-filters-btn:hover::before {
left: 100%;
}
.clear-filters-btn:hover {
background: linear-gradient(135deg, #c0392b 0%, #a93226 100%);
transform: translateY(-1px);
box-shadow: 0 3px 12px rgba(231, 76, 60, 0.35);
}
/* ===== POST GRID - COLUMN MASONRY LAYOUT ===== */
.posts-grid {
column-count: 6;
column-gap: 1.2rem;
}
/* No posts found message */
.no-posts {
text-align: center;
padding: 3rem 2rem;
background: var(--color-bg-light);
border-radius: 12px;
margin: 2rem 0;
column-span: all;
-webkit-column-span: all;
break-inside: avoid;
}
.no-posts h2 {
font-size: 1.5rem;
color: var(--color-text);
margin-bottom: 0.75rem;
display: block;
}
.no-posts p {
font-size: 1rem;
color: var(--color-text-light);
margin: 0;
display: block;
}
/* Sort Filter */
.sort-filter-wrapper {
display: flex !important;
justify-content: space-between;
align-items: center;
margin-bottom: 1.5rem;
padding: 0 0.5rem;
visibility: visible !important;
opacity: 1 !important;
gap: 1rem;
}
.filter-left-actions {
display: flex;
gap: 0.75rem;
}
.btn-collections {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.625rem 1.25rem;
background: #fff;
border: 1px solid var(--color-border);
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
text-decoration: none;
transition: all 0.3s;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
white-space: nowrap;
}
.btn-collections:hover {
background: var(--color-primary);
color: #fff;
border-color: var(--color-primary);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(21, 129, 218, 0.3);
}
.btn-collections svg {
flex-shrink: 0;
stroke: currentColor;
transition: all 0.3s;
}
.btn-featured {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.625rem 1.25rem;
background: #fff;
border: 1px solid var(--color-border);
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
text-decoration: none;
transition: all 0.3s;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
white-space: nowrap;
}
.btn-featured:hover {
background: var(--color-primary);
color: #fff;
border-color: var(--color-primary);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(21, 129, 218, 0.3);
}
.btn-featured svg {
flex-shrink: 0;
stroke: currentColor;
transition: all 0.3s;
}
.sort-filter {
display: flex !important;
align-items: center;
gap: 0.75rem;
visibility: visible !important;
}
.sort-select {
padding: 0.625rem 2.5rem 0.625rem 1rem;
border: 1px solid var(--color-border);
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
background: #fff url('data:image/svg+xml;utf8,') no-repeat;
background-position: right 0.75rem center;
cursor: pointer !important;
outline: none;
transition: all 0.3s;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
min-width: 160px;
pointer-events: auto !important;
}
.sort-select:hover {
border-color: var(--color-primary);
}
.sort-select:focus {
border-color: var(--color-primary);
box-shadow: 0 8px 18px rgba(0, 55, 200, 0.24) !important;
}
/* Custom Dropdown for Sort Filter */
.sort-filter.custom-select {
position: relative;
}
.sort-filter.custom-select .sort-select {
display: none;
}
.sort-filter .custom-select-trigger {
position: relative;
display: flex;
align-items: center;
padding: 0.625rem 2.5rem 0.625rem 1rem;
border: 1px solid var(--color-border);
border-radius: 8px;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
background: #fff;
cursor: pointer;
min-width: 160px;
white-space: nowrap;
transition: all 0.3s ease;
height: 38px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
user-select: none;
}
.sort-filter .custom-select-trigger:hover {
border-color: var(--color-primary);
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
}
.sort-filter .custom-select-trigger.active {
border-color: var(--color-primary);
box-shadow: 0 8px 18px rgba(0, 55, 200, 0.24) !important;
}
.sort-filter .custom-select-arrow {
position: absolute;
right: 0.75rem;
top: 50%;
transform: translateY(-50%);
width: 12px;
height: 8px;
pointer-events: none;
transition: transform 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
}
.sort-filter .custom-select-arrow svg {
width: 100%;
height: 100%;
display: block;
}
.sort-filter .custom-select-trigger.active .custom-select-arrow {
transform: translateY(-50%) rotate(180deg);
}
.sort-filter .custom-select-options {
position: absolute;
top: calc(100% + 4px);
left: 0;
right: 0;
background: #fff;
border-radius: 8px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
max-height: 0;
overflow: hidden;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
z-index: 100;
}
.sort-filter .custom-select-options.active {
max-height: 300px;
opacity: 1;
visibility: visible;
overflow-y: auto;
}
.sort-filter .custom-select-option {
padding: 0.75rem 1rem;
font-size: 0.9rem;
font-weight: 500;
color: var(--color-text);
cursor: pointer;
transition: all 0.2s ease;
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: relative;
}
.sort-filter .custom-select-option:hover {
background: var(--color-bg-light);
color: var(--color-primary);
}
.sort-filter .custom-select-option.selected {
background: rgba(37, 123, 233, 0.1);
color: var(--color-primary);
font-weight: 600;
}
@media (max-width: 1800px) {
.posts-grid {
column-count: 6;
}
}
@media (max-width: 1600px) {
.posts-grid {
column-count: 5;
}
}
@media (max-width: 1200px) {
.posts-grid {
column-count: 4;
}
}
@media (max-width: 1024px) {
.posts-grid {
column-count: 3;
}
}
@media (max-width: 768px) {
.posts-grid {
column-count: 2;
column-gap: 0.5rem;
}
/* Sort filter wrapper - Keep on same row on mobile */
.sort-filter-wrapper {
flex-direction: row;
align-items: center;
gap: 0.75rem;
flex-wrap: nowrap;
}
.filter-left-actions {
flex: 1;
}
.sort-filter {
flex-shrink: 0;
}
.btn-collections {
width: auto;
justify-content: center;
font-size: 0;
padding: 0.5rem;
gap: 0;
min-width: auto;
}
.btn-collections span {
display: none;
}
.btn-collections svg {
width: 16px;
height: 16px;
}
.btn-featured {
width: auto;
justify-content: center;
font-size: 0;
padding: 0.5rem;
gap: 0;
min-width: auto;
}
.btn-featured span {
display: none;
}
.btn-featured svg {
width: 16px;
height: 16px;
}
.sort-filter {
justify-content: flex-end;
}
/* Reduce icon sizes on mobile post cards */
.post-favorite {
width: 24px !important;
height: 24px !important;
padding: 4px !important;
}
.post-favorite svg {
width: 12px !important;
height: 12px !important;
}
.card-download-btn,
.post-thumbnail-wrapper .card-download-btn {
width: 24px !important;
height: 24px !important;
padding: 4px !important;
top: 2.5rem !important;
border-radius: 50% !important;
}
.card-download-btn svg,
.post-thumbnail-wrapper .card-download-btn svg {
width: 16px !important;
height: 16px !important;
}
.file-badge {
padding: 2px 5px !important;
font-size: 0.55rem !important;
height: auto !important;
line-height: 1.7 !important;
}
.vip-badge-overlay {
padding: 2px 5px !important;
font-size: 0.55rem !important;
height: auto !important;
line-height: 1.2 !important;
}
/* Reduce overlay title size on mobile */
.overlay-title {
font-size: 0.75rem !important;
line-height: 1.3 !important;
}
/* Reduce card spacing on mobile */
.post-card.pinterest-style {
margin-bottom: 0.5rem !important;
}
}
@media (max-width: 480px) {
.posts-grid {
column-count: 2;
column-gap: 0.5rem;
}
/* Compact button on small mobile */
.btn-collections {
padding: 0.55rem 1rem;
font-size: 0.85rem;
}
.btn-collections svg {
width: 16px;
height: 16px;
}
.sort-select {
font-size: 0.85rem;
min-width: 140px;
}
/* Further reduce card spacing on small mobile */
.post-card.pinterest-style {
margin-bottom: 0.5rem !important;
}
}
/* Pinterest Style Card */
.post-card.pinterest-style {
background: transparent;
border: none;
border-radius: 12px;
overflow: visible;
transition: all 0.3s ease;
position: relative;
break-inside: avoid;
margin-bottom: 1.2rem;
display: block;
width: 100%;
}
.post-thumbnail-wrapper {
position: relative;
width: 100%;
border-radius: 12px;
overflow: hidden;
background: #fff;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
transition: all 0.3s ease;
}
.post-thumbnail-wrapper:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
transform: translateY(-4px);
}
.post-thumbnail-wrapper img {
width: 100%;
height: auto;
display: block;
transition: transform 0.3s ease;
}
/* Hover Overlay with Title */
.hover-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0.7) 100%);
opacity: 0;
transition: opacity 0.3s ease;
display: flex;
align-items: flex-end;
justify-content: center;
padding: 1rem;
z-index: 5;
}
.post-thumbnail-wrapper:hover .hover-overlay {
opacity: 1;
}
.overlay-content {
width: 100%;
text-align: left;
}
.overlay-title {
font-size: 0.95rem;
font-weight: 600;
line-height: 1.4;
margin: 0;
color: #fff;
text-align: left;
}
.overlay-title a {
color: #fff;
text-decoration: none;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.overlay-title a:hover {
color: var(--color-primary);
}
/* Download Button - Same Style as Favorite Button */
.card-download-btn {
position: absolute;
top: 3rem;
right: 0.75rem;
width: 38px !important;
height: 38px !important;
padding: 0 !important;
background: rgba(255, 255, 255, 0.95) !important;
border: none;
border-radius: 50% !important;
cursor: pointer;
display: flex !important;
align-items: center;
justify-content: center;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
z-index: 6;
gap: 0 !important;
margin: 0 !important;
font-size: inherit !important;
backdrop-filter: blur(10px);
opacity: 0;
transform: translateX(10px);
}
/* Show download button on hover */
.post-thumbnail-wrapper:hover .card-download-btn {
opacity: 1;
transform: translateX(0);
}
.card-download-btn:hover {
background: var(--color-primary) !important;
transform: scale(1.1) !important;
box-shadow: 0 8px 18px rgba(0, 55, 200, 0.24) !important
}
.card-download-btn svg {
width: 20px !important;
height: 20px !important;
stroke: var(--color-primary);
fill: none;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.card-download-btn:hover svg {
stroke: #fff;
}
.card-download-btn.downloading {
pointer-events: none;
opacity: 0.7;
}
.card-download-btn.downloading svg {
animation: spin 1s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.card-download-btn svg.spin-animation {
animation: spin 1s linear infinite;
}
/* Sticky/Featured Badge Icon - Below Download Button */
.sticky-badge-icon {
position: absolute;
top: 6.0rem;
right: 0.75rem;
width: 38px;
height: 38px;
background: rgba(255, 255, 255, 0.95);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
backdrop-filter: blur(10px);
z-index: 6;
opacity: 0;
transform: translateX(10px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.post-thumbnail-wrapper:hover .sticky-badge-icon {
opacity: 1;
transform: translateX(0);
}
.sticky-badge-icon:hover {
transform: scale(1.1);
box-shadow: 0 4px 12px rgba(255, 215, 0, 0.4);
}
/* Post Content Below Image - Hide */
.post-content-below {
display: none;
}
.post-card.pinterest-style .post-title {
display: none;
}
/* Remove old overlay-download-btn styles */
.overlay-download-btn,
.overlay-meta,
.overlay-vip,
.overlay-downloads,
.overlay-views {
display: none;
}
/* Badges - Always Visible */
.file-badge {
padding: 0.4rem 0.75rem;
background: rgba(255, 255, 255, 0.95);
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
color: var(--color-text);
text-transform: uppercase;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
height: 28px;
display: inline-flex;
align-items: center;
line-height: 1;
opacity: 0;
transform: translateY(-10px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
/* Show file-badge on hover */
.post-thumbnail-wrapper:hover .file-badge {
opacity: 1;
transform: translateY(0);
}
.post-badge {
position: absolute;
top: 0.5rem;
left: 0.5rem;
padding: 0.25rem 0.5rem;
border-radius: 4px;
font-size: 0.7rem;
font-weight: 600;
color: #fff;
text-transform: uppercase;
z-index: 6;
}
.badge-freepack {
background: var(--color-primary);
}
.badge-sale {
background: var(--color-secondary);
}
.badge-hot {
background: var(--color-danger);
}
.badge-new {
background: #3b82f6;
}
.post-favorite {
position: absolute;
top: 0.75rem;
left: 0.75rem;
width: 38px;
height: 38px;
background: rgba(255, 255, 255, 0.95);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 6;
border: none;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
backdrop-filter: blur(10px);
opacity: 0;
transform: translateX(-10px);
}
/* Show favorite button on hover */
.post-thumbnail-wrapper:hover .post-favorite {
opacity: 1;
transform: translateX(0);
}
/* Hide favorite button by default, show on hover - for both favorited and not favorited */
.post-thumbnail-wrapper:hover .post-favorite {
opacity: 1;
transform: translateX(0);
}
.post-favorite.is-favorited {
opacity: 0;
transform: translateX(10px);
}
.post-favorite:hover {
background: var(--color-danger);
transform: scale(1.1);
box-shadow: 0 4px 12px rgba(231, 76, 60, 0.4);
}
.post-favorite:hover svg {
fill: #fff;
stroke: #fff;
}
.post-favorite svg {
width: 20px;
height: 20px;
stroke: var(--color-danger);
fill: none;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.post-favorite.is-favorited svg {
fill: var(--color-danger);
animation: heartBeat 0.3s ease;
}
.post-favorite.is-favorited:hover {
background: var(--color-danger);
transform: scale(1.1);
}
.post-favorite.is-favorited:hover svg {
fill: #fff;
stroke: #fff;
}
/* Animation for favorite button */
@keyframes heartBeat {
0%, 100% {
transform: scale(1);
}
25% {
transform: scale(1.3);
}
50% {
transform: scale(1.1);
}
75% {
transform: scale(1.2);
}
}
.post-favorite.animate-pulse {
animation: heartBeat 0.3s ease;
}
.post-favorite.active svg {
fill: var(--color-danger);
}
/* Remove old post-content and post-title styles for pinterest style */
.post-card.pinterest-style .post-content {
display: block;
}
.post-meta {
display: flex;
align-items: center;
gap: var(--spacing-sm);
font-size: 0.85rem;
color: var(--color-text-light);
}
.meta-item {
display: flex;
align-items: center;
gap: 0.25rem;
}
/* ===== TOP DOWNLOAD PAGE ===== */
.top-download-page.site-main {
flex: 1;
padding-top: 15px;
}
.top-download-item {
position: relative;
}
.rank-badge {
position: absolute;
top: 0.5rem;
left: 0.5rem;
min-width: 38px;
height: 38px;
padding: 0 0.625rem;
background: rgba(0, 0, 0, 0.85);
color: #fff;
font-weight: 700;
font-size: 0.875rem;
border-radius: 20px;
display: flex;
align-items: center;
justify-content: center;
gap: 0.25rem;
z-index: 10;
backdrop-filter: blur(10px);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
/* Top 3 special styling */
.rank-badge.rank-1 {
background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
color: #000;
box-shadow: 0 4px 12px rgba(255, 215, 0, 0.5);
font-size: 1rem;
min-width: 42px;
height: 42px;
}
.rank-badge.rank-2 {
background: linear-gradient(135deg, #C0C0C0 0%, #A8A8A8 100%);
color: #000;
box-shadow: 0 4px 12px rgba(192, 192, 192, 0.5);
font-size: 0.95rem;
min-width: 40px;
height: 40px;
}
.rank-badge.rank-3 {
background: linear-gradient(135deg, #CD7F32 0%, #A0522D 100%);
color: #fff;
box-shadow: 0 4px 12px rgba(205, 127, 50, 0.5);
font-size: 0.9rem;
}
.rank-badge svg {
width: 14px;
height: 14px;
}
.rank-badge.rank-1 svg,
.rank-badge.rank-2 svg,
.rank-badge.rank-3 svg {
width: 16px;
height: 16px;
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
}
/* Top download page header styling */
.top-download-page .page-header h1 svg {
color: var(--color-primary);
}
/* Top download page mobile adjustments */
@media (max-width: 768px) {
.top-download-page.site-main {
padding-top: 0;
}
}
/* ===== PAGINATION ===== */
.pagination {
display: flex;
justify-content: center;
align-items: center;
margin: var(--spacing-xl) 0;
}
.pagination .page-numbers {
display: flex;
justify-content: center;
align-items: center;
gap: 0.75rem;
list-style: none;
padding: 0;
margin: 0;
}
.pagination a,
.pagination span {
min-width: 44px;
height: 44px;
padding: 8px 16px;
border: 2px solid var(--color-border);
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
transition: all 0.3s;
text-decoration: none;
color: var(--color-text);
display: inline-flex;
align-items: center;
justify-content: center;
}
.pagination a:hover {
background: var(--color-primary);
color: #fff;
border-color: var(--color-primary);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(21, 129, 218, 0.3);
}
.pagination .current {
background: var(--color-primary);
color: #fff;
border-color: var(--color-primary);
box-shadow: 0 2px 8px rgba(46, 204, 113, 0.2);
}
/* ===== FOOTER ===== */
.site-footer {
background: var(--color-bg-light);
border-top: 1px solid var(--color-border);
padding: var(--spacing-xl) 0 var(--spacing-md);
margin-top: var(--spacing-xl);
}
.footer-content {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: var(--spacing-xl);
margin-bottom: var(--spacing-lg);
}
.footer-column h3 {
font-size: 1.1rem;
font-weight: 600;
margin-bottom: var(--spacing-sm);
color: var(--color-text);
}
/* Footer menu styles */
.footer-menu {
list-style: none;
padding: 0;
margin: 0;
}
.footer-menu li {
margin-bottom: 0.5rem;
}
.footer-menu a {
display: block;
color: var(--color-text);
text-decoration: none;
transition: color 0.3s;
font-size: 0.9rem;
}
.footer-menu a:hover {
color: var(--color-primary);
}
.footer-info,
.footer-links,
.footer-social {
font-size: 0.9rem;
color: var(--color-text);
}
.footer-info p,
.footer-links a,
.footer-social a {
display: flex;
align-items: center;
gap: 0.5rem;
margin-bottom: 0.5rem;
transition: color 0.3s;
}
.footer-social a svg {
width: 20px;
height: 20px;
}
.social-icons {
display: flex;
gap: 1rem;
margin-top: 0.5rem;
}
.social-icon {
width: 36px;
height: 36px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: var(--color-bg);
border: 1px solid var(--color-border);
transition: all 0.3s;
color: var(--color-text);
}
.social-icon:hover {
background: var(--color-primary);
border-color: var(--color-primary);
color: #fff;
transform: translateY(-2px);
}
.social-icon svg {
width: 18px;
height: 18px;
}
.footer-links a:hover {
color: var(--color-primary);
}
.footer-social a:hover:not(.social-icon) {
color: var(--color-primary);
}
.social-icon:hover {
color: #fff !important;
}
.footer-bottom {
text-align: center;
padding-top: var(--spacing-md);
border-top: 1px solid var(--color-border);
font-size: 0.85rem;
color: var(--color-text);
}
/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
.content-layout {
grid-template-columns: 250px 1fr;
}
.posts-grid {
column-count: 3;
}
}
@media (max-width: 768px) {
.site-main {
padding-top: 180px;
}
.featured-files-page.site-main {
padding-top: 0;
}
.header-top {
flex-wrap: wrap;
}
.main-navigation {
order: 4;
width: 100%;
}
.main-navigation ul {
width: 100%;
justify-content: space-between;
}
.header-search {
order: 3;
flex: 1 1 100%;
max-width: 100%;
}
.content-layout {
grid-template-columns: 1fr;
}
/* Reduce top spacing on account page mobile (no category bar) */
.site-main.account-page {
padding-top: 18px !important;
}
/* Mobile category tags - horizontal scroll */
.category-bar {
position: relative;
padding: 0 !important;
}
.category-bar .container {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0 var(--spacing-md);
}
.category-tags {
flex-wrap: nowrap !important;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
padding: 0.5rem 0;
justify-content: flex-start;
flex: 1;
}
.category-tags::-webkit-scrollbar {
display: none;
}
/* Adjust category tag size on mobile */
.category-tag {
padding: 0.4rem 0.75rem;
font-size: 0.85rem;
height: 32px;
}
/* Sidebar toggle button on mobile */
.sidebar-toggle-btn {
display: inline-flex !important;
align-items: center;
justify-content: center;
min-width: 32px;
height: 32px;
background: none;
border: none;
border-radius: 0;
cursor: pointer;
flex-shrink: 0;
margin-right: 0.5rem;
padding: 0;
}
.sidebar-toggle-btn:hover {
background: rgba(0, 0, 0, 0.05);
border-radius: 8px;
}
.sidebar-toggle-btn svg {
width: 18px;
height: 18px;
stroke: var(--color-text);
stroke-width: 2.5;
}
/* Hide sidebar by default on mobile, show as slide-in menu */
.sidebar {
position: fixed;
top: 0;
left: -100%;
width: 280px;
height: 100vh;
background: #fff;
z-index: 1002;
overflow-y: auto;
transition: left 0.3s ease;
padding: 0 0 10rem 0;
box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
-webkit-overflow-scrolling: touch;
}
.sidebar.active {
left: 0;
}
/* Mobile sidebar header */
.sidebar-mobile-header {
display: flex !important;
justify-content: space-between;
align-items: center;
padding: 1rem;
border-bottom: 2px solid var(--color-primary);
background: #f9fafb;
position: sticky;
top: 0;
z-index: 10;
}
.sidebar-mobile-header h3 {
font-size: 1.1rem;
font-weight: 600;
color: var(--color-primary);
margin: 0;
}
.sidebar-close-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
background: none;
border: none;
cursor: pointer;
border-radius: 4px;
transition: background 0.3s;
}
.sidebar-close-btn:hover {
background: #e5e7eb;
}
.sidebar-close-btn svg {
width: 20px;
height: 20px;
stroke: var(--color-text);
}
/* Add padding to sidebar content */
.sidebar .filter-section {
margin: 1rem;
margin-bottom: 0.5rem;
}
.sidebar .active-filters {
margin: 0rem;
}
/* Overlay when sidebar is open */
.sidebar-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(8px) !important;-webkit-backdrop-filter;
z-index: 1001;
}
.sidebar-overlay.active {
display: block;
}
.footer-content {
grid-template-columns: 1fr;
gap: var(--spacing-lg);
}
}
@media (max-width: 480px) {
.site-main {
padding-top: 83px;
}
.featured-files-page.site-main {
padding-top: 0 !important;
}
.posts-grid {
column-count: 2;
}
.header-actions {
flex-direction: column;
width: 100%;
}
.btn {
width: 100%;
text-align: center;
}
}
/* ===== UTILITIES ===== */
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border-width: 0;
}
/* ===== DOWNLOAD SECTION ===== */
.download-section {
background: var(--color-bg-light);
border: 2px solid var(--color-primary);
border-radius: 12px;
padding: var(--spacing-lg);
margin: var(--spacing-xl) 0;
text-align: center;
}
.download-section h3 {
font-size: 1.5rem;
margin-bottom: var(--spacing-sm);
color: var(--color-text);
}
.file-info {
display: flex;
justify-content: center;
gap: var(--spacing-lg);
margin: var(--spacing-md) 0;
flex-wrap: wrap;
}
.file-info-item {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.95rem;
color: var(--color-text-light);
}
.file-info-item svg {
width: 20px;
height: 20px;
color: var(--color-primary);
}
.larxvo-download-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
padding: 1rem 2.5rem;
background: var(--color-primary);
color: #fff;
font-size: 1.1rem;
font-weight: 600;
border: none;
border-radius: 8px;
cursor: pointer;
transition: all 0.3s;
margin-top: var(--spacing-sm);
}
.larxvo-download-btn:hover:not(:disabled) {
background: var(--color-primary-hover);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(21, 129, 218, 0.3);
}
.larxvo-download-btn:disabled {
opacity: 0.6;
cursor: not-allowed;
}
.larxvo-download-btn svg {
width: 24px;
height: 24px;
}
.larxvo-download-btn .spinner {
display: inline-block;
animation: spin 1s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.vip-requirement {
display: inline-block;
padding: 0.5rem 1rem;
background: var(--color-secondary);
color: #fff;
border-radius: 6px;
font-weight: 600;
margin: var(--spacing-sm) 0;
}
.vip-requirement.vip {
background: #ffd700;
color: #1a1a1a;
font-weight: 700;
}
.larxvo-download-message {
display: none;
padding: 1rem;
margin-top: 1rem;
border-radius: 8px;
font-size: 0.95rem;
text-align: center;
}
.larxvo-download-message.success {
background: #2a68e9;
color: #155724;
border: 1px solid #c3e6cb;
}
.larxvo-download-message.error {
background: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
.larxvo-download-message .icon {
font-weight: bold;
margin-right: 0.5rem;
font-size: 1.2rem;
}
.larxvo-download-btn .spinner {
display: inline-block;
animation: spin 1s linear infinite;
}
@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
/* ===== SINGLE DESIGN FILE PAGE ===== */
.single-design-file .container {
max-width: 1400px;
padding: 0 var(--spacing-lg);
margin: 0 auto;
}
.single-design-file.site-main {
padding-top: 0px;
}
/* Featured Files Page Styles */
.featured-files-page.site-main {
flex: 1;
padding-top: 15px;
}
.single-design-file .breadcrumb a:hover {
color: var(--color-primary-hover);
}
.single-design-layout {
margin-bottom: 3rem;
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
/* Fixed height for single design left column */
.single-design-file .single-design-left {
min-height: 600px;
}
.single-design-file .single-design-left > .post-thumbnail-wrapper {
height: 600px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
}
/* Background blur effect using the same image */
.single-design-file .single-design-left > .post-thumbnail-wrapper::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
filter: blur(40px);
transform: scale(1.1);
z-index: 0;
opacity: 0.6;
}
.single-design-file .single-design-left > .post-thumbnail-wrapper img {
max-height: 100%;
max-width: 100%;
width: auto;
height: auto;
object-fit: contain;
position: relative;
z-index: 1;
filter: drop-shadow(0 4px 20px rgba(0, 0, 0, 0.3));
}
/* Favorite button in single page - always visible */
.single-design-file .post-favorite {
position: absolute;
top: 16px;
right: 70px;
z-index: 10;
opacity: 1 !important;
transform: translateX(0) !important;
width: 38px;
height: 38px;
}
@media (max-width: 1024px) {
.single-design-layout {
grid-template-columns: 1fr;
}
.single-design-sidebar {
order: -1;
}
.single-design-file .single-design-left > .post-thumbnail-wrapper {
height: 400px;
}
.single-design-file .single-design-left {
min-height: 400px;
}
}
.post-thumbnail-wrapper img {
transition: transform 0.3s ease;
}
.post-thumbnail-wrapper:hover img {
transform: scale(1.02);
}
.vip-badge-overlay {
padding: 0.4rem 0.75rem;
background: rgba(255, 255, 255, 0.95);
border-radius: 8px;
font-weight: 700;
font-size: 0.75rem;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
height: 28px;
display: inline-flex;
align-items: center;
line-height: 1;
}
.vip-badge-overlay.free {
color: #22c55e;
background: rgba(0, 0, 0, 0.4);
font-weight: 700;
}
.vip-badge-overlay.vip {
background: rgba(0, 0, 0, 0.4);
font-weight: 700;
}
.entry-content {
line-height: 1.8;
color: var(--color-text);
}
.entry-content p {
margin-bottom: 1rem;
}
.entry-content h2,
.entry-content h3,
.entry-content h4 {
margin-top: 1.5rem;
margin-bottom: 1rem;
font-weight: 600;
color: var(--color-text);
}
.file-description-list ul li:last-child {
border-bottom: none;
}
.entry-tags .tag-item:hover {
background: var(--color-primary);
color: #fff;
border-color: var(--color-primary);
}
.sidebar-card {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
transition: box-shadow 0.3s ease;
}
.sidebar-card:hover {
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.vip-badge-inline {
display: inline-block;
}
.vip-badge-inline.free {
background: #e8f5e9;
color: #2e7d32;
}
.vip-badge-inline.vip {
background: #ffd700;
color: #1a1a1a;
font-weight: 700;
}
.larxvo-download-btn:hover {
background: var(--color-primary-hover);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(21, 129, 218, 0.3);
}
.larxvo-download-btn:active {
transform: translateY(0);
}
.action-btn {
transition: all 0.3s ease;
}
.action-btn:hover {
background: var(--color-primary);
color: var(--color-text);
border-color: var(--color-primary);
transform: translateY(-2px);
box-shadow: 0 2px 8px rgba(46, 204, 113, 0.2);
}
.action-btn:hover svg {
stroke: var(--color-text);
}
/* Favorite button active state */
.action-btn.favorite.is-favorited {
background: rgba(231, 76, 60, 0.1);
border-color: var(--color-danger);
color: var(--color-danger);
}
.action-btn.favorite.is-favorited svg {
fill: var(--color-danger);
stroke: var(--color-danger);
}
.action-btn.favorite.is-favorited:hover {
background: rgba(220, 53, 69, 0.15);
color: var(--color-danger);
border-color: var(--color-danger);
transform: translateY(-2px);
box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
}
.action-btn.favorite.is-favorited:hover svg {
fill: var(--color-danger);
stroke: var(--color-danger);
}
.taxonomy-card a:hover {
opacity: 0.8;
transform: translateY(-2px);
transition: all 0.3s ease;
}
.related-posts-section {
animation: fadeIn 0.5s ease-in-out;
}
/* Related posts grid - use column masonry like homepage */
.related-posts-grid {
column-count: 6;
column-gap: 1.2rem; padding: 1rem 0 3rem 0;
}
.related-posts-grid .post-card {
break-inside: avoid;
margin-bottom: 1.2rem;
}
/* Related Posts Grid Responsive Breakpoints */
@media (max-width: 1800px) {
.related-posts-grid {
column-count: 6;
}
}
@media (max-width: 1600px) {
.related-posts-grid {
column-count: 5;
}
}
@media (max-width: 1400px) {
.related-posts-grid {
column-count: 4;
}
}
@media (max-width: 1024px) {
.related-posts-grid {
column-count: 3;
}
}
@media (max-width: 768px) {
.related-posts-grid {
column-count: 2;
}
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@media (max-width: 768px) {
/* Container padding */
.single-design-file .container {
padding: 0 var(--spacing-sm) !important;
}
/* Main layout - single column */
.single-design-layout {
grid-template-columns: 1fr !important;
gap: 1rem !important;
margin-bottom: 2rem !important;
}
/* Sidebar goes first on mobile */
.single-design-sidebar {
order: -1;
}
/* Breadcrumb */
.single-design-file .breadcrumb {
margin: 1rem 0 1rem !important;
font-size: 0.8rem !important;
}
/* Thumbnail wrapper */
.single-design-file .single-design-left > .post-thumbnail-wrapper {
height: 300px !important;
border-radius: 8px !important;
margin-bottom: 1rem !important;
}
.single-design-file .single-design-left {
min-height: auto !important;
}
/* Badges on thumbnail */
.post-thumbnail-wrapper .post-badge {
top: 8px !important;
left: 8px !important;
font-size: 0.65rem !important;
padding: 4px 8px !important;
}
.post-thumbnail-wrapper .vip-badge-overlay {
top: 8px !important;
right: 8px !important;
padding: 3px 4px !important;
font-size: 0.7rem !important;
height: auto !important;
}
/* Favorite button */
.single-design-file .post-favorite {
width: 28px !important;
height: 28px !important;
padding: 6px !important;
top: 8px !important;
left: 8px !important;
right: auto !important;
bottom: auto !important;
transform: none !important;
}
.single-design-file .post-favorite svg {
width: 16px !important;
height: 16px !important;
}
/* Entry content */
.single-design-file .entry-content {
padding: 1rem !important;
border-radius: 8px !important;
margin-bottom: 1rem !important;
font-size: 0.9rem !important;
}
/* Tags section */
.single-design-file .entry-tags {
margin-top: 1rem !important;
}
.single-design-file .entry-tags h4 {
font-size: 0.85rem !important;
margin-bottom: 0.75rem !important;
}
.single-design-file .tag-item {
padding: 0.3rem 0.75rem !important;
font-size: 0.75rem !important;
border-radius: 4px !important;
}
/* Sidebar cards */
.sidebar-card {
padding: 1rem !important;
border-radius: 8px !important;
margin-bottom: 1rem !important;
}
.sidebar-card h1 {
font-size: 1.1rem !important;
margin-bottom: 0.75rem !important;
}
.sidebar-card h3 {
font-size: 1rem !important;
margin-bottom: 1rem !important;
}
.sidebar-card h4 {
font-size: 0.85rem !important;
}
/* Meta info */
.meta-info {
font-size: 0.8rem !important;
gap: 0.5rem !important;
}
.meta-info svg {
width: 14px !important;
height: 14px !important;
}
/* File info grid */
.file-info-grid .info-row {
padding-bottom: 0.75rem !important;
font-size: 0.85rem !important;
}
.file-info-grid .info-row span {
font-size: 0.8rem !important;
}
.file-info-grid .info-row strong {
font-size: 0.85rem !important;
}
/* VIP badge inline */
.vip-badge-inline {
padding: 0.25rem 0.6rem !important;
font-size: 0.75rem !important;
}
/* VIP notices */
.vip-active-notice,
.vip-notice {
padding: 0.75rem !important;
font-size: 0.85rem !important;
border-radius: 6px !important;
}
.vip-active-notice strong,
.vip-notice strong {
font-size: 0.85rem !important;
}
.vip-active-notice svg {
width: 16px !important;
height: 16px !important;
}
/* Download button */
.larxvo-download-btn {
padding: 0.85rem !important;
font-size: 0.9rem !important;
border-radius: 6px !important;
}
.larxvo-download-btn svg {
width: 18px !important;
height: 18px !important;
}
/* Download message */
.larxvo-download-message {
margin-top: 0.75rem !important;
font-size: 0.8rem !important;
}
/* Action buttons */
.action-buttons {
flex-direction: row !important;
gap: 0.5rem !important;
margin-top: 0.75rem !important;
}
.action-btn {
padding: 0.7rem !important;
font-size: 0.8rem !important;
border-radius: 6px !important;
}
.action-btn svg {
width: 16px !important;
height: 16px !important;
}
.action-btn span {
display: none;
}
/* Taxonomy card */
.taxonomy-card > div {
margin-bottom: 1rem !important;
}
.taxonomy-card > div:last-child {
margin-bottom: 0 !important;
}
.taxonomy-card a {
padding: 0.3rem 0.75rem !important;
font-size: 0.75rem !important;
border-radius: 4px !important;
}
/* Related posts section */
.related-posts-section {
margin-top: 2rem !important;
padding-top: 2rem !important;
}
.related-posts-section h3 {
font-size: 1.1rem !important;
margin-bottom: 1rem !important;
}
.related-posts-grid {
column-count: 2 !important;
column-gap: 0.75rem !important;
}
.related-posts-grid .post-card {
break-inside: avoid !important;
margin-bottom: 0.75rem !important;
}
/* Collection Taxonomy Page Mobile */
.collection-header {
padding: 1rem 1.25rem !important;
border-radius: 12px !important;
margin-bottom: 1rem !important;
}
.collection-header h1 {
font-size: 1.1rem !important;
margin-bottom: 0.5rem !important;
line-height: 1.3 !important;
}
.collection-header p {
font-size: 0.8rem !important;
line-height: 1.4 !important;
margin-bottom: 0 !important;
}
.collection-controls {
flex-direction: column !important;
align-items: stretch !important;
gap: 0.75rem !important;
padding: 0 !important;
}
.control-left,
.control-right {
width: 100% !important;
justify-content: space-between !important;
}
.control-left .collection-count {
font-size: 0.85rem !important;
}
.btn-follow-collection,
.btn-copy-link {
padding: 0.5rem 1rem !important;
font-size: 0.85rem !important;
}
#collection-sort {
width: 100% !important;
font-size: 0.85rem !important;
}
}
/* ===== NOTIFICATION POPUP ===== */
.larxvo-notification {
position: fixed;
top: 90px;
right: 20px;
background: rgba(255, 255, 255, 0.98);
color: var(--color-text);
padding: 1rem 1.5rem;
border-radius: 8px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04);
z-index: 99999;
opacity: 0;
transform: translateX(400px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
font-size: 0.9rem;
font-weight: 500;
border-left: 4px solid var(--color-primary);
backdrop-filter: blur(10px);
max-width: 320px;
}
.larxvo-notification.show {
opacity: 1;
transform: translateX(0);
}
.larxvo-notification::before {
content: "✓";
display: inline-block;
margin-right: 0.5rem;
color: var(--color-primary);
font-weight: bold;
font-size: 1.1rem;
}
@media (max-width: 768px) {
.larxvo-notification {
right: 10px;
left: 10px;
max-width: none;
}
}
/* ===== ACCOUNT PAGE ===== */
body.account-page .breadcrumb {
padding-top: 0px;
padding-bottom: 10px;
}
.account-page {
max-width: 100%;
margin: 0 auto;
padding: 0;
}
.account-page > .container {
max-width: 1300px;
margin: 0 auto;
padding: 0 var(--spacing-lg);
}
/* Reduce top spacing on account page (no category bar) */
.site-main.account-page {
padding-top: 18px;
}
.account-layout {
display: grid;
grid-template-columns: 250px 1fr;
gap: 2rem;
margin-bottom: 3rem;
}
/* Account Sidebar */
.account-sidebar {
position: sticky;
top: 140px;
height: fit-content;
}
.sidebar-section {
background: #fff;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
border-radius: 12px;
padding: 1.5rem;
margin-bottom: 1.5rem;
}
.sidebar-section h3 {
font-size: 0.95rem;
font-weight: 600;
color: var(--color-text);
margin-bottom: 1rem;
}
.account-menu {
list-style: none;
padding: 0;
margin: 0;
}
.account-menu li {
margin-bottom: 0.5rem;
}
.account-menu li:last-child {
margin-bottom: 0;
}
.account-menu a {
display: block;
padding: 0.75rem 1rem;
color: var(--color-text);
font-size: 0.9rem;
border-radius: 8px;
transition: all 0.3s;
}
.account-menu a:hover {
background: var(--color-bg-light);
color: var(--color-primary);
}
.account-menu li.active a {
background: var(--color-primary);
color: #fff;
}
/* Account Content */
.account-content {
background: #fff;
}
.account-info-card {
background: #fff;
border: 1px solid var(--color-primary);
box-shadow: 0 8px 24px rgba(21, 129, 218, 0.06);
border-radius: 12px;
padding: 2rem;
margin-bottom: 2rem;
}
.account-info-card h2 {
font-size: 1.3rem;
font-weight: 700;
color: var(--color-text);
margin-bottom: 1.5rem;
}
.info-grid {
display: flex;
flex-direction: column;
gap: 1rem;
}
.info-row {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 1rem;
border-bottom: 1px solid var(--color-border);
}
.info-row:last-child {
border-bottom: none;
padding-bottom: 0;
}
.info-label {
color: var(--color-text);
font-size: 0.95rem;
}
.info-value {
color: var(--color-text);
font-size: 1rem;
font-weight: 600;
}
.status-active {
color: var(--color-primary);
}
.section-title {
font-size: 1.5rem;
font-weight: 700;
color: var(--color-text);
margin-bottom: 1.5rem;
}
/* Pricing Grid */
.pricing-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1.5rem;
margin-bottom: 2rem;
}
.pricing-card {
background: #fff;
border: 2px solid var(--color-border);
border-radius: 12px;
padding: 1.5rem;
position: relative;
transition: all 0.3s;
}
.pricing-card:hover {
transform: translateY(-4px);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}
.pricing-card.recommended {
border-color: var(--color-primary);
}
.pricing-card.best-value {
border-color: var(--color-secondary);
}
.recommended-badge,
.best-value-badge {
position: absolute;
top: -16px;
left: 50%;
transform: translateX(-50%);
padding: 0.4rem 1rem;
border-radius: 20px;
font-size: 0.75rem;
font-weight: 600;
color: #fff;
}
.recommended-badge {
background: var(--color-primary);
}
.best-value-badge {
background: var(--color-secondary);
}
.plan-header h3 {
font-size: 1.1rem;
font-weight: 700;
color: var(--color-text);
margin-bottom: 1rem;
text-align: center;
}
.plan-price {
text-align: center;
margin-bottom: 1.5rem;
}
.plan-price .price {
display: block;
font-size: 1.8rem;
font-weight: 700;
color: var(--color-primary);
margin-bottom: 0.5rem;
}
.pricing-card.best-value .plan-price .price {
color: var(--color-secondary);
}
.plan-price .price-note {
display: block;
font-size: 0.8rem;
color: var(--color-text);
}
.plan-features {
margin-bottom: 1.5rem;
}
.feature-badge {
background: #f8f9fa;
border: 1px solid var(--color-border);
border-radius: 8px;
padding: 1rem;
text-align: center;
margin-bottom: 1rem;
}
.feature-badge.highlight {
background: rgba(27, 105, 251, 0.1);
border-color: var(--color-primary);
}
.feature-badge .badge-label {
display: block;
font-size: 0.8rem;
color: var(--color-text);
margin-bottom: 0.5rem;
}
.feature-badge .badge-value {
display: block;
font-size: 1.1rem;
font-weight: 700;
color: var(--color-primary);
}
.feature-list {
list-style: none;
padding: 0;
margin: 0;
}
.feature-list li {
font-size: 0.85rem;
color: var(--color-text);
margin-bottom: 0.75rem;
line-height: 1.6;
}
.feature-list li:last-child {
margin-bottom: 0;
}
.btn-purchase {
width: 100%;
padding: 1rem;
background: var(--color-primary);
color: #fff;
border: none;
border-radius: 8px;
font-size: 1rem;
font-weight: 600;
cursor: pointer;
transition: all 0.3s;
text-align: center;
text-decoration: none;
display: block;
}
.btn-purchase:hover {
background: var(--color-primary-hover);
color: #fff;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(21, 129, 218, 0.3);
}
.btn-purchase.highlight {
background: var(--color-primary);
}
.btn-purchase.highlight:hover {
background: var(--color-primary-hover);
color: #fff;
}
.btn-purchase.best {
background: var(--color-secondary);
}
.btn-purchase.best:hover {
background: #e68900;
color: #fff;
box-shadow: 0 4px 12px rgba(255, 152, 0, 0.3);
}
/* Plan Description */
.plan-description {
background: #fff;
border: none;
border-radius: 12px;
padding: 2rem;
margin-top: 2rem; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
}
.plan-description h3 {
font-size: 1.1rem;
font-weight: 600;
color: var(--color-text);
margin-bottom: 1rem;
margin-top: 1.5rem;
}
.plan-description h3:first-child {
margin-top: 0;
}
.plan-description ul {
list-style: none;
padding: 0;
margin: 0 0 1rem 0;
}
.plan-description ul li {
font-size: 0.9rem;
color: var(--color-text);
line-height: 1.8;
margin-bottom: 0.75rem;
padding-left: 1.5rem;
position: relative;
}
.plan-description ul li::before {
content: "✓";
position: absolute;
left: 0;
color: var(--color-primary);
font-weight: bold;
}
.plan-description a {
color: var(--color-primary);
text-decoration: underline;
}
.plan-description a:hover {
color: var(--color-primary-hover);
}
/* Responsive */
@media (max-width: 1024px) {
.pricing-grid {
grid-template-columns: 1fr;
}
.account-layout {
grid-template-columns: 1fr;
}
.account-sidebar {
position: static;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
}
}
@media (max-width: 768px) {
.account-sidebar {
grid-template-columns: 1fr;
}
.pricing-card {
padding: 1.25rem;
}
.plan-price .price {
font-size: 1.5rem;
}
}
/* Account section styles */
.account-section {
padding: 2rem;
background: #fff;
border-radius: 8px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.04) !important;
}
.account-section h2 {
font-size: 24px;
margin-bottom: 30px;
color: #2c3e50;
border-bottom: 2px solid #2a68e9;
padding-bottom: 15px;
}
/* Empty state */
.empty-state {
text-align: center;
padding: 60px 30px;
}
.empty-state svg {
color: #bdc3c7;
margin-bottom: 20px;
}
.empty-state h3 {
font-size: 20px;
color: #2c3e50;
margin-bottom: 10px;
}
.empty-state p {
color: #7f8c8d;
margin-bottom: 25px;
}
/* Favorites grid - List style */
.favorites-grid {
display: flex;
flex-direction: column;
gap: 15px;
}
.favorite-item {
background: white;
border: 1px solid #e0e0e0;
border-radius: 8px;
overflow: hidden;
transition: all 0.3s;
display: flex;
align-items: center;
gap: 15px;
padding: 12px;
}
.favorite-item:hover {
box-shadow: 0 10px 40px rgba(24, 98, 245, 0.06) !important;
border-color: var(--color-primary);
}
.favorite-thumbnail {
position: relative;
overflow: hidden;
flex-shrink: 0;
width: 120px;
height: 90px;
border-radius: 6px;
}
.favorite-thumbnail a {
display: block;
width: 100%;
height: 100%;
}
.favorite-thumbnail img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s;
}
.favorite-item:hover .favorite-thumbnail img {
transform: scale(1.05);
}
.favorite-info {
flex: 1;
min-width: 0;
}
.favorite-info h3 {
font-size: 15px;
margin-bottom: 8px;
line-height: 1.4;
}
.favorite-info h3 a {
color: #2c3e50;
text-decoration: none;
transition: color 0.3s;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.favorite-info h3 a:hover {
color: var(--color-primary);
}
.favorite-meta {
display: flex;
gap: 15px;
font-size: 13px;
color: #7f8c8d;
flex-wrap: wrap;
}
.favorite-meta span {
display: flex;
align-items: center;
gap: 4px;
}
.favorite-actions {
display: flex;
gap: 8px;
flex-shrink: 0;
}
.btn-download-favorite,
.remove-favorite {
width: 38px;
height: 38px;
border: none;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
background: rgba(255, 255, 255, 0.95);
border: 1px solid var(--color-border);
}
.btn-download-favorite {
color: var(--color-primary);
}
.btn-download-favorite:hover {
background: var(--color-primary);
color: white;
border-color: var(--color-primary);
transform: scale(1.1);
}
.remove-favorite {
color: #e74c3c;
}
.remove-favorite:hover {
background: #e74c3c;
color: white;
border-color: #e74c3c;
transform: scale(1.1);
}
.btn-download-favorite svg,
.remove-favorite svg {
width: 18px;
height: 18px;
}
/* Orders table */
.orders-table-wrapper {
overflow-x: auto;
margin-top: 20px;
}
.orders-table {
width: 100%;
border-collapse: collapse;
background: white;
}
.orders-table thead {
background: #f8f9fa;
}
.orders-table th {
padding: 15px;
text-align: left;
font-weight: 600;
color: #2c3e50;
border-bottom: 2px solid #e0e0e0;
}
.orders-table td {
padding: 15px;
border-bottom: 1px solid #e0e0e0;
color: #555;
}
.orders-table tbody tr:hover {
background: #f8f9fa;
}
.order-status {
padding: 5px 12px;
border-radius: 20px;
font-size: 13px;
font-weight: 500;
display: inline-block;
}
.order-status.status-pending {
background: #fff3cd;
color: #856404;
}
.order-status.status-processing {
background: #cce5ff;
color: #004085;
}
.order-status.status-completed {
background: #2a68e9;
color: #fff;
}
.order-status.status-cancelled {
background: #f8d7da;
color: #721c24;
}
.order-actions {
display: flex;
gap: 10px;
}
.btn-view-order,
.btn-download-invoice,
.btn-view-file {
padding: 6px 12px;
font-size: 13px;
border-radius: 4px;
text-decoration: none;
transition: all 0.3s;
}
.btn-view-order {
background: #3498db;
color: white;
}
.btn-view-order:hover {
background: #2980b9;
}
.btn-download-invoice,
.btn-view-file {
background: #95a5a6;
color: white;
}
.btn-download-invoice:hover,
.btn-view-file:hover {
background: #7f8c8d;
}
/* Download stats - Removed old styles, now using inline styles in template */
.stat-label {
font-size: 14px;
opacity: 0.9;
}
/* Download history table */
.download-history-wrapper {
overflow-x: auto;
margin-top: 20px;
}
.download-history-table {
width: 100%;
border-collapse: collapse;
background: white;
}
.download-history-table thead {
background: #f8f9fa;
}
.download-history-table th {
padding: 15px;
text-align: left;
font-weight: 600;
color: #2c3e50;
border-bottom: 2px solid #e0e0e0;
}
.download-history-table td {
padding: 15px;
border-bottom: 1px solid #e0e0e0;
color: #555;
}
.download-history-table tbody tr:hover {
background: #f8f9fa;
}
.download-file-name {
color: #2c3e50;
text-decoration: none;
font-weight: 500;
transition: color 0.3s;
}
.download-file-name:hover {
color: #3498db;
}
/* Responsive styles for account tabs */
@media (max-width: 768px) {
.favorite-item {
flex-direction: column;
align-items: stretch;
}
.favorite-thumbnail {
width: 100%;
height: 180px;
}
.favorite-actions {
justify-content: flex-end;
margin-top: 10px;
}
.favorites-grid {
gap: 12px;
}
.orders-table,
.download-history-table {
font-size: 13px;
}
.orders-table th,
.orders-table td,
.download-history-table th,
.download-history-table td {
padding: 10px;
}
.download-stats {
grid-template-columns: 1fr;
}
.order-actions {
flex-direction: column;
}
}
@media (max-width: 480px) {
.favorite-meta {
flex-direction: column;
gap: 8px;
}
.favorite-info h3 {
font-size: 14px;
}
}
/* ===== MOBILE RESPONSIVE - COMPLETE ===== */
/* Tablet & Small Desktop (768px - 1024px) */
@media (max-width: 1024px) {
.header-top {
padding: var(--spacing-sm);
gap: var(--spacing-sm);
}
.container {
padding: 0 var(--spacing-sm);
}
.top-menu .container {
padding: 0 var(--spacing-sm);
}
.main-navigation,
.secondary-navigation {
gap: var(--spacing-sm);
}
.header-search {
max-width: 400px;
}
}
/* Mobile Landscape & Tablet Portrait (768px and below) */
@media (max-width: 768px) {
/* Top Menu - Mobile */
.top-navigation ul {
gap: 0.5rem;
font-size: 0.8rem;
padding: 0.4rem 0;
}
.top-navigation a {
padding: 0.2rem 0.4rem;
}
/* Header - Mobile Compact Layout */
.header-top {
display: grid;
grid-template-columns: auto 1fr auto auto;
padding: 0.5rem 0;
gap: 0.3rem;
overflow: visible;
align-items: center;
}
.site-header .container {
overflow: visible;
}
.site-logo {
font-size: 0.9rem;
grid-column: 1;
grid-row: 1;
}
.site-logo img {
max-height: 24px;
}
/* Search - Icon only, click to show popup */
.header-search {
display: flex;
grid-column: 2;
grid-row: 1;
margin-left: auto;
position: relative;
}
/* Hide search form by default */
.header-search .search-form {
display: none;
position: fixed;
top: 104px;
left: 0;
right: 0;
background: #fff;padding: 15px 0;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
z-index: 999; border-radius: 0;
border-bottom: 1px solid var(--color-border);
}
.header-search .search-form.active {
display: flex;
}
/* Search toggle icon button */
.search-toggle-btn {
display: inline-flex !important;
align-items: center;
justify-content: center;
padding: 0.5rem;
background: none;
border-radius: 8px;
cursor: pointer;
width: 40px;
height: 40px;
}
.search-toggle-btn svg {
width: 25px;
height: 25px;
stroke: currentColor !important;
stroke-width: 2;
}
/* Header actions on same row */
.header-actions {
grid-column: 3;
grid-row: 1;
display: flex;
gap: 0.3rem;
flex-direction: row;
flex-wrap: nowrap;
}
.header-actions .btn {
padding: 0.5rem;
font-size: 0.75rem;
min-width: 40px;
white-space: nowrap;
width: 40px !important;
height: 40px !important;
flex: 0 0 auto;
border-radius: 8px;
}
/* Hide "Buy downloads" button on mobile */
.header-actions .btn-primary {
display: none !important;
}
/* Hide button text on mobile, keep icons only */
.header-actions .btn span {
display: none !important;
}
.header-actions .btn svg {
margin: 0;
width: 20px;
height: 20px;
}
/* Mobile Menu Toggle - After header actions, same row */
.mobile-menu-toggle {
display: inline-flex !important;
align-items: center;
justify-content: center;
grid-column: 4;
grid-row: 1;
padding: 0.5rem;
border-radius: 8px;
cursor: pointer;
width: 40px;
height: 40px;
}
.mobile-menu-toggle svg {
width: 20px;
height: 20px;
stroke: #fff;
display: block;
}
/* Hide main navigation, show secondary in mobile menu */
.main-navigation {
display: none !important;
}
/* Account page - reduce padding on mobile */
body.account-page .site-main.account-page,
.site-main.account-page {
padding-top: 12px !important;
}
/* Account page - when logged in (but not admin) */
body.logged-in:not(.admin-bar).account-page .site-main.account-page,
body.logged-in:not(.admin-bar) .site-main.account-page {
padding-top: 30px !important;
}
.secondary-navigation {
display: none;
position: fixed;
top: 104px;
left: 0;
right: 0;
background: #fff;
border-bottom: 1px solid var(--color-border);
z-index: 999;
overflow-y: auto;
padding: 0;
}
.secondary-navigation.active {
display: block !important;
}
/* Mobile menu header with close button */
.mobile-menu-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
border-bottom: 2px solid var(--color-primary);
background: #f9fafb;
}
.mobile-menu-title {
font-size: 1.1rem;
font-weight: 600;
color: var(--color-primary);
margin: 0;
}
.mobile-menu-close {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.4rem;
background: none;
border: none;
cursor: pointer;
width: 32px;
height: 32px;
border-radius: 4px;
transition: background 0.3s;
}
.mobile-menu-close:hover {
background: #e5e7eb;
}
.mobile-menu-close svg {
width: 20px;
height: 20px;
stroke: var(--color-text);
}
.secondary-navigation ul {
flex-direction: column;
padding: 0;
gap: 0 !important;
margin: 0;
list-style: none;
}
.secondary-navigation li {
width: 100%;
border-bottom: 1px solid #e5e7eb;
}
.secondary-navigation li:last-child {
border-bottom: none;
}
.secondary-navigation a {
display: block;
padding: 1rem 1.5rem;
color: var(--color-text);
text-decoration: none;
font-size: 1rem;
transition: all 0.3s;
position: relative;
}
.secondary-navigation a:hover,
.secondary-navigation a.current-menu-item {
background: #f0f9ff;
color: var(--color-primary);
padding-left: 2rem;
}
.secondary-navigation a:hover::before,
.secondary-navigation a.current-menu-item::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 4px;
background: var(--color-primary);
}
/* Header Actions - Compact icons only on same row as logo */
.header-actions {
order: 2;
gap: 0.4rem;
margin-left: auto;
flex: 0 0 auto;
flex-direction: row;
flex-wrap: nowrap;
}
.header-actions .btn {
padding: 0.45rem 0.6rem;
font-size: 0.85rem;
min-width: auto;
white-space: nowrap;
width: auto !important;
flex: 0 0 auto;
}
.header-actions .btn-primary {
width: auto !important;
max-width: none;
}
/* Hide all button text on mobile, keep icons only */
.header-actions .btn span {
display: none !important;
}
.header-actions .btn svg {
margin: 0;
width: 20px;
height: 20px;
}
/* User dropdown - Icon only */
.user-account-btn span {
display: none !important;
}
.user-account-btn {
padding: 0.45rem !important;
}
.user-avatar-icon {
width: 25px;
height: 25px;
}
.dropdown-arrow {
display: none !important;
}
.account-dropdown-menu {
right: 0;
left: auto;
min-width: 200px;
}
.search-form {
flex-direction: row;
gap: 0.4rem;
align-items: stretch;
}
.search-type-wrapper {
flex: 0 0 auto;
width: auto;
}
.search-form .search-type-select {
width: auto;
padding: 0.55rem 1.75rem 0.55rem 2rem;
min-width: 90px;
font-size: 0.8rem;
}
.search-type-wrapper .custom-select-trigger {
width: auto;
padding: 0.45rem 1.75rem 0.45rem 2rem;
min-width: 90px;
font-size: 0.8rem;
height: auto;
}
.search-type-icon {
width: 14px;
height: 14px;
left: 0.5rem;
}
.search-type-wrapper .custom-select-arrow {
right: 0.5rem;
width: 10px;
height: 6px;
}
.search-form label {
flex: 1;
min-width: 0;
}
.search-form input[type="search"] {
padding: 0.55rem 2.5rem 0.55rem 0.75rem;
font-size: 0.85rem;
}
.search-form button {
right: 0.3rem;
}
.search-form button svg {
width: 18px;
height: 18px;
stroke: var(--color-text) !important;
}
/* Adjust main content padding */
.site-main {
padding-top: 120px;
}
}
/* Mobile Portrait (480px and below) */
@media (max-width: 480px) {
/* Top Menu - Compact */
.top-menu {
font-size: 0.7rem;
}
.top-navigation ul {
gap: 0.2rem;
font-size: 0.7rem;
padding: 0.75rem 0;
justify-content: flex-start;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.top-navigation ul::-webkit-scrollbar {
display: none;
}
.top-navigation a {
padding: 0.15rem 0.35rem;
white-space: nowrap;
}
.top-menu .container {
padding: 0 0.4rem;
}
/* Header - Ultra Compact for small screens */
.header-top {
padding: 0.4rem;
gap: 0.35rem;
}
.site-logo {
font-size: 0.9rem;
}
.site-logo img {
max-height: 26px;
}
/* Header Actions - Smaller icons */
.header-actions {
gap: 0.3rem;
}
.header-actions .btn {
padding: 0.4rem 0.5rem;
}
.header-actions .btn svg {
width: 18px;
height: 18px;
}
.user-avatar-icon {
width: 25px;
height: 25px;
}
/* Search - Compact but still horizontal */
.search-form {
gap: 0.3rem;
}
.search-form .search-type-select {
padding: 0.5rem 1.5rem 0.5rem 1.75rem;
font-size: 0.75rem;
min-width: 80px;
}
.search-type-icon {
width: 13px;
height: 13px;
left: 0.4rem;
}
.search-form input[type="search"] {
font-size: 0.8rem;
}
.search-form button {
right: 1.25rem;
}
.search-form button svg {
width: 16px;
height: 16px;
stroke: var(--color-text) !important;
}
/* Dropdown menu */
.account-dropdown-menu {
min-width: 170px;
font-size: 0.8rem;
}
.dropdown-item {
padding: 0.6rem 0.75rem;
}
.dropdown-item svg {
width: 15px;
height: 15px;
}
/* Adjust main content */
.site-main {
padding-top: 106px;
}
/* When logged in as regular user - pages need more padding */
body.logged-in:not(.admin-bar).home .site-main,
body.logged-in:not(.admin-bar).blog .site-main,
body.logged-in:not(.admin-bar).single-post .site-main,
body.logged-in:not(.admin-bar).category .site-main,
body.logged-in:not(.admin-bar).tag .site-main,
body.logged-in:not(.admin-bar).archive .site-main,
body.logged-in:not(.admin-bar).page-template-page-blog .site-main,
body.logged-in:not(.admin-bar).page-template-page-collections .site-main,
body.logged-in:not(.admin-bar).page-template-page-file-noi-bat .site-main {
padding-top: 106px;
}
/* When logged in as admin - default */
body.admin-bar .site-main {
padding-top: 30px;
}
/* Exception: Blog pages need more padding with admin bar (46px) */
body.admin-bar.blog .site-main,
body.admin-bar.single-post .site-main,
body.admin-bar.category .site-main,
body.admin-bar.tag .site-main,
body.admin-bar.archive .site-main,
body.admin-bar.page-template-page-blog .site-main,
body.admin-bar.page-template-page-collections .site-main,
body.admin-bar.page-template-page-file-noi-bat .site-main {
padding-top: 56px;
}
}
/* Extra Small Mobile (360px and below) */
@media (max-width: 360px) {
.top-menu {
font-size: 0.65rem;
}
.top-navigation ul {
font-size: 0.65rem;
gap: 0.15rem;
}
.top-navigation a {
padding: 0.1rem 0.25rem;
}
.top-menu .container {
padding: 0 0.3rem;
}
.header-top {
padding: 0.3rem;
gap: 0.3rem;
}
.site-logo {
font-size: 0.85rem;
}
.site-logo img {
max-height: 24px;
}
/* Keep search horizontal but more compact */
.search-form {
gap: 0.25rem;
}
.search-form .search-type-select {
font-size: 0.7rem;
padding: 0.45rem 1.4rem 0.45rem 1.6rem;
min-width: 75px;
}
.search-type-icon {
width: 12px;
height: 12px;
left: 0.35rem;
}
.search-form input[type="search"] {
padding: 0.45rem 2rem 0.45rem 0.55rem;
font-size: 0.75rem;
}
.header-actions {
gap: 0.25rem;
}
.header-actions .btn {
padding: 0.35rem 0.45rem;
}
.header-actions .btn svg {
width: 16px;
height: 16px;
}
.user-avatar-icon {
width: 20px;
height: 20px;
}
.search-form button {
right: 0.2rem;
padding: 0.4rem;
}
.search-form button svg {
width: 15px;
height: 15px;
stroke: var(--color-text) !important;
}
.site-main {
padding-top: 100px;
}
}
/* Landscape Orientation Fix */
@media (max-height: 500px) and (orientation: landscape) {
.site-main {
padding-top: 100px;
}
.header-top {
padding: 0.5rem;
}
.top-menu {
font-size: 0.75rem;
}
.top-navigation ul {
padding: 0.65rem 0;
}
}
/* Safe Area for Notched Devices (iPhone X, etc) - Removed to eliminate side spacing */
/* Áp dụng hiệu ứng cho phần thân (line) and đầu mũi tên (polyline) khi hover vào nút */
.larxvo-download-btn:hover svg polyline,
.larxvo-download-btn:hover svg line {
animation: downloadArrowSlide 1.2s infinite ease-in-out;
/* Đảm bảo tâm chuyển động chuẩn xác cho thẻ SVG con */
transform-origin: center;
transform-box: fill-box;
}
/* Giữ cho phần khay hứng (path) ở dưới đứng im and không bị ảnh hưởng bởi animation */
.larxvo-download-btn:hover svg path {
animation: none;
transform: none;
}
/* Định nghĩa hiệu ứng trượt xuống: Mũi tên xuất hiện từ trên, trượt xuống khay and mờ đi */
@keyframes downloadArrowSlide {
0% {
transform: translateY(-4px);
opacity: 0;
}
30% {
opacity: 1; /* Mũi tên hiện rõ khi đang trượt xuống */
}
70% {
transform: translateY(3px);
opacity: 1;
}
100% {
transform: translateY(5px); /* Chạm gần đáy khay */
opacity: 0; /* Mờ đi để lặp lại vòng mới */
}
}
/* Status mặc định của nút heart */
.post-favorite {
position: absolute;
top: 0.75rem;
left: 0.75rem;
width: 38px;
height: 38px;
background-color: rgba(255, 255, 255, 0.95);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
z-index: 6;
border: none;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
overflow: hidden; /* Đảm bảo hiệu ứng không tràn ra ngoài */
}
/* Biểu tượng trái tim bên trong nút */
.post-favorite svg {
width: 20px;
height: 20px;
fill: none;
stroke-width: 2;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
/* Hiệu ứng nhấp nháy cho biểu tượng trái tim khi hover */
.post-favorite:hover svg {
animation: post-favorite-pulse 1.2s infinite ease-in-out;
}
/* Định nghĩa hiệu ứng nhấp nháy (pulse) cho trái tim */
@keyframes post-favorite-pulse {
0% {
transform: scale(1);
opacity: 1;
}
50% {
transform: scale(1.1); /* Phóng lớn một chút */
opacity: 0.7; /* Giảm độ mờ một chút */
}
100% {
transform: scale(1);
opacity: 1;
}
}
/* Hiệu ứng thu nhỏ and phóng lớn khi click */
.post-favorite:active svg {
transform: scale(0.9);
transition: all 0.1s ease-in-out;
}
//* HERO SLIDER *//
/* --- Desktop Styles (Màn hình lớn) --- */
.hero-creative-split {
padding: 80px 0;
overflow: hidden;
background: #fff;
min-height: 80vh;
display: flex;
align-items: center;
}
.hero-container {
max-width: 1300px;
width: 90%;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 40px;
}
.hero-content-left { flex: 0 0 45%; }
.hero-visual-right {
flex: 0 0 50%;
height: 500px;
position: relative;
}
.horizontal-coverflow-container {
width: 100%; height: 100%;
perspective: 1200px;
}
.coverflow-track {
position: relative; width: 100%; height: 100%;
transform-style: preserve-3d;
}
.coverflow-item {
position: absolute;
top: 50%; left: 50%;
width: 300px; height: 420px;
margin-top: -210px; margin-left: -150px;
border-radius: 20px;
overflow: hidden;
transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
opacity: 0; visibility: hidden;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
.coverflow-item img { width: 100%; height: 100%; object-fit: cover; }
/* Status hiển thị Desktop */
.coverflow-item.is-active {
opacity: 1; visibility: visible; z-index: 10;
transform: translateX(0) scale(1) translateZ(100px);
}
.coverflow-item.is-prev {
opacity: 0.5; visibility: visible; z-index: 5;
transform: translateX(-220px) scale(0.8) rotateY(20deg);
}
.coverflow-item.is-next {
opacity: 0.5; visibility: visible; z-index: 5;
transform: translateX(220px) scale(0.8) rotateY(-20deg);
}
/* --- RESPONSIVE: Tablet (Dưới 1024px) --- */
/* --- RESPONSIVE CHO TABLET & MOBILE --- */
@media (max-width: 1024px) {
.hero-container {
flex-direction: column !important; /* ÉP BUỘC CHUYỂN THÀNH HÀNG DỌC */
text-align: center;
gap: 30px; /* Khoảng cách giữa Text and Slider */
padding-top: 40px;
}
.hero-content-left {
flex: 0 0 100%;
width: 100%;
order: 1; /* Chữ nằm trên */
}
.hero-visual-right {
flex: 0 0 100%;
width: 100%;
height: 350px; /* Chiều cao vùng chứa slider */
order: 2; /* Slider nằm dưới */
}
/* Thu nhỏ các tấm ảnh để không bị tràn lề màn hình mobile */
.coverflow-item {
width: 200px;
height: 280px;
margin-left: -100px; /* Nửa width */
margin-top: -140px; /* Nửa height */
}
/* Điều chỉnh vị trí 2 tấm ảnh phụ sát vào trung tâm hơn */
.coverflow-item.is-prev {
transform: translateX(-120px) scale(0.7) rotateY(15deg);
opacity: 0.4;
}
.coverflow-item.is-next {
transform: translateX(120px) scale(0.7) rotateY(-15deg);
opacity: 0.4;
}
}
/* Tối ưu riêng cho điện thoại nhỏ */
@media (max-width: 480px) {
.hero-title {
font-size: 2rem;
line-height: 1.2;
}
.hero-visual-right {
height: 300px;
}
.coverflow-item {
width: 160px;
height: 230px;
margin-left: -80px;
margin-top: -115px;
}
.coverflow-item.is-prev { transform: translateX(-90px) scale(0.65); }
.coverflow-item.is-next { transform: translateX(90px) scale(0.65); }
}
@media (max-width: 991px) {
/* 1. Khung bao ngoài cùng */
.sort-filter-wrapper {
display: flex !important;
align-items: center !important; /* Căn giữa dọc tất cả các thành phần */
gap: 8px !important;
width: 100% !important;
padding: 10px 0 !important;
}
/* 2. Khung chứa 3 nút bên trái */
.filter-left-actions {
display: flex !important;
flex: 1 !important; /* Chiếm không gian còn lại */
gap: 8px !important;
align-items: center !important;
}
/* 4. Xử lý riêng cho nút Filters (Icon duy nhất) */
.sidebar-toggle-btn {
width: 42px;
min-width: 42px;
height:38px;
border: 1px solid var(--color-border);
border-radius: 8px;
padding: 0;
}
/* 5. Xử lý nút Collections and Favorites (Có text) */
.btn-collections, .btn-featured {
flex: 1; /* Chia đều không gian cho 2 nút có chữ */
gap: 6px;
white-space: nowrap;
}
/* Icon đồng nhất size */
.filter-left-actions svg {
width: 18px !important;
height: 18px !important;
stroke-width: 2 !important;
}
/* Ẩn bớt chữ trên màn hình quá nhỏ để tránh tràn lề */
@media (max-width: 380px) {
.btn-collections span, .btn-featured span {
display: none; /* Chỉ hiện icon nếu máy quá bé */
}
.btn-collections, .btn-featured {
flex: 0 0 42px;
}
}
}
.btn-shimmer {
position: relative;
overflow: hidden;
}
.btn-shimmer::after {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 50%;
height: 100%;
background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
transform: skewX(-25deg);
animation: shimmer-effect 3s infinite;
}
@keyframes shimmer-effect {
0% { left: -100%; }
20% { left: 200%; }
100% { left: 200%; } /* Tạo thời gian nghỉ giữa các lần quét */
}
.woocommerce ul.order_details li strong{color:var (--color-primary)!important;}
.mobile-menu-toggle {
display: flex;
align-items: center;
justify-content: center;
position: relative;
background: transparent;
border: none;
cursor: pointer;
padding: 0;
color: #2a68e9;
/* Kích thước: w-6 h-6 trên mobile, w-10 h-10 trên desktop */
width: 24px;
height: 24px;
margin-left: 24px; /* tương đương ml-6 */
}
@media (max-width: 768px) {
/* Lớp phủ mờ (20% còn lại) */
.mobile-menu-overlay {
position: fixed !important;
top: 0;
left: 0;
width: 100vw;
height: 100dvh;
background-color: rgba(0, 0, 0, 0.3) !important;
backdrop-filter: blur(8px) !important;
-webkit-backdrop-filter: blur(8px) !important;
z-index: 99998 !important; /* Thấp hơn menu */
opacity: 0;
visibility: hidden;
transition: all 0.3s ease-in-out;
}
.mobile-menu-overlay.active {
opacity: 1 !important;
visibility: visible !important;
}
/* Menu chính (80%) */
.secondary-navigation {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 80% !important;
height: 100dvh !important;
background-color: #fff !important;
z-index: 99999 !important; /* CAO NHẤT để không bị mờ */
transform: translateX(-101%) !important;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
display: block !important;
}
.secondary-navigation.active {
transform: translateX(0) !important;
}
/* Đảm bảo chữ rõ nét */
.secondary-navigation * {
filter: none !important;
backdrop-filter: none !important;
}
}
/* Container chính của Search */
.header-search {
flex: 1;
max-width: 500px;
position: relative;
}
/* Form search tạo thành một khối thống nhất */
.search-form {
display: flex;
align-items: center;
background: var(--color-bg);
border: 1px solid #e1e4e8;
border-radius: 10px 10px 0 0;
padding: 4px 0 6px 0px;
transition: all 0.3s ease;
}
/* Hiệu ứng khi click vào search (Focus) */
.search-form:focus-within {
background: #fff;
border-color: #2a68e9;
box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.1);
}
/* Phần chọn loại (All, Format...) */
.search-type-wrapper {
display: flex;
align-items: center;
border-right: 1px solid #e1e4e8; /* Vạch chia tinh tế */
color: #666;
}
.search-type-select {
border: none;
background: transparent;
font-size: 14px;
font-weight: 500;
padding: 4px;
cursor: pointer;
outline: none;
color: inherit;
}
/* Ô nhập liệu */
.search-input-wrapper {
flex: 1;
display: flex;
align-items: center;
}
.search-field {
width: 100%;
border: none !important;
background: transparent !important;
padding: 8px 12px !important;
font-size: 15px !important;
outline: none !important;
}
/* Nút Submit */
.search-submit {
background: transparent;
border: none;
padding: 8px;
cursor: pointer;
color: #666;
display: flex;
align-items: center;
justify-content: center;
transition: color 0.2s;
}
.search-submit:hover {
color: #007bff; /* Đổi màu khi hover */
}
/* Responsive cho Mobile */
@media (max-width: 991px) {
.header-search {
max-width: 100%;
}
.search-type-wrapper {
display: none; /* Ẩn bớt phần chọn trên mobile cho gọn */
}
}
.search-autocomplete-dropdown {
position: absolute;
top: calc(100% + 10px);
left: 0;
right: 0;
background: #fff;
border-radius: 0 0 10px 10px;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
z-index: 100;
overflow: hidden;
}
/* Style cho Badge VIP trong Card Tài Khoản */
.premium-package-badge {
position: relative;
display: inline-flex;
align-items: center;
padding: 6px 18px;
background: #000;
border-radius: 8px; /* Bo góc khớp với phong cách Card của you */
overflow: hidden;
z-index: 1;
font-weight: 800;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
/* Viền Cam - Yellow chạy liên tục (Snake Border) */
.premium-package-badge::before {
content: '';
position: absolute;
z-index: -2;
left: -50%;
top: -50%;
width: 200%;
height: 200%;
background-image: conic-gradient(
transparent,
#ff8c00 10%, /* Cam đậm */
#f1c40f 25%, /* Yellow Gold */
#fff 35%, /* Ánh nắng trắng */
#f1c40f 50%,
transparent 100%
);
animation: rotateBorder 3.5s linear infinite;
}
/* Lớp mặt nạ bên trong để viền trông thanh mảnh */
.premium-package-badge::after {
content: '';
position: absolute;
z-index: -1;
left: 2px;
top: 2px;
width: calc(100% - 4px);
height: calc(100% - 4px);
background: #111;
border-radius: 7px;
}
/* Hiệu ứng chữ vàng phát sáng (Golden Shimmer) */
.premium-text-shimmer {
font-size: 14px;
letter-spacing: 1px;
text-transform: uppercase;
background: linear-gradient(
120deg,
#e67e22 0%,
#f1c40f 25%,
#fff 50%,
#f1c40f 75%,
#e67e22 100%
);
background-size: 200% auto;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: textShine 2.5s linear infinite;
}
@keyframes rotateBorder {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
@keyframes textShine {
to { background-position: 200% center; }
}
/* LarxVo single file sections - force balanced 6-card rows */
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
display: grid !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
gap: 1.15rem !important;
column-count: initial !important;
column-gap: initial !important;
align-items: start;
}
.single-design-file .related-posts-grid .post-card,
.single-design-file .recently-viewed-grid .post-card,
.related-posts-section .related-posts-grid .post-card,
.recently-viewed-section .recently-viewed-grid .post-card {
width: 100% !important;
max-width: none !important;
display: block !important;
break-inside: auto !important;
margin: 0 !important;
}
@media (max-width: 1400px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
}
@media (max-width: 1180px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
}
@media (max-width: 1024px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
}
@media (max-width: 768px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 1rem !important;
}
}
/* LarxVo single file author link inside info card */
.single-design-file .single-file-author-row {
border-radius: 14px;
margin: 0 -8px;
padding-left: 8px !important;
padding-right: 8px !important;
transition: background .2s ease, transform .2s ease;
}
.single-design-file .single-file-author-row:hover {
background: #f6f8ff;
transform: translateX(2px);
}
.single-design-file .single-file-author-row:hover strong,
.single-design-file .single-file-author-row:hover .single-file-author-arrow {
color: #2a68e9 !important;
}
/* v9: single design file cards breathe better */
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
display: grid !important;
grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
gap: 24px !important;
row-gap: 30px !important;
column-count: initial !important;
column-gap: 24px !important;
align-items: start !important;
}
.single-design-file .related-posts-grid .post-card,
.single-design-file .recently-viewed-grid .post-card,
.single-design-file .related-posts-grid .design-file-card,
.single-design-file .recently-viewed-grid .design-file-card,
.related-posts-section .related-posts-grid .post-card,
.recently-viewed-section .recently-viewed-grid .post-card,
.related-posts-section .related-posts-grid .design-file-card,
.recently-viewed-section .recently-viewed-grid .design-file-card {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
}
@media (max-width: 1400px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
}
@media (max-width: 1180px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 22px !important;
}
}
@media (max-width: 900px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 18px !important;
}
}
@media (max-width: 640px) {
.single-design-file .related-posts-grid,
.single-design-file .recently-viewed-grid,
.related-posts-section .related-posts-grid,
.recently-viewed-section .recently-viewed-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 14px !important;
}
}
/* v10: VietQR scan animation + cleaner VNĐ-only payment UI */
.larxvo-qr-scan-wrap{
position:relative!important;
overflow:hidden!important;
border-radius:12px!important;
isolation:isolate!important;
}
.larxvo-qr-scan-wrap::before{
content:""!important;
position:absolute!important;
left:6%!important;
right:6%!important;
top:0!important;
height:4px!important;
border-radius:999px!important;
background:linear-gradient(90deg,rgba(34,197,94,0),rgba(34,197,94,.95),rgba(187,247,208,.95),rgba(34,197,94,.95),rgba(34,197,94,0))!important;
box-shadow:0 0 14px rgba(34,197,94,.95),0 0 30px rgba(34,197,94,.42)!important;
z-index:3!important;
pointer-events:none!important;
animation:larxvoQrScan 2.35s ease-in-out infinite alternate!important;
}
.larxvo-qr-scan-wrap::after{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
top:0!important;
height:34%!important;
background:linear-gradient(180deg,rgba(34,197,94,.18),rgba(34,197,94,0))!important;
transform:translateY(-100%)!important;
z-index:2!important;
pointer-events:none!important;
animation:larxvoQrScanGlow 2.35s ease-in-out infinite alternate!important;
}
.larxvo-qr-scan-wrap img{position:relative!important;z-index:1!important}
@keyframes larxvoQrScan{0%{top:4%}100%{top:92%}}
@keyframes larxvoQrScanGlow{0%{transform:translateY(-58%)}100%{transform:translateY(230%)}}
@media (prefers-reduced-motion: reduce){
.larxvo-qr-scan-wrap::before,
.larxvo-qr-scan-wrap::after{animation:none!important}
}
/* v10: slightly roomier design file cards on desktop */
.posts-grid{
column-gap:28px!important;
}
.posts-grid .post-card,
.posts-grid .design-file-card,
.posts-grid article.post-card,
.post-card.pinterest-style{
margin-bottom:28px!important;
}
.related-posts-grid,
.recently-viewed-grid,
.lv-seller-product-grid{
column-gap:30px!important;
}
.related-posts-grid .post-card,
.recently-viewed-grid .post-card,
.lv-seller-product-grid .post-card,
.lv-seller-product-grid .design-file-card,
.lv-seller-product-grid article,
.lv-seller-product-grid .post-card.pinterest-style{
margin-bottom:30px!important;
}
@media(max-width:1180px){
.posts-grid,.related-posts-grid,.recently-viewed-grid,.lv-seller-product-grid{column-gap:22px!important}
.posts-grid .post-card,.posts-grid .design-file-card,.posts-grid article.post-card,.post-card.pinterest-style,
.related-posts-grid .post-card,.recently-viewed-grid .post-card,.lv-seller-product-grid .post-card,.lv-seller-product-grid .design-file-card,.lv-seller-product-grid article{margin-bottom:22px!important}
}
@media(max-width:640px){
.posts-grid,.related-posts-grid,.recently-viewed-grid,.lv-seller-product-grid{column-gap:14px!important}
.posts-grid .post-card,.posts-grid .design-file-card,.posts-grid article.post-card,.post-card.pinterest-style,
.related-posts-grid .post-card,.recently-viewed-grid .post-card,.lv-seller-product-grid .post-card,.lv-seller-product-grid .design-file-card,.lv-seller-product-grid article{margin-bottom:14px!important}
}
/* v10: light/dark mode toggle */
.lv-theme-toggle{
width:38px!important;
height:38px!important;
min-width:38px!important;
border-radius:999px!important;
display:inline-grid!important;
place-items:center!important;
position:relative!important;
overflow:hidden!important;
background:linear-gradient(135deg,rgba(42,104,233,.12),rgba(42,104,233,.05))!important;
color:var(--color-primary)!important;
border:1px solid rgba(42,104,233,.12)!important;
box-shadow:0 10px 22px rgba(42,104,233,.10)!important;
}
.lv-theme-toggle:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(42,104,233,.16)!important}
.lv-theme-toggle-icon{position:absolute;display:grid;place-items:center;transition:opacity .24s ease,transform .24s ease}
.lv-theme-toggle svg{width:18px;height:18px;display:block}
.lv-theme-toggle-sun{opacity:0;transform:translateY(10px) rotate(-35deg) scale(.72)}
.lv-theme-toggle-moon{opacity:1;transform:translateY(0) rotate(0) scale(1)}
html.lv-theme-dark .lv-theme-toggle{background:rgba(255,255,255,.08)!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important;box-shadow:0 10px 24px rgba(0,0,0,.22)!important}
html.lv-theme-dark .lv-theme-toggle-sun{opacity:1;transform:translateY(0) rotate(0) scale(1)}
html.lv-theme-dark .lv-theme-toggle-moon{opacity:0;transform:translateY(-10px) rotate(35deg) scale(.72)}
/* v10: dark mode surfaces, text and common components */
html.lv-theme-dark{
color-scheme:dark;
--color-primary:#7aa2ff;
--color-primary-hover:#9bb8ff;
--color-secondary:#fbbf24;
--color-danger:#fb7185;
--color-text:#e5edff;
--color-text-light:#8fa2c4;
--color-border:rgba(148,163,184,.18);
--color-bg:#070b16;
--color-bg-light:#101827;
--color-top:#0b1120;
--lv-bg:#070b16;
--lv-bg-soft:#0b1120;
--lv-bg-muted:#111827;
--lv-bg-glass:rgba(15,23,42,.72);
--lv-text:#e5edff;
--lv-text-soft:#cbd5e1;
--lv-text-muted:#94a3b8;
--lv-text-faint:#64748b;
--lv-border:rgba(148,163,184,.16);
--lv-border-strong:rgba(148,163,184,.24);
--lv-primary:#e5edff;
--lv-primary-soft:#111827;
--lv-accent:#7aa2ff;
--lv-accent-soft:rgba(122,162,255,.14);
--lv-pro:#f8fafc;
}
html.lv-theme-dark body,
html.lv-theme-dark .site-wrapper,
html.lv-theme-dark .site-main{
background:#070b16!important;
color:#e5edff!important;
}
html.lv-theme-dark a{color:inherit}
html.lv-theme-dark p,
html.lv-theme-dark small,
html.lv-theme-dark .text-muted{color:#9fb0cf!important}
html.lv-theme-dark h1,
html.lv-theme-dark h2,
html.lv-theme-dark h3,
html.lv-theme-dark h4,
html.lv-theme-dark h5,
html.lv-theme-dark h6,
html.lv-theme-dark strong{color:#edf3ff!important}
html.lv-theme-dark .top-menu,
html.lv-theme-dark .site-header,
html.lv-theme-dark .secondary-navigation,
html.lv-theme-dark .mobile-menu-header,
html.lv-theme-dark .account-dropdown-menu{
background:rgba(9,14,27,.92)!important;
border-color:rgba(148,163,184,.14)!important;
box-shadow:0 18px 44px rgba(0,0,0,.26)!important;
backdrop-filter:blur(16px) saturate(145%);
-webkit-backdrop-filter:blur(16px) saturate(145%);
}
html.lv-theme-dark .main-navigation a,
html.lv-theme-dark .top-navigation a,
html.lv-theme-dark .dropdown-item,
html.lv-theme-dark .user-account-btn{color:#dce7ff!important}
html.lv-theme-dark .main-navigation a:hover,
html.lv-theme-dark .top-navigation a:hover,
html.lv-theme-dark .dropdown-item:hover{color:#9bb8ff!important}
html.lv-theme-dark .search-form,
html.lv-theme-dark .search-field,
html.lv-theme-dark .search-type-wrapper,
html.lv-theme-dark input,
html.lv-theme-dark textarea,
html.lv-theme-dark select{
background:#0f172a!important;
color:#e5edff!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark input::placeholder,
html.lv-theme-dark textarea::placeholder{color:#64748b!important}
html.lv-theme-dark .post-card,
html.lv-theme-dark .design-file-card,
html.lv-theme-dark .filter-section,
html.lv-theme-dark .sidebar-widget,
html.lv-theme-dark .single-file-card,
html.lv-theme-dark .related-posts-section,
html.lv-theme-dark .recently-viewed-section,
html.lv-theme-dark .larxvo-bank-container,
html.lv-theme-dark .lv-follow-account-panel,
html.lv-theme-dark .lv-follow-card,
html.lv-theme-dark .lv-follow-follower-card,
html.lv-theme-dark .lv-ranking-page,
html.lv-theme-dark .lv-ranking-panel,
html.lv-theme-dark .lv-rank-file,
html.lv-theme-dark .lv-rank-list-row,
html.lv-theme-dark .lv-seller-profile-card,
html.lv-theme-dark .lv-seller-store-panel,
html.lv-theme-dark .lv-seller-tabs,
html.lv-theme-dark .account-page,
html.lv-theme-dark .account-content,
html.lv-theme-dark .affiliate-dashboard-v2,
html.lv-theme-dark .aff-stat-card{
background:#0f172a!important;
color:#e5edff!important;
border-color:rgba(148,163,184,.16)!important;
box-shadow:0 18px 48px rgba(0,0,0,.18)!important;
}
html.lv-theme-dark .post-content,
html.lv-theme-dark .card-content,
html.lv-theme-dark .lv-rank-info,
html.lv-theme-dark .lv-follow-empty,
html.lv-theme-dark .lv-follow-insight-grid>div,
html.lv-theme-dark .no-posts,
html.lv-theme-dark .plan-summary-chip{
background:#111827!important;
color:#dbe7ff!important;
border-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .larxvo-bank-left h3,
html.lv-theme-dark .larxvo-bank-left p,
html.lv-theme-dark .larxvo-bank-left strong{color:#dbe7ff!important}
html.lv-theme-dark .highlight-text{color:#9bb8ff!important}
html.lv-theme-dark .larxvo-bank-right img,
html.lv-theme-dark .aff-qr-preview-wrap,
html.lv-theme-dark .larxvo-qr-scan-wrap{background:#fff!important}
html.lv-theme-dark .affiliate-dashboard-v2 [style*="background: #fff"],
html.lv-theme-dark .affiliate-dashboard-v2 [style*="background:#fff"],
html.lv-theme-dark .affiliate-dashboard-v2 [style*="background: #f8fafc"],
html.lv-theme-dark .affiliate-dashboard-v2 [style*="background:#f8fafc"],
html.lv-theme-dark .account-page [style*="background: #fff"],
html.lv-theme-dark .account-page [style*="background:#fff"]{
background:#0f172a!important;
color:#e5edff!important;
border-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .affiliate-dashboard-v2 [style*="color: #1e293b"],
html.lv-theme-dark .affiliate-dashboard-v2 [style*="color:#1e293b"],
html.lv-theme-dark .affiliate-dashboard-v2 [style*="color: #64748b"],
html.lv-theme-dark .affiliate-dashboard-v2 [style*="color:#64748b"],
html.lv-theme-dark .account-page [style*="color: #1e293b"],
html.lv-theme-dark .account-page [style*="color:#1e293b"]{
color:#dbe7ff!important;
}
html.lv-theme-dark table,
html.lv-theme-dark th,
html.lv-theme-dark td{border-color:rgba(148,163,184,.15)!important}
html.lv-theme-dark thead tr,
html.lv-theme-dark tr[style*="background: #f8fafc"]{background:#111827!important}
html.lv-theme-dark .btn-outline,
html.lv-theme-dark .user-account-btn,
html.lv-theme-dark .search-toggle-btn{
background:#111827!important;
border-color:rgba(148,163,184,.18)!important;
color:#e5edff!important;
}
html.lv-theme-dark .btn-primary,
html.lv-theme-dark .btn-shimmer{box-shadow:0 16px 30px rgba(42,104,233,.24)!important}
html.lv-theme-dark .mobile-menu-overlay{background:rgba(2,6,23,.72)!important}
@media(max-width:768px){.lv-theme-toggle{width:36px!important;height:36px!important;min-width:36px!important}}
/* v11: real moving VietQR scanner line + deeper dark mode coverage */
.larxvo-qr-scan-wrap.has-lv-real-qr-scan::before,
.larxvo-qr-scan-wrap.has-lv-real-qr-scan::after{
display:none!important;
animation:none!important;
}
.larxvo-qr-scan-wrap{position:relative!important;overflow:hidden!important;isolation:isolate!important}
.lv-qr-scan-real{
position:absolute!important;
inset:0!important;
z-index:9!important;
pointer-events:none!important;
border-radius:inherit!important;
overflow:hidden!important;
display:block!important;
}
.lv-qr-scan-real::before{
content:""!important;
position:absolute!important;
left:0!important;
right:0!important;
top:0!important;
height:42%!important;
background:linear-gradient(180deg,rgba(34,197,94,.22),rgba(187,247,208,.13) 42%,rgba(34,197,94,0))!important;
opacity:.86!important;
transform:translateY(-60%)!important;
animation:lvQrScanGlowV11 2.05s ease-in-out infinite alternate!important;
will-change:transform!important;
}
.lv-qr-scan-real__line{
position:absolute!important;
left:5%!important;
right:5%!important;
top:4%!important;
height:5px!important;
border-radius:999px!important;
display:block!important;
background:linear-gradient(90deg,rgba(34,197,94,0),rgba(22,163,74,.92) 20%,rgba(187,247,208,1) 50%,rgba(22,163,74,.92) 80%,rgba(34,197,94,0))!important;
box-shadow:0 0 14px rgba(34,197,94,.95),0 0 28px rgba(34,197,94,.52),0 0 48px rgba(187,247,208,.26)!important;
animation:lvQrScanLineV11 2.05s ease-in-out infinite alternate!important;
will-change:top,opacity!important;
}
@keyframes lvQrScanLineV11{0%{top:4%;opacity:.72}8%{opacity:1}100%{top:calc(96% - 5px);opacity:1}}
@keyframes lvQrScanGlowV11{0%{transform:translateY(-62%);opacity:.55}100%{transform:translateY(220%);opacity:.95}}
html.lv-theme-dark{
--lv-dark-page:#0a1020;
--lv-dark-surface:#0f172a;
--lv-dark-surface-2:#111b31;
--lv-dark-surface-3:#17233a;
--lv-dark-border:rgba(148,163,184,.18);
--lv-dark-text:#eef5ff;
--lv-dark-muted:#9fb0cf;
--lv-dark-soft:#c9d7f2;
}
html.lv-theme-dark body,
html.lv-theme-dark .site,
html.lv-theme-dark .site-main,
html.lv-theme-dark .single-design-file,
html.lv-theme-dark .lv-seller-page,
html.lv-theme-dark .site-main.account-page,
html.lv-theme-dark .woocommerce,
html.lv-theme-dark .woocommerce-page{
background:var(--lv-dark-page)!important;
color:var(--lv-dark-text)!important;
}
html.lv-theme-dark .container,
html.lv-theme-dark .lv-container{color:var(--lv-dark-text)!important}
html.lv-theme-dark h1,
html.lv-theme-dark h2,
html.lv-theme-dark h3,
html.lv-theme-dark h4,
html.lv-theme-dark h5,
html.lv-theme-dark h6,
html.lv-theme-dark .section-title,
html.lv-theme-dark .entry-title,
html.lv-theme-dark .post-title,
html.lv-theme-dark .card-title,
html.lv-theme-dark .account-title-wrap h1,
html.lv-theme-dark .lv-seller-name-row h1,
html.lv-theme-dark .lv-seller-section-head h2,
html.lv-theme-dark .lv-seller-side-card h2,
html.lv-theme-dark .lv-seller-panel h2{
color:var(--lv-dark-text)!important;
}
html.lv-theme-dark p,
html.lv-theme-dark small,
html.lv-theme-dark label,
html.lv-theme-dark .breadcrumb,
html.lv-theme-dark .meta-info,
html.lv-theme-dark .info-label,
html.lv-theme-dark .price-note,
html.lv-theme-dark .lv-seller-headline,
html.lv-theme-dark .lv-seller-section-head p,
html.lv-theme-dark .lv-seller-side-card p,
html.lv-theme-dark .lv-seller-panel p,
html.lv-theme-dark .account-title-wrap p,
html.lv-theme-dark .account-overview-card .eyebrow,
html.lv-theme-dark .feature-list,
html.lv-theme-dark .plan-detail-rich,
html.lv-theme-dark .plan-detail-meta-card span{
color:var(--lv-dark-muted)!important;
}
html.lv-theme-dark strong,
html.lv-theme-dark .info-value,
html.lv-theme-dark .price,
html.lv-theme-dark .badge-value,
html.lv-theme-dark .account-overview-card strong,
html.lv-theme-dark .plan-detail-meta-card strong{
color:var(--lv-dark-text)!important;
}
html.lv-theme-dark a:not(.btn):not(.lv-btn):not(.btn-primary):not(.btn-purchase):not(.larxvo-download-btn){color:#cfe0ff!important}
/* account center */
html.lv-theme-dark body .site-main.account-page .account-topbar,
html.lv-theme-dark body .site-main.account-page .account-overview-card,
html.lv-theme-dark body .site-main.account-page .account-info-card,
html.lv-theme-dark body .site-main.account-page .account-panel,
html.lv-theme-dark body .site-main.account-page .free-plan-context,
html.lv-theme-dark body .site-main.account-page .pricing-card,
html.lv-theme-dark body .site-main.account-page .plan-detail-panel,
html.lv-theme-dark body .site-main.account-page .plan-detail-meta-card,
html.lv-theme-dark body .site-main.account-page .feature-badge,
html.lv-theme-dark body .site-main.account-page .lv-dashboard-panel,
html.lv-theme-dark body .site-main.account-page .lv-seller-dashboard,
html.lv-theme-dark body .site-main.account-page .lv-seller-products-layout,
html.lv-theme-dark body .site-main.account-page .lv-card-clean,
html.lv-theme-dark body .site-main.account-page .lv-follow-account-panel,
html.lv-theme-dark body .site-main.account-page .lv-follow-card,
html.lv-theme-dark body .site-main.account-page .lv-follow-follower-card,
html.lv-theme-dark body .site-main.account-page .account-section{
background:linear-gradient(180deg,var(--lv-dark-surface),#0d1629)!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
box-shadow:0 18px 48px rgba(0,0,0,.24)!important;
}
html.lv-theme-dark body .site-main.account-page .account-tabs-wrap{
background:rgba(10,16,32,.74)!important;
border-color:var(--lv-dark-border)!important;
box-shadow:none!important;
backdrop-filter:blur(18px) saturate(155%)!important;
-webkit-backdrop-filter:blur(18px) saturate(155%)!important;
}
html.lv-theme-dark body .site-main.account-page .account-tab-link{
background:#1a2438!important;
color:#dce8ff!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 10px 24px rgba(0,0,0,.20)!important;
}
html.lv-theme-dark body .site-main.account-page .account-tab-link.active{
background:linear-gradient(135deg,#2f6bff,#607cff)!important;
color:#fff!important;
border-color:rgba(96,124,255,.55)!important;
}
html.lv-theme-dark body .site-main.account-page .account-tab-link .tab-icon{
background:rgba(255,255,255,.08)!important;
color:inherit!important;
}
html.lv-theme-dark body .site-main.account-page .notice,
html.lv-theme-dark body .site-main.account-page .notice-warning,
html.lv-theme-dark body .site-main.account-page .notice-info{
background:#172033!important;
color:#dce8ff!important;
border-color:rgba(245,158,11,.28)!important;
}
html.lv-theme-dark body .site-main.account-page .pricing-card.recommended,
html.lv-theme-dark body .site-main.account-page .pricing-card.best-value{
background:linear-gradient(180deg,#13203a,#0f172a)!important;
}
html.lv-theme-dark body .site-main.account-page .feature-badge.highlight{
background:#172544!important;
border-color:rgba(96,165,250,.35)!important;
}
html.lv-theme-dark body .site-main.account-page .plan-expand-trigger,
html.lv-theme-dark body .site-main.account-page .btn-purchase:not(.primary):not(.featured){
background:#1a2740!important;
color:#dbeafe!important;
border-color:rgba(148,163,184,.18)!important;
}
/* single file */
html.lv-theme-dark body .single-design-file .post-thumbnail-wrapper,
html.lv-theme-dark body .single-design-file .sidebar-card,
html.lv-theme-dark body .single-design-file .download-card,
html.lv-theme-dark body .single-design-file .taxonomy-card,
html.lv-theme-dark body .single-design-file .entry-content,
html.lv-theme-dark body .single-design-file .related-posts-section,
html.lv-theme-dark body .single-design-file .recently-viewed-section,
html.lv-theme-dark body .single-design-file .larxvo-download-floating,
html.lv-theme-dark body .single-design-file .vip-active-notice,
html.lv-theme-dark body .single-design-file .vip-notice,
html.lv-theme-dark body .single-design-file .larxvo-visible-rating{
background:linear-gradient(180deg,var(--lv-dark-surface),#0d1629)!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
box-shadow:0 18px 48px rgba(0,0,0,.22)!important;
}
html.lv-theme-dark body .single-design-file .info-row,
html.lv-theme-dark body .single-design-file .single-file-author-row{
border-color:var(--lv-dark-border)!important;
color:var(--lv-dark-soft)!important;
}
html.lv-theme-dark body .single-design-file .action-btn,
html.lv-theme-dark body .single-design-file .tag-item,
html.lv-theme-dark body .single-design-file .vip-badge-inline,
html.lv-theme-dark body .single-design-file .modern-download-progress{
background:#172033!important;
color:#dce8ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark body .single-design-file .post-content-area,
html.lv-theme-dark body .single-design-file .single-design-sidebar{color:var(--lv-dark-text)!important}
/* seller profile / creator store */
html.lv-theme-dark body .lv-seller-page .lv-seller-profile,
html.lv-theme-dark body .lv-seller-page .lv-card,
html.lv-theme-dark body .lv-seller-page .lv-card-clean,
html.lv-theme-dark body .lv-seller-page .lv-seller-side-card,
html.lv-theme-dark body .lv-seller-page .lv-seller-products,
html.lv-theme-dark body .lv-seller-page .lv-seller-panel,
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs,
html.lv-theme-dark body .lv-seller-page .lv-seller-store-filters,
html.lv-theme-dark body .lv-seller-page .lv-seller-empty,
html.lv-theme-dark body .lv-seller-page .lv-pro-unlocked-box,
html.lv-theme-dark body .lv-seller-page .lv-service-preview-grid>div{
background:linear-gradient(180deg,var(--lv-dark-surface),#0d1629)!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
box-shadow:0 18px 48px rgba(0,0,0,.22)!important;
}
html.lv-theme-dark body .lv-seller-page .lv-seller-meta-line span,
html.lv-theme-dark body .lv-seller-page .lv-seller-socials a,
html.lv-theme-dark body .lv-seller-page .lv-badge:not(.lv-badge-pro),
html.lv-theme-dark body .lv-seller-page .lv-store-search,
html.lv-theme-dark body .lv-seller-page .lv-store-type-filter,
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs a{
background:#172033!important;
color:#dce8ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs a.is-active,
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs a:hover{
background:#dbeafe!important;
color:#1d4ed8!important;
}
html.lv-theme-dark body .lv-seller-page .lv-store-search input,
html.lv-theme-dark body .lv-seller-page .lv-store-type-filter{
background:#111b31!important;
color:#eaf2ff!important;
}
html.lv-theme-dark body .lv-seller-page .lv-seller-product-grid .post-card,
html.lv-theme-dark body .lv-seller-page .lv-seller-product-grid .design-file-card,
html.lv-theme-dark body .lv-seller-page .lv-seller-product-grid article{
background:#10192d!important;
border-color:var(--lv-dark-border)!important;
}
/* generic inline style cleanup for dark mode, excluding QR/images */
html.lv-theme-dark body .account-page [style*="background: #fff"]:not(.larxvo-qr-scan-wrap):not(.aff-qr-preview-wrap),
html.lv-theme-dark body .account-page [style*="background:#fff"]:not(.larxvo-qr-scan-wrap):not(.aff-qr-preview-wrap),
html.lv-theme-dark body .account-page [style*="background: #f8fafc"],
html.lv-theme-dark body .account-page [style*="background:#f8fafc"],
html.lv-theme-dark body .single-design-file [style*="background: #fff"]:not(.larxvo-qr-scan-wrap),
html.lv-theme-dark body .single-design-file [style*="background:#fff"]:not(.larxvo-qr-scan-wrap),
html.lv-theme-dark body .single-design-file [style*="background: #f8f9fa"],
html.lv-theme-dark body .single-design-file [style*="background:#f8f9fa"],
html.lv-theme-dark body .lv-seller-page [style*="background: #fff"]:not(.larxvo-qr-scan-wrap),
html.lv-theme-dark body .lv-seller-page [style*="background:#fff"]:not(.larxvo-qr-scan-wrap),
html.lv-theme-dark body .lv-seller-page [style*="background: #f8fafc"],
html.lv-theme-dark body .lv-seller-page [style*="background:#f8fafc"]{
background:var(--lv-dark-surface)!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark body .account-page [style*="color: #1f2937"],
html.lv-theme-dark body .account-page [style*="color:#1f2937"],
html.lv-theme-dark body .account-page [style*="color: #374151"],
html.lv-theme-dark body .account-page [style*="color:#374151"],
html.lv-theme-dark body .account-page [style*="color: #4a5568"],
html.lv-theme-dark body .account-page [style*="color:#4a5568"],
html.lv-theme-dark body .single-design-file [style*="color: #333"],
html.lv-theme-dark body .single-design-file [style*="color:#333"],
html.lv-theme-dark body .single-design-file [style*="color: #4a5568"],
html.lv-theme-dark body .single-design-file [style*="color:#4a5568"]{
color:var(--lv-dark-text)!important;
}
html.lv-theme-dark body .account-page [style*="color: #6b7280"],
html.lv-theme-dark body .account-page [style*="color:#6b7280"],
html.lv-theme-dark body .account-page [style*="color: #64748b"],
html.lv-theme-dark body .account-page [style*="color:#64748b"],
html.lv-theme-dark body .single-design-file [style*="color: #64748b"],
html.lv-theme-dark body .single-design-file [style*="color:#64748b"],
html.lv-theme-dark body .single-design-file [style*="color: #718096"],
html.lv-theme-dark body .single-design-file [style*="color:#718096"]{
color:var(--lv-dark-muted)!important;
}
html.lv-theme-dark body input,
html.lv-theme-dark body textarea,
html.lv-theme-dark body select,
html.lv-theme-dark body .search-field,
html.lv-theme-dark body .lv-input,
html.lv-theme-dark body .lv-select,
html.lv-theme-dark body .lv-textarea{
background:#111b31!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark body input::placeholder,
html.lv-theme-dark body textarea::placeholder{color:#7183a6!important}
html.lv-theme-dark body .larxvo-qr-scan-wrap,
html.lv-theme-dark body .aff-qr-preview-wrap,
html.lv-theme-dark body .larxvo-bank-right img,
html.lv-theme-dark body #qr-preview-img{
background:#fff!important;
color:#0f172a!important;
}
html.lv-theme-dark body .larxvo-bank-container{
background:linear-gradient(180deg,var(--lv-dark-surface),#0d1629)!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark body .larxvo-bank-left h3{border-color:var(--lv-dark-border)!important}
html.lv-theme-dark body mark.order-id{background:#facc15!important;color:#422006!important}
html.lv-theme-dark body table,
html.lv-theme-dark body thead,
html.lv-theme-dark body tbody,
html.lv-theme-dark body tr,
html.lv-theme-dark body td,
html.lv-theme-dark body th{
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark body thead tr,
html.lv-theme-dark body tr[style*="background: #f8fafc"]{
background:#172033!important;
color:var(--lv-dark-text)!important;
}
@media(max-width:768px){
html.lv-theme-dark body .site-main.account-page .account-tabs-wrap{background:rgba(10,16,32,.94)!important}
}
/* v12: force real moving QR scanner + complete dark mode polish */
.larxvo-qr-scan-wrap,
.aff-qr-preview-wrap{
position:relative!important;
overflow:hidden!important;
isolation:isolate!important;
border-radius:12px!important;
background:#fff!important;
}
.larxvo-qr-scan-wrap::before,
.larxvo-qr-scan-wrap::after,
.larxvo-qr-scan-wrap.has-lv-real-qr-scan::before,
.larxvo-qr-scan-wrap.has-lv-real-qr-scan::after{
display:none!important;
content:none!important;
animation:none!important;
}
.larxvo-qr-scan-wrap img,
.aff-qr-preview-wrap img,
#qr-preview-img{
position:relative!important;
z-index:1!important;
display:block!important;
}
.lv-qr-scan-real{
position:absolute!important;
inset:0!important;
z-index:20!important;
pointer-events:none!important;
overflow:hidden!important;
border-radius:inherit!important;
display:block!important;
transform:translateZ(0)!important;
}
.lv-qr-scan-real__glow{
position:absolute!important;
left:0!important;
right:0!important;
top:0!important;
height:48%!important;
display:block!important;
background:linear-gradient(180deg,rgba(34,197,94,.22),rgba(187,247,208,.18) 35%,rgba(34,197,94,0) 100%)!important;
mix-blend-mode:multiply!important;
will-change:transform,opacity!important;
}
.lv-qr-scan-real__line{
position:absolute!important;
left:5%!important;
right:5%!important;
top:0!important;
height:5px!important;
display:block!important;
border-radius:999px!important;
background:linear-gradient(90deg,rgba(34,197,94,0),rgba(22,163,74,.92) 16%,rgba(187,247,208,1) 50%,rgba(22,163,74,.92) 84%,rgba(34,197,94,0))!important;
box-shadow:0 0 12px rgba(34,197,94,.95),0 0 26px rgba(34,197,94,.58),0 0 44px rgba(187,247,208,.35)!important;
will-change:transform!important;
animation:none!important;
transform:translate3d(0,6px,0);
}
html.lv-theme-dark,
body.lv-theme-dark{
--lv-dark-page:#070d1b;
--lv-dark-surface:#0d1628;
--lv-dark-surface-2:#111d33;
--lv-dark-surface-3:#17243b;
--lv-dark-border:rgba(148,163,184,.18);
--lv-dark-border-strong:rgba(148,163,184,.28);
--lv-dark-text:#f3f7ff;
--lv-dark-muted:#a9b8d4;
--lv-dark-faint:#7f91b2;
--color-text:#f3f7ff;
--color-text-light:#a9b8d4;
--color-bg:#070d1b;
--color-bg-light:#111d33;
--color-border:rgba(148,163,184,.18);
}
html.lv-theme-dark body,
body.lv-theme-dark,
html.lv-theme-dark .site,
html.lv-theme-dark .site-wrapper,
html.lv-theme-dark .site-main,
html.lv-theme-dark main,
html.lv-theme-dark .content-layout,
html.lv-theme-dark .main-content{
background:var(--lv-dark-page)!important;
color:var(--lv-dark-text)!important;
}
html.lv-theme-dark .site-header,
html.lv-theme-dark .top-menu,
html.lv-theme-dark .main-header,
html.lv-theme-dark .secondary-navigation,
html.lv-theme-dark .site-footer,
html.lv-theme-dark footer{
background:#0b1324!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .site-logo a,
html.lv-theme-dark .main-navigation a,
html.lv-theme-dark .top-navigation a,
html.lv-theme-dark .footer-widget h3,
html.lv-theme-dark .footer-title{
color:var(--lv-dark-text)!important;
}
/* dark search */
html.lv-theme-dark .search-form,
html.lv-theme-dark .search-container,
html.lv-theme-dark .search-type-wrapper,
html.lv-theme-dark .search-input-wrapper,
html.lv-theme-dark .search-field,
html.lv-theme-dark .search-type-btn,
html.lv-theme-dark .custom-select-trigger{
background:#111b31!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .search-field::placeholder{color:#7f91b2!important}
html.lv-theme-dark .search-autocomplete-dropdown,
html.lv-theme-dark .custom-select-options,
html.lv-theme-dark .account-dropdown-menu{
background:#0f172a!important;
color:#eaf2ff!important;
border:1px solid var(--lv-dark-border-strong)!important;
box-shadow:0 24px 60px rgba(0,0,0,.42)!important;
}
html.lv-theme-dark .autocomplete-header,
html.lv-theme-dark .autocomplete-section,
html.lv-theme-dark .autocomplete-item,
html.lv-theme-dark .autocomplete-view-all,
html.lv-theme-dark .custom-select-option,
html.lv-theme-dark .dropdown-item{
background:#0f172a!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .autocomplete-title,
html.lv-theme-dark .post-title,
html.lv-theme-dark .autocomplete-item strong,
html.lv-theme-dark .autocomplete-item .title{
color:#f3f7ff!important;
}
html.lv-theme-dark .autocomplete-item:hover,
html.lv-theme-dark .custom-select-option:hover,
html.lv-theme-dark .dropdown-item:hover{
background:#17243b!important;
color:#fff!important;
}
html.lv-theme-dark .autocomplete-item .tag,
html.lv-theme-dark .autocomplete-tag,
html.lv-theme-dark .post-type-badge,
html.lv-theme-dark .meta-item,
html.lv-theme-dark .post-format-icon-fallback{
background:#1d2a44!important;
color:#dbeafe!important;
border-color:rgba(148,163,184,.2)!important;
}
html.lv-theme-dark .autocomplete-loading,
html.lv-theme-dark .autocomplete-empty,
html.lv-theme-dark .autocomplete-error{background:#0f172a!important;color:#a9b8d4!important}
html.lv-theme-dark .autocomplete-panel-header,
html.lv-theme-dark .autocomplete-hot-title,
html.lv-theme-dark .autocomplete-hot-file{
color:#f3f7ff!important;
}
html.lv-theme-dark .autocomplete-chip,
html.lv-theme-dark .autocomplete-keyword-button{
background:#17243b!important;
color:#eaf2ff!important;
}
html.lv-theme-dark .autocomplete-hot-keyword{
background:#2a2234!important;
color:#fed7aa!important;
}
html.lv-theme-dark .autocomplete-hot-thumb{
background:#17243b!important;
color:#7f91b2!important;
}
html.lv-theme-dark .autocomplete-hot-file:hover{
background:#17243b!important;
}
html.lv-theme-dark .autocomplete-hot-meta,
html.lv-theme-dark .autocomplete-history-remove{
color:#a9b8d4!important;
}
/* dark collections and design cards */
html.lv-theme-dark .collection-card,
html.lv-theme-dark .featured-collection-card,
html.lv-theme-dark .collection-card[style],
html.lv-theme-dark .post-card,
html.lv-theme-dark .design-file-card,
html.lv-theme-dark article.post-card,
html.lv-theme-dark .post-card.pinterest-style{
background:#0f172a!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
box-shadow:0 18px 44px rgba(0,0,0,.30)!important;
}
html.lv-theme-dark .collection-info,
html.lv-theme-dark .post-card-content,
html.lv-theme-dark .card-content,
html.lv-theme-dark .post-content,
html.lv-theme-dark .post-info{
background:transparent!important;
color:var(--lv-dark-text)!important;
}
html.lv-theme-dark .collection-info h3,
html.lv-theme-dark .collection-card h3,
html.lv-theme-dark .post-card h2,
html.lv-theme-dark .post-card h3,
html.lv-theme-dark .design-file-card h2,
html.lv-theme-dark .design-file-card h3,
html.lv-theme-dark .post-card-title,
html.lv-theme-dark .post-title a{
color:#f3f7ff!important;
}
html.lv-theme-dark .collection-count,
html.lv-theme-dark .file-count,
html.lv-theme-dark .post-meta,
html.lv-theme-dark .post-card small,
html.lv-theme-dark .design-file-card small{
color:#a9b8d4!important;
}
html.lv-theme-dark .collection-card .btn,
html.lv-theme-dark .collection-card a:not(.collection-card),
html.lv-theme-dark .collection-link{
color:#82aaff!important;
}
/* dark account panels */
html.lv-theme-dark .site-main.account-page .account-shell,
html.lv-theme-dark .site-main.account-page .account-content,
html.lv-theme-dark .site-main.account-page .account-panel,
html.lv-theme-dark .site-main.account-page .account-section,
html.lv-theme-dark .site-main.account-page .account-info-card,
html.lv-theme-dark .site-main.account-page .account-overview-card,
html.lv-theme-dark .site-main.account-page .account-topbar,
html.lv-theme-dark .site-main.account-page .account-collections-section,
html.lv-theme-dark .site-main.account-page .download-history-wrapper,
html.lv-theme-dark .site-main.account-page .orders-table-wrapper,
html.lv-theme-dark .site-main.account-page .affiliate-dashboard-v2,
html.lv-theme-dark .site-main.account-page .aff-stat-card,
html.lv-theme-dark .site-main.account-page .lv-dashboard-panel,
html.lv-theme-dark .site-main.account-page .lv-seller-dashboard,
html.lv-theme-dark .site-main.account-page .lv-seller-submit-panel,
html.lv-theme-dark .site-main.account-page .lv-seller-products-panel,
html.lv-theme-dark .site-main.account-page .lv-seller-products-layout,
html.lv-theme-dark .site-main.account-page .lv-card-clean,
html.lv-theme-dark .site-main.account-page .lv-follow-account-panel{
background:linear-gradient(180deg,#0f172a,#0c1425)!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
box-shadow:0 18px 48px rgba(0,0,0,.28)!important;
}
html.lv-theme-dark .site-main.account-page .account-tabs-wrap,
html.lv-theme-dark .site-main.account-page .account-tabs-scroll{
background:rgba(10,16,32,.88)!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .site-main.account-page .account-tab-link{
background:#1a2438!important;
color:#dce8ff!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .site-main.account-page .account-tab-link.active{
background:linear-gradient(135deg,#2f6bff,#607cff)!important;
color:#fff!important;
}
html.lv-theme-dark .site-main.account-page .stat-card,
html.lv-theme-dark .site-main.account-page .favorite-item,
html.lv-theme-dark .site-main.account-page .realtime-viewer-item,
html.lv-theme-dark .site-main.account-page .lv-seller-product-row,
html.lv-theme-dark .site-main.account-page .lv-seller-preview-card,
html.lv-theme-dark .site-main.account-page .lv-lock-card,
html.lv-theme-dark .site-main.account-page .lv-pro-featured-form,
html.lv-theme-dark .site-main.account-page .feature-badge,
html.lv-theme-dark .site-main.account-page .plan-detail-meta-card{
background:#111d33!important;
color:var(--lv-dark-text)!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .site-main.account-page .orders-table,
html.lv-theme-dark .site-main.account-page .download-history-table,
html.lv-theme-dark .site-main.account-page table,
html.lv-theme-dark .site-main.account-page thead,
html.lv-theme-dark .site-main.account-page tbody,
html.lv-theme-dark .site-main.account-page tr,
html.lv-theme-dark .site-main.account-page td,
html.lv-theme-dark .site-main.account-page th{
background:#0f172a!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .site-main.account-page thead tr,
html.lv-theme-dark .site-main.account-page th{
background:#15223a!important;
color:#cfe0ff!important;
}
html.lv-theme-dark .site-main.account-page input,
html.lv-theme-dark .site-main.account-page textarea,
html.lv-theme-dark .site-main.account-page select,
html.lv-theme-dark .site-main.account-page .lv-form-field input,
html.lv-theme-dark .site-main.account-page .lv-form-field textarea,
html.lv-theme-dark .site-main.account-page .lv-form-field select{
background:#111b31!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .site-main.account-page ::placeholder{color:#7183a6!important}
html.lv-theme-dark .site-main.account-page h1,
html.lv-theme-dark .site-main.account-page h2,
html.lv-theme-dark .site-main.account-page h3,
html.lv-theme-dark .site-main.account-page h4,
html.lv-theme-dark .site-main.account-page strong,
html.lv-theme-dark .site-main.account-page .download-file-name,
html.lv-theme-dark .site-main.account-page .favorite-info h3,
html.lv-theme-dark .site-main.account-page .lv-dashboard-title{
color:#f3f7ff!important;
}
html.lv-theme-dark .site-main.account-page p,
html.lv-theme-dark .site-main.account-page small,
html.lv-theme-dark .site-main.account-page span:not(.account-status-chip):not(.tab-icon):not(.badge):not(.order-status),
html.lv-theme-dark .site-main.account-page label,
html.lv-theme-dark .site-main.account-page .favorite-meta,
html.lv-theme-dark .site-main.account-page .lv-dashboard-desc,
html.lv-theme-dark .site-main.account-page .lv-seller-product-meta{
color:#a9b8d4!important;
}
/* dark WooCommerce cart + checkout */
html.lv-theme-dark .woocommerce,
html.lv-theme-dark .woocommerce-page,
html.lv-theme-dark .custom-woo-cart,
html.lv-theme-dark .woocommerce form.checkout,
html.lv-theme-dark #customer_details,
html.lv-theme-dark #order_review,
html.lv-theme-dark .woocommerce-checkout-review-order,
html.lv-theme-dark .woocommerce-checkout-payment,
html.lv-theme-dark .woocommerce table.shop_table,
html.lv-theme-dark .woocommerce-cart-form,
html.lv-theme-dark .cart-collaterals,
html.lv-theme-dark .cart_totals{
background:#0f172a!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
box-shadow:0 18px 48px rgba(0,0,0,.28)!important;
}
html.lv-theme-dark .custom-woo-cart table.shop_table tbody tr.cart_item,
html.lv-theme-dark .woocommerce table.shop_table tbody tr,
html.lv-theme-dark .woocommerce table.shop_table tfoot tr,
html.lv-theme-dark .woocommerce table.shop_table thead tr,
html.lv-theme-dark .woocommerce table.shop_table td,
html.lv-theme-dark .woocommerce table.shop_table th{
background:#111d33!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .woocommerce table.shop_table a,
html.lv-theme-dark .custom-woo-cart table.shop_table td.product-name a,
html.lv-theme-dark .woocommerce table.shop_table .product-name,
html.lv-theme-dark .woocommerce table.shop_table .product-total,
html.lv-theme-dark .woocommerce table.shop_table .order-total th,
html.lv-theme-dark .woocommerce table.shop_table .order-total td,
html.lv-theme-dark .cart_totals strong,
html.lv-theme-dark .cart_totals .amount{
color:#f3f7ff!important;
}
html.lv-theme-dark .custom-woo-cart table.shop_table td.product-thumbnail,
html.lv-theme-dark .custom-woo-cart table.shop_table .quantity{
background:#0b1324!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .woocommerce .woocommerce-message,
html.lv-theme-dark .woocommerce .woocommerce-info,
html.lv-theme-dark .woocommerce .woocommerce-error,
html.lv-theme-dark .woocommerce-notices-wrapper .woocommerce-message,
html.lv-theme-dark .woocommerce-notices-wrapper .woocommerce-info{
background:#111d33!important;
color:#eaf2ff!important;
border-top-color:#84cc16!important;
border-left-color:#84cc16!important;
box-shadow:none!important;
}
html.lv-theme-dark .woocommerce form .form-row input.input-text,
html.lv-theme-dark .woocommerce form .form-row textarea,
html.lv-theme-dark .woocommerce form .form-row select,
html.lv-theme-dark .woocommerce .input-text,
html.lv-theme-dark .woocommerce input,
html.lv-theme-dark .woocommerce textarea,
html.lv-theme-dark .woocommerce select{
background:#111b31!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .woocommerce input::placeholder,
html.lv-theme-dark .woocommerce textarea::placeholder{color:#7183a6!important}
html.lv-theme-dark .woocommerce-checkout-payment .payment_box,
html.lv-theme-dark .woocommerce-privacy-policy-text,
html.lv-theme-dark .woocommerce-terms-and-conditions-wrapper{
background:#111d33!important;
color:#a9b8d4!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark .woocommerce button.button,
html.lv-theme-dark .woocommerce a.button,
html.lv-theme-dark .woocommerce #payment #place_order,
html.lv-theme-dark .custom-woo-cart .checkout-button{
background:linear-gradient(135deg,#2f6bff,#607cff)!important;
color:#fff!important;
border:0!important;
}
/* dark page-specific inline white cleanup */
html.lv-theme-dark [style*="background: #fff"]:not(.larxvo-qr-scan-wrap):not(.aff-qr-preview-wrap):not(.larxvo-bank-right),
html.lv-theme-dark [style*="background:#fff"]:not(.larxvo-qr-scan-wrap):not(.aff-qr-preview-wrap):not(.larxvo-bank-right),
html.lv-theme-dark [style*="background: white"]:not(.larxvo-qr-scan-wrap):not(.aff-qr-preview-wrap):not(.larxvo-bank-right),
html.lv-theme-dark [style*="background:#ffffff"]:not(.larxvo-qr-scan-wrap):not(.aff-qr-preview-wrap):not(.larxvo-bank-right),
html.lv-theme-dark [style*="background: #f8fafc"],
html.lv-theme-dark [style*="background:#f8fafc"],
html.lv-theme-dark [style*="background: #f9fafb"],
html.lv-theme-dark [style*="background:#f9fafb"]{
background:#0f172a!important;
color:#eaf2ff!important;
border-color:var(--lv-dark-border)!important;
}
html.lv-theme-dark [style*="color: #111827"],
html.lv-theme-dark [style*="color:#111827"],
html.lv-theme-dark [style*="color: #1f2937"],
html.lv-theme-dark [style*="color:#1f2937"],
html.lv-theme-dark [style*="color: #1d2327"],
html.lv-theme-dark [style*="color:#1d2327"],
html.lv-theme-dark [style*="color: #374151"],
html.lv-theme-dark [style*="color:#374151"]{
color:#f3f7ff!important;
}
html.lv-theme-dark [style*="color: #64748b"],
html.lv-theme-dark [style*="color:#64748b"],
html.lv-theme-dark [style*="color: #6b7280"],
html.lv-theme-dark [style*="color:#6b7280"],
html.lv-theme-dark [style*="color: #666"],
html.lv-theme-dark [style*="color:#666"]{
color:#a9b8d4!important;
}
html.lv-theme-dark .larxvo-qr-scan-wrap,
html.lv-theme-dark .aff-qr-preview-wrap,
html.lv-theme-dark #qr-preview-img,
html.lv-theme-dark .larxvo-qr-scan-wrap img{
background:#fff!important;
color:#0f172a!important;
}
/* v13: Creator reviews + stronger dark-mode polish */
.lv-review-panel{
padding:28px!important;
border-radius:28px!important;
overflow:hidden!important;
}
.lv-review-head{
display:grid!important;
grid-template-columns:1fr auto!important;
gap:22px!important;
align-items:start!important;
margin-bottom:22px!important;
}
.lv-review-kicker{
display:inline-flex!important;
align-items:center!important;
gap:7px!important;
height:30px!important;
padding:0 12px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#3b6df6!important;
font-size:12px!important;
font-weight:900!important;
margin-bottom:10px!important;
}
.lv-review-head h2{margin:0 0 8px!important;font-size:26px!important;line-height:1.15!important;color:#0f172a!important}
.lv-review-head p{margin:0!important;color:#64748b!important;line-height:1.6!important}
.lv-review-score-card{
min-width:156px!important;
padding:18px!important;
border-radius:22px!important;
background:linear-gradient(180deg,#fff8db,#fff)!important;
border:1px solid rgba(245,158,11,.22)!important;
box-shadow:0 18px 38px rgba(245,158,11,.12)!important;
text-align:center!important;
}
.lv-review-score-card strong{display:block!important;font-size:38px!important;line-height:1!important;color:#d97706!important}
.lv-review-score-card small{display:block!important;margin-top:7px!important;color:#7c5a1d!important;font-weight:800!important}
.lv-review-stars{display:inline-flex!important;gap:2px!important;color:#cbd5e1!important;letter-spacing:.02em!important}
.lv-review-stars span{color:#cbd5e1!important}
.lv-review-stars span.is-filled{color:#f59e0b!important;text-shadow:0 4px 12px rgba(245,158,11,.28)!important}
.lv-review-stars-large{font-size:18px!important;margin-top:8px!important}
.lv-review-layout{display:grid!important;grid-template-columns:minmax(260px,380px) 1fr!important;gap:20px!important;align-items:start!important}
.lv-review-form-card,.lv-review-list-card{
background:#f8fafc!important;
border:1px solid rgba(148,163,184,.18)!important;
border-radius:24px!important;
padding:18px!important;
}
.lv-review-form-title{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;margin-bottom:14px!important;font-weight:900!important;color:#0f172a!important}
.lv-review-form-title b{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:56px!important;height:34px!important;border-radius:999px!important;background:#fff7ed!important;color:#d97706!important;border:1px solid rgba(245,158,11,.18)!important}
.lv-rating-control{padding:14px!important;border-radius:20px!important;background:#fff!important;border:1px solid rgba(148,163,184,.14)!important;margin-bottom:14px!important}
.lv-rating-stars-input{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;margin-bottom:10px!important}
.lv-rating-stars-input button{appearance:none!important;border:0!important;background:transparent!important;color:#cbd5e1!important;font-size:30px!important;line-height:1!important;cursor:pointer!important;padding:0 2px!important;transition:transform .18s ease,color .18s ease,text-shadow .18s ease!important}
.lv-rating-stars-input button:hover{transform:translateY(-1px) scale(1.08)!important}
.lv-rating-stars-input button.is-active{color:#f59e0b!important;text-shadow:0 6px 18px rgba(245,158,11,.32)!important}
.lv-rating-control input[type="range"]{width:100%!important;height:6px!important;accent-color:#f59e0b!important;cursor:grab!important;background:transparent!important;border:0!important;padding:0!important}
.lv-rating-control input[type="range"]:active{cursor:grabbing!important}
.lv-rating-scale{display:flex!important;justify-content:space-between!important;color:#94a3b8!important;font-size:12px!important;font-weight:800!important;margin-top:4px!important}
.lv-review-field{display:grid!important;gap:8px!important;margin-bottom:12px!important;color:#334155!important;font-weight:850!important}
.lv-review-field textarea{width:100%!important;resize:vertical!important;min-height:112px!important;border-radius:18px!important;border:1px solid rgba(148,163,184,.18)!important;background:#fff!important;color:#0f172a!important;padding:13px 14px!important;line-height:1.55!important;outline:none!important}
.lv-review-field textarea:focus{border-color:rgba(59,109,246,.55)!important;box-shadow:0 0 0 4px rgba(59,109,246,.10)!important}
.lv-review-anonymous-toggle{display:grid!important;grid-template-columns:auto 1fr!important;gap:10px!important;align-items:center!important;border:1px solid rgba(148,163,184,.16)!important;border-radius:18px!important;background:#fff!important;padding:12px!important;cursor:pointer!important;margin-bottom:14px!important;color:#334155!important}
.lv-review-anonymous-toggle input{position:absolute!important;opacity:0!important;pointer-events:none!important}
.lv-review-anonymous-toggle span{width:36px!important;height:36px!important;border-radius:999px!important;display:grid!important;place-items:center!important;background:#eef4ff!important;color:#3b6df6!important;transition:.2s ease!important}
.lv-review-anonymous-toggle input:checked+span{background:#111827!important;color:#fff!important}
.lv-review-submit{width:100%!important;justify-content:center!important;gap:8px!important}
.lv-review-submit.is-loading{opacity:.72!important;pointer-events:none!important}
.lv-review-form-message{min-height:20px!important;margin-top:10px!important;font-size:13px!important;font-weight:800!important;color:#64748b!important}
.lv-review-form-message.error{color:#ef4444!important}.lv-review-form-message.loading{color:#3b6df6!important}
.lv-review-login-card{display:grid!important;justify-items:start!important;gap:10px!important;padding:18px!important;border-radius:22px!important;background:#fff!important;border:1px dashed rgba(59,109,246,.24)!important;color:#64748b!important}
.lv-review-login-card i{width:42px!important;height:42px!important;border-radius:999px!important;display:grid!important;place-items:center!important;background:#eef4ff!important;color:#3b6df6!important;font-size:18px!important}
.lv-review-login-card h3{margin:0!important;color:#0f172a!important}.lv-review-login-card p{margin:0!important;line-height:1.6!important}
.lv-review-bars{display:grid!important;gap:8px!important;margin-bottom:16px!important}
.lv-review-bar{display:grid!important;grid-template-columns:36px 1fr 28px!important;gap:10px!important;align-items:center!important;color:#64748b!important;font-size:12px!important;font-weight:900!important}
.lv-review-bar i{height:8px!important;border-radius:999px!important;background:#e2e8f0!important;overflow:hidden!important;display:block!important}
.lv-review-bar i em{display:block!important;height:100%!important;border-radius:inherit!important;background:linear-gradient(90deg,#facc15,#f59e0b)!important}
.lv-review-list{display:grid!important;gap:12px!important;max-height:620px!important;overflow:auto!important;padding-right:4px!important}
.lv-review-item{display:grid!important;grid-template-columns:44px 1fr!important;gap:12px!important;padding:14px!important;border-radius:20px!important;background:#fff!important;border:1px solid rgba(148,163,184,.14)!important}
.lv-review-avatar{width:44px!important;height:44px!important;border-radius:999px!important;overflow:hidden!important;background:#eef4ff!important;color:#3b6df6!important;display:grid!important;place-items:center!important;font-size:16px!important;flex:none!important}
.lv-review-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;border-radius:inherit!important}
.lv-review-avatar.is-anonymous{background:#111827!important;color:#fff!important}
.lv-review-body{min-width:0!important}.lv-review-item-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;margin-bottom:4px!important}
.lv-review-item-head strong{color:#0f172a!important;font-size:14px!important}.lv-review-item-head time{font-size:12px!important;color:#94a3b8!important;white-space:nowrap!important}
.lv-review-item p{margin:7px 0 0!important;color:#475569!important;line-height:1.58!important}
.lv-review-empty{display:grid!important;justify-items:center!important;text-align:center!important;gap:8px!important;padding:32px 18px!important;border-radius:20px!important;background:#fff!important;border:1px dashed rgba(148,163,184,.22)!important;color:#64748b!important}
.lv-review-empty i{font-size:24px!important;color:#f59e0b!important}.lv-review-empty strong{color:#0f172a!important}
@media(max-width:920px){.lv-review-head,.lv-review-layout{grid-template-columns:1fr!important}.lv-review-score-card{text-align:left!important}.lv-review-list{max-height:none!important}}
@media(max-width:640px){.lv-review-panel{padding:18px!important;border-radius:22px!important}.lv-review-head h2{font-size:22px!important}.lv-rating-stars-input button{font-size:25px!important}.lv-review-item{grid-template-columns:38px 1fr!important}.lv-review-avatar{width:38px!important;height:38px!important}}
/* v13: dark mode for review UI, seller tabs and sales notification */
html.lv-theme-dark .lv-review-panel,
html.lv-theme-dark .lv-review-form-card,
html.lv-theme-dark .lv-review-list-card,
html.lv-theme-dark .lv-rating-control,
html.lv-theme-dark .lv-review-login-card,
html.lv-theme-dark .lv-review-anonymous-toggle,
html.lv-theme-dark .lv-review-item,
html.lv-theme-dark .lv-review-empty{
background:linear-gradient(180deg,#10192d,#0d1629)!important;
color:#e5edff!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-review-kicker{background:rgba(122,162,255,.14)!important;color:#9bb8ff!important;border:1px solid rgba(122,162,255,.22)!important}
html.lv-theme-dark .lv-review-head h2,
html.lv-theme-dark .lv-review-form-title,
html.lv-theme-dark .lv-review-login-card h3,
html.lv-theme-dark .lv-review-item-head strong,
html.lv-theme-dark .lv-review-empty strong{color:#f2f6ff!important}
html.lv-theme-dark .lv-review-head p,
html.lv-theme-dark .lv-review-item p,
html.lv-theme-dark .lv-review-login-card p,
html.lv-theme-dark .lv-review-field,
html.lv-theme-dark .lv-review-anonymous-toggle,
html.lv-theme-dark .lv-review-bar{color:#b8c6df!important}
html.lv-theme-dark .lv-review-score-card{background:linear-gradient(180deg,#1b263b,#111827)!important;border-color:rgba(245,158,11,.24)!important;box-shadow:0 18px 40px rgba(0,0,0,.24)!important}
html.lv-theme-dark .lv-review-score-card strong{color:#fbbf24!important}html.lv-theme-dark .lv-review-score-card small{color:#fde68a!important}
html.lv-theme-dark .lv-review-field textarea{background:#0b1224!important;color:#edf3ff!important;border-color:rgba(148,163,184,.22)!important}
html.lv-theme-dark .lv-review-field textarea::placeholder{color:#64748b!important}
html.lv-theme-dark .lv-review-bar i{background:#1e293b!important}
html.lv-theme-dark .lv-review-avatar:not(.is-anonymous){background:#172544!important;color:#9bb8ff!important}
html.lv-theme-dark .lv-review-anonymous-toggle span,
html.lv-theme-dark .lv-review-login-card i{background:#172544!important;color:#9bb8ff!important}
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs,
html.lv-theme-dark body .lv-seller-page nav.lv-seller-tabs{
background:rgba(10,16,32,.88)!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 14px 34px rgba(0,0,0,.22)!important;
}
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs a{
background:#172033!important;
color:#cbd7ee!important;
border:1px solid rgba(148,163,184,.12)!important;
}
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs a.is-active,
html.lv-theme-dark body .lv-seller-page .lv-seller-tabs a:hover{
background:linear-gradient(135deg,#2f6bff,#607cff)!important;
color:#fff!important;
border-color:rgba(122,162,255,.55)!important;
box-shadow:0 12px 26px rgba(47,107,255,.24)!important;
}
html.lv-theme-dark #lx-sales-noti{
background:#10192d!important;
color:#e5edff!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 24px 60px rgba(0,0,0,.42),0 0 0 1px rgba(148,163,184,.06)!important;
}
html.lv-theme-dark #lx-noti-close{color:#94a3b8!important}html.lv-theme-dark #lx-noti-close:hover{color:#fff!important}
html.lv-theme-dark #lx-sales-noti .lx-noti-icon{background:#172544!important;color:#9bb8ff!important}
html.lv-theme-dark #lx-sales-noti .lx-noti-title{color:#cbd7ee!important}
html.lv-theme-dark #lx-sales-noti .lx-name{color:#f2f6ff!important}
html.lv-theme-dark #lx-sales-noti .lx-noti-product{color:#8fb2ff!important}
html.lv-theme-dark #lx-sales-noti .lx-noti-time{color:#94a3b8!important}
/* v13: stronger dark mode for collections/search dropdown/account white leftovers */
html.lv-theme-dark .search-suggestions,
html.lv-theme-dark .search-results-dropdown,
html.lv-theme-dark .autocomplete-results,
html.lv-theme-dark .larxvo-search-results,
html.lv-theme-dark .search-result-item,
html.lv-theme-dark .collection-card,
html.lv-theme-dark .collection-info,
html.lv-theme-dark .empty-collections{
background:#10192d!important;
color:#e5edff!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 18px 48px rgba(0,0,0,.24)!important;
}
html.lv-theme-dark .collection-thumbnail{background:#0b1224!important}
html.lv-theme-dark .collection-card h3,
html.lv-theme-dark .collection-info h3,
html.lv-theme-dark .search-result-item h4,
html.lv-theme-dark .search-result-item strong{color:#f2f6ff!important}
html.lv-theme-dark .collection-info p,
html.lv-theme-dark .search-result-item p{color:#9fb0cf!important}
html.lv-theme-dark body .account-page .account-tab-link,
html.lv-theme-dark body .account-page .account-tabs a,
html.lv-theme-dark body .account-page .account-tabs button{
background:#172033!important;
color:#dce8ff!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark body .account-page .account-tab-link.active,
html.lv-theme-dark body .account-page .account-tabs a.active,
html.lv-theme-dark body .account-page .account-tabs button.active{
background:linear-gradient(135deg,#2f6bff,#607cff)!important;
color:#fff!important;
}
/* v14: anonymous review toggle, Sforum-inspired blog, linked file cards */
.lv-review-anonymous-toggle{
position:relative!important;
user-select:none!important;
}
.lv-review-anonymous-toggle input{
position:absolute!important;
inline-size:1px!important;
block-size:1px!important;
opacity:0!important;
pointer-events:auto!important;
}
.lv-review-anonymous-toggle.is-checked,
.lv-review-anonymous-toggle:has(input:checked){
border-color:rgba(59,109,246,.55)!important;
background:linear-gradient(180deg,#eef4ff,#ffffff)!important;
box-shadow:0 10px 24px rgba(59,109,246,.12)!important;
}
.lv-review-anonymous-toggle.is-checked span,
.lv-review-anonymous-toggle:has(input:checked) span{
background:#3b6df6!important;
color:#fff!important;
}
html.lv-theme-dark .lv-review-anonymous-toggle.is-checked,
html.lv-theme-dark .lv-review-anonymous-toggle:has(input:checked){
background:linear-gradient(180deg,#18243f,#111827)!important;
border-color:rgba(96,165,250,.55)!important;
}
html.lv-theme-dark .lv-review-anonymous-toggle.is-checked span,
html.lv-theme-dark .lv-review-anonymous-toggle:has(input:checked) span{
background:#60a5fa!important;
color:#08111f!important;
}
/* Blog hub */
.lv-blog-hub,
.lv-blog-detail-page{
background:#f7f9fc;
color:#0f172a;
padding:34px 0 80px;
}
.lv-blog-shell,
.lv-blog-detail-shell{
width:min(1180px,calc(100% - 32px));
margin-inline:auto;
}
.lv-blog-breadcrumb{
display:flex;
align-items:center;
gap:8px;
margin:0 0 18px;
color:#64748b;
font-size:13px;
font-weight:700;
}
.lv-blog-breadcrumb a{
color:#3b6df6;
text-decoration:none;
}
.lv-blog-breadcrumb strong{
color:#0f172a;
}
.lv-blog-layout{
display:grid;
grid-template-columns:190px minmax(0,1fr) 300px;
gap:26px;
align-items:start;
}
.lv-blog-side-nav{
position:sticky;
top:92px;
display:grid;
gap:6px;
}
.lv-blog-side-nav a{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
min-height:38px;
padding:0 12px;
border-radius:12px;
color:#334155;
text-decoration:none;
font-weight:800;
transition:.18s ease;
}
.lv-blog-side-nav a i{
color:#64748b;
width:18px;
}
.lv-blog-side-nav a:hover,
.lv-blog-side-nav a.is-active{
background:#fff0f2;
color:#e11d48;
}
.lv-section-title-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin:0 0 14px;
}
.lv-section-title-row h1,
.lv-section-title-row h2{
margin:0;
color:#0f172a;
font-size:24px;
line-height:1.15;
font-weight:950;
}
.lv-section-title-row span{
flex:1;
height:3px;
max-width:72px;
background:#ef123f;
border-radius:999px;
}
.lv-blog-featured-card{
display:grid;
grid-template-columns:45% 1fr;
min-height:220px;
overflow:hidden;
border-radius:18px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 18px 44px rgba(15,23,42,.06);
text-decoration:none;
}
.lv-blog-featured-image{
display:block;
background:#e2e8f0;
min-height:220px;
}
.lv-blog-featured-image img,
.lv-blog-list-thumb img,
.lv-blog-mini-item img,
.lv-blog-file-thumb img,
.lv-post-hero-media img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
.lv-blog-featured-image i,
.lv-blog-list-thumb i,
.lv-blog-mini-item i,
.lv-blog-file-thumb i{
display:grid;
place-items:center;
width:100%;
height:100%;
color:#94a3b8;
font-size:28px;
}
.lv-blog-featured-content{
display:flex;
flex-direction:column;
justify-content:center;
gap:10px;
padding:24px;
}
.lv-blog-featured-content em,
.lv-blog-cat,
.lv-post-cat{
width:max-content;
max-width:100%;
display:inline-flex;
align-items:center;
padding:5px 10px;
border-radius:999px;
background:#eef4ff;
color:#3b6df6;
font-style:normal;
font-weight:900;
font-size:12px;
text-decoration:none;
}
.lv-blog-featured-content strong{
display:block;
color:#0f172a;
font-size:25px;
line-height:1.2;
font-weight:950;
}
.lv-blog-featured-content small,
.lv-blog-meta{
color:#64748b;
font-weight:700;
font-size:13px;
}
.lv-blog-featured-content span{
color:#475569;
line-height:1.62;
}
.lv-blog-latest{
margin-top:26px;
}
.lv-blog-list{
display:grid;
gap:18px;
}
.lv-blog-list-item{
display:grid;
grid-template-columns:220px 1fr;
gap:18px;
padding:14px;
border-radius:18px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 12px 32px rgba(15,23,42,.045);
}
.lv-blog-list-thumb{
display:block;
min-height:138px;
border-radius:14px;
overflow:hidden;
background:#e2e8f0;
text-decoration:none;
}
.lv-blog-list-body{
min-width:0;
display:grid;
align-content:center;
gap:8px;
}
.lv-blog-list-body h3{
margin:0;
font-size:20px;
line-height:1.28;
}
.lv-blog-list-body h3 a{
color:#0f172a;
text-decoration:none;
}
.lv-blog-list-body p{
color:#475569;
margin:0;
line-height:1.58;
}
.lv-blog-meta{
display:flex;
gap:12px;
flex-wrap:wrap;
}
.lv-blog-right-rail{
position:sticky;
top:92px;
display:grid;
gap:18px;
}
.lv-blog-widget{
padding:18px;
border-radius:18px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 12px 30px rgba(15,23,42,.045);
}
.lv-blog-mini-list{
display:grid;
gap:12px;
}
.lv-blog-mini-item{
display:grid;
grid-template-columns:76px 1fr;
gap:10px;
align-items:center;
text-decoration:none;
color:#0f172a;
}
.lv-blog-mini-item span{
height:58px;
border-radius:10px;
overflow:hidden;
background:#e2e8f0;
}
.lv-blog-mini-item strong{
font-size:13px;
line-height:1.35;
}
.lv-blog-files-widget{
display:grid;
gap:12px;
}
.lv-blog-pagination ul{
display:flex;
justify-content:center;
gap:8px;
list-style:none;
margin:26px 0 0;
padding:0;
}
.lv-blog-pagination a,
.lv-blog-pagination span{
min-width:36px;
height:36px;
display:grid;
place-items:center;
border-radius:10px;
background:#fff;
color:#334155;
border:1px solid rgba(148,163,184,.2);
text-decoration:none;
font-weight:900;
}
.lv-blog-pagination .current{
background:#3b6df6;
color:#fff;
}
.lv-blog-seo-copy{
margin-top:38px;
padding:22px 0;
color:#475569;
line-height:1.75;
}
.lv-blog-seo-copy h2{
color:#0f172a;
}
/* Blog detail */
.lv-post-hero{
position:relative;
max-width:820px;
margin:0 auto 28px;
}
.lv-post-hero-media{
height:300px;
overflow:hidden;
border-radius:22px;
background:#e2e8f0;
}
.lv-post-title-card{
position:relative;
margin:-54px auto 0;
width:calc(100% - 42px);
padding:24px;
border-radius:18px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 22px 60px rgba(15,23,42,.10);
}
.lv-post-title-card h1{
margin:12px 0 14px;
color:#0f172a;
font-size:clamp(28px,4vw,42px);
line-height:1.12;
font-weight:950;
}
.lv-post-meta{
display:flex;
align-items:center;
gap:10px;
color:#64748b;
font-weight:800;
flex-wrap:wrap;
}
.lv-post-meta img{
border-radius:999px;
}
.lv-post-layout{
display:grid;
grid-template-columns:190px minmax(0,760px) 280px;
gap:24px;
align-items:start;
}
.lv-post-left-rail,
.lv-post-right-rail{
position:sticky;
top:92px;
display:grid;
gap:18px;
}
.lv-post-sticky-card,
.lv-post-widget{
padding:18px;
border-radius:18px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 12px 30px rgba(15,23,42,.045);
}
.lv-post-sticky-card strong,
.lv-post-widget h3{
display:block;
margin:0 0 12px;
color:#0f172a;
font-size:16px;
font-weight:950;
}
.lv-post-sticky-card a{
color:#3b6df6;
font-weight:900;
text-decoration:none;
}
.lv-post-article{
min-width:0;
}
.lv-post-content{
padding:28px;
border-radius:20px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 18px 42px rgba(15,23,42,.045);
color:#1f2937;
font-size:16px;
line-height:1.84;
}
.lv-post-content :where(h2,h3,h4){
color:#0f172a;
line-height:1.25;
margin-top:1.5em;
}
.lv-post-content img{
max-width:100%;
height:auto;
border-radius:16px;
}
.lv-post-content a{
color:#2563eb;
font-weight:800;
}
.lv-post-tags{
display:flex;
gap:8px;
flex-wrap:wrap;
margin-top:14px;
}
.lv-post-tags a{
display:inline-flex;
padding:6px 10px;
border-radius:999px;
background:#f1f5f9;
color:#475569;
text-decoration:none;
font-size:12px;
font-weight:900;
}
.lv-post-tags.is-bottom{
margin:20px 0;
}
.lv-post-comments{
margin-top:24px;
padding:24px;
border-radius:20px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
}
/* Linked files inside posts */
.lv-blog-linked-files{
margin:28px 0;
padding:22px;
border-radius:22px;
background:linear-gradient(180deg,#fff,#f8fbff);
border:1px solid rgba(148,163,184,.18);
box-shadow:0 18px 42px rgba(15,23,42,.06);
}
.lv-blog-linked-head{
display:flex;
justify-content:space-between;
gap:16px;
align-items:end;
margin-bottom:16px;
}
.lv-blog-linked-head span{
display:inline-flex;
margin-bottom:5px;
color:#3b6df6;
font-size:12px;
font-weight:950;
}
.lv-blog-linked-head h3{
margin:0;
color:#0f172a;
font-size:22px;
}
.lv-blog-linked-head a{
color:#3b6df6;
font-weight:950;
text-decoration:none;
}
.lv-blog-linked-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:14px;
}
.lv-blog-file-card{
display:grid;
overflow:hidden;
border-radius:16px;
background:#fff;
color:#0f172a;
border:1px solid rgba(148,163,184,.18);
text-decoration:none;
box-shadow:0 10px 26px rgba(15,23,42,.045);
transition:.2s ease;
}
.lv-blog-file-card:hover{
transform:translateY(-3px);
box-shadow:0 18px 38px rgba(15,23,42,.09);
}
.lv-blog-file-thumb{
position:relative;
display:block;
aspect-ratio:4/3;
background:#e2e8f0;
overflow:hidden;
}
.lv-blog-file-price{
position:absolute;
left:8px;
bottom:8px;
display:inline-flex;
padding:5px 8px;
border-radius:999px;
background:#0f172a;
color:#fff;
font-size:11px;
font-weight:950;
}
.lv-blog-file-body{
display:grid;
gap:6px;
padding:12px;
}
.lv-blog-file-cat{
color:#3b6df6;
font-size:11px;
font-weight:950;
}
.lv-blog-file-body strong{
color:#0f172a;
font-size:14px;
line-height:1.35;
}
.lv-blog-file-meta{
display:flex;
gap:10px;
color:#64748b;
font-size:12px;
font-weight:800;
}
.lv-blog-file-card-mini{
grid-template-columns:74px 1fr;
align-items:center;
}
.lv-blog-file-card-mini .lv-blog-file-thumb{
aspect-ratio:1;
height:74px;
}
.lv-blog-file-card-mini .lv-blog-file-price{
display:none;
}
.lv-blog-file-card-mini .lv-blog-file-body{
padding:10px;
}
.lv-blog-file-card-mini .lv-blog-file-meta{
display:none;
}
/* Dark-mode fixes for blog/review/tabs/sales notification */
html.lv-theme-dark .lv-blog-hub,
html.lv-theme-dark .lv-blog-detail-page{
background:#08111f!important;
color:#e5edf9!important;
}
html.lv-theme-dark .lv-blog-breadcrumb,
html.lv-theme-dark .lv-blog-featured-content small,
html.lv-theme-dark .lv-blog-meta,
html.lv-theme-dark .lv-post-meta,
html.lv-theme-dark .lv-blog-file-meta{
color:#9fb0c9!important;
}
html.lv-theme-dark .lv-blog-breadcrumb strong,
html.lv-theme-dark .lv-section-title-row h1,
html.lv-theme-dark .lv-section-title-row h2,
html.lv-theme-dark .lv-blog-featured-content strong,
html.lv-theme-dark .lv-blog-list-body h3 a,
html.lv-theme-dark .lv-blog-mini-item,
html.lv-theme-dark .lv-post-title-card h1,
html.lv-theme-dark .lv-post-sticky-card strong,
html.lv-theme-dark .lv-post-widget h3,
html.lv-theme-dark .lv-post-content :where(h2,h3,h4),
html.lv-theme-dark .lv-blog-linked-head h3,
html.lv-theme-dark .lv-blog-file-body strong{
color:#f8fbff!important;
}
html.lv-theme-dark .lv-blog-side-nav a{
color:#c9d7ee!important;
}
html.lv-theme-dark .lv-blog-side-nav a:hover,
html.lv-theme-dark .lv-blog-side-nav a.is-active{
background:#1e293b!important;
color:#93c5fd!important;
}
html.lv-theme-dark .lv-blog-featured-card,
html.lv-theme-dark .lv-blog-list-item,
html.lv-theme-dark .lv-blog-widget,
html.lv-theme-dark .lv-post-title-card,
html.lv-theme-dark .lv-post-sticky-card,
html.lv-theme-dark .lv-post-widget,
html.lv-theme-dark .lv-post-content,
html.lv-theme-dark .lv-post-comments,
html.lv-theme-dark .lv-blog-linked-files,
html.lv-theme-dark .lv-blog-file-card,
html.lv-theme-dark .lv-seller-tabs,
html.lv-theme-dark .lv-seller-tab-panel,
html.lv-theme-dark .lv-seller-panel,
html.lv-theme-dark .lv-card{
background:#0f1a2d!important;
border-color:rgba(148,163,184,.18)!important;
color:#dbe7fa!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-blog-list-body p,
html.lv-theme-dark .lv-blog-featured-content span,
html.lv-theme-dark .lv-blog-seo-copy,
html.lv-theme-dark .lv-post-content{
color:#c2cfe4!important;
}
html.lv-theme-dark .lv-post-tags a{
background:#18243a!important;
color:#c9d7ee!important;
}
html.lv-theme-dark .lv-seller-tabs a{
background:#18243a!important;
color:#cbd5e1!important;
border-color:rgba(148,163,184,.12)!important;
}
html.lv-theme-dark .lv-seller-tabs a.is-active{
background:#dbeafe!important;
color:#1e3a8a!important;
}
html.lv-theme-dark .larxvo-notification,
html.lv-theme-dark .larxvo-sales-notification,
html.lv-theme-dark .sales-notification,
html.lv-theme-dark .sale-notification,
html.lv-theme-dark [class*="sales-notification"],
html.lv-theme-dark [class*="notification-popup"]{
background:#0f1a2d!important;
color:#e5edf9!important;
border-color:rgba(96,165,250,.32)!important;
box-shadow:0 20px 50px rgba(0,0,0,.38)!important;
}
html.lv-theme-dark .larxvo-notification a,
html.lv-theme-dark .larxvo-sales-notification a,
html.lv-theme-dark [class*="sales-notification"] a{
color:#93c5fd!important;
}
/* Fix light text in dark-mode account/table/cards still inheriting too pale */
html.lv-theme-dark .account-page :where(h1,h2,h3,h4,strong,label,th),
html.lv-theme-dark .site-main.account-page :where(h1,h2,h3,h4,strong,label,th),
html.lv-theme-dark .woocommerce :where(h1,h2,h3,h4,strong,label,th){
color:#f8fbff!important;
}
html.lv-theme-dark .account-page :where(p,span,td,small,li),
html.lv-theme-dark .site-main.account-page :where(p,span,td,small,li),
html.lv-theme-dark .woocommerce :where(p,span,td,small,li){
color:#c9d7ee!important;
}
html.lv-theme-dark .account-page a,
html.lv-theme-dark .site-main.account-page a{
color:#93c5fd!important;
}
@media(max-width:1100px){
.lv-blog-layout{grid-template-columns:1fr}
.lv-blog-side-nav{position:static;display:flex;overflow-x:auto;padding-bottom:8px}
.lv-blog-side-nav a{white-space:nowrap;background:#fff}
.lv-blog-right-rail{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}
.lv-post-layout{grid-template-columns:1fr}
.lv-post-left-rail,.lv-post-right-rail{position:static}
.lv-post-right-rail{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
.lv-blog-featured-card,
.lv-blog-list-item{grid-template-columns:1fr}
.lv-blog-linked-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.lv-blog-right-rail,
.lv-post-right-rail{grid-template-columns:1fr}
.lv-post-title-card{width:calc(100% - 20px);padding:18px}
.lv-post-hero-media{height:220px}
.lv-post-content{padding:20px}
}
/* v15 blog archive/detail/comment UX polish */
.lv-blog-archive-page .lv-blog-layout,
.lv-blog-hub .lv-blog-layout{
align-items:start;
}
.lv-blog-archive-hero{
position:relative;
overflow:hidden;
margin:0 0 26px;
padding:28px 30px;
border-radius:22px;
background:linear-gradient(135deg,#f8fbff 0%,#eaf2ff 48%,#ffffff 100%);
border:1px solid rgba(148,163,184,.18);
box-shadow:0 18px 48px rgba(15,23,42,.06);
}
.lv-blog-archive-hero::after{
content:"";
position:absolute;
right:-70px;
top:-90px;
width:260px;
height:260px;
border-radius:999px;
background:radial-gradient(circle,rgba(59,109,246,.18),rgba(59,109,246,0) 64%);
}
.lv-blog-archive-hero span{
display:inline-flex;
padding:7px 11px;
border-radius:999px;
background:#eff6ff;
color:#2563eb;
font-size:12px;
font-weight:950;
margin-bottom:12px;
}
.lv-blog-archive-hero h1{
position:relative;
margin:0 0 8px;
color:#0f172a;
font-size:clamp(32px,4vw,48px);
line-height:1.05;
font-weight:950;
}
.lv-blog-archive-hero p{
position:relative;
margin:0;
max-width:720px;
color:#64748b;
font-weight:700;
line-height:1.7;
}
.lv-blog-side-nav,
.lv-post-left-rail{
top:150px!important;
align-self:start!important;
max-height:calc(100vh - 170px);
overflow:auto;
scrollbar-width:thin;
}
.admin-bar .lv-blog-side-nav,
.admin-bar .lv-post-left-rail{
top:182px!important;
max-height:calc(100vh - 202px);
}
.lv-blog-side-nav a b{
margin-left:auto;
color:inherit;
opacity:.65;
}
.lv-blog-side-nav a span{
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.lv-post-sforum-layout{
display:grid;
grid-template-columns:220px minmax(0,940px);
gap:30px;
align-items:start;
}
.lv-post-main-wide{
min-width:0;
}
.lv-post-main-wide .lv-post-hero{
max-width:none;
margin:0 0 26px;
}
.lv-post-main-wide .lv-post-hero-media{
height:360px;
border-radius:22px;
}
.lv-post-main-wide .lv-post-title-card{
max-width:860px;
margin:-74px auto 0;
}
.lv-post-article{
min-width:0;
}
.lv-post-article .lv-post-content{
font-size:17px;
line-height:1.88;
}
.lv-post-end-card{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:22px;
margin-top:28px;
padding-top:20px;
border-top:1px solid rgba(148,163,184,.18);
}
.lv-post-end-tags{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:10px;
}
.lv-post-end-tags > span{
color:#334155;
font-weight:900;
}
.lv-post-end-tags a{
display:inline-flex;
align-items:center;
min-height:32px;
padding:0 12px;
border-radius:9px;
background:#f3f4f6;
color:#334155;
text-decoration:none;
font-size:14px;
font-weight:850;
}
.lv-post-rating-box{
min-width:178px;
text-align:center;
}
.lv-post-rating-box em{
display:block;
color:#111827;
font-family:cursive;
font-size:18px;
font-weight:900;
line-height:1;
transform:rotate(-4deg);
margin-bottom:8px;
}
.lv-post-rating-stars{
display:flex;
align-items:center;
justify-content:center;
gap:2px;
}
.lv-post-rating-stars button{
appearance:none;
border:0;
background:transparent;
padding:0 1px;
color:#fbbf24;
font-size:24px;
line-height:1;
cursor:pointer;
filter:drop-shadow(0 4px 8px rgba(251,191,36,.18));
}
.lv-post-rating-stars button:not(.is-active):last-child,
.lv-post-rating-stars button:not(.is-active){
color:#fbbf24;
}
.lv-post-rating-box small{
display:block;
margin-top:5px;
color:#64748b;
font-weight:800;
}
.lv-blog-linked-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:16px!important;
}
.lv-blog-linked-files{
margin-top:28px!important;
}
.lv-post-comments{
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-comments-area{
margin-top:28px;
padding:24px;
border-radius:22px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 18px 42px rgba(15,23,42,.045);
}
.lv-comments-title-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-bottom:18px;
}
.lv-comments-title-row span{
display:inline-flex;
color:#3b6df6;
font-size:12px;
font-weight:950;
text-transform:uppercase;
letter-spacing:.04em;
}
.lv-comments-title-row h2,
.lv-comment-form-title{
margin:4px 0 0;
color:#0f172a;
font-size:24px;
line-height:1.15;
font-weight:950;
}
.lv-comments-title-row i{
width:42px;
height:42px;
border-radius:999px;
display:grid;
place-items:center;
background:#eef2ff;
color:#3b6df6;
}
.lv-comment-list{
display:grid;
gap:12px;
margin-bottom:22px;
}
.lv-comment-item{
display:grid;
grid-template-columns:42px 1fr;
gap:12px;
padding:14px;
border-radius:16px;
background:#f8fafc;
border:1px solid rgba(148,163,184,.14);
}
.lv-comment-avatar img,
.lv-comment-form-avatar img{
border-radius:999px;
}
.lv-comment-body{
min-width:0;
}
.lv-comment-head{
display:flex;
align-items:center;
gap:10px;
flex-wrap:wrap;
margin-bottom:6px;
}
.lv-comment-head strong{
color:#0f172a;
font-size:14px;
}
.lv-comment-head time{
color:#94a3b8;
font-size:12px;
font-weight:800;
}
.lv-comment-text{
color:#334155;
line-height:1.65;
}
.lv-comment-text p{
margin:.2em 0;
}
.lv-comment-awaiting{
margin:0 0 6px;
color:#f59e0b;
font-weight:850;
}
.lv-comment-actions a{
display:inline-flex;
margin-top:8px;
color:#3b6df6;
font-weight:850;
text-decoration:none;
}
.lv-comment-login-note{
margin:0 0 12px;
color:#64748b;
font-weight:700;
}
.lv-comment-login-note a{
color:#3b6df6;
font-weight:900;
}
.lv-comment-input-row,
.lv-comment-guest-box{
display:grid;
grid-template-columns:52px 1fr;
gap:14px;
align-items:start;
}
.lv-comment-input-row textarea,
.lv-comment-guest-box textarea{
width:100%;
min-height:128px;
border:1px solid rgba(148,163,184,.32);
border-radius:16px;
padding:16px 18px;
resize:vertical;
outline:none;
background:#fff;
color:#0f172a;
font:inherit;
line-height:1.55;
box-shadow:inset 0 1px 0 rgba(15,23,42,.02);
}
.lv-comment-input-row textarea:focus{
border-color:#3b6df6;
box-shadow:0 0 0 4px rgba(59,109,246,.12);
}
.lv-comment-submit-row{
margin-top:14px;
display:flex;
justify-content:flex-end;
}
.lv-comment-submit{
min-height:42px;
padding:0 18px;
border:0;
border-radius:999px;
background:linear-gradient(135deg,#3b82f6,#255cff);
color:#fff;
font-weight:950;
cursor:pointer;
box-shadow:0 14px 28px rgba(37,92,255,.2);
}
.lv-comment-guest-avatar{
width:52px;
height:52px;
border-radius:999px;
display:grid;
place-items:center;
border:2px solid #f43f5e;
color:#3b6df6;
background:#f8fafc;
}
.lv-comment-guest-box{
cursor:pointer;
}
.lv-comment-guest-box textarea{
pointer-events:none;
color:#94a3b8;
}
.lv-comment-login-modal{
position:fixed;
inset:0;
z-index:99999;
display:none;
align-items:center;
justify-content:center;
padding:20px;
}
.lv-comment-login-modal.is-open{
display:flex;
}
.lv-comment-login-backdrop{
position:absolute;
inset:0;
background:rgba(15,23,42,.48);
backdrop-filter:blur(6px);
}
.lv-comment-login-card{
position:relative;
width:min(390px,100%);
border-radius:22px;
background:#fff;
padding:28px;
text-align:center;
color:#0f172a;
box-shadow:0 28px 80px rgba(15,23,42,.28);
animation:lvCommentModalIn .2s ease both;
}
@keyframes lvCommentModalIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
.lv-comment-login-card h3{
margin:0 0 14px;
color:#ef123f;
font-size:24px;
font-weight:950;
}
.lv-comment-login-icon{
width:76px;
height:76px;
display:grid;
place-items:center;
border-radius:999px;
margin:0 auto 14px;
background:#f1f5ff;
color:#3b6df6;
font-size:30px;
}
.lv-comment-login-card p{
margin:0 auto 20px;
color:#334155;
line-height:1.6;
font-weight:750;
}
.lv-comment-login-close{
position:absolute;
top:12px;
right:12px;
width:32px;
height:32px;
border:0;
border-radius:999px;
background:#e5e7eb;
color:#64748b;
font-size:22px;
cursor:pointer;
}
.lv-comment-login-actions{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
}
.lv-comment-login-actions a{
min-height:44px;
border-radius:12px;
display:flex;
align-items:center;
justify-content:center;
text-decoration:none;
font-weight:950;
}
.lv-comment-login-actions .is-outline{
border:2px solid #ef123f;
color:#ef123f;
background:#fff;
}
.lv-comment-login-actions .is-primary{
border:2px solid #ef123f;
background:linear-gradient(135deg,#ef123f,#ff5d3d);
color:#fff;
}
.lv-post-related-below{
margin-top:28px;
padding:22px;
border-radius:22px;
background:#fff;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 18px 42px rgba(15,23,42,.045);
}
.lv-post-related-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:14px;
}
.lv-post-related-card{
display:grid;
grid-template-columns:96px 1fr;
gap:12px;
align-items:center;
padding:10px;
border-radius:16px;
background:#f8fafc;
text-decoration:none;
color:#0f172a;
border:1px solid rgba(148,163,184,.12);
}
.lv-post-related-card > span{
height:74px;
border-radius:12px;
overflow:hidden;
background:#e2e8f0;
}
.lv-post-related-card img{
width:100%;
height:100%;
object-fit:cover;
}
.lv-post-related-card strong{
font-size:14px;
line-height:1.38;
}
.lv-post-related-card small{
color:#64748b;
font-weight:800;
}
/* dark mode for v15 blog/comment pieces */
html.lv-theme-dark .lv-blog-archive-hero,
html.lv-theme-dark .lv-comments-area,
html.lv-theme-dark .lv-comment-login-card,
html.lv-theme-dark .lv-post-related-below{
background:#0f1a2d!important;
border-color:rgba(148,163,184,.18)!important;
color:#e5edf9!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-blog-archive-hero h1,
html.lv-theme-dark .lv-comments-title-row h2,
html.lv-theme-dark .lv-comment-form-title,
html.lv-theme-dark .lv-comment-head strong,
html.lv-theme-dark .lv-post-end-tags > span,
html.lv-theme-dark .lv-post-rating-box em,
html.lv-theme-dark .lv-post-related-card,
html.lv-theme-dark .lv-comment-login-card{
color:#f8fbff!important;
}
html.lv-theme-dark .lv-blog-archive-hero p,
html.lv-theme-dark .lv-comment-login-note,
html.lv-theme-dark .lv-comment-text,
html.lv-theme-dark .lv-comment-login-card p,
html.lv-theme-dark .lv-post-rating-box small,
html.lv-theme-dark .lv-post-related-card small{
color:#c2cfe4!important;
}
html.lv-theme-dark .lv-comment-item,
html.lv-theme-dark .lv-post-related-card,
html.lv-theme-dark .lv-comment-input-row textarea,
html.lv-theme-dark .lv-comment-guest-box textarea,
html.lv-theme-dark .lv-comment-guest-avatar,
html.lv-theme-dark .lv-post-end-tags a{
background:#111d31!important;
border-color:rgba(148,163,184,.2)!important;
color:#dbe7fa!important;
}
html.lv-theme-dark .lv-comment-input-row textarea:focus{
border-color:#60a5fa!important;
box-shadow:0 0 0 4px rgba(96,165,250,.14)!important;
}
html.lv-theme-dark .lv-comment-login-actions .is-outline{
background:#111d31!important;
color:#fda4af!important;
border-color:#f43f5e!important;
}
html.lv-theme-dark .lv-comment-login-close{
background:#1e293b!important;
color:#cbd5e1!important;
}
html.lv-theme-dark .lv-post-title-card,
html.lv-theme-dark .lv-post-content,
html.lv-theme-dark .lv-blog-linked-files,
html.lv-theme-dark .lv-post-related-below,
html.lv-theme-dark .lv-comments-area{
background:#0f1a2d!important;
}
@media(max-width:1180px){
.lv-post-sforum-layout{grid-template-columns:1fr}
.lv-post-sforum-layout .lv-blog-side-nav{position:static!important;display:flex!important;overflow-x:auto!important;max-height:none!important;padding-bottom:8px}
.lv-post-sforum-layout .lv-blog-side-nav a{white-space:nowrap;min-width:max-content}
}
@media(max-width:900px){
.lv-blog-linked-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.lv-post-related-grid{grid-template-columns:1fr}
.lv-post-end-card{align-items:flex-start;flex-direction:column}
.lv-post-rating-box{text-align:left}
.lv-post-rating-stars{justify-content:flex-start}
}
@media(max-width:640px){
.lv-blog-linked-grid{grid-template-columns:1fr!important}
.lv-comment-input-row,
.lv-comment-guest-box{grid-template-columns:1fr}
.lv-comment-form-avatar,
.lv-comment-guest-avatar{display:none}
.lv-comments-area,
.lv-post-related-below{padding:18px}
.lv-post-main-wide .lv-post-hero-media{height:230px}
.lv-post-main-wide .lv-post-title-card{width:calc(100% - 20px);padding:18px;margin-top:-48px}
}
.lv-blog-pagination .nav-links{display:flex;justify-content:center;gap:8px;margin:26px 0 0;flex-wrap:wrap}.lv-blog-pagination .page-numbers{min-width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#fff;color:#334155;border:1px solid rgba(148,163,184,.2);text-decoration:none;font-weight:900;padding:0 10px}.lv-blog-pagination .page-numbers.current{background:#3b6df6;color:#fff;border-color:#3b6df6}html.lv-theme-dark .lv-blog-pagination .page-numbers{background:#111d31!important;color:#dbe7fa!important;border-color:rgba(148,163,184,.2)!important}html.lv-theme-dark .lv-blog-pagination .page-numbers.current{background:#3b6df6!important;color:#fff!important;border-color:#3b6df6!important}
/* v16 blog rating interactivity + typography reset */
.lv-blog-hub,
.lv-blog-detail-page,
.lv-blog-hub p,
.lv-blog-detail-page p,
.lv-blog-hub span,
.lv-blog-detail-page span,
.lv-blog-hub small,
.lv-blog-detail-page small,
.lv-blog-hub a,
.lv-blog-detail-page a,
.lv-comments-area,
.lv-comments-area p,
.lv-comments-area span,
.lv-comments-area small,
.lv-comments-area a,
.lv-comments-area textarea{
font-weight:400!important;
}
.lv-blog-breadcrumb,
.lv-blog-meta,
.lv-blog-featured-content small,
.lv-comment-login-note,
.lv-comment-head time,
.lv-post-rating-box small,
.lv-post-article .lv-post-content,
.lv-post-article .lv-post-content p{
font-weight:400!important;
}
.lv-blog-cat,
.lv-post-cat,
.lv-blog-file-cat,
.lv-blog-archive-hero span,
.lv-comments-title-row span{
font-weight:600!important;
}
.lv-blog-side-nav a,
.lv-blog-side-nav a span,
.lv-post-end-tags > span,
.lv-post-end-tags a,
.lv-blog-file-price,
.lv-comment-actions a,
.lv-comment-login-note a,
.lv-comment-submit,
.lv-comment-login-actions a{
font-weight:500!important;
}
.lv-section-title-row h1,
.lv-section-title-row h2,
.lv-blog-archive-hero h1,
.lv-post-title-card h1,
.lv-comments-title-row h2{
font-weight:700!important;
}
.lv-blog-list-body h3,
.lv-blog-list-body h3 a,
.lv-blog-featured-content strong,
.lv-blog-mini-item strong,
.lv-blog-file-card strong,
.lv-post-related-card strong,
.lv-comment-form-title,
.lv-comment-head strong{
font-weight:600!important;
}
.lv-post-article .lv-post-content strong,
.lv-post-article .lv-post-content b{
font-weight:600!important;
}
.lv-blog-archive-page .lv-blog-layout{
grid-template-columns:220px minmax(0,760px) 300px!important;
gap:28px!important;
}
.lv-blog-archive-page .lv-blog-archive-hero{
padding:22px 28px!important;
margin-bottom:22px!important;
}
.lv-blog-archive-page .lv-blog-archive-featured{
margin:0 0 28px!important;
}
.lv-blog-archive-page .lv-blog-featured-card{
grid-template-columns:48% 1fr!important;
min-height:210px!important;
box-shadow:none!important;
}
.lv-blog-archive-page .lv-blog-featured-image{
min-height:210px!important;
}
.lv-blog-archive-page .lv-blog-list-item{
grid-template-columns:220px minmax(0,1fr)!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
padding:0!important;
border-radius:0!important;
}
.lv-blog-archive-page .lv-blog-list-thumb{
min-height:132px!important;
height:132px!important;
}
.lv-blog-archive-page .lv-blog-list{
gap:24px!important;
}
.lv-post-rating-box{
min-width:190px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:4px!important;
}
.lv-post-rating-arrow{
display:block!important;
width:150px!important;
max-width:100%!important;
height:auto!important;
object-fit:contain!important;
margin:0 auto 0!important;
pointer-events:none!important;
opacity:.92!important;
}
.lv-post-rating-box em{
display:none!important;
}
.lv-post-rating-stars{
gap:4px!important;
min-height:28px!important;
}
.lv-post-rating-stars button{
color:transparent!important;
-webkit-text-stroke:1.4px #f59e0b!important;
text-shadow:none!important;
filter:none!important;
font-size:25px!important;
line-height:1!important;
transition:transform .16s ease,color .16s ease,text-shadow .16s ease!important;
}
.lv-post-rating-stars button:hover,
.lv-post-rating-stars button:focus{
transform:translateY(-1px) scale(1.08)!important;
outline:none!important;
}
.lv-post-rating-stars button.is-active{
color:#fbbf24!important;
-webkit-text-stroke:1px #f59e0b!important;
text-shadow:0 5px 14px rgba(251,191,36,.28)!important;
}
.lv-post-rating-message{
display:none!important;
margin-top:6px!important;
padding:8px 12px!important;
border-radius:8px!important;
color:#166534!important;
background:#dcfce7!important;
border:1px solid #22c55e!important;
font-size:13px!important;
font-weight:500!important;
line-height:1.35!important;
}
.lv-post-rating-message.is-visible{
display:inline-flex!important;
}
.lv-post-rating-message.is-error{
color:#991b1b!important;
background:#fee2e2!important;
border-color:#fecaca!important;
}
.lv-post-rating-box.is-saving .lv-post-rating-stars{
opacity:.7!important;
pointer-events:none!important;
}
.lv-comments-area{
padding:24px!important;
}
.lv-comments-title-row h2,
.lv-comment-form-title{
font-size:22px!important;
letter-spacing:-.02em!important;
}
.lv-comment-login-note{
color:#64748b!important;
line-height:1.6!important;
}
.lv-comment-login-note strong{
font-weight:500!important;
}
.lv-comment-input-row textarea,
.lv-comment-guest-box textarea{
font-size:15px!important;
font-weight:400!important;
}
.lv-comment-text,
.lv-comment-text p{
font-weight:400!important;
}
.lv-comment-awaiting{
font-weight:500!important;
}
.lv-post-end-tags a{
font-size:13px!important;
min-height:28px!important;
background:#f5f5f6!important;
color:#475569!important;
}
.lv-post-end-tags > span{
color:#334155!important;
}
html.lv-theme-dark .lv-post-rating-arrow{
filter:invert(1) brightness(1.35) contrast(.9)!important;
opacity:.78!important;
}
html.lv-theme-dark .lv-post-rating-message{
background:rgba(34,197,94,.14)!important;
color:#bbf7d0!important;
border-color:rgba(34,197,94,.38)!important;
}
html.lv-theme-dark .lv-post-end-tags a{
background:#172033!important;
color:#dbe7fa!important;
}
html.lv-theme-dark .lv-blog-archive-page .lv-blog-list-item{
background:transparent!important;
}
@media(max-width:1180px){
.lv-blog-archive-page .lv-blog-layout{grid-template-columns:1fr!important}
.lv-blog-archive-page .lv-blog-side-nav{position:static!important;display:flex!important;overflow-x:auto!important;max-height:none!important;padding-bottom:8px!important}
.lv-blog-archive-page .lv-blog-side-nav a{white-space:nowrap!important;min-width:max-content!important}
}
@media(max-width:800px){
.lv-blog-archive-page .lv-blog-featured-card,
.lv-blog-archive-page .lv-blog-list-item{grid-template-columns:1fr!important}
.lv-post-rating-box{align-items:flex-start!important;text-align:left!important}
.lv-post-rating-arrow{margin-left:0!important;width:138px!important}
}
/* v18 restore blog detail layout + safe comment containment */
.lv-blog-detail-page,
.lv-blog-detail-page *{
box-sizing:border-box;
}
.lv-blog-detail-page{
overflow-x:hidden!important;
}
.lv-blog-detail-shell{
width:min(1180px,calc(100% - 32px))!important;
max-width:1180px!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-post-sforum-layout{
display:grid!important;
grid-template-columns:220px minmax(0,940px)!important;
gap:30px!important;
align-items:start!important;
width:100%!important;
max-width:100%!important;
}
.lv-post-main-wide,
.lv-post-article{
min-width:0!important;
width:100%!important;
max-width:100%!important;
}
.lv-post-main-wide .lv-post-hero,
.lv-post-main-wide .lv-post-content,
.lv-post-main-wide .lv-blog-linked-files,
.lv-post-main-wide .lv-post-comments,
.lv-post-main-wide .lv-post-related-below{
width:100%!important;
max-width:940px!important;
margin-left:0!important;
margin-right:0!important;
}
.lv-post-comments{
display:block!important;
clear:both!important;
overflow:visible!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-comments-area{
width:100%!important;
max-width:100%!important;
margin:28px 0 0!important;
overflow:hidden!important;
}
.lv-comment-list,
.lv-comment-item,
.lv-comment-body,
.lv-comment-respond,
.lv-comment-form,
.lv-comment-input-row,
.lv-comment-submit-row,
.lv-comment-guest-box{
width:100%!important;
max-width:100%!important;
min-width:0!important;
box-sizing:border-box!important;
}
.lv-comment-respond{
display:block!important;
clear:both!important;
position:relative!important;
inset:auto!important;
float:none!important;
transform:none!important;
margin:22px 0 0!important;
padding:0!important;
}
.lv-comment-form{
display:block!important;
position:relative!important;
inset:auto!important;
float:none!important;
transform:none!important;
margin:0!important;
padding:0!important;
}
.lv-comment-input-row{
display:grid!important;
grid-template-columns:52px minmax(0,1fr)!important;
gap:14px!important;
align-items:start!important;
}
.lv-comment-input-row textarea,
.lv-comment-guest-box textarea,
.lv-comments-area textarea#comment{
display:block!important;
width:100%!important;
max-width:100%!important;
min-width:0!important;
box-sizing:border-box!important;
}
.lv-comment-submit-row{
overflow:hidden!important;
}
.lv-post-related-below{
clear:both!important;
overflow:hidden!important;
}
@media(max-width:1180px){
.lv-post-sforum-layout{
grid-template-columns:1fr!important;
}
.lv-post-sforum-layout .lv-blog-side-nav{
position:static!important;
display:flex!important;
overflow-x:auto!important;
max-height:none!important;
padding-bottom:8px!important;
}
.lv-post-sforum-layout .lv-blog-side-nav a{
white-space:nowrap!important;
min-width:max-content!important;
}
.lv-post-main-wide .lv-post-hero,
.lv-post-main-wide .lv-post-content,
.lv-post-main-wide .lv-blog-linked-files,
.lv-post-main-wide .lv-post-comments,
.lv-post-main-wide .lv-post-related-below{
max-width:100%!important;
}
}
@media(max-width:640px){
.lv-blog-detail-shell{
width:calc(100% - 22px)!important;
}
.lv-comment-input-row,
.lv-comment-guest-box{
grid-template-columns:1fr!important;
}
.lv-comment-form-avatar,
.lv-comment-guest-avatar{
display:none!important;
}
}
/* v19 contained blog comments + related posts layout fix */
.lv-blog-detail-page{
overflow-x:hidden!important;
}
.lv-blog-detail-page .lv-post-main-wide,
.lv-blog-detail-page .lv-post-article{
min-width:0!important;
max-width:100%!important;
}
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page .lv-post-related-below{
width:100%!important;
max-width:940px!important;
margin-left:0!important;
margin-right:0!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comments-area{
width:100%!important;
max-width:100%!important;
margin:28px 0 0!important;
padding:24px!important;
border-radius:22px!important;
box-sizing:border-box!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-comment-compose-panel{
width:100%!important;
max-width:100%!important;
margin:22px 0 0!important;
padding:18px!important;
border-radius:18px!important;
background:#f8fafc!important;
border:1px solid rgba(148,163,184,.16)!important;
box-sizing:border-box!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-comment-compose-head{
display:flex!important;
align-items:flex-start!important;
justify-content:space-between!important;
gap:16px!important;
margin-bottom:14px!important;
}
.lv-blog-detail-page .lv-comment-compose-head span{
display:inline-flex!important;
margin-bottom:4px!important;
color:#3b6df6!important;
font-size:12px!important;
font-weight:600!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
}
.lv-blog-detail-page .lv-comment-form-title{
margin:0!important;
font-size:21px!important;
line-height:1.2!important;
font-weight:650!important;
color:#0f172a!important;
}
.lv-blog-detail-page .lv-comment-login-note{
margin:5px 0 0!important;
color:#64748b!important;
font-weight:400!important;
line-height:1.5!important;
}
.lv-blog-detail-page .lv-comment-login-note strong,
.lv-blog-detail-page .lv-comment-login-note a{
font-weight:500!important;
}
.lv-blog-detail-page .lv-comment-form,
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-submit-row,
.lv-blog-detail-page .lv-comment-list,
.lv-blog-detail-page .lv-comment-item,
.lv-blog-detail-page .lv-comment-body,
.lv-blog-detail-page .lv-comment-guest-box{
width:100%!important;
max-width:100%!important;
min-width:0!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-guest-box{
display:grid!important;
grid-template-columns:52px minmax(0,1fr)!important;
gap:14px!important;
align-items:start!important;
}
.lv-blog-detail-page .lv-comment-input-row textarea,
.lv-blog-detail-page .lv-comment-guest-box textarea,
.lv-blog-detail-page textarea#comment{
display:block!important;
width:100%!important;
max-width:100%!important;
min-width:0!important;
min-height:126px!important;
box-sizing:border-box!important;
resize:vertical!important;
border-radius:16px!important;
font-weight:400!important;
}
.lv-blog-detail-page .lv-comment-submit-row{
display:flex!important;
justify-content:flex-end!important;
margin-top:14px!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-comment-submit{
min-height:42px!important;
padding:0 20px!important;
border-radius:999px!important;
font-weight:600!important;
}
.lv-blog-detail-page .lv-post-related-below{
clear:both!important;
margin-top:28px!important;
padding:22px!important;
border-radius:22px!important;
box-sizing:border-box!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-post-related-grid{
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page .lv-blog-empty{
width:100%!important;
max-width:100%!important;
box-sizing:border-box!important;
font-weight:400!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comment-compose-panel{
background:#101b2e!important;
border-color:rgba(148,163,184,.2)!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comment-form-title{
color:#f8fbff!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comment-login-note{
color:#c2cfe4!important;
}
@media(max-width:1180px){
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page .lv-post-related-below{
max-width:100%!important;
}
}
@media(max-width:640px){
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page .lv-comment-compose-panel,
.lv-blog-detail-page .lv-post-related-below{
padding:18px!important;
}
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-guest-box{
grid-template-columns:1fr!important;
}
.lv-blog-detail-page .lv-comment-form-avatar,
.lv-blog-detail-page .lv-comment-guest-avatar{
display:none!important;
}
}
/* v20 blog detail comment flow: contained form -> list -> related -> suggested files */
.lv-blog-detail-page .lv-post-main-wide,
.lv-blog-detail-page .lv-post-article{
min-width:0!important;
width:100%!important;
max-width:100%!important;
overflow:visible!important;
}
.lv-blog-detail-page .lv-post-article > .lv-post-content,
.lv-blog-detail-page .lv-post-article > .lv-post-comments,
.lv-blog-detail-page .lv-post-article > .lv-post-related-below,
.lv-blog-detail-page .lv-post-article > .lv-blog-linked-files{
width:100%!important;
max-width:940px!important;
margin-left:0!important;
margin-right:0!important;
box-sizing:border-box!important;
clear:both!important;
}
.lv-blog-detail-page .lv-post-comments{
display:block!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page .lv-comments-area{
width:100%!important;
max-width:100%!important;
margin:28px 0 0!important;
padding:24px!important;
border-radius:24px!important;
background:#fff!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 42px rgba(15,23,42,.045)!important;
overflow:hidden!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comments-title-row{
margin-bottom:18px!important;
}
.lv-blog-detail-page .lv-comments-title-row h2{
font-size:22px!important;
font-weight:700!important;
letter-spacing:-.02em!important;
}
.lv-blog-detail-page .lv-comment-compose-panel{
width:100%!important;
max-width:100%!important;
margin:0 0 20px!important;
padding:18px!important;
border-radius:20px!important;
background:#f8fafc!important;
border:1px solid rgba(148,163,184,.16)!important;
box-sizing:border-box!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-comments-list-panel{
width:100%!important;
max-width:100%!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comments-list-head{
display:flex!important;
align-items:end!important;
justify-content:space-between!important;
gap:16px!important;
padding-top:4px!important;
margin:0 0 14px!important;
}
.lv-blog-detail-page .lv-comments-list-head span{
display:block!important;
color:#3b6df6!important;
font-size:12px!important;
font-weight:600!important;
text-transform:uppercase!important;
letter-spacing:.04em!important;
}
.lv-blog-detail-page .lv-comments-list-head h3{
margin:2px 0 0!important;
font-size:20px!important;
line-height:1.2!important;
font-weight:700!important;
color:#0f172a!important;
}
.lv-blog-detail-page .lv-comment-list{
display:grid!important;
gap:12px!important;
width:100%!important;
max-width:100%!important;
margin:0!important;
}
.lv-blog-detail-page .lv-comment-item{
width:100%!important;
max-width:100%!important;
display:grid!important;
grid-template-columns:42px minmax(0,1fr)!important;
gap:12px!important;
padding:14px!important;
border-radius:16px!important;
background:#f8fafc!important;
border:1px solid rgba(148,163,184,.14)!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comment-item.is-hidden-by-default{
display:none!important;
}
.lv-blog-detail-page .lv-comment-item.is-revealed{
animation:lvCommentReveal .22s ease both;
}
@keyframes lvCommentReveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.lv-blog-detail-page .lv-comments-load-more{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:40px!important;
margin:16px auto 0!important;
padding:0 18px!important;
border:0!important;
border-radius:999px!important;
background:#eef2ff!important;
color:#315eea!important;
font-size:14px!important;
font-weight:600!important;
cursor:pointer!important;
}
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-guest-box{
display:grid!important;
grid-template-columns:52px minmax(0,1fr)!important;
gap:14px!important;
align-items:start!important;
width:100%!important;
max-width:100%!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comment-input-row textarea,
.lv-blog-detail-page .lv-comment-guest-box textarea,
.lv-blog-detail-page textarea#comment{
width:100%!important;
max-width:100%!important;
min-width:0!important;
min-height:128px!important;
box-sizing:border-box!important;
resize:vertical!important;
border-radius:16px!important;
font-weight:400!important;
}
.lv-blog-detail-page .lv-post-related-below{
width:100%!important;
max-width:940px!important;
margin:24px 0 0!important;
padding:22px!important;
border-radius:22px!important;
background:#fff!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 42px rgba(15,23,42,.045)!important;
box-sizing:border-box!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-blog-linked-files{
margin-top:24px!important;
}
.lv-blog-detail-page .lv-blog-linked-files .lv-blog-file-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comments-area,
html.lv-theme-dark .lv-blog-detail-page .lv-post-related-below{
background:#0f1a2d!important;
border-color:rgba(148,163,184,.18)!important;
color:#e5edf9!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comment-compose-panel,
html.lv-theme-dark .lv-blog-detail-page .lv-comment-item{
background:#111d31!important;
border-color:rgba(148,163,184,.2)!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comments-list-head h3{
color:#f8fbff!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comments-load-more{
background:#172642!important;
color:#93c5fd!important;
}
@media(max-width:760px){
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page .lv-comment-compose-panel,
.lv-blog-detail-page .lv-post-related-below{
padding:18px!important;
}
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-guest-box{
grid-template-columns:1fr!important;
}
.lv-blog-detail-page .lv-comment-form-avatar,
.lv-blog-detail-page .lv-comment-guest-avatar{
display:none!important;
}
.lv-blog-detail-page .lv-blog-linked-files .lv-blog-file-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
}
@media(max-width:520px){
.lv-blog-detail-page .lv-blog-linked-files .lv-blog-file-grid{
grid-template-columns:1fr!important;
}
}
/* v21 final blog detail flow containment: article -> comments -> related -> suggested files */
.lv-blog-detail-page,
.lv-blog-detail-page *{
box-sizing:border-box;
}
.lv-blog-detail-page{
overflow-x:hidden!important;
}
.lv-blog-detail-page .lv-blog-detail-shell{
width:min(1180px,calc(100% - 32px))!important;
max-width:1180px!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-blog-detail-page .lv-post-sforum-layout{
display:grid!important;
grid-template-columns:220px minmax(0, 760px)!important;
gap:30px!important;
align-items:start!important;
justify-content:center!important;
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page .lv-post-main-wide,
.lv-blog-detail-page .lv-post-article{
width:100%!important;
max-width:760px!important;
min-width:0!important;
margin:0!important;
padding:0!important;
overflow:visible!important;
float:none!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
}
.lv-blog-detail-page .lv-post-article{
display:grid!important;
grid-template-columns:minmax(0,1fr)!important;
gap:24px!important;
}
.lv-blog-detail-page .lv-post-main-wide .lv-post-hero,
.lv-blog-detail-page .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page .lv-blog-after-content-stack,
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page .lv-blog-linked-files{
width:100%!important;
max-width:760px!important;
min-width:0!important;
margin-left:0!important;
margin-right:0!important;
float:none!important;
clear:both!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
box-sizing:border-box!important;
overflow:hidden!important;
}
.lv-blog-detail-page .lv-blog-after-content-stack{
display:grid!important;
grid-template-columns:minmax(0,1fr)!important;
gap:24px!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page .lv-post-comments{
display:block!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page .lv-comments-area{
margin:0!important;
padding:24px!important;
border-radius:24px!important;
background:#fff!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 42px rgba(15,23,42,.045)!important;
}
.lv-blog-detail-page .lv-comments-title-row{
margin-bottom:16px!important;
}
.lv-blog-detail-page .lv-comment-compose-panel{
margin:0 0 18px!important;
padding:18px!important;
width:100%!important;
max-width:100%!important;
overflow:hidden!important;
border-radius:18px!important;
background:#f8fafc!important;
border:1px solid rgba(148,163,184,.16)!important;
}
.lv-blog-detail-page .lv-comments-list-panel,
.lv-blog-detail-page .lv-comment-list,
.lv-blog-detail-page .lv-comment-item,
.lv-blog-detail-page .lv-comment-body,
.lv-blog-detail-page .lv-comment-form,
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-submit-row,
.lv-blog-detail-page .lv-comment-guest-box{
width:100%!important;
max-width:100%!important;
min-width:0!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-guest-box{
display:grid!important;
grid-template-columns:46px minmax(0,1fr)!important;
gap:14px!important;
align-items:start!important;
}
.lv-blog-detail-page .lv-comment-input-row textarea,
.lv-blog-detail-page .lv-comment-guest-box textarea,
.lv-blog-detail-page textarea#comment{
width:100%!important;
max-width:100%!important;
min-width:0!important;
min-height:124px!important;
border-radius:16px!important;
resize:vertical!important;
}
.lv-blog-detail-page .lv-comment-submit-row{
display:flex!important;
justify-content:flex-end!important;
margin-top:14px!important;
}
.lv-blog-detail-page .lv-comment-item.is-hidden-by-default{
display:none!important;
}
.lv-blog-detail-page .lv-post-related-below{
margin:0!important;
padding:22px!important;
border-radius:22px!important;
background:#fff!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 42px rgba(15,23,42,.045)!important;
}
.lv-blog-detail-page .lv-post-related-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:14px!important;
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page .lv-blog-linked-files{
margin:0!important;
padding:22px!important;
border-radius:22px!important;
background:linear-gradient(180deg,#fff,#f8fbff)!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 42px rgba(15,23,42,.06)!important;
}
.lv-blog-detail-page .lv-blog-linked-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:16px!important;
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page .lv-blog-file-card{
min-width:0!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comments-area,
html.lv-theme-dark .lv-blog-detail-page .lv-post-related-below,
html.lv-theme-dark .lv-blog-detail-page .lv-blog-linked-files{
background:#0f1a2d!important;
border-color:rgba(148,163,184,.18)!important;
color:#e5edf9!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-blog-detail-page .lv-comment-compose-panel,
html.lv-theme-dark .lv-blog-detail-page .lv-comment-item{
background:#111d31!important;
border-color:rgba(148,163,184,.2)!important;
}
@media(max-width:1180px){
.lv-blog-detail-page .lv-post-sforum-layout{
grid-template-columns:1fr!important;
justify-content:stretch!important;
}
.lv-blog-detail-page .lv-post-main-wide,
.lv-blog-detail-page .lv-post-article,
.lv-blog-detail-page .lv-post-main-wide .lv-post-hero,
.lv-blog-detail-page .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page .lv-blog-after-content-stack,
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page .lv-blog-linked-files{
max-width:100%!important;
}
}
@media(max-width:760px){
.lv-blog-detail-page .lv-blog-detail-shell{width:calc(100% - 22px)!important}
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page .lv-comment-compose-panel,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page .lv-blog-linked-files{padding:18px!important}
.lv-blog-detail-page .lv-comment-input-row,
.lv-blog-detail-page .lv-comment-guest-box{grid-template-columns:1fr!important}
.lv-blog-detail-page .lv-comment-form-avatar,
.lv-blog-detail-page .lv-comment-guest-avatar{display:none!important}
.lv-blog-detail-page .lv-blog-linked-grid,
.lv-blog-detail-page .lv-post-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:520px){
.lv-blog-detail-page .lv-blog-linked-grid,
.lv-blog-detail-page .lv-post-related-grid{grid-template-columns:1fr!important}
}
/* v22 — tighten single blog after-content flow so comments, related posts,
and suggested files stay in the same centered content column without shifting. */
.lv-blog-detail-page .lv-post-main-wide{
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
justify-self:center!important;
}
.lv-blog-detail-page .lv-post-main-wide > *{
width:100%!important;
}
.lv-blog-detail-page .lv-post-article{
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:24px!important;
}
.lv-blog-detail-page .lv-post-article > *{
width:100%!important;
max-width:100%!important;
min-width:0!important;
align-self:stretch!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page .lv-blog-after-content-stack{
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
justify-content:flex-start!important;
width:100%!important;
max-width:100%!important;
min-width:0!important;
gap:24px!important;
}
.lv-blog-detail-page .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page .lv-blog-after-content-stack > .lv-blog-linked-files{
width:100%!important;
max-width:100%!important;
min-width:0!important;
margin:0!important;
align-self:stretch!important;
justify-self:stretch!important;
}
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page .lv-blog-linked-files,
.lv-blog-detail-page .lv-comments-area{
display:block!important;
float:none!important;
clear:both!important;
}
.lv-blog-detail-page .lv-post-related-grid,
.lv-blog-detail-page .lv-blog-linked-grid{
width:100%!important;
max-width:100%!important;
}
/* v23 — single blog column lock: keep post content, comments, related posts,
and suggested design files in one consistent content column. */
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout,
.lv-blog-detail-page .lv-post-sforum-layout{
grid-template-columns:220px minmax(0,760px)!important;
justify-content:center!important;
align-items:start!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide,
.lv-blog-detail-page .lv-post-main-wide{
width:100%!important;
max-width:760px!important;
justify-self:stretch!important;
align-self:start!important;
margin:0!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article,
.lv-blog-detail-page .lv-post-article{
width:100%!important;
max-width:760px!important;
margin:0!important;
padding:0!important;
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:24px!important;
float:none!important;
clear:both!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide .lv-post-hero,
.lv-blog-detail-page .lv-post-main-wide .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-after-content-stack,
.lv-blog-detail-page .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-comments,
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area,
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-below,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-files,
.lv-blog-detail-page .lv-blog-linked-files{
width:100%!important;
max-width:760px!important;
min-width:0!important;
margin-left:0!important;
margin-right:0!important;
float:none!important;
clear:both!important;
box-sizing:border-box!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-after-content-stack,
.lv-blog-detail-page .lv-blog-after-content-stack{
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:24px!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-after-content-stack > .lv-blog-linked-files,
.lv-blog-detail-page .lv-blog-after-content-stack > .lv-blog-linked-files{
width:100%!important;
max-width:760px!important;
margin:0!important;
align-self:stretch!important;
justify-self:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-comments,
.lv-blog-detail-page .lv-post-comments{
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area,
.lv-blog-detail-page .lv-comments-area{
margin:0!important;
padding:24px!important;
border-radius:24px!important;
overflow:hidden!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-below,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-files,
.lv-blog-detail-page .lv-blog-linked-files{
margin:0!important;
padding:22px!important;
border-radius:22px!important;
overflow:hidden!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-grid,
.lv-blog-detail-page .lv-post-related-grid,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid,
.lv-blog-detail-page .lv-blog-linked-grid{
width:100%!important;
max-width:100%!important;
min-width:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid,
.lv-blog-detail-page .lv-blog-linked-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:16px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-grid,
.lv-blog-detail-page .lv-post-related-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list,
.lv-blog-detail-page .lv-comment-list{
display:flex!important;
flex-direction:column!important;
gap:14px!important;
margin:0 0 22px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-item,
.lv-blog-detail-page .lv-comment-item{
width:100%!important;
max-width:100%!important;
margin:0!important;
box-sizing:border-box!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children,
.lv-blog-detail-page .lv-comment-list .children{
display:flex!important;
flex-direction:column!important;
gap:14px!important;
margin:14px 0 0 54px!important;
padding:0!important;
}
@media(max-width:1180px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout,
.lv-blog-detail-page .lv-post-sforum-layout{
grid-template-columns:1fr!important;
justify-content:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide,
.lv-blog-detail-page .lv-post-main-wide,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article,
.lv-blog-detail-page .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide .lv-post-hero,
.lv-blog-detail-page .lv-post-main-wide .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-after-content-stack,
.lv-blog-detail-page .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-comments,
.lv-blog-detail-page .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area,
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-below,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-files,
.lv-blog-detail-page .lv-blog-linked-files{
max-width:100%!important;
}
}
@media(max-width:760px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area,
.lv-blog-detail-page .lv-comments-area,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-below,
.lv-blog-detail-page .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-files,
.lv-blog-detail-page .lv-blog-linked-files{
padding:18px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid,
.lv-blog-detail-page .lv-blog-linked-grid,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-grid,
.lv-blog-detail-page .lv-post-related-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children,
.lv-blog-detail-page .lv-comment-list .children{
margin-left:22px!important;
}
}
@media(max-width:520px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid,
.lv-blog-detail-page .lv-blog-linked-grid,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-grid,
.lv-blog-detail-page .lv-post-related-grid{
grid-template-columns:1fr!important;
}
}
/* v24 — hard DOM/layout lock for single blog detail.
Related posts and suggested files are direct children of .lv-post-main-wide,
never independent sections beside/below the Sforum grid. */
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout{
display:grid!important;
grid-template-columns:220px minmax(0,760px)!important;
column-gap:30px!important;
row-gap:0!important;
align-items:start!important;
justify-content:center!important;
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-main-wide{
grid-column:2!important;
width:100%!important;
max-width:760px!important;
min-width:0!important;
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:24px!important;
margin:0!important;
padding:0!important;
justify-self:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
width:100%!important;
max-width:760px!important;
min-width:0!important;
margin-left:0!important;
margin-right:0!important;
box-sizing:border-box!important;
float:none!important;
clear:both!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
align-self:stretch!important;
justify-self:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article{
display:block!important;
margin:0!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack{
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:24px!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-comments{
display:block!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
margin:0!important;
overflow:hidden!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area{
margin:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list{
display:flex!important;
flex-direction:column!important;
gap:16px!important;
margin:0 0 22px!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .lv-comment-item,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .comment,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-item + .lv-comment-item{
margin-top:0!important;
margin-bottom:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{
display:flex!important;
flex-direction:column!important;
gap:14px!important;
margin:14px 0 0 54px!important;
padding:0!important;
}
/* Safety net: if an older cached template leaves these as grid children, keep them in column 2. */
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-blog-linked-files,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-comments{
grid-column:2!important;
width:100%!important;
max-width:760px!important;
margin-left:0!important;
margin-right:0!important;
justify-self:stretch!important;
}
@media(max-width:1180px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout{
grid-template-columns:1fr!important;
justify-content:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-main-wide,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-blog-linked-files,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-comments{
grid-column:1!important;
max-width:100%!important;
}
}
@media(max-width:760px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{
margin-left:22px!important;
}
}
/* v25 — strict single post column + archive-design-card rendering for suggested files */
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout{
display:grid!important;
grid-template-columns:220px minmax(0,760px)!important;
column-gap:30px!important;
row-gap:0!important;
align-items:start!important;
justify-content:center!important;
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-left-rail{grid-column:1!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-main-wide{
grid-column:2!important;width:100%!important;max-width:760px!important;min-width:0!important;
display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:24px!important;
margin:0!important;padding:0!important;float:none!important;clear:none!important;position:relative!important;
left:auto!important;right:auto!important;transform:none!important;overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-breadcrumb,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-blog-linked-files{
width:100%!important;max-width:760px!important;min-width:0!important;margin-left:0!important;margin-right:0!important;
box-sizing:border-box!important;float:none!important;clear:both!important;position:relative!important;
left:auto!important;right:auto!important;transform:none!important;align-self:stretch!important;justify-self:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article{
display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:24px!important;
margin:0!important;padding:0!important;overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack{
display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:24px!important;
margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-comments{
display:block!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-blog-linked-files{margin:0!important;overflow:hidden!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area{margin:0!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list{display:flex!important;flex-direction:column!important;gap:16px!important;margin:0 0 22px!important;padding:0!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{display:flex!important;flex-direction:column!important;gap:14px!important;margin:14px 0 0 54px!important;padding:0!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .lv-comment-item,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .comment,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-item + .lv-comment-item{margin-top:0!important;margin-bottom:0!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid.lv-blog-linked-design-grid.posts-grid{
display:block!important;column-count:3!important;column-gap:16px!important;width:100%!important;max-width:100%!important;padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-design-grid .post-card.pinterest-style,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-design-grid article.post-card{
display:block!important;break-inside:avoid!important;-webkit-column-break-inside:avoid!important;page-break-inside:avoid!important;
margin:0 0 16px!important;width:100%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-blog-linked-files{
width:760px!important;max-width:760px!important;margin-left:calc((100% - 1010px) / 2 + 250px)!important;margin-right:auto!important;
box-sizing:border-box!important;float:none!important;clear:both!important;position:relative!important;left:auto!important;right:auto!important;transform:none!important;
}
@media(max-width:1180px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout{grid-template-columns:1fr!important;justify-content:stretch!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-main-wide,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-breadcrumb,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide .lv-post-content,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-blog-linked-files,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-blog-linked-files{
grid-column:1!important;width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;
}
}
@media(max-width:760px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid.lv-blog-linked-design-grid.posts-grid{column-count:2!important;column-gap:14px!important;}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{margin-left:22px!important;}
}
@media(max-width:520px){.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid.lv-blog-linked-design-grid.posts-grid{column-count:1!important;}}
/* v26 — design file archive routing + single blog vertical rhythm fixes */
.lv-design-archive-page{
background:var(--color-bg-light);
padding:28px 0 48px;
}
.lv-design-archive-page .container{
max-width:1600px;
}
.lv-design-archive-head{
margin:0 0 8px;
}
.lv-design-archive-breadcrumb{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:8px;
margin:0 0 16px;
font-size:.92rem;
color:#64748b;
}
.lv-design-archive-breadcrumb a{
color:var(--color-primary);
text-decoration:none;
font-weight:500;
}
.lv-design-archive-breadcrumb strong{
color:var(--color-text);
}
.lv-design-archive-title-card{
width:100%;
max-width:860px;
padding:26px 30px;
border:1px solid rgba(42,104,233,.12);
border-radius:22px;
background:linear-gradient(135deg,#fff 0%,#eef4ff 100%);
box-shadow:0 20px 55px rgba(15,23,42,.06);
}
.lv-design-archive-title-card > span{
display:inline-flex;
align-items:center;
padding:7px 12px;
border-radius:999px;
background:#edf4ff;
color:var(--color-primary);
font-size:.82rem;
font-weight:700;
margin-bottom:12px;
}
.lv-design-archive-title-card h1{
margin:0 0 10px;
color:#0f172a;
font-size:clamp(2rem,4vw,3.35rem);
line-height:1.05;
letter-spacing:-.045em;
}
.lv-design-archive-title-card p{
margin:0;
color:#64748b;
font-size:1.05rem;
line-height:1.7;
}
.lv-design-archive-layout{
align-items:start;
}
.lv-design-archive-layout .main-content{
min-width:0;
}
.lv-design-archive-page .btn-collections.is-active{
background:var(--color-primary);
border-color:var(--color-primary);
color:#fff;
box-shadow:0 8px 18px rgba(42,104,233,.18);
}
.lv-design-archive-page .posts-grid{
width:100%;
}
.lv-design-archive-page .no-posts{
column-span:all;
-webkit-column-span:all;
break-inside:avoid;
}
.lv-blog-detail-page.lv-blog-detail-page-v15{
--lv-detail-card-gap:28px;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide{
gap:var(--lv-detail-card-gap)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article{
gap:var(--lv-detail-card-gap)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack{
display:grid!important;
grid-template-columns:1fr!important;
row-gap:var(--lv-detail-card-gap)!important;
gap:var(--lv-detail-card-gap)!important;
margin:0!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-article > .lv-blog-after-content-stack > .lv-blog-linked-files{
margin:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-files{
border-radius:22px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list{
gap:18px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{
gap:16px!important;
margin-top:16px!important;
}
@media(max-width:1180px){
.lv-design-archive-page{
padding-top:22px;
}
.lv-design-archive-title-card{
max-width:100%;
}
}
@media(max-width:760px){
.lv-design-archive-title-card{
padding:22px 18px;
border-radius:18px;
}
.lv-blog-detail-page.lv-blog-detail-page-v15{
--lv-detail-card-gap:20px;
}
}
/* v27 — single blog DOM/sticky/sidebar + featured-file showcase rhythm fix */
.lv-blog-detail-page.lv-blog-detail-page-v15{
--lv-detail-card-gap:30px;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout{
display:grid!important;
grid-template-columns:220px minmax(0,760px)!important;
column-gap:30px!important;
row-gap:0!important;
align-items:start!important;
justify-content:center!important;
width:100%!important;
max-width:100%!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-left-rail.lv-blog-side-nav{
grid-column:1!important;
position:sticky!important;
top:150px!important;
align-self:start!important;
z-index:20!important;
display:grid!important;
gap:8px!important;
max-height:calc(100vh - 170px)!important;
overflow:auto!important;
scrollbar-width:thin;
}
.admin-bar .lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-left-rail.lv-blog-side-nav{
top:182px!important;
max-height:calc(100vh - 202px)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-main-wide{
grid-column:2!important;
width:100%!important;
max-width:760px!important;
min-width:0!important;
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:var(--lv-detail-card-gap)!important;
margin:0!important;
padding:0!important;
overflow:visible!important;
float:none!important;
clear:none!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-breadcrumb,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
width:100%!important;
max-width:760px!important;
min-width:0!important;
margin-left:0!important;
margin-right:0!important;
box-sizing:border-box!important;
float:none!important;
clear:both!important;
position:relative!important;
left:auto!important;
right:auto!important;
transform:none!important;
align-self:stretch!important;
justify-self:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article{
display:block!important;
margin:0!important;
padding:0!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack{
display:flex!important;
flex-direction:column!important;
align-items:stretch!important;
gap:var(--lv-detail-card-gap)!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-comments{
display:block!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
margin:0!important;
padding:24px!important;
border-radius:24px!important;
overflow:hidden!important;
background:#fff!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 42px rgba(15,23,42,.05)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
background:linear-gradient(180deg,#fff,#f8fbff)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comments-area{
margin:0!important;
border-radius:24px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list{
display:flex!important;
flex-direction:column!important;
gap:18px!important;
margin:0 0 22px!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{
display:flex!important;
flex-direction:column!important;
gap:16px!important;
margin:16px 0 0 54px!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-featured-files-block .lv-blog-linked-head span{
color:#3b6df6!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-featured-files-block .lv-blog-linked-head h3{
margin:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid.lv-blog-linked-design-grid.posts-grid{
display:block!important;
column-count:3!important;
column-gap:16px!important;
width:100%!important;
max-width:100%!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-design-grid .post-card.pinterest-style,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-design-grid article.post-card{
display:block!important;
break-inside:avoid!important;
-webkit-column-break-inside:avoid!important;
page-break-inside:avoid!important;
margin:0 0 16px!important;
width:100%!important;
}
/* Fallback for sites that still have a cached older single.php where the two cards sit after .lv-post-sforum-layout. */
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-sforum-layout + .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-related-below + .lv-blog-linked-files,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-sforum-layout + .lv-blog-linked-files{
margin-top:var(--lv-detail-card-gap)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-blog-linked-files{
width:760px!important;
max-width:760px!important;
margin-left:calc((100% - 1010px) / 2 + 250px)!important;
margin-right:auto!important;
box-sizing:border-box!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
background:#0f1a2d!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:none!important;
}
@media(max-width:1180px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout{
grid-template-columns:1fr!important;
justify-content:stretch!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-left-rail.lv-blog-side-nav{
grid-column:1!important;
position:static!important;
max-height:none!important;
display:flex!important;
overflow-x:auto!important;
overflow-y:hidden!important;
padding-bottom:8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-left-rail.lv-blog-side-nav a{
min-width:max-content!important;
white-space:nowrap!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-sforum-layout > .lv-post-main-wide,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-breadcrumb,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-hero,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-detail-shell > .lv-blog-linked-files{
width:100%!important;
max-width:100%!important;
margin-left:0!important;
margin-right:0!important;
}
}
@media(max-width:760px){
.lv-blog-detail-page.lv-blog-detail-page-v15{
--lv-detail-card-gap:22px;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-post-related-below,
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-post-main-wide > .lv-blog-after-content-stack > .lv-blog-linked-files{
padding:18px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid.lv-blog-linked-design-grid.posts-grid{
column-count:2!important;
column-gap:14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-comment-list .children{
margin-left:22px!important;
}
}
@media(max-width:520px){
.lv-blog-detail-page.lv-blog-detail-page-v15 .lv-blog-linked-grid.lv-blog-linked-design-grid.posts-grid{
column-count:1!important;
}
}
/* v33 - Desktop left rail icon system */
.lv-rail-actions{
display:none;
}
@media (min-width:769px){
.secondary-navigation{
width:64px!important;
background:#fff!important;
border-right:1px solid #f0f2f6!important;
box-shadow:0 0 0 1px rgba(15,23,42,.01)!important;
padding:18px 0 14px!important;
gap:12px!important;
}
:root{
--lv-rail-width:64px;
}
.secondary-navigation .mobile-menu-header{
position:relative;
min-height:40px;
align-items:center;
justify-content:center;
margin-bottom:8px;
}
.secondary-navigation .mobile-menu-header::after{
content:"";
width:0;
height:0;
border-left:4px solid transparent;
border-right:4px solid transparent;
border-top:5px solid #9aa4b2;
position:absolute;
right:8px;
top:16px;
}
.secondary-navigation .site-logo{
width:34px!important;
min-height:34px!important;
height:34px!important;
border-radius:11px!important;
background:transparent!important;
box-shadow:none!important;
overflow:visible!important;
}
.secondary-navigation .site-logo a{
width:34px!important;
height:34px!important;
padding:0!important;
border-radius:11px!important;
font-size:0!important;
background:transparent!important;
position:relative;
}
.secondary-navigation .site-logo a::before{
content:"";
width:28px;
height:28px;
border-radius:11px;
display:block;
background:
radial-gradient(circle at 70% 28%, rgba(255,255,255,.65) 0 22%, rgba(255,255,255,0) 23%),
linear-gradient(135deg,#ff9ab4 0%,#ff5b83 48%,#c6d9ff 49%,#ffedf2 100%);
box-shadow:0 8px 18px rgba(255,91,131,.16);
}
.secondary-navigation .site-logo img{
display:none!important;
}
.secondary-navigation > ul,
.secondary-navigation > .menu{
display:none!important;
}
.lv-rail-actions{
display:flex;
flex:1 1 auto;
width:100%;
min-height:0;
flex-direction:column;
align-items:center;
gap:12px;
}
.lv-rail-group{
width:100%;
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
}
.lv-rail-group-main{
gap:8px;
}
.lv-rail-group-bottom{
margin-top:auto;
gap:8px;
}
.lv-rail-separator{
width:34px;
height:1px;
background:#e8ebf1;
margin:2px 0 4px;
}
.lv-rail-link{
width:38px!important;
min-height:38px!important;
height:38px!important;
padding:0!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
color:#20242b!important;
background:transparent!important;
box-shadow:none!important;
}
.lv-rail-link:hover,
.lv-rail-link:focus-visible{
background:#f5f7fb!important;
color:#111827!important;
box-shadow:none!important;
}
.lv-rail-link svg{
width:20px;
height:20px;
fill:none;
stroke:currentColor;
stroke-width:1.9;
stroke-linecap:round;
stroke-linejoin:round;
}
.lv-rail-group-main .lv-rail-link:first-child{
width:40px!important;
height:40px!important;
min-height:40px!important;
background:linear-gradient(180deg,#fff,#fbf7fb)!important;
color:#161b22!important;
box-shadow:0 8px 24px rgba(15,23,42,.06)!important;
}
.lv-rail-group-main .lv-rail-link:first-child svg{
width:19px;
height:19px;
}
.lv-rail-support{
width:44px!important;
min-height:54px!important;
display:flex!important;
flex-direction:column;
align-items:center;
justify-content:center;
gap:2px;
padding:0!important;
border-radius:999px!important;
background:transparent!important;
color:#36a7ff!important;
box-shadow:none!important;
}
.lv-rail-support-icon{
width:34px;
height:34px;
display:grid;
place-items:center;
border-radius:999px;
background:#e8f5ff;
color:#58b7ff;
}
.lv-rail-support svg{
width:22px;
height:22px;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.lv-rail-support span:last-child{
display:block;
max-width:42px;
padding:1px 5px;
border-radius:4px;
background:#53b8ff;
color:#fff;
font-size:9px;
line-height:1.25;
font-weight:700;
white-space:nowrap;
}
.top-menu,
.site-header{
left:var(--lv-rail-width)!important;
}
.site-wrapper{
padding-left:var(--lv-rail-width)!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
left:var(--lv-rail-width)!important;
}
}
/* v38 - final LarxVo shell order guard */
:root{
--lv-rail-width:84px!important;
--lv-topbar-height:64px!important;
--lv-promo-height:40px!important;
--lv-hero-gradient:linear-gradient(180deg,#eefaff 0%,#f7fbff 38%,#ffffff 82%);
}
@media (min-width:769px){
body.has-lv-rail .site-wrapper{padding-left:var(--lv-rail-width)!important}
body.has-lv-rail .top-menu,
body.has-lv-rail .site-header{left:var(--lv-rail-width)!important}
body.has-lv-rail .top-navigation{display:none!important}
body.has-lv-rail .top-menu .container{
justify-content:flex-end!important;
padding-left:32px!important;
padding-right:40px!important;
}
body.home .top-menu{
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{
background:var(--lv-hero-gradient)!important;
min-height:650px!important;
padding-top:136px!important;
}
body.home.has-lv-promo .lv-home-hero{padding-top:150px!important}
body.home.has-lv-promo.lv-promo-dismissed .lv-home-hero{padding-top:110px!important}
body.has-lv-promo .top-menu{top:var(--lv-promo-height)!important}
body.admin-bar.has-lv-promo .top-menu{top:calc(32px + var(--lv-promo-height))!important}
body.has-lv-promo.lv-promo-dismissed .top-menu{top:0!important}
body.admin-bar.has-lv-promo.lv-promo-dismissed .top-menu{top:32px!important}
body.has-lv-rail .secondary-navigation.lv-side-rail{
display:flex!important;
width:var(--lv-rail-width)!important;
padding:18px 0!important;
overflow:visible!important;
background:linear-gradient(180deg,#f2fbff 0%,#f8fbff 44%,#fff 100%)!important;
border-right:1px solid rgba(226,232,240,.72)!important;
}
body.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:var(--lv-promo-height)!important;
height:calc(100vh - var(--lv-promo-height))!important;
}
body.admin-bar.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:calc(32px + var(--lv-promo-height))!important;
height:calc(100vh - 32px - var(--lv-promo-height))!important;
}
body.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:0!important;
height:100vh!important;
}
body.admin-bar.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:32px!important;
height:calc(100vh - 32px)!important;
}
.lv-side-rail .mobile-menu-header,
.lv-side-rail > ul,
.lv-side-rail > .menu,
.lv-side-rail > .lv-rail-actions:not(.lv-rail-actions-editable){display:none!important}
.lv-side-rail .lv-rail-actions-editable{
width:100%!important;
height:100%!important;
padding:0 13px!important;
gap:18px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
overflow:visible!important;
}
.lv-rail-brand{
width:48px!important;
height:52px!important;
min-height:52px!important;
border-radius:10px!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-side-rail .lv-rail-group{
width:100%!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:11px!important;
}
.lv-side-rail .lv-rail-group-bottom{
margin-top:auto!important;
gap:11px!important;
padding-bottom:4px!important;
}
.lv-side-rail .lv-rail-link,
.lv-side-rail .lv-rail-support{
position:relative!important;
width:56px!important;
min-height:56px!important;
height:56px!important;
padding:0!important;
display:grid!important;
place-items:center!important;
border-radius:16px!important;
background:transparent!important;
color:#20242b!important;
overflow:visible!important;
box-shadow:none!important;
text-align:center!important;
text-decoration:none!important;
font-size:0!important;
}
.lv-side-rail .lv-rail-link:hover,
.lv-side-rail .lv-rail-link:focus-visible,
.lv-side-rail .lv-rail-support:hover,
.lv-side-rail .lv-rail-support:focus-visible{
background:#fff!important;
color:#111827!important;
box-shadow:0 12px 24px rgba(15,23,42,.07)!important;
}
.lv-side-rail .lv-rail-icon,
.lv-side-rail .lv-rail-support .lv-rail-icon{
width:42px!important;
height:42px!important;
display:grid!important;
place-items:center!important;
border-radius:999px!important;
background:transparent!important;
color:currentColor!important;
}
.lv-side-rail .lv-rail-support .lv-rail-icon{
background:#e8f5ff!important;
color:#4ab2ff!important;
}
.lv-side-rail .lv-rail-icon svg{
width:24px!important;
height:24px!important;
max-width:24px!important;
max-height:24px!important;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.lv-side-rail .lv-rail-label,
.lv-side-rail .lv-rail-support .lv-rail-label{
position:absolute!important;
left:calc(100% + 12px)!important;
top:50%!important;
z-index:1600!important;
max-width:190px!important;
min-height:30px!important;
display:inline-flex!important;
align-items:center!important;
padding:0 10px!important;
border-radius:8px!important;
background:#1f2329!important;
color:#fff!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
white-space:nowrap!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translate(-4px,-50%)!important;
transition:opacity .16s ease, transform .16s ease, visibility .16s ease!important;
box-shadow:0 12px 28px rgba(15,23,42,.18)!important;
}
.lv-side-rail .lv-rail-label::before{
content:""!important;
position:absolute!important;
left:-5px!important;
top:50%!important;
width:10px!important;
height:10px!important;
background:#1f2329!important;
transform:translateY(-50%) rotate(45deg)!important;
}
.lv-side-rail .lv-rail-link:hover .lv-rail-label,
.lv-side-rail .lv-rail-link:focus-visible .lv-rail-label,
.lv-side-rail .lv-rail-support:hover .lv-rail-label,
.lv-side-rail .lv-rail-support:focus-visible .lv-rail-label{
opacity:1!important;
visibility:visible!important;
transform:translate(0,-50%)!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{left:var(--lv-rail-width)!important}
}
.top-navigation a,
.lv-promo-content,
.lv-promo-badge,
.lv-login-btn,
.lv-hero-kicker,
.lv-search-mode span,
.lv-search-mode a,
.lv-filter-chip,
.lv-term-strip a,
.lv-tool-item,
.lv-section-titlebar a,
.btn-collections,
.btn-featured,
.sidebar-toggle-btn,
.sort-select,
.lv-recent-title,
.lv-detail-suggested-card span{font-weight:400!important}
.lv-search-mode .is-active,
.lv-hero-search > button[type="submit"],
.lv-filter-chip:hover,
.lv-term-strip a:hover,
.lv-section-titlebar h2,
.lv-account-profile strong,
.lv-plan-card strong{font-weight:500!important}
@media (max-width:1280px) and (min-width:769px){
:root{--lv-rail-width:78px!important}
.lv-side-rail .lv-rail-actions-editable{
padding-left:11px!important;
padding-right:11px!important;
}
.lv-side-rail .lv-rail-link,
.lv-side-rail .lv-rail-support{
width:52px!important;
min-height:52px!important;
height:52px!important;
}
}
@media (max-width:768px){
body.has-lv-rail .site-wrapper,
.site-wrapper{padding-left:0!important}
.secondary-navigation.lv-side-rail,
.lv-side-rail .lv-rail-actions-editable{display:none!important}
body.home .top-menu{
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{background:var(--lv-hero-gradient)!important}
.lv-top-actions{
display:flex!important;
gap:10px!important;
}
.top-menu .container{
padding-left:14px!important;
padding-right:14px!important;
}
.lv-top-theme-toggle{display:none!important}
}
html.lv-theme-dark .secondary-navigation.lv-side-rail{
background:linear-gradient(180deg,#111827 0%,#0f172a 100%)!important;
}
/* v41 - final mobile header and account sheet override */
@media (max-width:768px){
:root{
--lv-mobile-topbar-height:48px;
--lv-mobile-promo-height:40px;
}
.site-header,
.header-search,
.search-toggle-btn,
.mobile-menu-toggle,
.mobile-menu-overlay{
display:none!important;
}
.top-menu{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
min-height:var(--lv-mobile-topbar-height)!important;
height:var(--lv-mobile-topbar-height)!important;
z-index:1500!important;
background:linear-gradient(180deg,rgba(247,252,255,.97),rgba(247,252,255,.76))!important;
border:0!important;
box-shadow:0 1px 0 rgba(226,232,240,.6)!important;
backdrop-filter:blur(16px) saturate(145%)!important;
-webkit-backdrop-filter:blur(16px) saturate(145%)!important;
}
.admin-bar .top-menu{
top:46px!important;
}
.top-menu .container{
min-height:var(--lv-mobile-topbar-height)!important;
height:var(--lv-mobile-topbar-height)!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:10px!important;
padding:0 14px!important;
}
.top-navigation{display:none!important}
.lv-mobile-brand{
min-width:0;
display:block!important;
color:#111827!important;
font-size:15px!important;
line-height:1!important;
font-weight:500!important;
text-decoration:none!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.lv-top-actions{
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:10px!important;
margin-left:auto!important;
}
.lv-top-icon,
.lv-account-trigger,
.lv-top-theme-toggle.lv-theme-toggle{
width:32px!important;
height:32px!important;
min-width:32px!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
}
.lv-vip-link span,
.lv-notification-link{display:none!important}
.lv-account-trigger img,
.lv-account-trigger .avatar{
width:32px!important;
height:32px!important;
border-radius:999px!important;
}
.lv-promo-bar{
position:fixed!important;
top:var(--lv-mobile-topbar-height)!important;
left:0!important;
right:0!important;
min-height:var(--lv-mobile-promo-height)!important;
height:var(--lv-mobile-promo-height)!important;
z-index:1490!important;
padding:0 42px 0 12px!important;
}
.admin-bar .lv-promo-bar{
top:calc(46px + var(--lv-mobile-topbar-height))!important;
}
.lv-promo-content{
justify-content:flex-start!important;
font-size:12px!important;
white-space:normal!important;
}
body:not(.home) .site-main{padding-top:var(--lv-mobile-topbar-height)!important}
body.has-lv-promo:not(.lv-promo-dismissed):not(.home) .site-main{
padding-top:calc(var(--lv-mobile-topbar-height) + var(--lv-mobile-promo-height))!important;
}
body.home .site-main{padding-top:0!important}
body.home .lv-home-hero{padding-top:92px!important}
body.home.has-lv-promo:not(.lv-promo-dismissed) .lv-home-hero{padding-top:132px!important}
body.home.lv-promo-dismissed .lv-home-hero{padding-top:92px!important}
body.lv-account-sheet-open{overflow:hidden!important}
.lv-account-sheet-backdrop{
position:fixed!important;
inset:0!important;
z-index:1690!important;
background:rgba(15,23,42,.58)!important;
opacity:0!important;
visibility:hidden!important;
transition:opacity .2s ease, visibility .2s ease!important;
}
body.lv-account-sheet-open .lv-account-sheet-backdrop{
display:block!important;
opacity:1!important;
visibility:visible!important;
}
.lv-account-dropdown{position:static!important}
.lv-account-menu{
position:fixed!important;
left:0!important;
right:0!important;
bottom:0!important;
top:auto!important;
z-index:1700!important;
width:100%!important;
min-width:0!important;
max-width:none!important;
max-height:calc(100dvh - 64px)!important;
margin:0!important;
padding:18px 14px 22px!important;
border-radius:18px 18px 0 0!important;
border:0!important;
background:#fff!important;
box-shadow:0 -18px 50px rgba(15,23,42,.18)!important;
overflow-y:auto!important;
opacity:1!important;
visibility:visible!important;
pointer-events:none!important;
transform:translateY(110%)!important;
transition:transform .24s ease!important;
}
.lv-account-menu::before{display:none!important}
.lv-account-menu.is-open{
pointer-events:auto!important;
transform:translateY(0)!important;
}
}
/* v40 - LarxVo mobile top bar and account sheet */
.lv-mobile-brand{
display:none;
}
.lv-account-sheet-backdrop{
display:none;
}
@media (max-width:768px){
:root{
--lv-mobile-topbar-height:48px;
--lv-mobile-promo-height:40px;
}
.site-header,
.header-search,
.search-toggle-btn,
.mobile-menu-toggle,
.mobile-menu-overlay{
display:none!important;
}
.top-menu{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
min-height:var(--lv-mobile-topbar-height)!important;
height:var(--lv-mobile-topbar-height)!important;
z-index:1500!important;
background:linear-gradient(180deg,rgba(247,252,255,.97),rgba(247,252,255,.76))!important;
border:0!important;
box-shadow:0 1px 0 rgba(226,232,240,.6)!important;
backdrop-filter:blur(16px) saturate(145%)!important;
-webkit-backdrop-filter:blur(16px) saturate(145%)!important;
}
.admin-bar .top-menu{
top:46px!important;
}
.top-menu .container{
min-height:var(--lv-mobile-topbar-height)!important;
height:var(--lv-mobile-topbar-height)!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:10px!important;
padding:0 14px!important;
}
.top-navigation{
display:none!important;
}
.lv-mobile-brand{
min-width:0;
display:block!important;
color:#111827!important;
font-size:15px!important;
line-height:1!important;
font-weight:500!important;
text-decoration:none!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.lv-top-actions{
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:10px!important;
margin-left:auto!important;
}
.lv-top-icon,
.lv-account-trigger,
.lv-top-theme-toggle.lv-theme-toggle{
width:32px!important;
height:32px!important;
min-width:32px!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
}
.lv-vip-link span,
.lv-notification-link{
display:none!important;
}
.lv-account-trigger img,
.lv-account-trigger .avatar{
width:32px!important;
height:32px!important;
border-radius:999px!important;
}
.lv-promo-bar{
position:fixed!important;
top:var(--lv-mobile-topbar-height)!important;
left:0!important;
right:0!important;
min-height:var(--lv-mobile-promo-height)!important;
height:var(--lv-mobile-promo-height)!important;
z-index:1490!important;
padding:0 42px 0 12px!important;
}
.admin-bar .lv-promo-bar{
top:calc(46px + var(--lv-mobile-topbar-height))!important;
}
.lv-promo-content{
justify-content:flex-start!important;
font-size:12px!important;
white-space:normal!important;
}
body:not(.home) .site-main{
padding-top:var(--lv-mobile-topbar-height)!important;
}
body.has-lv-promo:not(.lv-promo-dismissed):not(.home) .site-main{
padding-top:calc(var(--lv-mobile-topbar-height) + var(--lv-mobile-promo-height))!important;
}
body.home .site-main,
body.admin-bar.home .site-main{
padding-top:0!important;
}
body.home .lv-home-hero{
padding-top:92px!important;
}
body.home.has-lv-promo:not(.lv-promo-dismissed) .lv-home-hero{
padding-top:132px!important;
}
body.home.lv-promo-dismissed .lv-home-hero{
padding-top:92px!important;
}
body.lv-account-sheet-open{
overflow:hidden!important;
}
.lv-account-sheet-backdrop{
position:fixed!important;
inset:0!important;
z-index:1690!important;
background:rgba(15,23,42,.58)!important;
opacity:0!important;
visibility:hidden!important;
transition:opacity .2s ease, visibility .2s ease!important;
}
body.lv-account-sheet-open .lv-account-sheet-backdrop{
display:block!important;
opacity:1!important;
visibility:visible!important;
}
.lv-account-dropdown{
position:static!important;
}
.lv-account-menu{
position:fixed!important;
left:0!important;
right:0!important;
bottom:0!important;
top:auto!important;
z-index:1700!important;
width:100%!important;
min-width:0!important;
max-width:none!important;
max-height:calc(100dvh - 64px)!important;
margin:0!important;
padding:18px 14px 22px!important;
border-radius:18px 18px 0 0!important;
border:0!important;
background:#fff!important;
box-shadow:0 -18px 50px rgba(15,23,42,.18)!important;
overflow-y:auto!important;
opacity:1!important;
visibility:visible!important;
pointer-events:none!important;
transform:translateY(110%)!important;
transition:transform .24s ease!important;
}
.lv-account-menu::before{
display:none!important;
}
.lv-account-menu.is-open{
pointer-events:auto!important;
transform:translateY(0)!important;
}
.lv-account-profile strong,
.lv-account-stats strong,
.lv-plan-title strong,
.lv-plan-card strong{
font-weight:500!important;
}
.lv-account-profile span,
.lv-account-stats span,
.lv-plan-card p,
.lv-account-menu .dropdown-item{
font-weight:400!important;
}
}
/* v37 - LarxVo responsive shell refinements */
:root{
--lv-rail-width:84px!important;
--lv-topbar-height:64px!important;
--lv-promo-height:40px!important;
--lv-hero-gradient:linear-gradient(180deg,#eefaff 0%,#f7fbff 38%,#ffffff 82%);
}
@media (min-width:769px){
body.has-lv-rail .site-wrapper{
padding-left:var(--lv-rail-width)!important;
}
body.has-lv-rail .top-menu,
body.has-lv-rail .site-header{
left:var(--lv-rail-width)!important;
}
body.has-lv-rail .top-menu .container{
justify-content:flex-end!important;
padding-left:32px!important;
padding-right:40px!important;
}
body.home .top-menu{
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{
background:var(--lv-hero-gradient)!important;
min-height:650px!important;
padding-top:136px!important;
}
body.home.has-lv-promo .lv-home-hero{
padding-top:150px!important;
}
body.home.has-lv-promo.lv-promo-dismissed .lv-home-hero{
padding-top:110px!important;
}
body.has-lv-promo .top-menu{
top:var(--lv-promo-height)!important;
}
body.admin-bar.has-lv-promo .top-menu{
top:calc(32px + var(--lv-promo-height))!important;
}
body.has-lv-promo.lv-promo-dismissed .top-menu{
top:0!important;
}
body.admin-bar.has-lv-promo.lv-promo-dismissed .top-menu{
top:32px!important;
}
body.has-lv-rail .secondary-navigation.lv-side-rail{
display:flex!important;
width:var(--lv-rail-width)!important;
padding:18px 0!important;
overflow:visible!important;
background:linear-gradient(180deg,#f2fbff 0%,#f8fbff 44%,#fff 100%)!important;
border-right:1px solid rgba(226,232,240,.72)!important;
}
body.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:var(--lv-promo-height)!important;
height:calc(100vh - var(--lv-promo-height))!important;
}
body.admin-bar.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:calc(32px + var(--lv-promo-height))!important;
height:calc(100vh - 32px - var(--lv-promo-height))!important;
}
body.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:0!important;
height:100vh!important;
}
body.admin-bar.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:32px!important;
height:calc(100vh - 32px)!important;
}
.lv-side-rail .lv-rail-actions-editable{
padding:0 13px!important;
gap:18px!important;
overflow:visible!important;
}
.lv-rail-brand{
width:48px!important;
height:52px!important;
min-height:52px!important;
border-radius:10px!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-side-rail .lv-rail-group{
gap:11px!important;
}
.lv-side-rail .lv-rail-group-bottom{
gap:11px!important;
padding-bottom:4px!important;
}
.lv-side-rail .lv-rail-link,
.lv-side-rail .lv-rail-support{
position:relative!important;
width:56px!important;
min-height:56px!important;
height:56px!important;
padding:0!important;
display:grid!important;
place-items:center!important;
border-radius:16px!important;
background:transparent!important;
color:#20242b!important;
overflow:visible!important;
box-shadow:none!important;
}
.lv-side-rail .lv-rail-link:hover,
.lv-side-rail .lv-rail-link:focus-visible,
.lv-side-rail .lv-rail-support:hover,
.lv-side-rail .lv-rail-support:focus-visible{
background:#fff!important;
color:#111827!important;
box-shadow:0 12px 24px rgba(15,23,42,.07)!important;
}
.lv-side-rail .lv-rail-icon,
.lv-side-rail .lv-rail-support .lv-rail-icon{
width:42px!important;
height:42px!important;
display:grid!important;
place-items:center!important;
border-radius:999px!important;
background:transparent!important;
color:currentColor!important;
}
.lv-side-rail .lv-rail-support .lv-rail-icon{
background:#e8f5ff!important;
color:#4ab2ff!important;
}
.lv-side-rail .lv-rail-icon svg,
.lv-side-rail .lv-rail-icon svg *{
max-width:24px!important;
max-height:24px!important;
stroke-width:1.8;
}
.lv-side-rail .lv-rail-label,
.lv-side-rail .lv-rail-support .lv-rail-label{
position:absolute!important;
left:calc(100% + 12px)!important;
top:50%!important;
z-index:1600!important;
max-width:190px!important;
min-height:30px!important;
display:inline-flex!important;
align-items:center!important;
padding:0 10px!important;
border-radius:8px!important;
background:#1f2329!important;
color:#fff!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
white-space:nowrap!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translate(-4px,-50%)!important;
transition:opacity .16s ease, transform .16s ease, visibility .16s ease!important;
box-shadow:0 12px 28px rgba(15,23,42,.18)!important;
}
.lv-side-rail .lv-rail-label::before{
content:""!important;
position:absolute!important;
left:-5px!important;
top:50%!important;
width:10px!important;
height:10px!important;
background:#1f2329!important;
transform:translateY(-50%) rotate(45deg)!important;
}
.lv-side-rail .lv-rail-link:hover .lv-rail-label,
.lv-side-rail .lv-rail-link:focus-visible .lv-rail-label,
.lv-side-rail .lv-rail-support:hover .lv-rail-label,
.lv-side-rail .lv-rail-support:focus-visible .lv-rail-label{
opacity:1!important;
visibility:visible!important;
transform:translate(0,-50%)!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
left:var(--lv-rail-width)!important;
}
}
.top-navigation a,
.lv-promo-content,
.lv-promo-badge,
.lv-login-btn,
.lv-hero-kicker,
.lv-search-mode span,
.lv-search-mode a,
.lv-filter-chip,
.lv-term-strip a,
.lv-tool-item,
.lv-section-titlebar a,
.btn-collections,
.btn-featured,
.sidebar-toggle-btn,
.sort-select,
.lv-recent-title,
.lv-detail-suggested-card span{
font-weight:400!important;
}
.lv-search-mode .is-active,
.lv-hero-search > button[type="submit"],
.lv-filter-chip:hover,
.lv-term-strip a:hover,
.lv-section-titlebar h2,
.lv-account-profile strong,
.lv-plan-card strong{
font-weight:500!important;
}
@media (max-width:1280px) and (min-width:769px){
:root{
--lv-rail-width:78px!important;
}
.lv-side-rail .lv-rail-actions-editable{
padding-left:11px!important;
padding-right:11px!important;
}
.lv-side-rail .lv-rail-link,
.lv-side-rail .lv-rail-support{
width:52px!important;
min-height:52px!important;
height:52px!important;
}
}
@media (max-width:768px){
body.has-lv-rail .site-wrapper,
.site-wrapper{
padding-left:0!important;
}
.secondary-navigation.lv-side-rail,
.lv-side-rail .lv-rail-actions-editable{
display:none!important;
}
body.home .top-menu{
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{
background:var(--lv-hero-gradient)!important;
}
.lv-top-actions{
display:flex!important;
gap:10px!important;
}
.top-menu .container{
padding-left:14px!important;
padding-right:14px!important;
}
.lv-top-theme-toggle{
display:none!important;
}
}
html.lv-theme-dark .secondary-navigation.lv-side-rail{
background:linear-gradient(180deg,#111827 0%,#0f172a 100%)!important;
}
/* v36 - editable LarxVo shell: left rail + promo top bar */
:root{
--lv-rail-width:70px;
--lv-topbar-height:64px;
--lv-promo-height:40px;
}
.lv-promo-bar[hidden]{
display:none!important;
}
.lv-promo-bar{
position:fixed;
top:0;
left:0;
right:0;
height:var(--lv-promo-height);
z-index:1500;
display:flex;
align-items:center;
justify-content:center;
padding:0 52px;
background:linear-gradient(90deg,var(--promo-start,#ffc1d4),var(--promo-mid,#ff3f5f),var(--promo-end,#ffc7d6));
color:#fff;
box-shadow:none;
}
.admin-bar .lv-promo-bar{
top:32px;
}
.lv-promo-content{
min-width:0;
max-width:100%;
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;
color:#fff!important;
text-decoration:none!important;
font-size:14px;
line-height:1.2;
font-weight:800;
white-space:nowrap;
}
.lv-promo-medal{
width:24px;
height:24px;
display:grid;
place-items:center;
color:#ffe08a;
}
.lv-promo-medal svg{
width:22px;
height:22px;
fill:currentColor;
stroke:currentColor;
stroke-width:1.8;
}
.lv-promo-text{
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
}
.lv-promo-badge{
min-height:20px;
display:inline-flex;
align-items:center;
padding:0 9px;
border-radius:5px;
background:#fff46a;
color:#171717;
font-size:11px;
font-weight:900;
}
.lv-promo-close{
position:absolute;
right:17px;
top:50%;
width:28px;
height:28px;
border:0;
border-radius:999px;
display:grid;
place-items:center;
transform:translateY(-50%);
background:transparent;
color:#fff;
font-size:30px;
line-height:1;
cursor:pointer;
}
.lv-promo-close:hover{
background:rgba(255,255,255,.16);
}
@media (min-width:769px){
:root{
--lv-rail-width:70px!important;
--lv-topbar-height:64px!important;
--lv-promo-height:40px!important;
}
body.has-lv-rail .site-wrapper{
padding-left:var(--lv-rail-width)!important;
}
body.has-lv-rail .top-menu,
body.has-lv-rail .site-header{
left:var(--lv-rail-width)!important;
}
body.has-lv-rail .top-navigation{
display:none!important;
}
body.has-lv-rail .top-menu .container{
justify-content:flex-end!important;
padding-left:34px!important;
padding-right:42px!important;
}
body.has-lv-promo .top-menu{
top:var(--lv-promo-height)!important;
}
body.admin-bar.has-lv-promo .top-menu{
top:calc(32px + var(--lv-promo-height))!important;
}
body.has-lv-promo.lv-promo-dismissed .top-menu{
top:0!important;
}
body.admin-bar.has-lv-promo.lv-promo-dismissed .top-menu{
top:32px!important;
}
body.has-lv-promo .site-main{
padding-top:calc(var(--lv-topbar-height) + var(--lv-promo-height))!important;
}
body.admin-bar.has-lv-promo .site-main{
padding-top:calc(32px + var(--lv-topbar-height) + var(--lv-promo-height))!important;
}
body.home.has-lv-promo .site-main,
body.admin-bar.home.has-lv-promo .site-main{
padding-top:0!important;
}
body.home.has-lv-promo .lv-home-hero{
min-height:650px!important;
padding-top:142px!important;
}
body.home.has-lv-promo.lv-promo-dismissed .lv-home-hero{
padding-top:106px!important;
}
body.has-lv-rail .secondary-navigation.lv-side-rail{
display:flex!important;
position:fixed!important;
top:0!important;
left:0!important;
width:var(--lv-rail-width)!important;
height:100vh!important;
z-index:1400!important;
padding:16px 0 14px!important;
flex-direction:column!important;
align-items:center!important;
gap:0!important;
background:#f4f6fa!important;
border-right:1px solid #edf1f6!important;
box-shadow:none!important;
overflow:hidden!important;
}
body.admin-bar.has-lv-rail .secondary-navigation.lv-side-rail{
top:32px!important;
height:calc(100vh - 32px)!important;
}
body.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:var(--lv-promo-height)!important;
height:calc(100vh - var(--lv-promo-height))!important;
}
body.admin-bar.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:calc(32px + var(--lv-promo-height))!important;
height:calc(100vh - 32px - var(--lv-promo-height))!important;
}
body.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:0!important;
height:100vh!important;
}
body.admin-bar.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:32px!important;
height:calc(100vh - 32px)!important;
}
.lv-side-rail .mobile-menu-header,
.lv-side-rail > ul,
.lv-side-rail > .menu,
.lv-side-rail > .lv-rail-actions:not(.lv-rail-actions-editable){
display:none!important;
}
.lv-side-rail .lv-rail-actions-editable{
width:100%!important;
height:100%!important;
min-height:0!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:14px!important;
padding:0 8px!important;
}
.lv-rail-brand{
width:42px;
min-height:42px;
display:grid;
place-items:center;
border-radius:9px;
background:linear-gradient(135deg,#2f68ff,#5fb0ff);
color:#fff!important;
font-size:13px;
line-height:1;
font-weight:900;
text-align:center;
text-decoration:none!important;
box-shadow:0 12px 24px rgba(47,104,255,.22);
}
.lv-side-rail .lv-rail-group{
width:100%!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:8px!important;
}
.lv-side-rail .lv-rail-group-bottom{
margin-top:auto!important;
gap:8px!important;
}
.lv-side-rail .lv-rail-link{
width:100%!important;
min-height:58px!important;
height:auto!important;
padding:5px 0!important;
border-radius:12px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
background:transparent!important;
color:#343b48!important;
box-shadow:none!important;
text-align:center!important;
text-decoration:none!important;
}
.lv-side-rail .lv-rail-link:hover,
.lv-side-rail .lv-rail-link:focus-visible{
background:#fff!important;
color:#111827!important;
box-shadow:0 10px 22px rgba(15,23,42,.06)!important;
}
.lv-side-rail .lv-rail-icon{
width:28px!important;
height:28px!important;
display:grid!important;
place-items:center!important;
border-radius:999px!important;
color:currentColor!important;
}
.lv-side-rail .lv-rail-icon svg{
width:21px!important;
height:21px!important;
display:block!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.9!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-side-rail .lv-rail-label{
max-width:58px!important;
display:block!important;
color:inherit!important;
font-size:11px!important;
line-height:1.15!important;
font-weight:600!important;
overflow-wrap:anywhere!important;
}
.lv-side-rail .lv-rail-support .lv-rail-icon{
width:34px!important;
height:34px!important;
background:#e8f5ff!important;
color:#4ab2ff!important;
}
.lv-side-rail .lv-rail-support .lv-rail-label{
max-width:50px!important;
padding:1px 5px!important;
border-radius:4px!important;
background:#53b8ff!important;
color:#fff!important;
font-size:9px!important;
font-weight:800!important;
white-space:nowrap!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
left:var(--lv-rail-width)!important;
}
}
@media (max-width:768px){
.lv-promo-bar{
position:relative;
height:auto;
min-height:38px;
padding:8px 42px 8px 12px;
}
.lv-promo-content{
justify-content:flex-start;
font-size:12px;
white-space:normal;
}
.lv-promo-close{
right:8px;
}
.lv-rail-actions-editable{
display:none!important;
}
}
html.lv-theme-dark .secondary-navigation.lv-side-rail{
background:#0f172a!important;
border-color:rgba(148,163,184,.14)!important;
}
html.lv-theme-dark .lv-rail-brand{
box-shadow:none!important;
}
html.lv-theme-dark .lv-side-rail .lv-rail-link{
color:#cbd7ee!important;
}
html.lv-theme-dark .lv-side-rail .lv-rail-link:hover,
html.lv-theme-dark .lv-side-rail .lv-rail-link:focus-visible{
background:#172544!important;
color:#fff!important;
}
/* v35 - LarxVo-style top header */
@media (min-width:769px){
:root{--lv-topbar-height:64px}
.secondary-navigation{
display:none!important;
}
.site-wrapper{
padding-left:0!important;
}
.top-menu{
position:fixed!important;
top:0!important;
left:0!important;
right:0!important;
min-height:var(--lv-topbar-height)!important;
z-index:1300!important;
border:0!important;
background:linear-gradient(180deg,rgba(247,252,255,.94),rgba(247,252,255,.72))!important;
box-shadow:none!important;
backdrop-filter:blur(18px) saturate(145%)!important;
-webkit-backdrop-filter:blur(18px) saturate(145%)!important;
}
.admin-bar .top-menu{
top:32px!important;
}
.top-menu .container{
max-width:100%!important;
min-height:var(--lv-topbar-height)!important;
padding:0 48px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:24px!important;
}
.top-navigation{
min-width:0;
}
.top-navigation ul{
min-height:var(--lv-topbar-height)!important;
padding:0!important;
display:flex!important;
align-items:center!important;
gap:30px!important;
flex-wrap:nowrap!important;
overflow:visible!important;
}
.top-navigation a{
min-height:var(--lv-topbar-height)!important;
display:inline-flex!important;
align-items:center!important;
gap:6px!important;
padding:0!important;
color:#555f6d!important;
font-size:14px!important;
font-weight:500!important;
text-decoration:none!important;
}
.top-navigation a:hover{
color:#111827!important;
opacity:1!important;
}
.site-header{
display:none!important;
}
.site-main{
padding-top:var(--lv-topbar-height)!important;
}
body.home .site-main{
padding-top:0!important;
}
.admin-bar .site-main{
padding-top:calc(var(--lv-topbar-height) + 32px)!important;
}
.admin-bar.home .site-main{
padding-top:0!important;
}
.lv-home-hero{
padding-top:96px!important;
min-height:570px!important;
}
.lv-hero-copy h1{
margin-top:18px!important;
margin-bottom:48px!important;
}
.lv-top-actions{
display:flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:14px!important;
flex:0 0 auto!important;
margin-left:auto!important;
}
.lv-top-icon,
.lv-account-trigger{
width:34px!important;
height:34px!important;
min-width:34px!important;
border:0!important;
padding:0!important;
display:inline-grid!important;
place-items:center!important;
border-radius:999px!important;
background:transparent!important;
color:#111827!important;
box-shadow:none!important;
text-decoration:none!important;
position:relative!important;
}
.lv-top-icon svg{
width:18px!important;
height:18px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:2!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-vip-link{
color:#f59e0b!important;
}
.lv-vip-link svg{
fill:#f59e0b!important;
stroke:#f59e0b!important;
}
.lv-vip-link span{
position:absolute!important;
width:1px!important;
height:1px!important;
overflow:hidden!important;
clip:rect(0,0,0,0)!important;
white-space:nowrap!important;
}
.lv-notification-link span{
position:absolute!important;
top:6px!important;
right:7px!important;
width:7px!important;
height:7px!important;
border-radius:999px!important;
background:#ff4d3d!important;
border:1px solid #fff!important;
}
.lv-login-btn{
min-height:32px!important;
padding:0 18px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
border-radius:8px!important;
background:#1f2329!important;
color:#fff!important;
font-size:14px!important;
font-weight:700!important;
text-decoration:none!important;
box-shadow:none!important;
}
.lv-login-btn:hover{
background:#111827!important;
color:#fff!important;
}
.lv-top-theme-toggle.lv-theme-toggle{
width:34px!important;
height:34px!important;
min-width:34px!important;
border-radius:999px!important;
background:rgba(255,255,255,.64)!important;
border:1px solid rgba(148,163,184,.18)!important;
color:#316cff!important;
box-shadow:none!important;
}
.lv-account-dropdown{
position:relative!important;
}
.lv-account-trigger .avatar,
.lv-account-trigger img{
width:34px!important;
height:34px!important;
border-radius:999px!important;
display:block!important;
border:2px solid rgba(255,255,255,.78)!important;
box-shadow:0 8px 20px rgba(15,23,42,.14)!important;
}
.lv-account-menu{
top:calc(100% + 12px)!important;
right:0!important;
width:380px!important;
min-width:380px!important;
padding:18px 16px 14px!important;
border:1px solid rgba(148,163,184,.16)!important;
border-radius:20px!important;
background:#fff!important;
box-shadow:0 24px 70px rgba(15,23,42,.14)!important;
overflow:visible!important;
}
.lv-account-menu::before{
content:""!important;
position:absolute!important;
top:-8px!important;
right:18px!important;
width:16px!important;
height:16px!important;
border-radius:4px 0 0 0!important;
background:#fff!important;
transform:rotate(45deg)!important;
border-left:1px solid rgba(148,163,184,.16)!important;
border-top:1px solid rgba(148,163,184,.16)!important;
}
.lv-account-dropdown:hover .account-dropdown-menu,
.lv-account-dropdown:focus-within .account-dropdown-menu{
opacity:1!important;
visibility:visible!important;
transform:translateY(0)!important;
pointer-events:auto!important;
}
.lv-account-profile{
display:flex!important;
align-items:center!important;
gap:12px!important;
min-width:0!important;
margin-bottom:16px!important;
}
.lv-account-avatar{
width:48px!important;
height:48px!important;
border-radius:999px!important;
flex:0 0 48px!important;
}
.lv-account-profile strong{
display:block!important;
color:#2c3442!important;
font-size:16px!important;
line-height:1.2!important;
font-weight:800!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-profile span{
display:block!important;
margin-top:5px!important;
color:#7c8798!important;
font-size:12px!important;
font-weight:600!important;
}
.lv-account-stats{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:8px!important;
margin-bottom:14px!important;
text-align:center!important;
}
.lv-account-stats div{
min-width:0!important;
}
.lv-account-stats strong{
display:block!important;
color:#2c3442!important;
font-size:15px!important;
font-weight:900!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-stats span{
display:block!important;
margin-top:4px!important;
color:#7c8798!important;
font-size:12px!important;
}
.lv-account-plan{
margin:0 0 14px!important;
padding:12px!important;
border-radius:16px!important;
background:#e8eefc!important;
}
.lv-plan-title{
display:flex!important;
align-items:center!important;
gap:8px!important;
margin-bottom:10px!important;
color:#364052!important;
}
.lv-plan-title svg{
width:20px!important;
height:20px!important;
fill:#9bb2dc!important;
stroke:#9bb2dc!important;
}
.lv-plan-title strong{
min-width:0!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
color:#364052!important;
font-size:15px!important;
font-weight:900!important;
}
.lv-plan-card{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
padding:14px 12px!important;
border-radius:12px!important;
background:#fff!important;
}
.lv-plan-card strong{
display:block!important;
margin:0 0 6px!important;
color:#1f2937!important;
font-size:14px!important;
line-height:1.2!important;
}
.lv-plan-card p{
margin:0!important;
color:#7c8798!important;
font-size:12px!important;
line-height:1.35!important;
}
.lv-plan-card a{
flex:0 0 auto!important;
min-height:32px!important;
padding:0 13px!important;
border-radius:999px!important;
background:#f8d99b!important;
color:#8a5b14!important;
font-size:13px!important;
font-weight:800!important;
text-decoration:none!important;
}
.lv-account-menu .dropdown-item{
min-height:40px!important;
padding:8px 4px!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
border-radius:10px!important;
color:#4b5563!important;
font-size:14px!important;
font-weight:600!important;
background:transparent!important;
}
.lv-account-menu .dropdown-item:hover{
background:#f5f7fb!important;
color:#111827!important;
}
.lv-account-menu .dropdown-item svg{
width:18px!important;
height:18px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.8!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-account-menu .dropdown-divider{
height:1px!important;
margin:10px 0!important;
background:#eef1f6!important;
}
}
@media (max-width:768px){
.lv-top-actions{
display:none!important;
}
}
html.lv-theme-dark .top-menu{
background:rgba(9,14,27,.76)!important;
border-color:rgba(148,163,184,.14)!important;
}
html.lv-theme-dark .top-navigation a,
html.lv-theme-dark .lv-top-icon,
html.lv-theme-dark .lv-account-trigger{
color:#dce7ff!important;
}
html.lv-theme-dark .lv-login-btn{
background:#f8fafc!important;
color:#111827!important;
}
html.lv-theme-dark .lv-account-menu,
html.lv-theme-dark .lv-account-menu::before{
background:#101827!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-account-profile strong,
html.lv-theme-dark .lv-account-stats strong,
html.lv-theme-dark .lv-plan-title strong,
html.lv-theme-dark .lv-plan-card strong{
color:#edf3ff!important;
}
html.lv-theme-dark .lv-account-profile span,
html.lv-theme-dark .lv-account-stats span,
html.lv-theme-dark .lv-plan-card p{
color:#a9b8d4!important;
}
html.lv-theme-dark .lv-account-plan{
background:#1a2740!important;
}
html.lv-theme-dark .lv-plan-card{
background:#0f172a!important;
}
/* v32 - LarxVo-inspired marketplace UI refresh */
:root{
--lv-rail-width:72px;
--lv-blue:#ffa727;
--lv-blue-2:#ffc176;
--lv-ink:#1f222d;
--lv-muted:#6b7280;
--lv-line:#e8edf5;
--lv-soft:#f5f7fb;
--lv-panel:#ffffff;
}
.lv-home-hero,
.lv-recent-section,
.lv-discover-section{
background:#fff;
}
@media (min-width:769px){
body{
background:#fff;
}
.site-wrapper{
padding-left:var(--lv-rail-width);
}
.secondary-navigation{
display:flex!important;
position:fixed;
inset:0 auto 0 0;
width:var(--lv-rail-width);
height:100vh;
z-index:1200;
flex-direction:column;
align-items:center;
gap:16px;
padding:16px 0;
background:#f4f6fa;
border-right:1px solid #edf1f6;
box-shadow:none;
}
.secondary-navigation .mobile-menu-header{
display:flex;
width:100%;
padding:0;
border:0;
background:transparent;
justify-content:center;
}
.secondary-navigation .mobile-menu-close{
display:none;
}
.secondary-navigation .site-logo{
width:42px;
min-height:42px;
border-radius:8px;
display:grid;
place-items:center;
overflow:hidden;
background:linear-gradient(135deg,var(--lv-blue),var(--lv-blue-2));
box-shadow:0 10px 22px rgba(47,104,255,.22);
color:#fff;
font-size:.74rem;
line-height:1.1;
text-align:center;
}
.secondary-navigation .site-logo a{
color:#fff!important;
display:grid;
place-items:center;
width:100%;
height:100%;
padding:4px;
}
.secondary-navigation .site-logo img{
max-width:34px!important;
max-height:34px!important;
object-fit:contain;
}
.secondary-navigation ul,
.secondary-navigation .menu{
width:100%;
display:flex;
flex-direction:column;
align-items:center;
gap:8px;
padding:4px 8px 0;
margin:0;
}
.secondary-navigation li{
width:100%;
}
.secondary-navigation a{
width:100%;
min-height:52px;
border-radius:8px;
display:flex;
align-items:center;
justify-content:center;
padding:7px 5px;
color:#4b5563;
font-size:10px;
font-weight:600;
line-height:1.2;
text-align:center;
word-break:break-word;
}
.secondary-navigation a:hover,
.secondary-navigation .current-menu-item > a{
background:#fff;
color:var(--lv-ink)!important;
box-shadow:0 8px 18px rgba(15,23,42,.06);
}
.top-menu,
.site-header{
left:var(--lv-rail-width);
}
.top-menu{
min-height:40px;
background:rgba(255,255,255,.9);
border-bottom:0;
box-shadow:none;
backdrop-filter:blur(16px);
}
.top-menu .container,
.site-header .container{
padding-left:40px;
padding-right:40px;
}
.top-navigation ul{
min-height:40px;
padding:0;
gap:28px;
flex-wrap:nowrap;
overflow:hidden;
}
.top-navigation a{
color:#5b6472;
font-weight:500;
padding:0;
}
.site-header{
top:40px;
background:rgba(255,255,255,.92);
border-bottom:1px solid rgba(232,237,245,.84);
box-shadow:none!important;
backdrop-filter:blur(18px);
}
.header-top{
min-height:68px;
padding:10px 0;
gap:18px;
}
.site-header .site-logo{
max-width:190px;
}
.main-navigation ul{
gap:18px;
}
.main-navigation a{
color:#4b5563;
font-weight:600;
}
.header-search{
flex:1 1 520px;
max-width:760px;
}
.search-toggle-btn{
display:none!important;
}
.search-form{
min-height:48px;
border:1px solid #edf1f6;
border-radius:16px;
background:#f6f8fb;
box-shadow:none;
overflow:visible;
}
.search-input-wrapper,
.search-form label{
min-width:0;
}
.search-field{
height:46px;
color:var(--lv-ink);
}
.search-field::placeholder{
color:#9aa4b2;
}
.search-submit{
min-width:48px;
border-radius:12px;
color:var(--lv-blue)!important;
}
.header-actions{
gap:10px;
}
.header-actions .btn,
.lv-theme-toggle,
.user-account-btn{
border-radius:12px!important;
box-shadow:none!important;
}
.site-main{
padding-top:108px;
}
body.home .site-main{
padding-top:0!important;
}
.site-main.single-design-file{
padding-top:24px!important;
}
}
.lv-home-hero{
min-height:650px;
display:flex;
align-items:flex-start;
justify-content:center;
padding:150px 24px 72px;
background:linear-gradient(180deg,#eefaff 0%,#f7fbff 36%,#fff 82%);
text-align:center;
overflow:hidden;
}
.lv-hero-inner{
width:min(980px,100%);
margin:0 auto;
}
.lv-hero-kicker{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:28px;
padding:0 12px;
border-radius:999px;
background:rgba(47,104,255,.08);
color:var(--lv-blue);
font-weight:700;
font-size:.84rem;
}
.lv-hero-copy h1{
margin:24px 0 56px;
color:var(--lv-ink);
font-size:clamp(2rem,4vw,3.05rem);
line-height:1.1;
font-weight:800;
letter-spacing:0;
}
.lv-hero-copy h1 span{
color:var(--lv-blue);
}
.lv-search-mode{
width:max-content;
max-width:100%;
margin:0 auto 18px;
display:flex;
align-items:center;
gap:4px;
padding:4px;
border-radius:999px;
background:#edf2f7;
}
.lv-search-mode span,
.lv-search-mode a{
min-width:118px;
height:34px;
padding:0 22px;
border-radius:999px;
display:inline-flex;
align-items:center;
justify-content:center;
color:#4b5563;
font-weight:700;
font-size:.94rem;
}
.lv-search-mode .is-active{
background:#fff;
color:#111827;
box-shadow:0 3px 12px rgba(15,23,42,.08);
}
.lv-hero-search{
width:min(760px,100%);
min-height:58px;
margin:0 auto;
display:flex;
align-items:center;
gap:10px;
padding:6px;
border-radius:16px;
background:#fff;
border:1px solid #edf1f6;
box-shadow:0 20px 45px rgba(15,23,42,.08);
position:relative;
z-index:30;
}
.lv-hero-search label{
flex:1;
min-width:0;
display:flex;
align-items:center;
gap:12px;
padding:0 12px;
color:#9aa4b2;
}
.lv-hero-search label > svg{
width:22px;
height:22px;
flex:0 0 auto;
}
.lv-hero-search input{
width:100%;
height:44px;
border:0;
outline:0;
color:var(--lv-ink);
background:transparent;
font-size:1rem;
}
.lv-hero-search > button[type="submit"]{
width:128px;
height:46px;
border-radius:10px;
background:var(--lv-blue);
color:#fff;
font-size:1.04rem;
font-weight:800;
box-shadow:0 10px 22px rgba(47,104,255,.26);
}
.lv-home-hero{
overflow:visible;
}
.lv-hero-search .search-autocomplete-dropdown{
top:calc(100% + 10px);
left:0;
right:0;
width:100%;
text-align:left;
border-radius:16px;
border:1px solid rgba(148,163,184,.18);
box-shadow:0 24px 60px rgba(15,23,42,.14);
max-height:min(460px, calc(100vh - 220px));
overflow-y:auto;
z-index:60;
}
.search-autocomplete-dropdown{
padding:8px 0;
border:1px solid rgba(148,163,184,.16);
}
.autocomplete-section + .autocomplete-section{
border-top:1px solid rgba(148,163,184,.14);
margin-top:6px;
padding-top:6px;
}
.autocomplete-header{
margin-bottom:0;
padding:.55rem 1rem .4rem;
}
.autocomplete-item{
width:100%;
border:0;
background:transparent;
text-align:left;
font-family:inherit;
}
.search-autocomplete-dropdown button{
position:static;
inset:auto;
transform:none;
width:auto;
height:auto;
min-width:0;
box-shadow:none;
}
.search-autocomplete-dropdown .autocomplete-item{
padding:.75rem 1rem;
color:var(--color-text);
}
.search-autocomplete-dropdown .clear-history{
padding:.25rem .5rem;
color:var(--color-danger);
}
.post-item{
min-height:76px;
}
.post-format-icons{
display:inline-flex;
align-items:center;
gap:5px;
min-width:0;
}
.post-format-icon{
width:18px;
height:18px;
flex:0 0 18px;
object-fit:contain;
display:block;
}
.post-format-icon-fallback{
min-width:28px;
height:18px;
padding:0 5px;
border-radius:5px;
display:inline-flex;
align-items:center;
justify-content:center;
background:#eef4ff;
color:var(--lv-blue);
font-size:.66rem;
line-height:1;
font-weight:800;
}
.autocomplete-view-all{
padding:.85rem 1rem;
}
.autocomplete-empty-state{
padding:14px 16px 16px;
}
.autocomplete-panel-section + .autocomplete-panel-section{
margin-top:18px;
}
.autocomplete-panel-header{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
margin-bottom:10px;
color:#111827;
font-size:.84rem;
font-weight:800;
}
.autocomplete-panel-header b{
font-size:1rem;
line-height:1;
}
.autocomplete-chip-row{
display:flex;
flex-wrap:wrap;
gap:8px;
}
.autocomplete-chip,
.autocomplete-keyword-button{
min-height:34px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:6px;
border:0;
border-radius:10px;
background:#f4f6f9;
color:#1f2937;
font-size:.9rem;
font-weight:600;
line-height:1;
cursor:pointer;
}
.autocomplete-keyword-button{
padding:0 12px;
}
.autocomplete-hot-keyword{
background:#fff7ed;
color:#9a3412;
}
.autocomplete-recent-chip{
padding:0 4px 0 0;
overflow:hidden;
}
.autocomplete-recent-chip .autocomplete-keyword-button{
min-height:34px;
padding:0 8px 0 12px;
background:transparent;
color:inherit;
}
.autocomplete-history-remove{
width:22px!important;
min-width:22px!important;
height:22px!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
background:transparent!important;
color:#8b95a1!important;
font-size:1.1rem!important;
line-height:1!important;
}
.autocomplete-history-remove:hover{
background:#e9edf3!important;
color:#111827!important;
}
.autocomplete-hot-files{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px 18px;
}
.autocomplete-hot-file{
min-width:0;
display:grid;
grid-template-columns:58px minmax(0,1fr);
align-items:center;
gap:12px;
padding:4px;
border-radius:12px;
color:#111827;
text-decoration:none;
transition:background .18s ease, transform .18s ease;
}
.autocomplete-hot-file:hover{
background:linear-gradient(90deg,#fff1f2 0%,#fff 72%);
transform:translateX(2px);
}
.autocomplete-hot-thumb{
width:58px;
height:58px;
border-radius:10px;
overflow:hidden;
background:#f1f5f9;
display:grid;
place-items:center;
color:#9aa4b2;
}
.autocomplete-hot-thumb img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
.autocomplete-hot-info{
min-width:0;
display:grid;
gap:5px;
}
.autocomplete-hot-title{
min-width:0;
color:#111827;
font-size:.9rem;
font-weight:700;
line-height:1.35;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.autocomplete-hot-title em{
display:inline-flex;
align-items:center;
height:15px;
margin-left:4px;
padding:0 4px;
border-radius:4px;
background:#ff3b30;
color:#fff;
font-size:.55rem;
font-style:normal;
font-weight:900;
vertical-align:middle;
}
.autocomplete-hot-meta{
min-height:19px;
display:flex;
align-items:center;
gap:6px;
flex-wrap:wrap;
color:#8b95a1;
font-size:.73rem;
font-weight:600;
}
.autocomplete-hot-stats{
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
@media(max-width:640px){
.autocomplete-hot-files{
grid-template-columns:1fr;
}
.autocomplete-empty-state{
padding:12px;
}
}
.lv-hero-chips,
.lv-term-strip{
display:flex;
align-items:center;
gap:10px;
overflow-x:auto;
overflow-y:hidden;
scrollbar-width:none;
}
.lv-hero-chips::-webkit-scrollbar,
.lv-term-strip::-webkit-scrollbar,
.lv-tool-dock::-webkit-scrollbar,
.lv-recent-row::-webkit-scrollbar{
display:none;
}
.lv-hero-chips{
justify-content:center;
margin:18px auto 52px;
}
.lv-filter-chip,
.lv-term-strip a{
min-height:34px;
display:inline-flex!important;
align-items:center;
gap:7px;
flex:0 0 auto;
padding:0 13px;
border:1px solid var(--lv-line);
border-radius:8px;
background:#fff;
color:#1f2937;
font-size:.88rem;
font-weight:700;
box-shadow:none;
}
.lv-filter-chip svg{
width:16px;
height:16px;
}
.lv-filter-chip:hover,
.lv-term-strip a:hover{
color:var(--lv-blue)!important;
border-color:rgba(47,104,255,.28);
background:#f8fbff;
}
.lv-tool-dock{
display:grid;
grid-template-columns:repeat(8,minmax(82px,1fr));
gap:18px;
align-items:start;
margin:0 auto;
}
.lv-tool-item{
min-width:0;
display:grid;
justify-items:center;
gap:10px;
color:#202938;
font-size:.9rem;
font-weight:500;
line-height:1.25;
}
.lv-tool-item:hover{
color:var(--lv-blue)!important;
}
.lv-tool-icon{
width:52px;
height:52px;
display:grid;
place-items:center;
border-radius:14px;
background:#fff;
border:1px solid #edf1f6;
color:#202938;
box-shadow:0 10px 22px rgba(15,23,42,.04);
}
.lv-tool-icon svg{
width:24px;
height:24px;
stroke:currentColor;
fill:none;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.lv-tool-icon-star{
color:#f59e0b;
}
.lv-tool-icon-download{
color:var(--lv-blue);
}
.lv-recent-section,
.lv-discover-section{
padding:0 0 42px;
}
.lv-recent-section .container,
.lv-discover-section .container{
max-width:100%;
padding-left:40px;
padding-right:40px;
}
.lv-section-titlebar{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin:0 0 16px;
}
.lv-section-titlebar h2{
margin:0;
color:var(--lv-ink);
font-size:1.35rem;
line-height:1.25;
font-weight:800;
letter-spacing:0;
}
.lv-section-titlebar a{
color:#7a8494;
font-size:.92rem;
font-weight:600;
}
.lv-recent-row{
display:grid;
grid-template-columns:repeat(7,minmax(170px,1fr));
gap:18px;
overflow-x:auto;
padding-bottom:6px;
}
.lv-recent-card{
min-width:170px;
color:#111827;
}
.lv-recent-thumb{
height:176px;
border-radius:8px;
background:#f4f6f9;
display:grid;
place-items:center;
overflow:hidden;
border:1px solid #f0f2f6;
}
.lv-recent-thumb img{
max-width:78%;
max-height:88%;
width:auto;
height:auto;
object-fit:contain;
border-radius:4px;
box-shadow:0 10px 22px rgba(15,23,42,.08);
}
.lv-recent-title{
display:block;
margin-top:9px;
color:#202938;
font-size:.86rem;
line-height:1.35;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.lv-empty-thumb{
width:70px;
height:70px;
display:grid;
place-items:center;
color:#7da0ff;
}
.lv-empty-thumb svg{
width:100%;
height:100%;
}
.lv-discover-titlebar{
margin-top:10px;
}
.lv-term-strip{
margin-bottom:20px;
padding-bottom:2px;
}
.lv-discover-section .content-layout,
.lv-design-archive-page .lv-design-archive-layout{
display:block!important;
max-width:100%;
padding:0!important;
}
.lv-discover-section .main-content,
.lv-design-archive-page .main-content{
width:100%;
min-width:0;
}
.sort-filter-wrapper{
align-items:center!important;
margin:0 0 18px!important;
padding:0!important;
}
.filter-left-actions{
min-width:0;
overflow-x:auto;
scrollbar-width:none;
}
.filter-left-actions::-webkit-scrollbar{
display:none;
}
.sidebar-toggle-btn,
.btn-collections,
.btn-featured,
.sort-select{
min-height:36px!important;
border-radius:8px!important;
background:#fff!important;
border:1px solid var(--lv-line)!important;
color:#202938!important;
box-shadow:none!important;
font-weight:700!important;
}
.sidebar-toggle-btn{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
min-width:38px!important;
padding:0 12px!important;
}
.btn-collections,
.btn-featured{
padding:0 13px!important;
}
.btn-collections:hover,
.btn-featured:hover,
.sidebar-toggle-btn:hover{
color:var(--lv-blue)!important;
border-color:rgba(47,104,255,.28)!important;
transform:none!important;
background:#f8fbff!important;
}
.sort-select{
padding-top:0!important;
padding-bottom:0!important;
}
@media (min-width:769px){
.lv-discover-section .sidebar,
.lv-design-archive-page .sidebar{
position:fixed!important;
top:0!important;
left:calc((340px + var(--lv-rail-width)) * -1)!important;
width:340px!important;
height:100vh!important;
z-index:1250!important;
overflow-y:auto!important;
padding:0 0 96px!important;
background:#fff!important;
border-right:1px solid var(--lv-line)!important;
box-shadow:20px 0 60px rgba(15,23,42,.12)!important;
transition:left .28s ease!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
left:var(--lv-rail-width)!important;
}
.lv-discover-section .sidebar-mobile-header,
.lv-design-archive-page .sidebar-mobile-header{
display:flex!important;
position:sticky;
top:0;
z-index:2;
align-items:center;
justify-content:space-between;
min-height:64px;
padding:0 18px;
background:#fff;
border-bottom:1px solid var(--lv-line);
}
.lv-discover-section .sidebar-mobile-header h3,
.lv-design-archive-page .sidebar-mobile-header h3{
color:var(--lv-ink);
font-size:1.04rem;
font-weight:800;
}
.lv-discover-section .sidebar .filter-section,
.lv-design-archive-page .sidebar .filter-section{
margin:14px 16px!important;
padding:14px!important;
border:1px solid #edf1f6!important;
border-radius:8px!important;
background:#fff!important;
}
.lv-discover-section .sidebar-overlay,
.lv-design-archive-page .sidebar-overlay{
display:none;
position:fixed;
inset:0;
z-index:1240;
background:rgba(17,24,39,.28)!important;
backdrop-filter:blur(4px);
}
.lv-discover-section .sidebar-overlay.active,
.lv-design-archive-page .sidebar-overlay.active{
display:block!important;
}
}
.posts-grid,
.lv-design-archive-page .posts-grid{
columns:178px auto!important;
column-width:178px!important;
column-count:auto!important;
column-gap:16px!important;
}
.posts-grid .post-card,
.posts-grid .design-file-card,
.posts-grid article.post-card,
.post-card.pinterest-style,
.related-posts-grid .post-card,
.recently-viewed-grid .post-card{
width:100%!important;
break-inside:avoid!important;
margin:0 0 16px!important;
border-radius:8px!important;
background:transparent!important;
box-shadow:none!important;
overflow:visible!important;
}
.post-card.pinterest-style .post-thumbnail-wrapper,
.posts-grid .post-thumbnail-wrapper,
.related-posts-grid .post-thumbnail-wrapper,
.recently-viewed-grid .post-thumbnail-wrapper{
border-radius:8px!important;
overflow:hidden!important;
background:#f4f6f9!important;
border:1px solid #f0f2f6!important;
box-shadow:none!important;
}
.post-card.pinterest-style img,
.posts-grid .post-thumbnail-wrapper img{
border-radius:8px!important;
}
.hover-overlay{
background:linear-gradient(180deg,rgba(15,23,42,0),rgba(15,23,42,.56))!important;
}
.file-badge,
.vip-badge-overlay,
.card-download-btn,
.post-favorite,
.sticky-badge-icon{
border-radius:8px!important;
}
.lv-design-archive-page{
background:#fff!important;
}
.lv-design-archive-page .container{
max-width:100%!important;
padding-left:40px!important;
padding-right:40px!important;
}
.lv-design-archive-head{
margin-bottom:20px!important;
}
.lv-design-archive-title-card{
max-width:100%!important;
padding:22px 24px!important;
border-radius:8px!important;
background:linear-gradient(180deg,#f5fbff,#fff)!important;
box-shadow:none!important;
}
.lv-design-archive-title-card h1{
letter-spacing:0!important;
}
.site-main.single-design-file{
background:#fff!important;
}
.single-design-file .container{
max-width:1760px!important;
padding-left:40px!important;
padding-right:40px!important;
}
.single-design-file .breadcrumb{
margin:0 0 22px!important;
}
.single-design-file .breadcrumb a{
color:#111827!important;
font-weight:700;
}
.single-design-layout{
gap:28px!important;
}
.post-thumbnail-area > .post-thumbnail-wrapper{
min-height:720px;
display:flex;
align-items:flex-start;
justify-content:center;
background:#fff!important;
border:0!important;
border-radius:8px!important;
box-shadow:none!important;
}
.post-thumbnail-area > .post-thumbnail-wrapper img{
width:100%!important;
height:auto!important;
max-height:none!important;
object-fit:contain!important;
border-radius:8px!important;
filter:none!important;
}
.single-design-sidebar{
position:sticky;
top:128px;
}
.single-design-file .sidebar-card,
.single-design-file .entry-content,
.single-design-file .taxonomy-card{
border:0!important;
border-radius:8px!important;
box-shadow:none!important;
background:#fff!important;
}
.single-design-file .sidebar-card{
padding:0 0 22px!important;
border-bottom:1px solid var(--lv-line)!important;
}
.single-design-file .sidebar-card h1{
font-size:1.28rem!important;
line-height:1.35!important;
letter-spacing:0!important;
}
.single-design-file .download-card{
padding:22px 0!important;
}
.larxvo-download-btn-main,
.larxvo-download-btn-floating{
min-height:48px!important;
border-radius:10px!important;
background:#20242b!important;
box-shadow:none!important;
}
.action-buttons .action-btn{
min-height:44px;
border-radius:10px!important;
background:#f1f3f6!important;
border:0!important;
}
.single-design-suggested-rail{
min-width:0;
}
.lv-detail-suggested-head{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin:0 0 16px;
}
.lv-detail-suggested-head h2{
margin:0;
color:var(--lv-ink);
font-size:1.04rem;
font-weight:800;
letter-spacing:0;
}
.lv-detail-suggested-head a{
color:#7a8494;
font-size:.86rem;
font-weight:700;
}
.lv-detail-suggested-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
}
.lv-detail-suggested-card{
min-width:0;
display:block;
color:#202938;
}
.lv-detail-suggested-card img{
width:100%;
height:auto;
border-radius:8px;
background:#f4f6f9;
border:1px solid #f0f2f6;
}
.lv-detail-suggested-card span{
display:block;
margin-top:8px;
color:#4b5563;
font-size:.82rem;
line-height:1.35;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.related-posts-section,
.recently-viewed-section{
background:#fff!important;
border-top:0!important;
}
.related-posts-section h3{
letter-spacing:0!important;
}
.site-footer{
background:#fff!important;
border-top:1px solid var(--lv-line)!important;
}
.footer-content{
max-width:1320px;
margin:0 auto;
gap:42px!important;
}
@media (max-width:1280px){
.lv-tool-dock{
grid-template-columns:repeat(4,minmax(90px,1fr));
}
.lv-detail-suggested-grid{
grid-template-columns:repeat(4,minmax(140px,1fr));
}
.single-design-sidebar{
position:static;
}
}
@media (max-width:768px){
.lv-home-hero{
min-height:auto;
padding:116px 14px 42px;
}
.lv-hero-copy h1{
margin:18px 0 30px;
font-size:2rem;
}
.lv-search-mode span,
.lv-search-mode a{
min-width:96px;
}
.lv-hero-search{
min-height:52px;
border-radius:14px;
}
.lv-hero-search > button[type="submit"]{
width:94px;
height:42px;
font-size:.94rem;
}
.lv-hero-chips{
justify-content:flex-start;
margin-bottom:30px;
}
.lv-filter-chip.sidebar-toggle-btn{
width:auto!important;
min-width:max-content!important;
height:36px!important;
padding:0 13px!important;
white-space:nowrap!important;
}
.lv-filter-chip span{
white-space:nowrap!important;
}
.lv-tool-dock{
display:flex;
overflow-x:auto;
gap:14px;
padding-bottom:4px;
}
.lv-tool-item{
width:76px;
flex:0 0 76px;
font-size:.78rem;
}
.lv-tool-icon{
width:48px;
height:48px;
}
.lv-recent-section .container,
.lv-discover-section .container,
.single-design-file .container,
.lv-design-archive-page .container{
padding-left:14px!important;
padding-right:14px!important;
}
.lv-recent-row{
display:flex;
gap:12px;
}
.lv-recent-card{
flex:0 0 148px;
min-width:148px;
}
.lv-recent-thumb{
height:142px;
}
.sort-filter-wrapper{
align-items:flex-start!important;
flex-direction:column;
}
.sort-filter{
width:100%;
}
.sort-select{
width:100%!important;
}
.posts-grid,
.lv-design-archive-page .posts-grid{
columns:2!important;
column-gap:12px!important;
}
.posts-grid .post-card,
.posts-grid article.post-card,
.post-card.pinterest-style{
margin-bottom:12px!important;
}
.post-thumbnail-area > .post-thumbnail-wrapper{
min-height:auto;
}
.single-design-layout{
gap:18px!important;
}
.lv-detail-suggested-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
}
.footer-content{
gap:24px!important;
}
}
/* v34 - final left rail override after LarxVo shell */
@media (min-width:769px){
:root{--lv-rail-width:64px!important}
.site-wrapper{padding-left:0!important}
.top-menu,.site-header{left:0!important}
.top-menu{
top:0!important;
right:0!important;
min-height:var(--lv-topbar-height,64px)!important;
background:linear-gradient(180deg,rgba(247,252,255,.94),rgba(247,252,255,.72))!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:blur(18px) saturate(145%)!important;
-webkit-backdrop-filter:blur(18px) saturate(145%)!important;
}
.admin-bar .top-menu{top:32px!important}
.top-menu .container{
max-width:100%!important;
min-height:var(--lv-topbar-height,64px)!important;
padding:0 48px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:24px!important;
}
.top-navigation ul{
min-height:var(--lv-topbar-height,64px)!important;
padding:0!important;
gap:30px!important;
flex-wrap:nowrap!important;
overflow:visible!important;
}
.top-navigation a{
min-height:var(--lv-topbar-height,64px)!important;
display:inline-flex!important;
align-items:center!important;
color:#555f6d!important;
font-size:14px!important;
font-weight:500!important;
}
.site-header{display:none!important}
.site-main{padding-top:var(--lv-topbar-height,64px)!important}
body.home .site-main{padding-top:0!important}
.admin-bar .site-main{padding-top:calc(var(--lv-topbar-height,64px) + 32px)!important}
.admin-bar.home .site-main{padding-top:0!important}
.lv-home-hero{
padding-top:96px!important;
min-height:570px!important;
}
.secondary-navigation{
display:none!important;
width:64px!important;
background:#fff!important;
border-right:1px solid #f0f2f6!important;
box-shadow:none!important;
padding:18px 0 14px!important;
gap:12px!important;
}
.secondary-navigation .mobile-menu-header{
position:relative!important;
min-height:40px!important;
justify-content:center!important;
margin-bottom:8px!important;
}
.secondary-navigation .mobile-menu-header::after{
content:""!important;
position:absolute!important;
right:8px!important;
top:16px!important;
width:0!important;
height:0!important;
border-left:4px solid transparent!important;
border-right:4px solid transparent!important;
border-top:5px solid #9aa4b2!important;
}
.secondary-navigation .site-logo,
.secondary-navigation .site-logo a{
width:34px!important;
height:34px!important;
min-height:34px!important;
border-radius:11px!important;
background:transparent!important;
box-shadow:none!important;
color:transparent!important;
font-size:0!important;
padding:0!important;
}
.secondary-navigation .site-logo a::before{
content:""!important;
width:28px!important;
height:28px!important;
border-radius:11px!important;
display:block!important;
background:radial-gradient(circle at 70% 28%,rgba(255,255,255,.65) 0 22%,rgba(255,255,255,0) 23%),linear-gradient(135deg,#ff9ab4 0%,#ff5b83 48%,#c6d9ff 49%,#ffedf2 100%)!important;
}
.secondary-navigation .site-logo img,
.secondary-navigation > ul,
.secondary-navigation > .menu{
display:none!important;
}
.lv-rail-actions{
display:flex!important;
flex:1 1 auto!important;
width:100%!important;
min-height:0!important;
flex-direction:column!important;
align-items:center!important;
gap:12px!important;
}
.lv-rail-group{
width:100%!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:10px!important;
}
.lv-rail-group-bottom{margin-top:auto!important;gap:8px!important}
.lv-rail-separator{
width:34px!important;
height:1px!important;
background:#e8ebf1!important;
margin:2px 0 4px!important;
}
.lv-rail-link{
width:38px!important;
min-height:38px!important;
height:38px!important;
padding:0!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
color:#20242b!important;
background:transparent!important;
box-shadow:none!important;
font-size:0!important;
}
.lv-rail-link:hover,
.lv-rail-link:focus-visible{
background:#f5f7fb!important;
color:#111827!important;
}
.lv-rail-link svg{
width:20px!important;
height:20px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.9!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-rail-group-main .lv-rail-link:first-child{
width:40px!important;
height:40px!important;
min-height:40px!important;
background:linear-gradient(180deg,#fff,#fbf7fb)!important;
box-shadow:0 8px 24px rgba(15,23,42,.06)!important;
}
.lv-rail-support{
width:44px!important;
min-height:54px!important;
padding:0!important;
border-radius:999px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
gap:2px!important;
background:transparent!important;
box-shadow:none!important;
color:#36a7ff!important;
}
.lv-rail-support-icon{
width:34px!important;
height:34px!important;
display:grid!important;
place-items:center!important;
border-radius:999px!important;
background:#e8f5ff!important;
color:#58b7ff!important;
}
.lv-rail-support svg{
width:22px!important;
height:22px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.8!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-rail-support span:last-child{
display:block!important;
max-width:42px!important;
padding:1px 5px!important;
border-radius:4px!important;
background:#53b8ff!important;
color:#fff!important;
font-size:9px!important;
line-height:1.25!important;
font-weight:700!important;
white-space:nowrap!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
left:var(--lv-rail-width)!important;
}
}
/* v39 - final LarxVo shell order guard */
:root{
--lv-rail-width:84px!important;
--lv-topbar-height:64px!important;
--lv-promo-height:40px!important;
--lv-hero-gradient:linear-gradient(180deg,#eefaff 0%,#f7fbff 38%,#ffffff 82%);
}
@media (min-width:769px){
body.has-lv-rail .site-wrapper{padding-left:var(--lv-rail-width)!important}
body.has-lv-rail .top-menu,
body.has-lv-rail .site-header{left:var(--lv-rail-width)!important}
body.has-lv-rail .top-navigation{display:none!important}
body.has-lv-rail .top-menu .container{
justify-content:flex-end!important;
padding-left:32px!important;
padding-right:40px!important;
}
body.home .top-menu{
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{
background:var(--lv-hero-gradient)!important;
min-height:650px!important;
padding-top:136px!important;
}
body.home.has-lv-promo .lv-home-hero{padding-top:150px!important}
body.home.has-lv-promo.lv-promo-dismissed .lv-home-hero{padding-top:110px!important}
body.has-lv-promo .top-menu{top:var(--lv-promo-height)!important}
body.admin-bar.has-lv-promo .top-menu{top:calc(32px + var(--lv-promo-height))!important}
body.has-lv-promo.lv-promo-dismissed .top-menu{top:0!important}
body.admin-bar.has-lv-promo.lv-promo-dismissed .top-menu{top:32px!important}
body.has-lv-rail .secondary-navigation.lv-side-rail{
display:flex!important;
width:var(--lv-rail-width)!important;
padding:18px 0!important;
overflow:visible!important;
background:linear-gradient(180deg,#f2fbff 0%,#f8fbff 44%,#fff 100%)!important;
border-right:1px solid rgba(226,232,240,.72)!important;
}
body.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:var(--lv-promo-height)!important;
height:calc(100vh - var(--lv-promo-height))!important;
}
body.admin-bar.has-lv-promo.has-lv-rail .secondary-navigation.lv-side-rail{
top:calc(32px + var(--lv-promo-height))!important;
height:calc(100vh - 32px - var(--lv-promo-height))!important;
}
body.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:0!important;
height:100vh!important;
}
body.admin-bar.has-lv-promo.lv-promo-dismissed.has-lv-rail .secondary-navigation.lv-side-rail{
top:32px!important;
height:calc(100vh - 32px)!important;
}
.lv-side-rail .mobile-menu-header,
.lv-side-rail > ul,
.lv-side-rail > .menu,
.lv-side-rail > .lv-rail-actions:not(.lv-rail-actions-editable){display:none!important}
.lv-side-rail .lv-rail-actions-editable{
width:100%!important;
height:100%!important;
padding:0 13px!important;
gap:18px!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
overflow:visible!important;
}
.lv-rail-brand{
width:48px!important;
height:52px!important;
min-height:52px!important;
border-radius:10px!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-side-rail .lv-rail-group{
width:100%!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:11px!important;
}
.lv-side-rail .lv-rail-group-bottom{
margin-top:auto!important;
gap:11px!important;
padding-bottom:4px!important;
}
.lv-side-rail .lv-rail-link,
.lv-side-rail .lv-rail-support{
position:relative!important;
width:56px!important;
min-height:56px!important;
height:56px!important;
padding:0!important;
display:grid!important;
place-items:center!important;
border-radius:16px!important;
background:transparent!important;
color:#20242b!important;
overflow:visible!important;
box-shadow:none!important;
text-align:center!important;
text-decoration:none!important;
font-size:0!important;
}
.lv-side-rail .lv-rail-link:hover,
.lv-side-rail .lv-rail-link:focus-visible,
.lv-side-rail .lv-rail-support:hover,
.lv-side-rail .lv-rail-support:focus-visible{
background:#fff!important;
color:#111827!important;
box-shadow:0 12px 24px rgba(15,23,42,.07)!important;
}
.lv-side-rail .lv-rail-icon,
.lv-side-rail .lv-rail-support .lv-rail-icon{
width:42px!important;
height:42px!important;
display:grid!important;
place-items:center!important;
border-radius:999px!important;
background:transparent!important;
color:currentColor!important;
}
.lv-side-rail .lv-rail-support .lv-rail-icon{
background:#e8f5ff!important;
color:#4ab2ff!important;
}
.lv-side-rail .lv-rail-icon svg{
width:24px!important;
height:24px!important;
max-width:24px!important;
max-height:24px!important;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.lv-side-rail .lv-rail-label,
.lv-side-rail .lv-rail-support .lv-rail-label{
position:absolute!important;
left:calc(100% + 12px)!important;
top:50%!important;
z-index:1600!important;
max-width:190px!important;
min-height:30px!important;
display:inline-flex!important;
align-items:center!important;
padding:0 10px!important;
border-radius:8px!important;
background:#1f2329!important;
color:#fff!important;
font-size:12px!important;
line-height:1!important;
font-weight:400!important;
white-space:nowrap!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translate(-4px,-50%)!important;
transition:opacity .16s ease, transform .16s ease, visibility .16s ease!important;
box-shadow:0 12px 28px rgba(15,23,42,.18)!important;
}
.lv-side-rail .lv-rail-label::before{
content:""!important;
position:absolute!important;
left:-5px!important;
top:50%!important;
width:10px!important;
height:10px!important;
background:#1f2329!important;
transform:translateY(-50%) rotate(45deg)!important;
}
.lv-side-rail .lv-rail-link:hover .lv-rail-label,
.lv-side-rail .lv-rail-link:focus-visible .lv-rail-label,
.lv-side-rail .lv-rail-support:hover .lv-rail-label,
.lv-side-rail .lv-rail-support:focus-visible .lv-rail-label{
opacity:1!important;
visibility:visible!important;
transform:translate(0,-50%)!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{left:var(--lv-rail-width)!important}
}
.top-navigation a,
.lv-promo-content,
.lv-promo-badge,
.lv-login-btn,
.lv-hero-kicker,
.lv-search-mode span,
.lv-search-mode a,
.lv-filter-chip,
.lv-term-strip a,
.lv-tool-item,
.lv-section-titlebar a,
.btn-collections,
.btn-featured,
.sidebar-toggle-btn,
.sort-select,
.lv-recent-title,
.lv-detail-suggested-card span{font-weight:400!important}
.lv-search-mode .is-active,
.lv-hero-search > button[type="submit"],
.lv-filter-chip:hover,
.lv-term-strip a:hover,
.lv-section-titlebar h2,
.lv-account-profile strong,
.lv-plan-card strong{font-weight:500!important}
@media (max-width:1280px) and (min-width:769px){
:root{--lv-rail-width:78px!important}
.lv-side-rail .lv-rail-actions-editable{
padding-left:11px!important;
padding-right:11px!important;
}
.lv-side-rail .lv-rail-link,
.lv-side-rail .lv-rail-support{
width:52px!important;
min-height:52px!important;
height:52px!important;
}
}
@media (max-width:768px){
body.has-lv-rail .site-wrapper,
.site-wrapper{padding-left:0!important}
.secondary-navigation.lv-side-rail,
.lv-side-rail .lv-rail-actions-editable{display:none!important}
body.home .top-menu{
background:transparent!important;
border:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{background:var(--lv-hero-gradient)!important}
.lv-top-actions{
display:flex!important;
gap:10px!important;
}
.top-menu .container{
padding-left:14px!important;
padding-right:14px!important;
}
.lv-top-theme-toggle{display:none!important}
}
html.lv-theme-dark .secondary-navigation.lv-side-rail{
background:linear-gradient(180deg,#111827 0%,#0f172a 100%)!important;
}
/* v44 - final editable top nav SVG icon overrides */
.lv-nav-custom-svg{
display:inline-grid!important;
place-items:center!important;
width:20px!important;
height:20px!important;
line-height:0!important;
}
.lv-top-icon .lv-nav-custom-svg svg,
.lv-theme-toggle-icon .lv-nav-custom-svg svg{
width:20px!important;
height:20px!important;
display:block!important;
fill:revert!important;
stroke:revert!important;
}
.lv-vip-link .lv-nav-custom-svg svg{
fill:revert!important;
stroke:revert!important;
}
.lv-account-custom-icon{
width:34px!important;
height:34px!important;
display:inline-grid!important;
place-items:center!important;
border-radius:999px!important;
overflow:hidden!important;
border:2px solid rgba(255,255,255,.78)!important;
box-shadow:0 8px 20px rgba(15,23,42,.14)!important;
background:rgba(255,255,255,.72)!important;
}
.lv-account-custom-icon .lv-nav-custom-svg{
width:100%!important;
height:100%!important;
}
.lv-account-custom-icon .lv-nav-custom-svg svg{
width:100%!important;
height:100%!important;
display:block!important;
fill:revert!important;
stroke:revert!important;
}
@media (max-width:768px){
.lv-top-theme-toggle.lv-theme-toggle{
display:inline-grid!important;
}
}
/* v45 - file format/tool icons only, names on hover */
.lv-format-icon{
width:24px!important;
height:24px!important;
min-width:24px!important;
display:inline-grid!important;
place-items:center!important;
position:relative!important;
border-radius:7px!important;
color:#1f2937!important;
line-height:0!important;
}
.lv-format-icon-inner,
.lv-format-icon-inner svg{
width:100%!important;
height:100%!important;
display:block!important;
}
.lv-format-icon:hover::after,
.lv-format-icon:focus-visible::after{
content:attr(data-format-label);
position:absolute;
left:50%;
bottom:calc(100% + 8px);
transform:translateX(-50%);
z-index:30;
max-width:160px;
padding:5px 8px;
border-radius:7px;
background:rgba(17,24,39,.94);
color:#fff;
font-size:12px;
font-weight:400;
line-height:1.2;
white-space:nowrap;
box-shadow:0 10px 24px rgba(15,23,42,.2);
pointer-events:none;
}
.lv-card-format-icons.file-badge,
.file-badge.software-icons.lv-card-format-icons{
height:auto!important;
min-height:30px!important;
padding:4px 6px!important;
display:inline-flex!important;
align-items:center!important;
gap:5px!important;
background:rgba(255,255,255,.96)!important;
border-radius:8px!important;
box-shadow:0 8px 20px rgba(15,23,42,.16)!important;
text-transform:none!important;
}
.lv-card-format-icons .lv-format-icon{
width:20px!important;
height:20px!important;
min-width:20px!important;
}
.post-format-icons .lv-format-icon,
.post-format-icon{
width:18px!important;
height:18px!important;
min-width:18px!important;
}
.post-format-icons .lv-format-icon:hover::after{
bottom:calc(100% + 6px);
}
.post-format-icon-fallback{
display:none!important;
}
.lv-format-tag-icon{
width:38px!important;
height:38px!important;
padding:7px!important;
}
.lv-format-tag-icon .lv-format-icon{
width:22px!important;
height:22px!important;
min-width:22px!important;
}
/* v46 - single design gallery thumbnails */
.single-design-file .lv-single-gallery{
width:100%!important;
display:block!important;
}
.single-design-file .lv-single-gallery-main{
padding:0!important;
margin-bottom:0!important;
border-radius:18px!important;
overflow:hidden!important;
position:relative!important;
}
.single-design-file .lv-single-gallery-image{
width:100%!important;
height:auto!important;
display:block!important;
object-fit:contain!important;
}
.single-design-file .lv-single-gallery-actions{
position:absolute!important;
top:14px!important;
left:14px!important;
z-index:20!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
gap:8px!important;
pointer-events:auto!important;
}
.single-design-file .lv-single-gallery-action,
.single-design-file .lv-single-gallery-actions .post-favorite{
position:static!important;
inset:auto!important;
width:36px!important;
height:36px!important;
min-width:36px!important;
min-height:36px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:0!important;
border-radius:999px!important;
background:rgba(255,255,255,.92)!important;
color:#1f2937!important;
opacity:1!important;
visibility:visible!important;
transform:none!important;
box-shadow:0 8px 22px rgba(15,23,42,.16)!important;
cursor:pointer!important;
}
.single-design-file .lv-single-gallery-action:hover,
.single-design-file .lv-single-gallery-actions .post-favorite:hover{
color:#3867ff!important;
background:#fff!important;
}
.single-design-file .lv-single-gallery-action svg,
.single-design-file .lv-single-gallery-actions .post-favorite svg{
width:18px!important;
height:18px!important;
display:block!important;
}
.single-design-file .lv-single-gallery-crown{
min-width:42px!important;
height:34px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
padding:0 10px!important;
border-radius:9px!important;
background:rgba(31,41,55,.88)!important;
color:#fbbf24!important;
font-size:12px!important;
font-weight:500!important;
line-height:1!important;
box-shadow:0 8px 22px rgba(15,23,42,.18)!important;
backdrop-filter:blur(10px)!important;
-webkit-backdrop-filter:blur(10px)!important;
}
.single-design-file .lv-single-gallery-crown.free{
color:#16a34a!important;
background:rgba(255,255,255,.92)!important;
}
.single-design-file .lv-single-gallery-thumbs{
display:flex!important;
align-items:center!important;
gap:8px!important;
width:100%!important;
margin-top:10px!important;
overflow-x:auto!important;
overscroll-behavior-x:contain!important;
scrollbar-width:thin!important;
}
.single-design-file .lv-single-gallery-thumb{
width:56px!important;
height:56px!important;
min-width:56px!important;
padding:0!important;
border:2px solid transparent!important;
border-radius:11px!important;
overflow:hidden!important;
background:#fff!important;
box-shadow:0 8px 20px rgba(15,23,42,.12)!important;
cursor:pointer!important;
}
.single-design-file .lv-single-gallery-thumb.is-active{
border-color:#3b82f6!important;
}
.single-design-file .lv-single-gallery-thumb img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
display:block!important;
}
@media (max-width:768px){
.single-design-file .lv-single-gallery-main{
border-radius:16px!important;
}
.single-design-file .lv-single-gallery-actions{
top:10px!important;
left:10px!important;
gap:7px!important;
}
.single-design-file .lv-single-gallery-action,
.single-design-file .lv-single-gallery-actions .post-favorite{
width:34px!important;
height:34px!important;
min-width:34px!important;
min-height:34px!important;
}
.single-design-file .lv-single-gallery-crown{
top:10px!important;
right:10px!important;
height:32px!important;
min-width:38px!important;
}
.single-design-file .lv-single-gallery-thumb{
width:50px!important;
height:50px!important;
min-width:50px!important;
border-radius:10px!important;
}
}
/* v47 - precise active rail, card icon tooltip, home dark mode */
@media (min-width:769px){
.lv-side-rail .lv-rail-group-main .lv-rail-link:first-child{
background:transparent!important;
box-shadow:none!important;
color:#20242b!important;
}
.lv-side-rail .lv-rail-link.is-active,
.lv-side-rail .lv-rail-support.is-active{
background:#fff!important;
color:#111827!important;
box-shadow:0 12px 24px rgba(15,23,42,.07)!important;
}
.lv-side-rail .lv-rail-link.is-active .lv-rail-icon,
.lv-side-rail .lv-rail-support.is-active .lv-rail-icon{
color:currentColor!important;
}
}
html.lv-theme-dark .lv-side-rail .lv-rail-group-main .lv-rail-link:first-child{
background:transparent!important;
box-shadow:none!important;
color:#dbeafe!important;
}
html.lv-theme-dark .lv-side-rail .lv-rail-link.is-active,
html.lv-theme-dark .lv-side-rail .lv-rail-support.is-active{
background:rgba(255,255,255,.12)!important;
color:#fff!important;
box-shadow:0 12px 26px rgba(0,0,0,.28)!important;
}
.lv-card-format-icons.file-badge,
.file-badge.software-icons.lv-card-format-icons{
overflow:visible!important;
z-index:35!important;
}
.lv-card-format-icons .lv-format-icon{
display:grid!important;
place-items:center!important;
overflow:visible!important;
line-height:0!important;
}
.lv-card-format-icons .lv-format-icon-inner{
width:100%!important;
height:100%!important;
display:grid!important;
place-items:center!important;
}
.lv-card-format-icons .lv-format-icon-inner svg{
width:100%!important;
height:100%!important;
max-width:100%!important;
max-height:100%!important;
display:block!important;
margin:auto!important;
}
.lv-card-format-icons .lv-format-icon:hover::after,
.lv-card-format-icons .lv-format-icon:focus-visible::after{
top:calc(100% + 6px)!important;
bottom:auto!important;
z-index:999!important;
transform:translateX(-50%)!important;
}
html.lv-theme-dark{
--lv-hero-gradient:linear-gradient(180deg,#08111f 0%,#0b1424 42%,#070b16 100%)!important;
--lv-ink:#eef5ff;
}
html.lv-theme-dark body.home,
html.lv-theme-dark body.home .site-wrapper,
html.lv-theme-dark body.home .site-main,
html.lv-theme-dark body.home .lv-home-hero,
html.lv-theme-dark body.home .lv-discover-section,
html.lv-theme-dark body.home .lv-recent-section{
background:var(--lv-hero-gradient)!important;
color:#e5edff!important;
}
html.lv-theme-dark body.home .top-menu{
background:rgba(8,17,31,.72)!important;
border-color:rgba(148,163,184,.12)!important;
}
html.lv-theme-dark body.home .lv-hero-kicker{
background:rgba(96,165,250,.14)!important;
color:#9cc4ff!important;
}
html.lv-theme-dark body.home .lv-hero-copy h1{
color:#f3f7ff!important;
}
html.lv-theme-dark body.home .lv-hero-copy h1 span{
color:#6f9cff!important;
}
html.lv-theme-dark body.home .lv-search-mode{
background:rgba(148,163,184,.14)!important;
}
html.lv-theme-dark body.home .lv-search-mode span,
html.lv-theme-dark body.home .lv-search-mode a{
color:#cbd7ee!important;
}
html.lv-theme-dark body.home .lv-search-mode .is-active{
background:#f8fafc!important;
color:#0f172a!important;
box-shadow:0 8px 22px rgba(0,0,0,.22)!important;
}
html.lv-theme-dark body.home .lv-hero-search{
background:rgba(15,23,42,.94)!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 20px 48px rgba(0,0,0,.34)!important;
}
html.lv-theme-dark body.home .lv-hero-search label{
color:#8fa2c4!important;
}
html.lv-theme-dark body.home .lv-hero-search input{
background:transparent!important;
color:#e5edff!important;
border:0!important;
box-shadow:none!important;
}
html.lv-theme-dark body.home .lv-hero-search input::placeholder{
color:#7f91b2!important;
}
html.lv-theme-dark body.home .lv-filter-chip,
html.lv-theme-dark body.home .lv-term-strip a,
html.lv-theme-dark body.home .btn-collections,
html.lv-theme-dark body.home .btn-featured,
html.lv-theme-dark body.home .sort-select{
background:rgba(15,23,42,.82)!important;
color:#dbe7ff!important;
border-color:rgba(148,163,184,.2)!important;
}
html.lv-theme-dark body.home .lv-filter-chip:hover,
html.lv-theme-dark body.home .lv-term-strip a:hover{
background:rgba(37,99,235,.22)!important;
color:#fff!important;
border-color:rgba(122,162,255,.34)!important;
}
html.lv-theme-dark body.home .lv-tool-item,
html.lv-theme-dark body.home .lv-recent-title,
html.lv-theme-dark body.home .lv-section-titlebar h2{
color:#f2f6ff!important;
}
html.lv-theme-dark body.home .lv-section-titlebar a{
color:#9bb8ff!important;
}
html.lv-theme-dark body.home .lv-tool-icon{
background:rgba(15,23,42,.86)!important;
color:#dbe7ff!important;
border-color:rgba(148,163,184,.2)!important;
box-shadow:0 12px 28px rgba(0,0,0,.24)!important;
}
html.lv-theme-dark body.home .lv-recent-card{
color:#eef5ff!important;
}
html.lv-theme-dark body.home .lv-recent-thumb{
background:#111827!important;
box-shadow:0 16px 36px rgba(0,0,0,.22)!important;
}
html.lv-theme-dark body.home .post-card,
html.lv-theme-dark body.home .post-card.pinterest-style{
background:#0f172a!important;
border-color:rgba(148,163,184,.16)!important;
}
/* v48 - dark mode sidebar filters */
html.lv-theme-dark .lv-discover-section .sidebar,
html.lv-theme-dark .lv-design-archive-page .sidebar{
background:#07101f!important;
border-right-color:rgba(148,163,184,.16)!important;
box-shadow:24px 0 60px rgba(0,0,0,.36)!important;
color:#dbe7ff!important;
}
html.lv-theme-dark .lv-discover-section .sidebar-mobile-header,
html.lv-theme-dark .lv-design-archive-page .sidebar-mobile-header{
background:#0b1324!important;
border-bottom-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar-mobile-header h3,
html.lv-theme-dark .lv-design-archive-page .sidebar-mobile-header h3{
color:#f3f7ff!important;
}
html.lv-theme-dark .lv-discover-section .sidebar-close-btn,
html.lv-theme-dark .lv-design-archive-page .sidebar-close-btn{
color:#dbe7ff!important;
background:rgba(255,255,255,.06)!important;
border-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-section,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-section,
html.lv-theme-dark .lv-discover-section .sidebar .active-filters .filter-section,
html.lv-theme-dark .lv-design-archive-page .sidebar .active-filters .filter-section{
background:#0f172a!important;
border-color:rgba(148,163,184,.16)!important;
box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-section h3,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-section h3,
html.lv-theme-dark .lv-discover-section .sidebar .filter-header h3,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-header h3{
color:#eef5ff!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-section h3 svg,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-section h3 svg{
color:#9bb8ff!important;
stroke:currentColor!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-option,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-option{
color:#dbe7ff!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-option label,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-option label{
color:#dbe7ff!important;
font-weight:400!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-option label span,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-option label span,
html.lv-theme-dark .lv-discover-section .sidebar [style*="color: #999"],
html.lv-theme-dark .lv-design-archive-page .sidebar [style*="color: #999"],
html.lv-theme-dark .lv-discover-section .sidebar [style*="color:#999"],
html.lv-theme-dark .lv-design-archive-page .sidebar [style*="color:#999"]{
color:#8fa2c4!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-option input[type="checkbox"],
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-option input[type="checkbox"]{
width:18px!important;
height:18px!important;
min-width:18px!important;
background:#111c31!important;
border:1px solid rgba(148,163,184,.38)!important;
box-shadow:inset 0 0 0 1px rgba(15,23,42,.32)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-option input[type="checkbox"]:checked,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-option input[type="checkbox"]:checked{
background:#3b6df6!important;
border-color:#7aa2ff!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .filter-options-scrollable,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-options-scrollable{
scrollbar-color:#334155 #0f172a!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .tag-filter-item,
html.lv-theme-dark .lv-design-archive-page .sidebar .tag-filter-item{
background:rgba(15,23,42,.82)!important;
color:#dbe7ff!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .tag-filter-item .tag-name,
html.lv-theme-dark .lv-design-archive-page .sidebar .tag-filter-item .tag-name{
color:#dbe7ff!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .tag-filter-item .tag-count,
html.lv-theme-dark .lv-design-archive-page .sidebar .tag-filter-item .tag-count{
color:#8fa2c4!important;
}
html.lv-theme-dark .lv-discover-section .sidebar .tag-filter-item:hover,
html.lv-theme-dark .lv-design-archive-page .sidebar .tag-filter-item:hover,
html.lv-theme-dark .lv-discover-section .sidebar .tag-filter-item.selected,
html.lv-theme-dark .lv-design-archive-page .sidebar .tag-filter-item.selected{
background:rgba(59,109,246,.2)!important;
border-color:rgba(122,162,255,.38)!important;
}
/* v49 - collection count badge liquid glass */
.lv-collection-count-badge,
.collection-thumbnail > .lv-collection-count-badge.lv-collection-count-badge{
z-index:4!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-width:62px!important;
min-height:30px!important;
padding:0 12px!important;
border-radius:999px!important;
background:
linear-gradient(135deg, rgba(185, 28, 28, .48), rgba(244, 63, 94, .28)),
rgba(15, 23, 42, .12)!important;
border:1px solid rgba(255,255,255,.22)!important;
color:#fff!important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.30),
inset 0 -10px 20px rgba(15,23,42,.10),
0 12px 26px rgba(15,23,42,.18)!important;
-webkit-backdrop-filter:blur(16px) saturate(155%)!important;
backdrop-filter:blur(16px) saturate(155%)!important;
font-size:13px!important;
font-weight:500!important;
line-height:1!important;
letter-spacing:0!important;
text-shadow:0 1px 10px rgba(15,23,42,.24)!important;
}
html.lv-theme-dark .lv-collection-count-badge,
html.lv-theme-dark .collection-thumbnail > .lv-collection-count-badge.lv-collection-count-badge{
background:
linear-gradient(135deg, rgba(190, 24, 93, .42), rgba(248, 113, 113, .22)),
rgba(255,255,255,.06)!important;
border-color:rgba(255,255,255,.18)!important;
color:#fff!important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.22),
inset 0 -12px 22px rgba(0,0,0,.12),
0 14px 30px rgba(0,0,0,.28)!important;
}
@media (max-width:640px){
.lv-collection-count-badge,
.collection-thumbnail > .lv-collection-count-badge.lv-collection-count-badge{
min-width:54px!important;
min-height:28px!important;
padding:0 10px!important;
font-size:12px!important;
}
}
/* v50 - /file archive dark mode contrast */
html.lv-theme-dark .lv-design-archive-page{
background:#070d1b!important;
color:#eaf2ff!important;
}
html.lv-theme-dark .lv-design-archive-page .container,
html.lv-theme-dark .lv-design-archive-page .content-layout,
html.lv-theme-dark .lv-design-archive-page .main-content,
html.lv-theme-dark .lv-design-archive-page .lv-design-archive-layout{
background:transparent!important;
color:#eaf2ff!important;
}
html.lv-theme-dark .lv-design-archive-breadcrumb{
color:#8fa2c4!important;
}
html.lv-theme-dark .lv-design-archive-breadcrumb a{
color:#c8d6f4!important;
font-weight:400!important;
}
html.lv-theme-dark .lv-design-archive-breadcrumb a:hover{
color:#8fb3ff!important;
}
html.lv-theme-dark .lv-design-archive-breadcrumb strong{
color:#f3f7ff!important;
font-weight:500!important;
}
html.lv-theme-dark .lv-design-archive-title-card{
background:
linear-gradient(135deg, rgba(15,23,42,.96), rgba(17,29,51,.90)),
#0f172a!important;
border:1px solid rgba(148,163,184,.18)!important;
box-shadow:0 18px 52px rgba(0,0,0,.24)!important;
}
html.lv-theme-dark .lv-design-archive-title-card > span{
background:rgba(59,109,246,.18)!important;
color:#9bb8ff!important;
border:1px solid rgba(122,162,255,.16)!important;
font-weight:500!important;
}
html.lv-theme-dark .lv-design-archive-title-card h1{
color:#f3f7ff!important;
opacity:1!important;
text-shadow:none!important;
}
html.lv-theme-dark .lv-design-archive-title-card p{
color:#a9b8d4!important;
opacity:1!important;
}
html.lv-theme-dark .lv-design-archive-page .sort-filter-wrapper{
background:transparent!important;
}
html.lv-theme-dark .lv-design-archive-page .sidebar-toggle-btn,
html.lv-theme-dark .lv-design-archive-page .btn-collections,
html.lv-theme-dark .lv-design-archive-page .btn-featured,
html.lv-theme-dark .lv-design-archive-page .sort-select{
background:#0f172a!important;
border-color:rgba(148,163,184,.24)!important;
color:#dbe7ff!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-design-archive-page .sidebar-toggle-btn svg,
html.lv-theme-dark .lv-design-archive-page .btn-collections svg,
html.lv-theme-dark .lv-design-archive-page .btn-featured svg{
color:inherit!important;
stroke:currentColor!important;
}
html.lv-theme-dark .lv-design-archive-page .btn-collections.is-active{
background:linear-gradient(135deg,#2f6bff,#5b8cff)!important;
border-color:rgba(122,162,255,.78)!important;
color:#fff!important;
box-shadow:0 12px 26px rgba(47,107,255,.24)!important;
}
html.lv-theme-dark .lv-design-archive-page .sidebar-toggle-btn:hover,
html.lv-theme-dark .lv-design-archive-page .btn-collections:hover,
html.lv-theme-dark .lv-design-archive-page .btn-featured:hover,
html.lv-theme-dark .lv-design-archive-page .sort-select:hover{
background:#17243b!important;
border-color:rgba(122,162,255,.38)!important;
color:#fff!important;
}
html.lv-theme-dark .lv-design-archive-page .sort-select option{
background:#0f172a!important;
color:#eaf2ff!important;
}
/* v51 - generic sidebar popular tags dark mode */
html.lv-theme-dark .sidebar .tags-filter-section{
background:#0f172a!important;
border-color:rgba(148,163,184,.16)!important;
box-shadow:0 14px 34px rgba(0,0,0,.18)!important;
}
html.lv-theme-dark .sidebar .tags-filter-section h3{
color:#eef5ff!important;
font-weight:500!important;
}
html.lv-theme-dark .sidebar .tags-filter-section h3 svg{
color:#dbe7ff!important;
stroke:currentColor!important;
}
html.lv-theme-dark .sidebar .tags-filter-cloud{
background:transparent!important;
}
html.lv-theme-dark .sidebar .tag-filter-item{
background:rgba(17,28,49,.92)!important;
border-color:rgba(148,163,184,.24)!important;
color:#dbe7ff!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 8px 18px rgba(0,0,0,.16)!important;
}
html.lv-theme-dark .sidebar .tag-filter-item .tag-name{
color:#dbe7ff!important;
font-weight:400!important;
}
html.lv-theme-dark .sidebar .tag-filter-item .tag-count{
background:#24314d!important;
color:#f3f7ff!important;
font-weight:500!important;
}
html.lv-theme-dark .sidebar .tag-filter-item:hover,
html.lv-theme-dark .sidebar .tag-filter-item.selected{
background:rgba(59,109,246,.24)!important;
border-color:rgba(122,162,255,.48)!important;
color:#fff!important;
box-shadow:0 10px 24px rgba(47,107,255,.18)!important;
}
html.lv-theme-dark .sidebar .tag-filter-item:hover .tag-name,
html.lv-theme-dark .sidebar .tag-filter-item.selected .tag-name{
color:#fff!important;
}
html.lv-theme-dark .sidebar .tag-filter-item:hover .tag-count,
html.lv-theme-dark .sidebar .tag-filter-item.selected .tag-count{
background:rgba(255,255,255,.18)!important;
color:#fff!important;
}
/* v52 - card overlay action/icon sizing and liquid glass */
.post-thumbnail-wrapper .card-top-badges{
z-index:40!important;
gap:4px!important;
align-items:flex-start!important;
}
.post-thumbnail-wrapper .post-favorite{
top:8px!important;
left:8px!important;
width:30px!important;
height:30px!important;
min-width:30px!important;
min-height:30px!important;
padding:0!important;
z-index:70!important;
border:1px solid rgba(255,255,255,.30)!important;
border-radius:10px!important;
background:linear-gradient(135deg,rgba(255,255,255,.36),rgba(255,255,255,.14))!important;
color:#ef4444!important;
box-shadow:0 10px 24px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.34)!important;
-webkit-backdrop-filter:blur(14px) saturate(150%)!important;
backdrop-filter:blur(14px) saturate(150%)!important;
}
.post-thumbnail-wrapper .post-favorite svg{
width:16px!important;
height:16px!important;
stroke:currentColor!important;
}
.post-thumbnail-wrapper:hover .post-favorite,
.post-thumbnail-wrapper:hover .post-favorite.is-favorited{
opacity:1!important;
transform:translateX(0)!important;
}
.post-thumbnail-wrapper .post-favorite:hover{
background:linear-gradient(135deg,rgba(239,68,68,.92),rgba(244,63,94,.74))!important;
color:#fff!important;
border-color:rgba(255,255,255,.36)!important;
transform:translateX(0) scale(1.06)!important;
}
.post-thumbnail-wrapper .card-download-btn{
top:44px!important;
right:8px!important;
width:30px!important;
height:30px!important;
min-width:30px!important;
min-height:30px!important;
z-index:60!important;
border:1px solid rgba(255,255,255,.30)!important;
border-radius:10px!important;
background:linear-gradient(135deg,rgba(255,255,255,.36),rgba(255,255,255,.14))!important;
color:#3f6dff!important;
box-shadow:0 10px 24px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.34)!important;
-webkit-backdrop-filter:blur(14px) saturate(150%)!important;
backdrop-filter:blur(14px) saturate(150%)!important;
}
.post-thumbnail-wrapper .card-download-btn svg{
width:16px!important;
height:16px!important;
stroke:currentColor!important;
}
.post-thumbnail-wrapper .card-download-btn:hover{
background:linear-gradient(135deg,#3867ff,#5b8cff)!important;
color:#fff!important;
transform:translateX(0) scale(1.06)!important;
border-color:rgba(255,255,255,.36)!important;
}
.post-thumbnail-wrapper .lv-card-format-icons.file-badge,
.post-thumbnail-wrapper .file-badge.software-icons.lv-card-format-icons{
min-height:30px!important;
height:30px!important;
padding:4px 5px!important;
gap:4px!important;
border:1px solid rgba(255,255,255,.30)!important;
border-radius:10px!important;
background:linear-gradient(135deg,rgba(255,255,255,.30),rgba(255,255,255,.12))!important;
box-shadow:0 10px 24px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.34)!important;
-webkit-backdrop-filter:blur(14px) saturate(150%)!important;
backdrop-filter:blur(14px) saturate(150%)!important;
}
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon{
width:22px!important;
height:22px!important;
min-width:22px!important;
padding:0!important;
display:grid!important;
place-items:center!important;
border-radius:7px!important;
background:transparent!important;
overflow:visible!important;
}
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon-inner{
width:18px!important;
height:18px!important;
display:grid!important;
place-items:center!important;
line-height:0!important;
}
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon-inner svg,
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon-inner img{
width:18px!important;
height:18px!important;
max-width:18px!important;
max-height:18px!important;
display:block!important;
margin:auto!important;
object-fit:contain!important;
}
html.lv-theme-dark .post-thumbnail-wrapper .post-favorite,
html.lv-theme-dark .post-thumbnail-wrapper .card-download-btn,
html.lv-theme-dark .post-thumbnail-wrapper .lv-card-format-icons.file-badge,
html.lv-theme-dark .post-thumbnail-wrapper .file-badge.software-icons.lv-card-format-icons{
background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.07))!important;
border-color:rgba(255,255,255,.18)!important;
box-shadow:0 12px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.16)!important;
}
@media (max-width:640px){
.post-thumbnail-wrapper .post-favorite,
.post-thumbnail-wrapper .card-download-btn{
width:28px!important;
height:28px!important;
min-width:28px!important;
min-height:28px!important;
border-radius:9px!important;
}
.post-thumbnail-wrapper .post-favorite svg,
.post-thumbnail-wrapper .card-download-btn svg{
width:15px!important;
height:15px!important;
}
.post-thumbnail-wrapper .card-download-btn{
top:40px!important;
}
.post-thumbnail-wrapper .lv-card-format-icons.file-badge,
.post-thumbnail-wrapper .file-badge.software-icons.lv-card-format-icons{
height:28px!important;
min-height:28px!important;
padding:3px 4px!important;
}
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon{
width:20px!important;
height:20px!important;
min-width:20px!important;
}
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon-inner,
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon-inner svg,
.post-thumbnail-wrapper .lv-card-format-icons .lv-format-icon-inner img{
width:16px!important;
height:16px!important;
max-width:16px!important;
max-height:16px!important;
}
}
/* v53 - smart card badge layout: product access right, actions/formats left */
.post-thumbnail-wrapper .card-top-badges{
top:8px!important;
left:8px!important;
right:8px!important;
width:auto!important;
display:flex!important;
justify-content:flex-end!important;
align-items:flex-start!important;
pointer-events:none!important;
z-index:64!important;
}
.post-thumbnail-wrapper .card-top-badges .seller-pro-badge,
.post-thumbnail-wrapper .card-top-badges .seller-featured-badge{
display:none!important;
}
.post-thumbnail-wrapper .card-top-badges .vip-badge-overlay{
pointer-events:auto!important;
min-height:28px!important;
height:28px!important;
padding:0 10px!important;
border-radius:10px!important;
border:1px solid rgba(255,255,255,.26)!important;
background:linear-gradient(135deg,rgba(15,23,42,.82),rgba(15,23,42,.56))!important;
color:#fff!important;
font-size:12px!important;
font-weight:500!important;
line-height:1!important;
letter-spacing:0!important;
box-shadow:0 10px 24px rgba(15,23,42,.24), inset 0 1px 0 rgba(255,255,255,.20)!important;
-webkit-backdrop-filter:blur(14px) saturate(150%)!important;
backdrop-filter:blur(14px) saturate(150%)!important;
opacity:1!important;
transform:none!important;
}
.post-thumbnail-wrapper .card-top-badges .vip-badge-overlay.free{
background:linear-gradient(135deg,rgba(22,163,74,.88),rgba(21,128,61,.66))!important;
color:#ecfdf5!important;
}
.post-thumbnail-wrapper .card-top-badges .vip-badge-overlay:not(.free) svg{
width:15px!important;
height:15px!important;
filter:drop-shadow(0 1px 4px rgba(245,158,11,.34))!important;
}
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons.file-badge,
.post-thumbnail-wrapper .card-top-badges .file-badge.software-icons.lv-card-format-icons{
position:absolute!important;
top:38px!important;
left:0!important;
right:auto!important;
width:30px!important;
min-width:30px!important;
height:auto!important;
min-height:0!important;
max-height:none!important;
padding:0!important;
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:flex-start!important;
gap:6px!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
pointer-events:auto!important;
opacity:0!important;
transform:translateX(-8px)!important;
}
.post-thumbnail-wrapper:hover .card-top-badges .lv-card-format-icons.file-badge,
.post-thumbnail-wrapper:hover .card-top-badges .file-badge.software-icons.lv-card-format-icons{
opacity:1!important;
transform:translateX(0)!important;
}
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon{
width:30px!important;
height:30px!important;
min-width:30px!important;
padding:0!important;
border-radius:10px!important;
display:grid!important;
place-items:center!important;
background:
radial-gradient(circle at 28% 20%,rgba(255,255,255,.92),rgba(255,255,255,.22) 42%,rgba(255,255,255,.12)),
rgba(255,255,255,.58)!important;
border:1px solid rgba(255,255,255,.46)!important;
box-shadow:0 10px 24px rgba(15,23,42,.20), inset 0 1px 0 rgba(255,255,255,.54)!important;
-webkit-backdrop-filter:blur(16px) saturate(170%)!important;
backdrop-filter:blur(16px) saturate(170%)!important;
}
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon-inner,
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon-inner svg,
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon-inner img{
width:18px!important;
height:18px!important;
max-width:18px!important;
max-height:18px!important;
display:block!important;
object-fit:contain!important;
}
.post-thumbnail-wrapper .post-favorite,
.post-thumbnail-wrapper .card-download-btn{
background:
radial-gradient(circle at 28% 20%,rgba(255,255,255,.92),rgba(255,255,255,.24) 42%,rgba(255,255,255,.14)),
rgba(255,255,255,.58)!important;
border-color:rgba(255,255,255,.46)!important;
box-shadow:0 10px 24px rgba(15,23,42,.20), inset 0 1px 0 rgba(255,255,255,.54)!important;
}
.post-thumbnail-wrapper .post-favorite{
left:8px!important;
top:8px!important;
color:#ef3349!important;
}
.post-thumbnail-wrapper .card-download-btn{
right:8px!important;
top:42px!important;
color:#3867ff!important;
}
html.lv-theme-dark .post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon,
html.lv-theme-dark .post-thumbnail-wrapper .post-favorite,
html.lv-theme-dark .post-thumbnail-wrapper .card-download-btn{
background:
radial-gradient(circle at 28% 20%,rgba(255,255,255,.30),rgba(255,255,255,.10) 42%,rgba(255,255,255,.06)),
rgba(15,23,42,.72)!important;
border-color:rgba(255,255,255,.20)!important;
box-shadow:0 12px 28px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.16)!important;
}
@media (max-width:640px){
.post-thumbnail-wrapper .card-top-badges{
top:7px!important;
left:7px!important;
right:7px!important;
}
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons.file-badge,
.post-thumbnail-wrapper .card-top-badges .file-badge.software-icons.lv-card-format-icons{
top:35px!important;
width:28px!important;
min-width:28px!important;
gap:5px!important;
}
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon,
.post-thumbnail-wrapper .post-favorite,
.post-thumbnail-wrapper .card-download-btn{
width:28px!important;
height:28px!important;
min-width:28px!important;
min-height:28px!important;
border-radius:9px!important;
}
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon-inner,
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon-inner svg,
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon-inner img,
.post-thumbnail-wrapper .post-favorite svg,
.post-thumbnail-wrapper .card-download-btn svg{
width:16px!important;
height:16px!important;
max-width:16px!important;
max-height:16px!important;
}
.post-thumbnail-wrapper .card-download-btn{
top:40px!important;
}
}
/* v55 - vertical format icon tooltips open to the right */
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon:hover::after,
.post-thumbnail-wrapper .card-top-badges .lv-card-format-icons .lv-format-icon:focus-visible::after{
top:50%!important;
left:calc(100% + 8px)!important;
right:auto!important;
bottom:auto!important;
transform:translateY(-50%)!important;
z-index:999!important;
max-width:160px!important;
white-space:nowrap!important;
}
/* v54 - single file detail layout refresh */
.single-design-file{
background:#fff!important;
}
.single-design-file .container{
width:100%!important;
max-width:1840px!important;
padding-left:clamp(18px,3.8vw,72px)!important;
padding-right:clamp(18px,3.8vw,72px)!important;
}
.single-design-file .breadcrumb{
margin:28px 0 26px!important;
}
.single-design-file .breadcrumb a{
color:#3867ff!important;
font-weight:400!important;
}
.single-design-layout{
width:100%!important;
max-width:none!important;
display:grid!important;
grid-template-columns:minmax(300px,380px) minmax(340px,420px) minmax(460px,1fr)!important;
gap:clamp(24px,2.4vw,48px)!important;
align-items:start!important;
margin:0 auto 42px!important;
}
.post-thumbnail-area{
grid-column:1!important;
grid-row:1!important;
min-width:0!important;
}
.single-design-sidebar{
grid-column:2!important;
grid-row:1!important;
position:sticky!important;
top:112px!important;
min-width:0!important;
}
.single-design-suggested-rail{
grid-column:3!important;
grid-row:1 / span 2!important;
min-width:0!important;
}
.post-content-area{
grid-column:1 / span 2!important;
grid-row:2!important;
min-width:0!important;
}
.single-design-file .lv-single-gallery-main{
width:100%!important;
border:0!important;
border-radius:18px!important;
background:#f8fafc!important;
box-shadow:0 18px 44px rgba(15,23,42,.08)!important;
}
.single-design-file .lv-single-gallery-image{
width:100%!important;
max-width:100%!important;
height:auto!important;
display:block!important;
border-radius:18px!important;
object-fit:contain!important;
filter:none!important;
}
.single-design-file .lv-single-gallery-thumbs{
margin-top:14px!important;
gap:10px!important;
}
.single-design-file .lv-single-gallery-thumb{
width:58px!important;
height:58px!important;
min-width:58px!important;
border-radius:12px!important;
border:2px solid transparent!important;
background:#f8fafc!important;
box-shadow:0 10px 24px rgba(15,23,42,.12)!important;
}
.single-design-file .sidebar-card,
.single-design-file .entry-content,
.single-design-file .taxonomy-card{
border:1px solid rgba(226,232,240,.78)!important;
border-radius:20px!important;
background:rgba(255,255,255,.96)!important;
box-shadow:0 18px 48px rgba(15,23,42,.055)!important;
}
.single-design-file .sidebar-card{
padding:24px!important;
margin-bottom:22px!important;
}
.single-design-file .sidebar-card h1{
margin:0 0 16px!important;
color:#111827!important;
font-size:clamp(22px,1.7vw,28px)!important;
font-weight:600!important;
line-height:1.22!important;
letter-spacing:0!important;
}
.single-design-file .download-card{
padding:24px!important;
}
.single-design-file .download-card > h3{
margin:0 0 18px!important;
color:#111827!important;
font-size:16px!important;
font-weight:500!important;
letter-spacing:0!important;
}
.single-design-file .file-info-grid{
gap:0!important;
margin-bottom:18px!important;
}
.single-design-file .info-row{
min-height:52px!important;
padding:12px 0!important;
border-bottom:1px solid rgba(226,232,240,.78)!important;
}
.single-design-file .info-row span{
color:#4b5563!important;
font-weight:400!important;
}
.single-design-file .info-row strong{
color:#111827!important;
font-weight:500!important;
}
.single-design-file .single-file-author-chip strong{
font-weight:500!important;
}
.single-design-file .vip-active-notice,
.single-design-file .vip-notice{
border-radius:14px!important;
margin:18px 0!important;
}
.single-design-file .larxvo-download-btn-main{
min-height:52px!important;
border-radius:14px!important;
background:linear-gradient(135deg,#3867ff,#5b8cff)!important;
box-shadow:0 14px 32px rgba(56,103,255,.22)!important;
}
.single-design-file .action-buttons{
gap:10px!important;
margin-top:12px!important;
}
.single-design-file .action-buttons .action-btn{
min-height:46px!important;
border-radius:12px!important;
background:#f6f8fb!important;
border:1px solid rgba(226,232,240,.72)!important;
color:#111827!important;
font-weight:400!important;
}
.single-design-file .taxonomy-card{
padding:24px!important;
}
.single-design-file .taxonomy-card > div{
margin:0!important;
}
.single-design-file .taxonomy-card > div + div{
margin-top:20px!important;
}
.single-design-file .taxonomy-card h4,
.single-design-file .lv-single-tags-section h4{
margin:0 0 10px!important;
color:#111827!important;
font-size:14px!important;
font-weight:500!important;
letter-spacing:0!important;
}
.single-design-file .taxonomy-card a,
.single-design-file .entry-tags .tag-item{
display:inline-flex!important;
align-items:center!important;
min-height:30px!important;
padding:6px 12px!important;
border:1px solid transparent!important;
border-radius:9px!important;
font-size:13px!important;
font-weight:400!important;
line-height:1!important;
text-decoration:none!important;
transition:transform .18s ease, box-shadow .18s ease, background .18s ease!important;
}
.single-design-file .taxonomy-card a:hover,
.single-design-file .entry-tags .tag-item:hover{
transform:translateY(-1px)!important;
box-shadow:0 10px 22px rgba(15,23,42,.08)!important;
}
.single-design-file .lv-single-tags-list{
gap:8px!important;
}
.single-design-file .lv-format-tag-icon{
width:34px!important;
height:34px!important;
min-width:34px!important;
padding:0!important;
justify-content:center!important;
background:#eef6ff!important;
border-color:#dbeafe!important;
}
.single-design-file .lv-format-tag-icon .lv-format-icon{
width:22px!important;
height:22px!important;
min-width:22px!important;
}
.single-design-file .lv-color-tag{
background:#f6f8fb!important;
color:#334155!important;
border-color:#e5eaf1!important;
}
.single-design-file .lv-color-dot{
box-shadow:0 0 0 2px rgba(255,255,255,.9), 0 0 0 3px rgba(148,163,184,.18)!important;
}
.lv-detail-suggested-head{
margin:0 0 18px!important;
}
.lv-detail-suggested-head h2{
color:#111827!important;
font-size:22px!important;
font-weight:600!important;
}
.lv-detail-suggested-head a{
color:#718096!important;
font-weight:400!important;
}
.lv-detail-suggested-grid{
display:grid!important;
grid-template-columns:repeat(auto-fill,minmax(170px,1fr))!important;
gap:22px!important;
}
.lv-detail-suggested-card{
display:block!important;
color:#111827!important;
text-decoration:none!important;
}
.lv-detail-suggested-card img{
width:100%!important;
aspect-ratio:3/4!important;
object-fit:cover!important;
border:0!important;
border-radius:12px!important;
background:#f4f6f9!important;
box-shadow:0 12px 30px rgba(15,23,42,.08)!important;
}
.lv-detail-suggested-card span{
margin-top:10px!important;
color:#4b5563!important;
font-size:13px!important;
font-weight:400!important;
line-height:1.35!important;
}
.single-design-file .entry-content{
padding:24px!important;
}
html.lv-theme-dark .single-design-file{
background:#070d1b!important;
}
html.lv-theme-dark .single-design-file .sidebar-card,
html.lv-theme-dark .single-design-file .entry-content,
html.lv-theme-dark .single-design-file .taxonomy-card,
html.lv-theme-dark .single-design-file .lv-single-gallery-main{
background:#0f172a!important;
border-color:rgba(148,163,184,.16)!important;
box-shadow:0 18px 48px rgba(0,0,0,.24)!important;
}
html.lv-theme-dark .single-design-file .sidebar-card h1,
html.lv-theme-dark .single-design-file .download-card > h3,
html.lv-theme-dark .single-design-file .taxonomy-card h4,
html.lv-theme-dark .single-design-file .lv-single-tags-section h4,
html.lv-theme-dark .lv-detail-suggested-head h2{
color:#f3f7ff!important;
}
html.lv-theme-dark .single-design-file .info-row{
border-bottom-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .single-design-file .info-row span,
html.lv-theme-dark .single-design-file .lv-detail-suggested-card span{
color:#a9b8d4!important;
}
html.lv-theme-dark .single-design-file .info-row strong,
html.lv-theme-dark .single-design-file .single-file-author-chip strong{
color:#f3f7ff!important;
}
html.lv-theme-dark .single-design-file .action-buttons .action-btn,
html.lv-theme-dark .single-design-file .lv-color-tag{
background:#111d33!important;
border-color:rgba(148,163,184,.16)!important;
color:#eaf2ff!important;
}
html.lv-theme-dark .single-design-file .lv-format-tag-icon{
background:#12203a!important;
border-color:rgba(122,162,255,.22)!important;
}
@media (max-width:1280px){
.single-design-layout{
grid-template-columns:minmax(300px,420px) minmax(340px,1fr)!important;
}
.single-design-suggested-rail{
grid-column:1 / -1!important;
grid-row:3!important;
}
.post-content-area{
grid-column:1 / -1!important;
grid-row:2!important;
}
}
@media (max-width:900px){
.single-design-layout{
display:flex!important;
flex-direction:column!important;
gap:20px!important;
}
.post-thumbnail-area,
.single-design-sidebar,
.post-content-area,
.single-design-suggested-rail{
width:100%!important;
grid-column:auto!important;
grid-row:auto!important;
}
.post-thumbnail-area{order:1!important}
.single-design-sidebar{
order:2!important;
position:static!important;
}
.post-content-area{order:3!important}
.single-design-suggested-rail{order:4!important}
.lv-detail-suggested-grid{
grid-template-columns:repeat(auto-fill,minmax(145px,1fr))!important;
gap:14px!important;
}
}
@media (max-width:640px){
.single-design-file .container{
padding-left:14px!important;
padding-right:14px!important;
}
.single-design-file .breadcrumb{
margin:16px 0!important;
}
.single-design-file .sidebar-card,
.single-design-file .entry-content,
.single-design-file .taxonomy-card{
padding:18px!important;
border-radius:16px!important;
}
.single-design-file .sidebar-card h1{
font-size:22px!important;
}
.single-design-file .lv-single-gallery-main,
.single-design-file .lv-single-gallery-image{
border-radius:16px!important;
}
.lv-detail-suggested-head h2{
font-size:20px!important;
}
}
/* v56 - long top search bar for detail/archive pages */
@media (min-width:769px){
:root{
--lv-topbar-height:72px!important;
}
.top-menu,
body.has-lv-rail .top-menu{
min-height:var(--lv-topbar-height)!important;
overflow:visible!important;
background:linear-gradient(180deg,rgba(248,253,255,.94),rgba(248,253,255,.78))!important;
border-bottom:1px solid rgba(226,232,240,.58)!important;
box-shadow:0 10px 34px rgba(15,23,42,.035)!important;
}
.top-menu .container,
body.has-lv-rail .top-menu .container{
min-height:var(--lv-topbar-height)!important;
display:grid!important;
grid-template-columns:minmax(320px,1fr) auto!important;
align-items:center!important;
justify-content:normal!important;
gap:22px!important;
padding-left:clamp(24px,2.4vw,44px)!important;
padding-right:clamp(24px,2.4vw,44px)!important;
overflow:visible!important;
}
.top-menu .lv-mobile-brand,
.top-menu .top-navigation{
display:none!important;
}
.top-menu .lv-top-search{
grid-column:1!important;
justify-self:center!important;
width:min(100%,1360px)!important;
max-width:1360px!important;
min-height:48px!important;
margin:0 auto!important;
padding:4px 8px 4px 14px!important;
border-radius:16px!important;
background:rgba(255,255,255,.88)!important;
border:1px solid rgba(203,213,225,.82)!important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.72), 0 8px 24px rgba(15,23,42,.045)!important;
backdrop-filter:blur(18px) saturate(145%)!important;
-webkit-backdrop-filter:blur(18px) saturate(145%)!important;
z-index:1200!important;
}
.top-menu .lv-top-search label{
gap:12px!important;
padding:0!important;
color:#94a3b8!important;
}
.top-menu .lv-top-search label > svg{
width:20px!important;
height:20px!important;
}
.top-menu .lv-top-search input{
height:38px!important;
color:#111827!important;
font-size:15px!important;
font-weight:400!important;
line-height:1!important;
}
.top-menu .lv-top-search input::placeholder{
color:#9aa4b2!important;
}
.top-menu .lv-top-search > button.lv-top-search-submit{
width:38px!important;
height:38px!important;
min-width:38px!important;
padding:0!important;
display:grid!important;
place-items:center!important;
border:0!important;
border-radius:12px!important;
background:transparent!important;
color:#94a3b8!important;
box-shadow:none!important;
font-size:0!important;
}
.top-menu .lv-top-search > button.lv-top-search-submit:hover,
.top-menu .lv-top-search > button.lv-top-search-submit:focus-visible{
background:rgba(59,103,246,.08)!important;
color:#3867ff!important;
}
.top-menu .lv-top-search > button.lv-top-search-submit svg{
width:20px!important;
height:20px!important;
display:block!important;
}
.top-menu .lv-top-search .search-autocomplete-dropdown{
top:calc(100% + 12px)!important;
left:0!important;
right:0!important;
width:100%!important;
max-height:min(520px,calc(100vh - 118px))!important;
z-index:2400!important;
}
.top-menu .lv-top-actions{
grid-column:2!important;
justify-self:end!important;
margin-left:0!important;
flex:0 0 auto!important;
}
body.home .top-menu .lv-top-search{
display:none!important;
}
body.home .top-menu .container,
body.home.has-lv-rail .top-menu .container{
display:flex!important;
justify-content:flex-end!important;
}
.site-main.single-design-file{
padding-top:84px!important;
}
body.has-lv-promo:not(.lv-promo-dismissed) .site-main.single-design-file{
padding-top:124px!important;
}
body.admin-bar .site-main.single-design-file{
padding-top:116px!important;
}
body.admin-bar.has-lv-promo:not(.lv-promo-dismissed) .site-main.single-design-file{
padding-top:156px!important;
}
.single-design-file .breadcrumb{
margin:14px 0 24px!important;
}
.single-design-sidebar{
top:92px!important;
}
}
html.lv-theme-dark .top-menu{
background:linear-gradient(180deg,rgba(8,15,30,.92),rgba(8,15,30,.76))!important;
border-bottom-color:rgba(148,163,184,.12)!important;
box-shadow:0 12px 34px rgba(0,0,0,.18)!important;
}
html.lv-theme-dark .top-menu .lv-top-search{
background:rgba(15,23,42,.88)!important;
border-color:rgba(148,163,184,.2)!important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 10px 30px rgba(0,0,0,.22)!important;
}
html.lv-theme-dark .top-menu .lv-top-search label{
color:#8294b3!important;
}
html.lv-theme-dark .top-menu .lv-top-search input{
color:#eaf2ff!important;
}
html.lv-theme-dark .top-menu .lv-top-search input::placeholder{
color:#7f91b2!important;
}
html.lv-theme-dark .top-menu .lv-top-search > button.lv-top-search-submit{
color:#8fa2c4!important;
}
html.lv-theme-dark .top-menu .lv-top-search > button.lv-top-search-submit:hover,
html.lv-theme-dark .top-menu .lv-top-search > button.lv-top-search-submit:focus-visible{
background:rgba(122,162,255,.12)!important;
color:#dbe7ff!important;
}
@media (max-width:768px){
.top-menu .lv-top-search{
display:none!important;
}
}
/* v57 - tighten the gap between the fixed top search bar and file pages */
@media (min-width:769px){
body.single-design_file .site-main.single-design-file > .container,
body.post-type-archive-design_file .site-main.lv-design-archive-page > .container,
body.tax-file_category .site-main.lv-design-archive-page > .container,
body.tax-file_format .site-main.lv-design-archive-page > .container,
body.tax-file_color .site-main.lv-design-archive-page > .container{
margin-top:-74px!important;
}
body.admin-bar.single-design_file .site-main.single-design-file > .container,
body.admin-bar.post-type-archive-design_file .site-main.lv-design-archive-page > .container,
body.admin-bar.tax-file_category .site-main.lv-design-archive-page > .container,
body.admin-bar.tax-file_format .site-main.lv-design-archive-page > .container,
body.admin-bar.tax-file_color .site-main.lv-design-archive-page > .container{
margin-top:clamp(-164px,-8.4vw,-124px)!important;
}
body.single-design_file .single-design-file .breadcrumb,
body.post-type-archive-design_file .lv-design-archive-breadcrumb,
body.tax-file_category .lv-design-archive-breadcrumb,
body.tax-file_format .lv-design-archive-breadcrumb,
body.tax-file_color .lv-design-archive-breadcrumb{
margin-bottom:18px!important;
}
body.single-design_file .single-design-layout,
body.post-type-archive-design_file .lv-design-archive-head,
body.tax-file_category .lv-design-archive-head,
body.tax-file_format .lv-design-archive-head,
body.tax-file_color .lv-design-archive-head{
margin-top:0!important;
}
}
@media (max-width:768px){
body.single-design_file .site-main.single-design-file > .container,
body.post-type-archive-design_file .site-main.lv-design-archive-page > .container,
body.tax-file_category .site-main.lv-design-archive-page > .container,
body.tax-file_format .site-main.lv-design-archive-page > .container,
body.tax-file_color .site-main.lv-design-archive-page > .container{
margin-top:0!important;
}
}
/* v58 - align featured and collection pages to the design archive layout */
@media (min-width:769px){
body.page-template-page-file-noi-bat .site-main.lv-design-archive-page > .container,
body.page-template-page-collections .site-main.lv-design-archive-page > .container{
margin-top:-74px!important;
}
body.admin-bar.page-template-page-file-noi-bat .site-main.lv-design-archive-page > .container,
body.admin-bar.page-template-page-collections .site-main.lv-design-archive-page > .container{
margin-top:clamp(-164px,-8.4vw,-124px)!important;
}
}
.featured-files-page.lv-design-archive-page .container,
.lv-collections-page.lv-design-archive-page .container{
max-width:100%!important;
padding-left:40px!important;
padding-right:40px!important;
}
.featured-files-page .lv-design-archive-head,
.lv-collections-page .lv-design-archive-head{
margin-bottom:20px!important;
}
.featured-files-page .lv-design-archive-title-card,
.lv-collections-page .lv-design-archive-title-card{
max-width:100%!important;
padding:22px 24px!important;
border-radius:8px!important;
background:linear-gradient(180deg,#f5fbff,#fff)!important;
box-shadow:none!important;
}
.featured-files-page .lv-design-archive-title-card h1,
.lv-collections-page .lv-design-archive-title-card h1{
letter-spacing:0!important;
}
.featured-files-page .btn-featured.is-active,
.lv-collections-page .btn-collections.is-active{
background:var(--color-primary)!important;
border-color:var(--color-primary)!important;
color:#fff!important;
box-shadow:0 8px 18px rgba(42,104,233,.18)!important;
}
.lv-collections-page .page-header{
display:none!important;
}
.lv-collections-page .content-layout.no-sidebar{
display:block!important;
width:100%!important;
max-width:none!important;
margin:0!important;
padding:0!important;
}
.lv-collections-page .main-content{
width:100%!important;
max-width:none!important;
margin:0!important;
}
.lv-collections-page .lv-collections-filter-row{
gap:14px!important;
}
.lv-collections-page .lv-collections-filter-row .filter-left-actions{
flex:1 1 auto!important;
}
.lv-collections-inline-search{
flex:0 1 420px!important;
min-width:280px!important;
display:flex!important;
align-items:center!important;
gap:8px!important;
margin:0!important;
}
.lv-collections-inline-search label{
flex:1 1 auto!important;
min-width:0!important;
height:38px!important;
display:flex!important;
align-items:center!important;
gap:9px!important;
padding:0 12px!important;
border:1px solid rgba(226,232,240,.9)!important;
border-radius:8px!important;
background:#fff!important;
color:#94a3b8!important;
}
.lv-collections-inline-search input{
width:100%!important;
border:0!important;
outline:0!important;
background:transparent!important;
color:#111827!important;
font-size:14px!important;
font-weight:400!important;
}
.lv-collections-inline-search button{
height:38px!important;
padding:0 14px!important;
border:0!important;
border-radius:8px!important;
background:var(--color-primary)!important;
color:#fff!important;
font-weight:500!important;
cursor:pointer!important;
}
.lv-collections-inline-search.is-highlighted label{
border-color:rgba(56,103,255,.62)!important;
box-shadow:0 0 0 4px rgba(56,103,255,.11)!important;
}
.lv-collections-page .collections-grid{
width:100%!important;
grid-template-columns:repeat(auto-fill,minmax(320px,1fr))!important;
gap:24px!important;
margin-bottom:3rem!important;
}
.lv-collections-page .collection-card{
border-radius:12px!important;
}
html.lv-theme-dark .featured-files-page .lv-design-archive-title-card,
html.lv-theme-dark .lv-collections-page .lv-design-archive-title-card{
background:#0f172a!important;
border-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .lv-collections-inline-search label{
background:#111d33!important;
border-color:rgba(148,163,184,.16)!important;
color:#8fa2c4!important;
}
html.lv-theme-dark .lv-collections-inline-search input{
color:#eaf2ff!important;
}
body.lv-sidebar-open{
overflow:hidden!important;
}
.lv-collections-sidebar .lv-collections-sidebar-section h3{
display:flex!important;
align-items:center!important;
gap:8px!important;
}
.lv-collections-sidebar .lv-collections-sidebar-section h3 svg{
flex:0 0 auto!important;
}
.lv-collections-drawer-search{
display:grid!important;
gap:10px!important;
margin:0!important;
}
.lv-collections-drawer-search input{
width:100%!important;
height:40px!important;
border:1px solid rgba(226,232,240,.95)!important;
border-radius:8px!important;
background:#fff!important;
color:#111827!important;
padding:0 12px!important;
font-size:14px!important;
font-weight:400!important;
outline:0!important;
}
.lv-collections-drawer-search input:focus{
border-color:rgba(56,103,255,.62)!important;
box-shadow:0 0 0 4px rgba(56,103,255,.11)!important;
}
.lv-collections-drawer-search button,
.lv-collection-sort-option{
height:38px!important;
border-radius:8px!important;
border:1px solid rgba(226,232,240,.95)!important;
background:#fff!important;
color:#202938!important;
font-size:14px!important;
font-weight:500!important;
cursor:pointer!important;
}
.lv-collections-drawer-search button{
border-color:transparent!important;
background:var(--color-primary)!important;
color:#fff!important;
}
.lv-collections-sort-options{
display:grid!important;
gap:8px!important;
}
.lv-collection-sort-option{
text-align:left!important;
padding:0 12px!important;
}
.lv-collection-sort-option:hover,
.lv-collection-sort-option.is-active{
border-color:rgba(56,103,255,.38)!important;
background:rgba(56,103,255,.1)!important;
color:var(--color-primary)!important;
}
html.lv-theme-dark .lv-collections-drawer-search input,
html.lv-theme-dark .lv-collection-sort-option{
background:#111d33!important;
border-color:rgba(148,163,184,.16)!important;
color:#eaf2ff!important;
}
html.lv-theme-dark .lv-collection-sort-option:hover,
html.lv-theme-dark .lv-collection-sort-option.is-active{
background:rgba(75,128,255,.18)!important;
border-color:rgba(125,165,255,.34)!important;
color:#dce8ff!important;
}
.lv-archive-tab-loading main.site-main.lv-design-archive-page{
pointer-events:none!important;
}
main.site-main.lv-design-archive-page{
transition:opacity .18s ease, transform .18s ease!important;
}
main.site-main.lv-design-archive-page.lv-archive-tab-out{
opacity:.45!important;
transform:translateY(8px)!important;
}
main.site-main.lv-design-archive-page.lv-archive-tab-in{
animation:lvArchiveTabIn .24s ease both;
}
@keyframes lvArchiveTabIn{
from{opacity:.35;transform:translateY(8px)}
to{opacity:1;transform:translateY(0)}
}
/* v60 - stable single-file gallery, centered thumbs, and single-file modals */
.single-design-file .single-file-main-card .meta-info{
padding-bottom:18px!important;
margin-bottom:18px!important;
border-bottom:1px solid rgba(226,232,240,.78)!important;
}
.single-design-file .single-file-main-card .lv-single-info-grid{
gap:0!important;
margin:0 0 18px!important;
}
.single-design-file .single-file-main-card .lv-single-author-access-row{
min-height:56px!important;
}
.single-design-file .single-file-main-card .single-file-author-row strong{
font-weight:500!important;
}
.single-design-file .single-file-main-card .lv-single-code-format-row{
min-height:52px!important;
}
.single-design-file .single-file-main-card .lv-single-file-code{
color:#dc2626!important;
font-weight:600!important;
letter-spacing:.01em!important;
}
.single-design-file .lv-single-format-icons{
display:inline-flex!important;
align-items:center!important;
justify-content:flex-end!important;
gap:8px!important;
min-width:0!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon{
width:34px!important;
height:34px!important;
min-width:34px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:1px solid rgba(226,232,240,.82)!important;
border-radius:10px!important;
background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(248,250,252,.72))!important;
box-shadow:0 10px 22px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.48)!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon-inner,
.single-design-file .lv-single-format-icons .lv-format-icon-inner svg,
.single-design-file .lv-single-format-icons .lv-format-icon-inner img{
width:22px!important;
height:22px!important;
max-width:22px!important;
max-height:22px!important;
display:block!important;
object-fit:contain!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon-inner{
display:grid!important;
place-items:center!important;
line-height:0!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon-inner svg,
.single-design-file .lv-single-format-icons .lv-format-icon-inner img{
margin:auto!important;
transform:translateX(0)!important;
}
.single-design-file .lv-detail-suggested-grid.posts-grid{
display:block!important;
columns:160px auto!important;
column-width:160px!important;
column-count:auto!important;
column-gap:18px!important;
}
.single-design-file .lv-detail-suggested-grid.posts-grid .post-card{
break-inside:avoid!important;
margin:0 0 18px!important;
}
.single-design-file .lv-detail-suggested-grid.posts-grid .post-thumbnail-wrapper{
border-radius:8px!important;
}
html.lv-theme-dark .single-design-file .single-file-main-card .meta-info{
border-bottom-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .single-design-file .lv-single-format-icons .lv-format-icon{
background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.06))!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 12px 28px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.12)!important;
}
.single-design-file .lv-single-gallery{
display:grid!important;
justify-items:center!important;
gap:14px!important;
width:100%!important;
}
.single-design-file .lv-single-gallery-main{
width:min(100%,660px)!important;
height:auto!important;
aspect-ratio:var(--lv-gallery-ratio,3 / 4)!important;
min-height:0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
justify-content:safe center!important;
padding:0!important;
margin:0 auto!important;
overflow:hidden!important;
border:0!important;
border-radius:18px!important;
background:linear-gradient(180deg,#f8fafc,#fff)!important;
box-shadow:0 18px 44px rgba(15,23,42,.08)!important;
}
.single-design-file .lv-single-gallery-main::before{
display:none!important;
content:none!important;
}
.single-design-file .lv-single-gallery-main:hover .lv-single-gallery-image,
.single-design-file .lv-single-gallery-image{
width:100%!important;
height:100%!important;
max-width:100%!important;
max-height:100%!important;
object-fit:contain!important;
display:block!important;
flex:0 0 auto!important;
transform:none!important;
filter:none!important;
border-radius:18px!important;
transition:opacity .16s ease!important;
}
.single-design-file .lv-single-gallery-image.is-loading{
opacity:.72!important;
}
.single-design-file .lv-single-gallery-thumbs{
width:100%!important;
max-width:660px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:10px!important;
margin:0 auto!important;
padding:0 6px 8px!important;
overflow-x:auto!important;
overscroll-behavior-x:contain!important;
}
.single-design-file .lv-single-gallery-thumb{
flex:0 0 58px!important;
width:58px!important;
height:58px!important;
min-width:58px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:2px solid transparent!important;
border-radius:12px!important;
overflow:hidden!important;
background:rgba(255,255,255,.72)!important;
box-shadow:0 10px 24px rgba(15,23,42,.12)!important;
}
.single-design-file .lv-single-gallery-thumb.is-active{
border-color:#3867ff!important;
}
.single-design-file .lv-single-gallery-thumb img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
display:block!important;
transform:none!important;
}
.single-design-file .lv-single-gallery-action,
.single-design-file .lv-single-gallery-actions .post-favorite{
background:rgba(255,255,255,.72)!important;
border:1px solid rgba(255,255,255,.46)!important;
color:#111827!important;
backdrop-filter:blur(14px)!important;
-webkit-backdrop-filter:blur(14px)!important;
}
.single-design-file .lv-single-gallery-actions .post-favorite{
color:#ef4444!important;
}
.single-design-file .lv-single-gallery-actions .post-favorite svg{
stroke:currentColor!important;
fill:none!important;
}
.single-design-file .lv-single-gallery-action:hover,
.single-design-file .lv-single-gallery-actions .post-favorite:hover{
background:rgba(255,255,255,.9)!important;
color:#3867ff!important;
}
.single-design-file .lv-single-gallery-actions .post-favorite:hover,
.single-design-file .lv-single-gallery-actions .post-favorite.is-favorited:hover{
background:linear-gradient(135deg,rgba(239,68,68,.92),rgba(244,63,94,.74))!important;
color:#fff!important;
transform:scale(1.06)!important;
}
.single-design-file .lv-single-gallery-actions .post-favorite:hover svg,
.single-design-file .lv-single-gallery-actions .post-favorite.is-favorited:hover svg{
stroke:#fff!important;
fill:#fff!important;
}
.single-design-file .lv-single-gallery-actions .post-favorite.is-favorited{
opacity:1!important;
transform:none!important;
}
.single-design-file .lv-single-gallery-actions .post-favorite.is-favorited svg{
stroke:#ef4444!important;
fill:#ef4444!important;
}
.lv-single-modal[hidden]{
display:none!important;
}
.lv-single-modal{
position:fixed;
inset:0;
z-index:100000;
display:grid;
place-items:center;
padding:20px;
opacity:0;
pointer-events:none;
transition:opacity .18s ease;
}
.lv-single-modal.is-open{
opacity:1;
pointer-events:auto;
}
.lv-single-modal__shade{
position:absolute;
inset:0;
border:0;
background:rgba(15,23,42,.46);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
cursor:pointer;
}
.lv-single-modal__panel{
position:relative;
z-index:1;
width:min(100%,460px);
max-height:min(680px,calc(100vh - 36px));
overflow:auto;
border:1px solid rgba(226,232,240,.86);
border-radius:18px;
background:rgba(255,255,255,.96);
color:#111827;
box-shadow:0 28px 80px rgba(15,23,42,.26);
padding:24px;
transform:translateY(10px) scale(.98);
transition:transform .18s ease;
}
.lv-single-modal.is-open .lv-single-modal__panel{
transform:translateY(0) scale(1);
}
.lv-single-modal__close{
position:absolute;
top:14px;
right:14px;
width:34px;
height:34px;
display:grid;
place-items:center;
border:0;
border-radius:999px;
background:#f3f6fb;
color:#111827;
font-size:22px;
line-height:1;
cursor:pointer;
}
.lv-single-modal__panel h3{
margin:0 42px 8px 0;
color:#111827;
font-size:22px;
font-weight:600;
letter-spacing:0;
}
.lv-single-modal__panel p,
.lv-single-empty{
margin:0 0 16px;
color:#64748b;
font-size:14px;
font-weight:400;
line-height:1.5;
}
.lv-single-modal__form{
display:grid;
gap:14px;
}
.lv-single-modal__form label{
display:grid;
gap:7px;
color:#334155;
font-size:13px;
font-weight:500;
}
.lv-single-modal__form input,
.lv-single-modal__form select,
.lv-single-modal__form textarea{
width:100%;
border:1px solid rgba(226,232,240,.92);
border-radius:10px;
background:#fff;
color:#111827;
font:inherit;
font-weight:400;
padding:11px 12px;
outline:0;
}
.lv-single-modal__form textarea{
resize:vertical;
}
.lv-single-modal__form input:focus,
.lv-single-modal__form select:focus,
.lv-single-modal__form textarea:focus{
border-color:rgba(56,103,255,.62);
box-shadow:0 0 0 4px rgba(56,103,255,.1);
}
.lv-single-modal__form button{
min-height:44px;
border:0;
border-radius:10px;
background:var(--color-primary,#3867ff);
color:#fff;
font-weight:500;
cursor:pointer;
}
.lv-single-modal__form button:disabled,
.lv-single-collection-choice:disabled{
opacity:.58;
cursor:progress;
}
.lv-single-collection-list{
display:grid;
gap:8px;
margin:16px 0;
}
.lv-single-collection-choice{
width:100%;
min-height:44px;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
border:1px solid rgba(226,232,240,.92);
border-radius:10px;
background:#f8fafc;
color:#111827;
padding:0 12px;
cursor:pointer;
text-align:left;
}
.lv-single-collection-choice span{
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
font-weight:500;
}
.lv-single-collection-choice small{
color:#64748b;
font-size:12px;
font-weight:400;
}
.lv-single-share-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
margin-top:16px;
}
.lv-single-share-choice{
min-height:86px;
display:grid;
place-items:center;
gap:8px;
border:1px solid rgba(226,232,240,.92);
border-radius:14px;
background:linear-gradient(180deg,#fff,#f8fafc);
color:#111827;
cursor:pointer;
font-size:13px;
font-weight:500;
transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.lv-single-share-choice:hover{
transform:translateY(-2px);
border-color:rgba(56,103,255,.34);
box-shadow:0 14px 28px rgba(15,23,42,.09);
}
.lv-single-share-icon{
width:38px;
height:38px;
display:grid;
place-items:center;
border-radius:12px;
background:rgba(56,103,255,.08);
color:var(--color-primary,#3867ff);
}
.lv-single-share-icon svg{
width:22px;
height:22px;
display:block;
}
.lv-single-modal__dashboard{
display:flex;
justify-content:center;
width:100%;
margin-top:14px;
color:var(--color-primary,#3867ff);
font-size:14px;
font-weight:500;
text-decoration:none;
}
.lv-single-toast{
position:fixed;
left:50%;
bottom:26px;
z-index:100001;
max-width:min(92vw,420px);
transform:translate(-50%,14px);
opacity:0;
pointer-events:none;
border:1px solid rgba(255,255,255,.38);
border-radius:999px;
background:rgba(17,24,39,.88);
color:#fff;
box-shadow:0 18px 44px rgba(15,23,42,.18);
padding:11px 18px;
font-size:14px;
font-weight:400;
transition:opacity .18s ease, transform .18s ease;
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);
}
.lv-single-toast.is-visible{
opacity:1;
transform:translate(-50%,0);
}
html.lv-theme-dark .single-design-file .lv-single-gallery-main{
background:linear-gradient(180deg,#111d33,#0f172a)!important;
}
html.lv-theme-dark .single-design-file .lv-single-gallery-thumb,
html.lv-theme-dark .single-design-file .lv-single-gallery-action,
html.lv-theme-dark .single-design-file .lv-single-gallery-actions .post-favorite{
background:rgba(17,29,51,.72)!important;
border-color:rgba(148,163,184,.18)!important;
color:#eaf2ff!important;
}
html.lv-theme-dark .single-design-file .lv-single-gallery-actions .post-favorite{
color:#fb7185!important;
}
html.lv-theme-dark .single-design-file .lv-single-gallery-actions .post-favorite.is-favorited svg{
stroke:#fb7185!important;
fill:#fb7185!important;
}
html.lv-theme-dark .single-design-file .lv-single-gallery-actions .post-favorite:hover,
html.lv-theme-dark .single-design-file .lv-single-gallery-actions .post-favorite.is-favorited:hover{
color:#fff!important;
}
html.lv-theme-dark .lv-single-modal__panel{
background:rgba(15,23,42,.96);
border-color:rgba(148,163,184,.18);
color:#eaf2ff;
}
html.lv-theme-dark .lv-single-modal__panel h3,
html.lv-theme-dark .lv-single-modal__form label,
html.lv-theme-dark .lv-single-collection-choice{
color:#f3f7ff;
}
html.lv-theme-dark .lv-single-modal__panel p,
html.lv-theme-dark .lv-single-empty,
html.lv-theme-dark .lv-single-collection-choice small{
color:#a9b8d4;
}
html.lv-theme-dark .lv-single-modal__close,
html.lv-theme-dark .lv-single-modal__form input,
html.lv-theme-dark .lv-single-modal__form select,
html.lv-theme-dark .lv-single-modal__form textarea,
html.lv-theme-dark .lv-single-collection-choice,
html.lv-theme-dark .lv-single-share-choice{
background:#111d33;
border-color:rgba(148,163,184,.18);
color:#eaf2ff;
}
html.lv-theme-dark .lv-single-share-icon{
background:rgba(75,128,255,.16);
color:#dce8ff;
}
@media (max-width:768px){
.single-design-file .lv-single-gallery-main{
width:100%!important;
height:auto!important;
min-height:0!important;
border-radius:16px!important;
}
.single-design-file .lv-single-gallery-image{
border-radius:16px!important;
}
.single-design-file .lv-single-gallery-thumbs{
justify-content:center!important;
justify-content:safe center!important;
max-width:100%!important;
}
.single-design-file .lv-single-gallery-thumb{
flex-basis:52px!important;
width:52px!important;
height:52px!important;
min-width:52px!important;
}
.lv-single-modal{
align-items:end;
padding:12px;
}
.lv-single-modal__panel{
width:100%;
max-height:calc(100vh - 24px);
border-radius:20px 20px 14px 14px;
padding:22px 18px;
transform:translateY(24px);
}
.lv-single-share-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
gap:8px;
}
.lv-single-share-choice{
min-height:78px;
font-size:12px;
}
}
@media (max-width:768px){
.featured-files-page.lv-design-archive-page .container,
.lv-collections-page.lv-design-archive-page .container{
padding-left:14px!important;
padding-right:14px!important;
}
.lv-collections-page .lv-collections-filter-row{
align-items:flex-start!important;
flex-direction:column!important;
}
.lv-collections-inline-search{
width:100%!important;
min-width:0!important;
flex:1 1 auto!important;
}
.lv-collections-page .collections-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:12px!important;
}
}
/* v61: single file modal polish and masonry follow-up sections */
.single-design-file .lv-single-format-icons .lv-format-icon{
box-sizing:border-box!important;
display:inline-grid!important;
place-items:center!important;
line-height:0!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon-inner{
display:grid!important;
place-items:center!important;
overflow:visible!important;
line-height:0!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon-inner > *{
grid-area:1 / 1!important;
}
.single-design-file .lv-single-format-icons .lv-format-icon-inner svg,
.single-design-file .lv-single-format-icons .lv-format-icon-inner img{
position:static!important;
inset:auto!important;
display:block!important;
margin:auto!important;
transform:none!important;
object-position:center!important;
}
.lv-single-modal{
isolation:isolate!important;
}
.lv-single-modal__shade{
background:rgba(15,23,42,.38)!important;
backdrop-filter:blur(18px) saturate(125%)!important;
-webkit-backdrop-filter:blur(18px) saturate(125%)!important;
}
.lv-single-modal__panel{
background:rgba(255,255,255,.88)!important;
backdrop-filter:blur(22px) saturate(125%)!important;
-webkit-backdrop-filter:blur(22px) saturate(125%)!important;
}
.lv-single-modal__dashboard{
width:100%!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
text-align:center!important;
margin-left:auto!important;
margin-right:auto!important;
}
.single-design-file > .related-posts-section,
.single-design-file > .recently-viewed-section,
.single-design-file > .recently-viewed-section .recently-viewed-section{
background:transparent!important;
border-top:0!important;
box-shadow:none!important;
}
.single-design-file > .related-posts-section{
padding-top:0!important;
}
.single-design-file > .recently-viewed-section{
padding-top:0!important;
}
.single-design-file .related-posts-grid.larxvo-single-product-grid,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
width:100%!important;
display:grid!important;
grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important;
gap:18px!important;
grid-auto-rows:auto!important;
grid-auto-flow:row!important;
columns:auto!important;
column-width:auto!important;
column-count:auto!important;
column-gap:0!important;
align-items:start!important;
justify-items:stretch!important;
}
.single-design-file .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file .related-posts-grid.larxvo-single-product-grid > article,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .post-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .design-file-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > article{
width:100%!important;
max-width:100%!important;
display:block!important;
break-inside:auto!important;
page-break-inside:auto!important;
margin:0!important;
vertical-align:top!important;
}
.single-design-file .related-posts-grid.larxvo-single-product-grid.is-larxvo-masonry,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid.is-larxvo-masonry{
grid-auto-rows:10px!important;
grid-auto-flow:dense!important;
}
.single-design-file .related-posts-grid.larxvo-single-product-grid.is-larxvo-masonry > .post-card,
.single-design-file .related-posts-grid.larxvo-single-product-grid.is-larxvo-masonry > .design-file-card,
.single-design-file .related-posts-grid.larxvo-single-product-grid.is-larxvo-masonry > article,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid.is-larxvo-masonry > .post-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid.is-larxvo-masonry > .design-file-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid.is-larxvo-masonry > article{
align-self:start!important;
}
html.lv-theme-dark .lv-single-modal__panel{
background:rgba(15,23,42,.88)!important;
}
@media (max-width:1180px){
.single-design-file .related-posts-grid.larxvo-single-product-grid,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid{
grid-template-columns:repeat(auto-fill,minmax(140px,1fr))!important;
gap:16px!important;
}
}
@media (max-width:640px){
.single-design-file .related-posts-grid.larxvo-single-product-grid,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:14px!important;
}
}
/* v62: remove same-category block and normalize recently viewed full-width grid */
.single-design-file > .related-posts-section{
display:none!important;
}
.single-design-file > .recently-viewed-section{
width:100%!important;
margin-top:3rem!important;
padding:0 0 72px!important;
border-top:0!important;
background:transparent!important;
}
.single-design-file > .recently-viewed-section > div{
width:100%!important;
max-width:1600px!important;
margin:0 auto!important;
padding-left:32px!important;
padding-right:32px!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-section{
margin:0!important;
padding:0!important;
background:transparent!important;
}
.single-design-file > .recently-viewed-section .section-title{
margin:0 0 24px!important;
color:var(--color-text,#111827)!important;
font-size:1.5rem!important;
font-weight:600!important;
line-height:1.25!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
width:100%!important;
display:grid!important;
grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;
gap:24px!important;
grid-auto-rows:auto!important;
grid-auto-flow:row!important;
columns:auto!important;
column-count:auto!important;
column-width:auto!important;
column-gap:0!important;
align-items:start!important;
justify-items:stretch!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .post-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .design-file-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > article{
width:100%!important;
max-width:100%!important;
display:block!important;
grid-row-end:auto!important;
margin:0!important;
break-inside:auto!important;
page-break-inside:auto!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid .post-thumbnail-wrapper{
width:100%!important;
}
@media (max-width:1280px){
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
grid-template-columns:repeat(auto-fill,minmax(164px,1fr))!important;
gap:20px!important;
}
}
@media (max-width:768px){
.single-design-file > .recently-viewed-section{
margin-top:2rem!important;
padding-bottom:48px!important;
}
.single-design-file > .recently-viewed-section > div{
padding-left:14px!important;
padding-right:14px!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:14px!important;
}
}
/* v63: recently viewed uses archive-style full-width masonry spacing */
.single-design-file > .recently-viewed-section{
width:100%!important;
max-width:none!important;
margin:3rem 0 0!important;
padding:0 0 72px!important;
}
.single-design-file > .recently-viewed-section > div{
width:100%!important;
max-width:100%!important;
padding-left:40px!important;
padding-right:40px!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-container{
width:100%!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
display:block!important;
width:100%!important;
max-width:100%!important;
columns:178px auto!important;
column-width:178px!important;
column-count:auto!important;
column-gap:18px!important;
gap:0!important;
grid-template-columns:none!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .post-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .design-file-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > article{
display:inline-block!important;
width:100%!important;
max-width:100%!important;
margin:0 0 18px!important;
break-inside:avoid!important;
page-break-inside:avoid!important;
vertical-align:top!important;
}
@media (max-width:1180px){
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
columns:160px auto!important;
column-width:160px!important;
column-gap:16px!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .post-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .design-file-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > article{
margin-bottom:16px!important;
}
}
@media (max-width:768px){
.single-design-file > .recently-viewed-section > div{
padding-left:14px!important;
padding-right:14px!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid:not(:empty){
columns:2!important;
column-count:2!important;
column-width:auto!important;
column-gap:14px!important;
}
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .post-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > .design-file-card,
.single-design-file > .recently-viewed-section .recently-viewed-grid.posts-grid > article{
margin-bottom:14px!important;
}
}
/* v64: single page bottom section uses related category, archive-style masonry */
.single-design-file > .recently-viewed-section{
display:none!important;
}
.single-design-file > .related-posts-section{
display:block!important;
width:100%!important;
max-width:none!important;
margin:3rem 0 0!important;
padding:0 0 72px!important;
border-top:0!important;
background:transparent!important;
box-shadow:none!important;
}
.single-design-file > .related-posts-section > div{
width:100%!important;
max-width:100%!important;
margin:0 auto!important;
padding-left:40px!important;
padding-right:40px!important;
}
.single-design-file > .related-posts-section h3{
margin:0 0 24px!important;
color:var(--color-text,#111827)!important;
font-size:1.5rem!important;
font-weight:600!important;
line-height:1.25!important;
letter-spacing:0!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
display:block!important;
width:100%!important;
max-width:100%!important;
columns:178px auto!important;
column-width:178px!important;
column-count:auto!important;
column-gap:18px!important;
gap:0!important;
grid-template-columns:none!important;
grid-auto-rows:auto!important;
align-items:initial!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
display:inline-block!important;
width:100%!important;
max-width:100%!important;
margin:0 0 18px!important;
break-inside:avoid!important;
page-break-inside:avoid!important;
vertical-align:top!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid .post-thumbnail-wrapper{
width:100%!important;
}
@media (max-width:1180px){
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:160px auto!important;
column-width:160px!important;
column-gap:16px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:16px!important;
}
}
@media (max-width:768px){
.single-design-file > .related-posts-section{
margin-top:2rem!important;
padding-bottom:48px!important;
}
.single-design-file > .related-posts-section > div{
padding-left:14px!important;
padding-right:14px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:2!important;
column-count:2!important;
column-width:auto!important;
column-gap:14px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:14px!important;
}
}
/* v65: keep related category aligned with the single layout, 8 cards per row on desktop */
.single-design-file > .related-posts-section > div{
box-sizing:border-box!important;
max-width:1760px!important;
padding-left:40px!important;
padding-right:40px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:auto 8!important;
column-count:8!important;
column-width:auto!important;
column-gap:24px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:24px!important;
}
@media (max-width:1439px){
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:auto 6!important;
column-count:6!important;
column-gap:22px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:22px!important;
}
}
@media (max-width:1180px){
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:auto 5!important;
column-count:5!important;
column-gap:20px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:20px!important;
}
}
@media (max-width:900px){
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:auto 4!important;
column-count:4!important;
column-gap:18px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:18px!important;
}
}
@media (max-width:768px){
.single-design-file > .related-posts-section > div{
padding-left:14px!important;
padding-right:14px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid{
columns:auto 2!important;
column-count:2!important;
column-gap:14px!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .post-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > .design-file-card,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid > article{
margin-bottom:14px!important;
}
}
/* v66: mobile account sheet must stay compact, blurred, and icon-safe */
.lv-account-menu .lv-plan-title svg,
.lv-account-menu .dropdown-item svg{
display:block!important;
flex:0 0 auto!important;
width:18px!important;
height:18px!important;
max-width:18px!important;
max-height:18px!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.8!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-account-menu .lv-plan-title svg{
width:20px!important;
height:20px!important;
max-width:20px!important;
max-height:20px!important;
color:#9bb2dc!important;
fill:currentColor!important;
stroke:currentColor!important;
}
@media (max-width:768px){
.lv-account-dropdown{
position:static!important;
}
.lv-account-sheet-backdrop{
position:fixed!important;
inset:0!important;
z-index:1690!important;
display:none!important;
background:rgba(15,23,42,.52)!important;
opacity:0!important;
visibility:hidden!important;
backdrop-filter:blur(10px) saturate(130%)!important;
-webkit-backdrop-filter:blur(10px) saturate(130%)!important;
transition:opacity .2s ease, visibility .2s ease!important;
}
body.lv-account-sheet-open .lv-account-sheet-backdrop{
display:block!important;
opacity:1!important;
visibility:visible!important;
}
.lv-account-menu{
box-sizing:border-box!important;
position:fixed!important;
inset:auto 0 0 0!important;
z-index:1700!important;
width:100vw!important;
min-width:0!important;
max-width:none!important;
max-height:min(82dvh,680px)!important;
margin:0!important;
padding:18px 16px calc(18px + env(safe-area-inset-bottom))!important;
border:1px solid rgba(255,255,255,.62)!important;
border-bottom:0!important;
border-radius:22px 22px 0 0!important;
background:rgba(255,255,255,.94)!important;
box-shadow:0 -24px 70px rgba(15,23,42,.24)!important;
overflow-y:auto!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translate3d(0,105%,0)!important;
transition:transform .24s ease, opacity .18s ease, visibility .18s ease!important;
backdrop-filter:blur(18px) saturate(145%)!important;
-webkit-backdrop-filter:blur(18px) saturate(145%)!important;
}
.lv-account-menu::before{
display:none!important;
}
.lv-account-menu.is-open{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translate3d(0,0,0)!important;
}
.lv-account-menu *,
.lv-account-menu *::before,
.lv-account-menu *::after{
box-sizing:border-box!important;
}
.lv-account-profile{
display:flex!important;
align-items:center!important;
gap:12px!important;
min-width:0!important;
margin:0 0 14px!important;
}
.lv-account-avatar{
width:48px!important;
height:48px!important;
min-width:48px!important;
border-radius:999px!important;
object-fit:cover!important;
}
.lv-account-profile strong{
display:block!important;
max-width:100%!important;
overflow:hidden!important;
color:#111827!important;
font-size:16px!important;
line-height:1.25!important;
font-weight:500!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-profile span{
display:block!important;
margin-top:4px!important;
color:#64748b!important;
font-size:12px!important;
line-height:1.35!important;
font-weight:400!important;
}
.lv-account-stats{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:8px!important;
margin:0 0 14px!important;
text-align:center!important;
}
.lv-account-stats strong{
display:block!important;
overflow:hidden!important;
color:#111827!important;
font-size:15px!important;
line-height:1.2!important;
font-weight:500!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-stats span{
display:block!important;
margin-top:4px!important;
overflow:hidden!important;
color:#64748b!important;
font-size:12px!important;
line-height:1.25!important;
font-weight:400!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-plan{
margin:0 0 14px!important;
padding:12px!important;
border-radius:18px!important;
background:rgba(226,234,250,.84)!important;
}
.lv-plan-title{
display:flex!important;
align-items:center!important;
gap:8px!important;
min-width:0!important;
margin:0 0 10px!important;
color:#334155!important;
}
.lv-plan-title strong{
min-width:0!important;
overflow:hidden!important;
color:#334155!important;
font-size:15px!important;
line-height:1.25!important;
font-weight:500!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-plan-card{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
align-items:center!important;
gap:12px!important;
padding:14px 12px!important;
border-radius:14px!important;
background:rgba(255,255,255,.88)!important;
overflow:hidden!important;
}
.lv-plan-card strong{
display:block!important;
margin:0 0 6px!important;
color:#111827!important;
font-size:14px!important;
line-height:1.25!important;
font-weight:500!important;
}
.lv-plan-card p{
margin:0!important;
color:#64748b!important;
font-size:12px!important;
line-height:1.45!important;
font-weight:400!important;
}
.lv-plan-card a{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-width:max-content!important;
min-height:34px!important;
padding:0 13px!important;
border-radius:999px!important;
background:#f8d99b!important;
color:#8a5b14!important;
font-size:13px!important;
line-height:1!important;
font-weight:500!important;
text-decoration:none!important;
white-space:nowrap!important;
}
.lv-account-menu .dropdown-item{
min-height:42px!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
padding:9px 4px!important;
border-radius:12px!important;
color:#273142!important;
font-size:14px!important;
line-height:1.25!important;
font-weight:400!important;
text-decoration:none!important;
background:transparent!important;
white-space:normal!important;
}
.lv-account-menu .dropdown-item:hover,
.lv-account-menu .dropdown-item:focus-visible{
background:rgba(59,103,246,.08)!important;
color:#1d4ed8!important;
}
.lv-account-menu .dropdown-divider{
height:1px!important;
margin:10px 0!important;
background:rgba(148,163,184,.18)!important;
}
.lv-account-menu svg{
max-width:22px!important;
max-height:22px!important;
}
html.lv-theme-dark .lv-account-sheet-backdrop{
background:rgba(2,6,23,.64)!important;
}
html.lv-theme-dark .lv-account-menu{
background:rgba(15,23,42,.94)!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 -24px 70px rgba(0,0,0,.34)!important;
}
html.lv-theme-dark .lv-account-profile strong,
html.lv-theme-dark .lv-account-stats strong,
html.lv-theme-dark .lv-plan-title strong,
html.lv-theme-dark .lv-plan-card strong{
color:#edf3ff!important;
}
html.lv-theme-dark .lv-account-profile span,
html.lv-theme-dark .lv-account-stats span,
html.lv-theme-dark .lv-plan-card p{
color:#a9b8d4!important;
}
html.lv-theme-dark .lv-account-plan{
background:rgba(30,41,59,.86)!important;
}
html.lv-theme-dark .lv-plan-card{
background:rgba(15,23,42,.86)!important;
}
html.lv-theme-dark .lv-account-menu .dropdown-item{
color:#dce7ff!important;
}
}
/* v67: mobile related card title scale + account sheet stacking fix */
@media (max-width:768px){
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid .hover-overlay{
padding:10px!important;
align-items:flex-end!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid h3.overlay-title,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid .overlay-title{
margin:0!important;
max-width:100%!important;
color:#fff!important;
font-size:13px!important;
line-height:1.25!important;
font-weight:500!important;
letter-spacing:0!important;
}
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid .overlay-title a{
display:-webkit-box!important;
overflow:hidden!important;
color:#fff!important;
text-decoration:none!important;
-webkit-box-orient:vertical!important;
-webkit-line-clamp:2!important;
}
.top-menu,
.top-menu .container{
overflow:visible!important;
}
body.lv-account-sheet-open .top-menu{
z-index:1710!important;
}
.lv-account-sheet-backdrop{
z-index:1700!important;
}
.lv-account-menu{
z-index:1711!important;
}
}
@media (max-width:420px){
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid h3.overlay-title,
.single-design-file > .related-posts-section .related-posts-grid.larxvo-single-product-grid .overlay-title{
font-size:12px!important;
line-height:1.22!important;
}
}
/* v68: account sheet is ported to body on mobile to avoid fixed-header clipping */
@media (max-width:768px){
body > .lv-account-menu[data-lv-account-ported="true"]{
position:fixed!important;
left:0!important;
right:0!important;
bottom:0!important;
top:auto!important;
z-index:100002!important;
width:100vw!important;
min-width:0!important;
max-width:none!important;
max-height:min(82dvh,680px)!important;
margin:0!important;
transform:translate3d(0,105%,0)!important;
}
body > .lv-account-menu[data-lv-account-ported="true"].is-open{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translate3d(0,0,0)!important;
}
body.lv-account-sheet-open .lv-account-sheet-backdrop{
z-index:100001!important;
}
}
/* v69: real file-format filter with equal SVG icons */
.lv-format-filter-note{
margin:-2px 0 12px!important;
color:#64748b!important;
font-size:12px!important;
line-height:1.45!important;
font-weight:400!important;
}
.lv-format-filter-list{
display:grid!important;
grid-template-columns:1fr!important;
gap:7px!important;
}
.lv-format-filter-option{
position:relative!important;
display:block!important;
}
.lv-format-filter-option input[type="checkbox"]{
position:absolute!important;
inset:0!important;
width:100%!important;
height:100%!important;
margin:0!important;
opacity:0!important;
cursor:pointer!important;
}
.lv-format-filter-option input[type="checkbox"]::after{
display:none!important;
}
.lv-format-filter-option label{
min-height:42px!important;
display:grid!important;
grid-template-columns:32px minmax(0,1fr) auto!important;
align-items:center!important;
gap:10px!important;
padding:7px 10px 7px 8px!important;
border:1px solid rgba(203,213,225,.7)!important;
border-radius:12px!important;
background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,250,252,.76))!important;
color:#273142!important;
cursor:pointer!important;
box-shadow:0 6px 18px rgba(15,23,42,.035), inset 0 1px 0 rgba(255,255,255,.72)!important;
transition:background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, color .18s ease!important;
}
.lv-format-filter-option label:hover,
.lv-format-filter-option input[type="checkbox"]:hover + label,
.lv-format-filter-option input[type="checkbox"]:focus-visible + label{
border-color:rgba(59,103,246,.45)!important;
background:linear-gradient(180deg,#fff,rgba(239,246,255,.88))!important;
color:#1d4ed8!important;
box-shadow:0 10px 24px rgba(59,103,246,.10), inset 0 1px 0 rgba(255,255,255,.86)!important;
transform:translateY(-1px)!important;
}
.lv-format-filter-option input[type="checkbox"]:checked + label{
border-color:rgba(59,103,246,.72)!important;
background:linear-gradient(135deg,rgba(59,103,246,.13),rgba(74,163,255,.10))!important;
color:#1d4ed8!important;
box-shadow:0 12px 26px rgba(59,103,246,.13), inset 0 0 0 1px rgba(255,255,255,.72)!important;
}
.lv-format-filter-option .lv-format-icon.is-filter-format{
width:32px!important;
height:32px!important;
min-width:32px!important;
border-radius:9px!important;
display:grid!important;
place-items:center!important;
background:rgba(255,255,255,.82)!important;
border:1px solid rgba(203,213,225,.58)!important;
box-shadow:0 6px 14px rgba(15,23,42,.06)!important;
}
.lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner,
.lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner svg,
.lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner img{
width:22px!important;
height:22px!important;
max-width:22px!important;
max-height:22px!important;
display:block!important;
}
.lv-format-filter-option .lv-format-icon.is-filter-format:hover::after,
.lv-format-filter-option .lv-format-icon.is-filter-format:focus-visible::after{
display:none!important;
}
.lv-format-filter-name{
min-width:0!important;
overflow:hidden!important;
color:inherit!important;
font-size:14px!important;
line-height:1.2!important;
font-weight:400!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-format-filter-count{
min-width:24px!important;
height:22px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
padding:0 7px!important;
border-radius:999px!important;
background:rgba(226,232,240,.74)!important;
color:#64748b!important;
font-size:12px!important;
line-height:1!important;
font-weight:500!important;
}
.lv-format-filter-option input[type="checkbox"]:checked + label .lv-format-filter-count{
background:rgba(59,103,246,.16)!important;
color:#315fe7!important;
}
html.lv-theme-dark .lv-format-filter-note{
color:#93a4c4!important;
}
html.lv-theme-dark .lv-format-filter-option label{
background:linear-gradient(180deg,rgba(17,28,49,.92),rgba(15,23,42,.86))!important;
border-color:rgba(148,163,184,.22)!important;
color:#dbe7ff!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 8px 18px rgba(0,0,0,.16)!important;
}
html.lv-theme-dark .lv-format-filter-option label:hover,
html.lv-theme-dark .lv-format-filter-option input[type="checkbox"]:hover + label,
html.lv-theme-dark .lv-format-filter-option input[type="checkbox"]:focus-visible + label{
background:linear-gradient(180deg,rgba(30,44,72,.96),rgba(21,34,58,.9))!important;
border-color:rgba(122,162,255,.42)!important;
color:#fff!important;
}
html.lv-theme-dark .lv-format-filter-option input[type="checkbox"]:checked + label{
background:linear-gradient(135deg,rgba(59,103,246,.28),rgba(74,163,255,.14))!important;
border-color:rgba(122,162,255,.58)!important;
color:#fff!important;
}
html.lv-theme-dark .lv-format-filter-option .lv-format-icon.is-filter-format{
background:rgba(15,23,42,.84)!important;
border-color:rgba(148,163,184,.22)!important;
box-shadow:0 8px 18px rgba(0,0,0,.18)!important;
}
html.lv-theme-dark .lv-format-filter-count{
background:rgba(30,41,59,.92)!important;
color:#a9b8d4!important;
}
@media (max-width:768px){
.lv-format-filter-note{
font-size:12px!important;
}
.lv-format-filter-list{
gap:8px!important;
}
.lv-format-filter-option label{
min-height:44px!important;
}
}
/* v70: front-end format filter is icon-only, data-driven, no counts */
.sidebar .filter-section{
overflow:visible!important;
}
.lv-format-filter-note,
.lv-format-filter-count{
display:none!important;
}
.lv-format-filter-list{
display:grid!important;
grid-template-columns:repeat(5,minmax(0,1fr))!important;
gap:9px!important;
overflow:visible!important;
}
.lv-format-filter-option{
position:relative!important;
width:100%!important;
aspect-ratio:1!important;
min-width:0!important;
}
.lv-format-filter-option input[type="checkbox"]{
position:absolute!important;
inset:0!important;
z-index:2!important;
width:100%!important;
height:100%!important;
margin:0!important;
opacity:0!important;
cursor:pointer!important;
}
.lv-format-filter-option label{
position:relative!important;
width:100%!important;
height:100%!important;
min-height:0!important;
display:grid!important;
grid-template-columns:1fr!important;
place-items:center!important;
gap:0!important;
padding:0!important;
border:1px solid rgba(203,213,225,.72)!important;
border-radius:8px!important;
background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(248,250,252,.76))!important;
box-shadow:0 8px 20px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.78)!important;
transform:none!important;
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.lv-format-filter-option label::after{
content:attr(data-format-label);
position:absolute!important;
left:50%!important;
top:calc(100% + 8px)!important;
z-index:20!important;
width:max-content!important;
max-width:160px!important;
padding:5px 8px!important;
border-radius:7px!important;
background:rgba(15,23,42,.94)!important;
color:#fff!important;
font-size:12px!important;
line-height:1.1!important;
font-weight:400!important;
white-space:nowrap!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translate(-50%,-4px)!important;
box-shadow:0 10px 22px rgba(15,23,42,.22)!important;
transition:opacity .14s ease,visibility .14s ease,transform .14s ease!important;
}
.lv-format-filter-option label:hover::after,
.lv-format-filter-option input[type="checkbox"]:hover + label::after,
.lv-format-filter-option input[type="checkbox"]:focus-visible + label::after{
opacity:1!important;
visibility:visible!important;
transform:translate(-50%,0)!important;
}
.lv-format-filter-option label:hover,
.lv-format-filter-option input[type="checkbox"]:hover + label,
.lv-format-filter-option input[type="checkbox"]:focus-visible + label{
border-color:rgba(59,103,246,.48)!important;
background:linear-gradient(180deg,#fff,rgba(239,246,255,.9))!important;
box-shadow:0 12px 26px rgba(59,103,246,.12), inset 0 1px 0 rgba(255,255,255,.88)!important;
transform:translateY(-1px)!important;
}
.lv-format-filter-option input[type="checkbox"]:checked + label{
border-color:rgba(59,103,246,.82)!important;
background:linear-gradient(135deg,rgba(59,103,246,.16),rgba(74,163,255,.10))!important;
box-shadow:0 12px 26px rgba(59,103,246,.16), inset 0 0 0 1px rgba(255,255,255,.72)!important;
}
.lv-format-filter-option input[type="checkbox"]:checked + label::before{
content:""!important;
position:absolute!important;
right:5px!important;
top:5px!important;
width:7px!important;
height:7px!important;
border-radius:50%!important;
background:#3b67f6!important;
box-shadow:0 0 0 3px rgba(59,103,246,.14)!important;
}
.lv-format-filter-name{
position:absolute!important;
width:1px!important;
height:1px!important;
margin:-1px!important;
padding:0!important;
overflow:hidden!important;
clip:rect(0 0 0 0)!important;
clip-path:inset(50%)!important;
white-space:nowrap!important;
}
.lv-format-filter-option .lv-format-icon.is-filter-format{
width:30px!important;
height:30px!important;
min-width:30px!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
}
.lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner,
.lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner svg,
.lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner img{
width:25px!important;
height:25px!important;
max-width:25px!important;
max-height:25px!important;
}
.sidebar .filter-options-scrollable{
max-height:none!important;
overflow:visible!important;
padding-right:0!important;
}
html.lv-theme-dark .lv-format-filter-option label{
background:linear-gradient(180deg,rgba(17,28,49,.92),rgba(15,23,42,.86))!important;
border-color:rgba(148,163,184,.24)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 18px rgba(0,0,0,.16)!important;
}
html.lv-theme-dark .lv-format-filter-option label:hover,
html.lv-theme-dark .lv-format-filter-option input[type="checkbox"]:hover + label,
html.lv-theme-dark .lv-format-filter-option input[type="checkbox"]:focus-visible + label{
background:linear-gradient(180deg,rgba(30,44,72,.96),rgba(21,34,58,.9))!important;
border-color:rgba(122,162,255,.46)!important;
}
html.lv-theme-dark .lv-format-filter-option input[type="checkbox"]:checked + label{
background:linear-gradient(135deg,rgba(59,103,246,.30),rgba(74,163,255,.15))!important;
border-color:rgba(122,162,255,.62)!important;
}
@media (max-width:768px){
.lv-format-filter-list{
grid-template-columns:repeat(6,minmax(0,1fr))!important;
gap:8px!important;
}
}
/* v71: resource filter uses editable FREE/VIP icons and floats above the fixed header */
@media (min-width:769px){
.lv-discover-section .sidebar,
.lv-design-archive-page .sidebar{
z-index:2600!important;
}
.lv-discover-section .sidebar-overlay,
.lv-design-archive-page .sidebar-overlay{
z-index:2500!important;
}
}
.lv-resource-filter-list{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,88px))!important;
justify-content:start!important;
align-items:center!important;
gap:10px!important;
overflow:visible!important;
}
.lv-resource-filter-option{
position:relative!important;
width:88px!important;
height:42px!important;
min-width:0!important;
margin:0!important;
}
.lv-resource-filter-option input[type="checkbox"]{
position:absolute!important;
inset:0!important;
z-index:2!important;
width:100%!important;
height:100%!important;
margin:0!important;
opacity:0!important;
cursor:pointer!important;
}
.lv-resource-filter-option label{
position:relative!important;
width:88px!important;
height:42px!important;
min-height:42px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
padding:0 12px!important;
border:1px solid rgba(203,213,225,.72)!important;
border-radius:14px!important;
background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,250,252,.72))!important;
color:#1f2937!important;
font-size:0!important;
line-height:0!important;
box-shadow:0 12px 30px rgba(15,23,42,.07), inset 0 1px 0 rgba(255,255,255,.82)!important;
backdrop-filter:blur(14px)!important;
-webkit-backdrop-filter:blur(14px)!important;
transform:none!important;
transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease!important;
}
.lv-resource-filter-icon{
width:20px!important;
height:20px!important;
display:inline-grid!important;
place-items:center!important;
flex:0 0 20px!important;
color:inherit!important;
line-height:1!important;
}
.lv-resource-filter-icon .lv-icon-svg,
.lv-resource-filter-icon .lv-nav-custom-svg,
.lv-resource-filter-icon .lv-nav-custom-svg svg{
width:20px!important;
height:20px!important;
display:block!important;
}
.lv-resource-filter-name{
position:static!important;
width:auto!important;
height:auto!important;
margin:0!important;
padding:0!important;
overflow:visible!important;
clip:auto!important;
clip-path:none!important;
color:inherit!important;
font-size:13px!important;
line-height:1!important;
font-weight:500!important;
letter-spacing:0!important;
white-space:nowrap!important;
}
.lv-resource-filter-option label::after{
display:none!important;
content:none!important;
}
.lv-resource-filter-option label:hover::after,
.lv-resource-filter-option input[type="checkbox"]:hover + label::after,
.lv-resource-filter-option input[type="checkbox"]:focus-visible + label::after{
display:none!important;
}
.lv-resource-filter-free label{
color:#16a34a!important;
}
.lv-resource-filter-vip label{
color:#f59e0b!important;
}
.lv-resource-filter-option label:hover,
.lv-resource-filter-option input[type="checkbox"]:hover + label,
.lv-resource-filter-option input[type="checkbox"]:focus-visible + label{
border-color:rgba(59,103,246,.48)!important;
background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(239,246,255,.88))!important;
box-shadow:0 16px 34px rgba(59,103,246,.13), inset 0 1px 0 rgba(255,255,255,.9)!important;
transform:translateY(-1px)!important;
}
.lv-resource-filter-option input[type="checkbox"]:checked + label{
border-color:rgba(59,103,246,.82)!important;
background:linear-gradient(135deg,rgba(59,103,246,.16),rgba(74,163,255,.10))!important;
color:#3b67f6!important;
box-shadow:0 16px 34px rgba(59,103,246,.16), inset 0 0 0 1px rgba(255,255,255,.78)!important;
}
.lv-resource-filter-option input[type="checkbox"]:checked + label::before{
content:""!important;
position:absolute!important;
right:6px!important;
top:6px!important;
width:7px!important;
height:7px!important;
border-radius:999px!important;
background:#3b67f6!important;
box-shadow:0 0 0 3px rgba(59,103,246,.14)!important;
}
html.lv-theme-dark .lv-resource-filter-option label{
background:linear-gradient(180deg,rgba(17,28,49,.9),rgba(15,23,42,.78))!important;
border-color:rgba(148,163,184,.24)!important;
box-shadow:0 12px 28px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
html.lv-theme-dark .lv-resource-filter-option label:hover,
html.lv-theme-dark .lv-resource-filter-option input[type="checkbox"]:hover + label,
html.lv-theme-dark .lv-resource-filter-option input[type="checkbox"]:focus-visible + label{
background:linear-gradient(180deg,rgba(30,44,72,.96),rgba(21,34,58,.9))!important;
border-color:rgba(122,162,255,.46)!important;
}
html.lv-theme-dark .lv-resource-filter-option input[type="checkbox"]:checked + label{
background:linear-gradient(135deg,rgba(59,103,246,.30),rgba(74,163,255,.15))!important;
border-color:rgba(122,162,255,.62)!important;
}
@media (max-width:768px){
.sidebar.active{
z-index:2600!important;
}
.sidebar-overlay.active{
z-index:2500!important;
}
.lv-resource-filter-list{
grid-template-columns:repeat(2,minmax(0,82px))!important;
gap:9px!important;
}
.lv-resource-filter-option,
.lv-resource-filter-option label{
width:82px!important;
height:40px!important;
min-height:40px!important;
}
.lv-resource-filter-icon,
.lv-resource-filter-icon .lv-icon-svg,
.lv-resource-filter-icon .lv-nav-custom-svg,
.lv-resource-filter-icon .lv-nav-custom-svg svg{
width:19px!important;
height:19px!important;
}
.lv-resource-filter-icon{
flex-basis:19px!important;
}
.lv-resource-filter-name{
font-size:12px!important;
}
}
/* v72: home nav and hero share one continuous gradient from the viewport top */
body.home{
background:
linear-gradient(180deg,#eefaff 0%,#f7fbff 34%,#ffffff 78%) no-repeat top left / 100% 760px,
#ffffff!important;
}
body.home .site-wrapper,
body.home .site-main{
background:transparent!important;
}
body.home .top-menu,
body.home.has-lv-rail .top-menu{
background:transparent!important;
border-bottom:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
body.home .lv-home-hero{
background:transparent!important;
}
html.lv-theme-dark body.home{
background:
linear-gradient(180deg,#08111f 0%,#0b1424 42%,#070b16 100%) no-repeat top left / 100% 760px,
#070b16!important;
}
html.lv-theme-dark body.home .site-wrapper,
html.lv-theme-dark body.home .site-main{
background:transparent!important;
}
html.lv-theme-dark body.home .top-menu,
html.lv-theme-dark body.home.has-lv-rail .top-menu,
html.lv-theme-dark body.home .lv-home-hero{
background:transparent!important;
border-bottom:0!important;
box-shadow:none!important;
backdrop-filter:none!important;
-webkit-backdrop-filter:none!important;
}
/* v73: premium liquid top actions and front-end auth modal */
.top-menu .lv-vip-link{
width:auto!important;
min-width:132px!important;
height:42px!important;
min-height:42px!important;
padding:0 18px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:9px!important;
overflow:hidden!important;
border:1px solid rgba(255,255,255,.72)!important;
border-radius:14px!important;
background:linear-gradient(135deg,rgba(59,103,246,.98),rgba(58,130,255,.9))!important;
color:#fff!important;
box-shadow:0 16px 34px rgba(59,103,246,.26), inset 0 1px 0 rgba(255,255,255,.38)!important;
backdrop-filter:blur(16px) saturate(150%)!important;
-webkit-backdrop-filter:blur(16px) saturate(150%)!important;
}
.top-menu .lv-vip-link::after{
content:""!important;
position:absolute!important;
inset:-40% auto -40% -75%!important;
width:46%!important;
background:linear-gradient(115deg,transparent,rgba(255,255,255,.76),transparent)!important;
transform:skewX(-18deg)!important;
animation:lv-vip-shine 3.2s ease-in-out infinite!important;
pointer-events:none!important;
}
@keyframes lv-vip-shine{
0%, 46%{left:-75%}
72%, 100%{left:132%}
}
.top-menu .lv-vip-link svg,
.top-menu .lv-vip-link .lv-nav-custom-svg,
.top-menu .lv-vip-link .lv-nav-custom-svg svg{
width:18px!important;
height:18px!important;
flex:0 0 18px!important;
color:#ffd84d!important;
fill:#ffd84d!important;
stroke:#ffd84d!important;
}
.top-menu .lv-vip-link span{
position:static!important;
width:auto!important;
height:auto!important;
overflow:visible!important;
clip:auto!important;
color:#fff!important;
font-size:14px!important;
line-height:1!important;
font-weight:500!important;
white-space:nowrap!important;
}
.top-menu .lv-vip-link:hover,
.top-menu .lv-vip-link:focus-visible{
transform:translateY(-1px)!important;
box-shadow:0 20px 40px rgba(59,103,246,.32), inset 0 1px 0 rgba(255,255,255,.42)!important;
}
.top-menu .lv-login-btn{
min-height:40px!important;
padding:0 22px!important;
border:1px solid rgba(255,255,255,.62)!important;
border-radius:14px!important;
background:linear-gradient(180deg,rgba(31,35,41,.94),rgba(17,24,39,.9))!important;
color:#fff!important;
font-size:14px!important;
line-height:1!important;
font-weight:500!important;
box-shadow:0 14px 32px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.16)!important;
backdrop-filter:blur(16px) saturate(150%)!important;
-webkit-backdrop-filter:blur(16px) saturate(150%)!important;
}
.top-menu .lv-login-btn:hover,
.top-menu .lv-login-btn:focus-visible{
background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(17,24,39,.94))!important;
transform:translateY(-1px)!important;
color:#fff!important;
}
.lv-auth-open{
overflow:hidden!important;
}
.lv-auth-modal[hidden]{
display:none!important;
}
.lv-auth-modal{
position:fixed!important;
inset:0!important;
z-index:100200!important;
display:grid!important;
place-items:center!important;
padding:22px!important;
opacity:0!important;
pointer-events:none!important;
transition:opacity .18s ease!important;
}
.lv-auth-modal.is-open{
opacity:1!important;
pointer-events:auto!important;
}
.lv-auth-backdrop{
position:absolute!important;
inset:0!important;
background:rgba(15,23,42,.46)!important;
backdrop-filter:blur(14px) saturate(130%)!important;
-webkit-backdrop-filter:blur(14px) saturate(130%)!important;
}
.lv-auth-dialog{
position:relative!important;
z-index:1!important;
width:min(100%,460px)!important;
max-height:min(86dvh,760px)!important;
overflow:auto!important;
padding:26px!important;
border:1px solid rgba(255,255,255,.7)!important;
border-radius:24px!important;
background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(248,250,252,.84))!important;
box-shadow:0 34px 90px rgba(15,23,42,.25), inset 0 1px 0 rgba(255,255,255,.78)!important;
backdrop-filter:blur(22px) saturate(150%)!important;
-webkit-backdrop-filter:blur(22px) saturate(150%)!important;
}
.lv-auth-close{
position:absolute!important;
top:14px!important;
right:14px!important;
width:34px!important;
height:34px!important;
border-radius:999px!important;
display:grid!important;
place-items:center!important;
background:rgba(241,245,249,.78)!important;
color:#0f172a!important;
font-size:22px!important;
line-height:1!important;
}
.lv-auth-head{
padding-right:32px!important;
margin-bottom:18px!important;
}
.lv-auth-kicker{
display:inline-flex!important;
margin-bottom:8px!important;
padding:6px 10px!important;
border-radius:999px!important;
background:rgba(59,103,246,.11)!important;
color:#3867ff!important;
font-size:12px!important;
line-height:1!important;
font-weight:500!important;
}
.lv-auth-head h2{
margin:0!important;
color:#111827!important;
font-size:26px!important;
line-height:1.15!important;
font-weight:500!important;
}
.lv-auth-tabs{
display:grid!important;
grid-template-columns:1fr 1fr!important;
gap:6px!important;
padding:6px!important;
margin-bottom:16px!important;
border-radius:16px!important;
background:rgba(226,232,240,.62)!important;
}
.lv-auth-tabs button{
height:40px!important;
border-radius:12px!important;
background:transparent!important;
color:#64748b!important;
font-size:14px!important;
font-weight:500!important;
}
.lv-auth-tabs button.is-active{
background:#fff!important;
color:#111827!important;
box-shadow:0 10px 22px rgba(15,23,42,.08)!important;
}
.lv-auth-panel{
display:none!important;
gap:13px!important;
}
.lv-auth-panel.is-active{
display:grid!important;
}
.lv-auth-panel label{
display:grid!important;
gap:7px!important;
color:#334155!important;
font-size:13px!important;
font-weight:500!important;
}
.lv-auth-panel input[type="text"],
.lv-auth-panel input[type="email"],
.lv-auth-panel input[type="password"]{
width:100%!important;
height:46px!important;
padding:0 14px!important;
border:1px solid rgba(203,213,225,.9)!important;
border-radius:14px!important;
background:rgba(255,255,255,.82)!important;
color:#0f172a!important;
font-size:15px!important;
outline:0!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;
}
.lv-auth-panel input:focus{
border-color:rgba(59,103,246,.72)!important;
box-shadow:0 0 0 4px rgba(59,103,246,.12)!important;
}
.lv-auth-google{
display:grid!important;
gap:8px!important;
}
.lv-auth-google:empty{
display:none!important;
}
.lv-auth-google a,
.lv-auth-google button{
width:100%!important;
min-height:44px!important;
border-radius:14px!important;
}
.lv-auth-divider{
display:flex!important;
align-items:center!important;
gap:12px!important;
color:#94a3b8!important;
font-size:12px!important;
}
.lv-auth-divider::before,
.lv-auth-divider::after{
content:""!important;
height:1px!important;
flex:1!important;
background:rgba(203,213,225,.82)!important;
}
.lv-auth-row{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
}
.lv-auth-check{
display:inline-flex!important;
align-items:center!important;
grid-template-columns:none!important;
gap:8px!important;
color:#64748b!important;
font-size:13px!important;
}
.lv-auth-row button,
.lv-auth-secondary{
background:transparent!important;
color:#3867ff!important;
font-size:13px!important;
font-weight:500!important;
padding:0!important;
}
.lv-auth-submit{
height:48px!important;
border-radius:15px!important;
background:linear-gradient(135deg,#3b67f6,#4a8dff)!important;
color:#fff!important;
font-size:15px!important;
font-weight:500!important;
box-shadow:0 16px 32px rgba(59,103,246,.22)!important;
}
.lv-auth-submit:disabled{
opacity:.62!important;
cursor:wait!important;
}
.lv-auth-copy{
margin:0 0 4px!important;
color:#64748b!important;
font-size:14px!important;
line-height:1.5!important;
}
.lv-auth-message{
margin:0 0 14px!important;
padding:11px 13px!important;
border-radius:14px!important;
font-size:13px!important;
line-height:1.45!important;
font-weight:400!important;
}
.lv-auth-message.is-error{
background:rgba(254,226,226,.9)!important;
color:#991b1b!important;
}
.lv-auth-message.is-success{
background:rgba(220,252,231,.9)!important;
color:#166534!important;
}
html.lv-theme-dark .lv-auth-dialog{
background:linear-gradient(180deg,rgba(15,23,42,.94),rgba(8,15,30,.86))!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 34px 90px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
html.lv-theme-dark .lv-auth-head h2,
html.lv-theme-dark .lv-auth-tabs button.is-active{
color:#eef5ff!important;
}
html.lv-theme-dark .lv-auth-tabs{
background:rgba(30,41,59,.68)!important;
}
html.lv-theme-dark .lv-auth-tabs button.is-active,
html.lv-theme-dark .lv-auth-close{
background:rgba(30,41,59,.92)!important;
}
html.lv-theme-dark .lv-auth-panel label{
color:#cbd7ee!important;
}
html.lv-theme-dark .lv-auth-panel input[type="text"],
html.lv-theme-dark .lv-auth-panel input[type="email"],
html.lv-theme-dark .lv-auth-panel input[type="password"]{
background:rgba(15,23,42,.82)!important;
border-color:rgba(148,163,184,.22)!important;
color:#eaf2ff!important;
}
@media (max-width:768px){
.top-menu .lv-vip-link{
min-width:36px!important;
width:36px!important;
height:36px!important;
min-height:36px!important;
padding:0!important;
border-radius:999px!important;
}
.top-menu .lv-vip-link span{
position:absolute!important;
width:1px!important;
height:1px!important;
overflow:hidden!important;
clip:rect(0,0,0,0)!important;
}
.top-menu .lv-login-btn{
min-height:36px!important;
padding:0 16px!important;
}
.lv-auth-modal{
padding:12px!important;
place-items:end center!important;
}
.lv-auth-dialog{
width:100%!important;
max-height:86dvh!important;
padding:22px 18px 18px!important;
border-radius:24px 24px 0 0!important;
}
}
/* v75: final lock for blog single v16 after older blog rules */
.lv-blog-detail-page.lv-blog-detail-page-v16{
background:#fff!important;
padding:18px 0 54px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell{
width:min(1120px, calc(100% - 32px))!important;
max-width:1120px!important;
margin:0 auto!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
display:grid!important;
grid-template-columns:minmax(0,520px) minmax(0,1fr)!important;
gap:26px!important;
align-items:center!important;
width:min(920px,100%)!important;
margin:0 auto 30px!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero-media{
width:100%!important;
height:auto!important;
aspect-ratio:16/9!important;
border-radius:10px!important;
overflow:hidden!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero-media img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card{
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reader-grid{
display:grid!important;
grid-template-columns:180px minmax(0,650px)!important;
justify-content:center!important;
align-items:start!important;
gap:24px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-article{
width:100%!important;
max-width:650px!important;
margin:0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content{
font-size:16px!important;
line-height:1.78!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content p{
font-size:16px!important;
line-height:1.78!important;
font-weight:400!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{
position:sticky!important;
top:104px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-below{
width:min(1040px,100%)!important;
margin:34px auto 0!important;
padding:0!important;
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{
display:grid!important;
grid-template-columns:repeat(5,minmax(0,1fr))!important;
gap:16px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card{
display:block!important;
padding:0!important;
border:0!important;
background:transparent!important;
box-shadow:none!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16{
background:#070d1a!important;
}
@media (max-width:1100px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reader-grid{grid-template-columns:minmax(0,650px)!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{position:relative!important;top:auto!important;width:100%!important;max-width:650px!important;margin:0 auto 18px!important;}
}
@media (max-width:900px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{grid-template-columns:1fr!important;width:min(650px,100%)!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell{width:calc(100% - 24px)!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card h1{font-size:25px!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content p{font-size:15px!important;line-height:1.72!important;}
}
/* v76: single blog alignment, real TOC, and reader font controls */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell{
width:min(980px, calc(100% - 32px))!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-breadcrumb,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-single-nav{
width:100%!important;
max-width:980px!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
width:min(860px,100%)!important;
grid-template-columns:minmax(0,450px) minmax(0,360px)!important;
gap:26px!important;
justify-content:center!important;
margin:8px auto 28px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card h1{
font-size:30px!important;
line-height:1.18!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-excerpt{
font-size:14px!important;
line-height:1.58!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reader-grid{
width:min(860px,100%)!important;
grid-template-columns:180px minmax(0,650px)!important;
gap:24px!important;
justify-content:center!important;
margin:0 auto!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content{
max-width:650px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content{
--lv-post-font-size:16px;
--lv-post-line-height:1.78;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
overflow:visible!important;
color:#1f2937!important;
font-size:var(--lv-post-font-size)!important;
line-height:var(--lv-post-line-height)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content p,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content li{
color:#1f2937!important;
font-size:var(--lv-post-font-size)!important;
line-height:var(--lv-post-line-height)!important;
font-weight:400!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content ul,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content ol{
margin:0 0 18px 22px!important;
padding:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content blockquote{
margin:20px 0!important;
padding:14px 18px!important;
border-left:3px solid #ef233c!important;
border-radius:0 10px 10px 0!important;
background:#fff5f6!important;
color:#334155!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{
display:block!important;
width:180px!important;
padding:8px!important;
border:1px solid #e8edf5!important;
border-radius:10px!important;
background:#f8fafc!important;
box-shadow:0 10px 22px rgba(15,23,42,.06)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs{
grid-template-columns:1fr 1fr!important;
background:#fff!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav{
margin-top:8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a{
border-left:3px solid transparent!important;
border-radius:6px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a:first-child{
border-left-color:#ef233c!important;
background:#fff!important;
color:#ef233c!important;
font-weight:500!important;
}
.lv-post-font-tools{
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:6px!important;
margin-top:10px!important;
padding-top:10px!important;
border-top:1px solid #e8edf5!important;
}
.lv-post-font-tools button{
display:grid!important;
place-items:center!important;
min-height:28px!important;
padding:0!important;
border:1px solid #e2e8f0!important;
border-radius:7px!important;
background:#fff!important;
color:#334155!important;
font-size:12px!important;
font-weight:500!important;
cursor:pointer!important;
}
.lv-post-font-tools button:hover{
color:#ef233c!important;
border-color:#fecdd3!important;
background:#fff1f2!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-comments{
width:min(650px,100%)!important;
margin:34px auto 0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-area{
max-width:650px!important;
margin:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-below{
width:min(860px,100%)!important;
margin-top:34px!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content p,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content li{
color:#dbe6f7!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content blockquote{
background:rgba(239,35,60,.12)!important;
color:#dbe6f7!important;
}
html.lv-theme-dark .lv-post-font-tools{
border-top-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-post-font-tools button{
background:rgba(15,23,42,.74)!important;
border-color:rgba(148,163,184,.22)!important;
color:#dbe6f7!important;
}
@media (max-width:1100px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reader-grid{
grid-template-columns:1fr!important;
width:min(650px,100%)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{
width:100%!important;
max-width:650px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:4px!important;
}
}
@media (max-width:900px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
width:min(650px,100%)!important;
grid-template-columns:1fr!important;
}
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell{
width:calc(100% - 24px)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav{
grid-template-columns:1fr!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content{
--lv-post-font-size:15px;
--lv-post-line-height:1.72;
}
}
/* v77: blog article final alignment and sticky TOC polish */
.lv-blog-detail-page.lv-blog-detail-page-v16{
--lv-blog-shell:1008px;
--lv-blog-hero-media:500px;
--lv-blog-toc:242px;
--lv-blog-copy:620px;
--lv-blog-gap:40px;
padding-top:22px!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell{
width:min(var(--lv-blog-shell), calc(100% - 32px))!important;
max-width:var(--lv-blog-shell)!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-breadcrumb,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-single-nav{
max-width:var(--lv-blog-shell)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
width:100%!important;
max-width:var(--lv-blog-shell)!important;
grid-template-columns:minmax(0,var(--lv-blog-hero-media)) minmax(0,1fr)!important;
gap:34px!important;
justify-content:start!important;
align-items:start!important;
margin:24px 0 42px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero-media{
aspect-ratio:3/2!important;
border-radius:12px!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card{
padding-top:4px!important;
min-width:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card h1{
max-width:480px!important;
font-size:34px!important;
line-height:1.16!important;
letter-spacing:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-excerpt{
max-width:480px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reader-grid{
width:100%!important;
max-width:var(--lv-blog-shell)!important;
grid-template-columns:var(--lv-blog-toc) minmax(0,var(--lv-blog-copy))!important;
gap:var(--lv-blog-gap)!important;
justify-content:start!important;
align-items:start!important;
margin:0!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-article,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content{
width:100%!important;
max-width:var(--lv-blog-copy)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{
position:sticky!important;
top:112px!important;
display:flex!important;
flex-direction:column!important;
width:var(--lv-blog-toc)!important;
max-height:calc(100vh - 132px)!important;
padding:0!important;
overflow:auto!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
scrollbar-width:thin!important;
z-index:3!important;
}
.admin-bar .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{
top:144px!important;
max-height:calc(100vh - 164px)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools{
order:0!important;
display:grid!important;
grid-template-columns:repeat(3,1fr)!important;
gap:0!important;
height:34px!important;
margin:0 0 10px!important;
padding:3px!important;
border:1px solid #e5e7eb!important;
border-radius:999px!important;
background:#fff!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools button{
min-height:26px!important;
border:0!important;
border-radius:999px!important;
background:transparent!important;
color:#667085!important;
font-size:12px!important;
font-weight:500!important;
line-height:1!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools button.is-active,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools button:hover{
background:#101828!important;
color:#fff!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs{
order:1!important;
display:block!important;
padding:0!important;
margin:0!important;
border:1px solid #e5e7eb!important;
border-bottom:0!important;
border-radius:10px 10px 0 0!important;
background:#f3f4f6!important;
overflow:hidden!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs span{
display:block!important;
padding:11px 16px!important;
border:0!important;
background:transparent!important;
color:#667085!important;
font-size:14px!important;
font-weight:600!important;
text-align:left!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs span:not(.is-active){
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav{
order:2!important;
display:block!important;
max-height:none!important;
margin:0!important;
padding:0!important;
overflow:visible!important;
border:1px solid #e5e7eb!important;
border-top:0!important;
border-radius:0 0 10px 10px!important;
background:#f3f4f6!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a{
display:block!important;
margin:0!important;
padding:10px 14px 10px 18px!important;
border:0!important;
border-left:4px solid transparent!important;
border-radius:0!important;
background:transparent!important;
color:#344054!important;
font-size:14px!important;
font-weight:500!important;
line-height:1.38!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a.is-sub{
padding-left:24px!important;
color:#667085!important;
font-size:13px!important;
font-weight:400!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a:first-child{
border-left-color:transparent!important;
background:transparent!important;
color:#344054!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a.is-current{
border-left-color:#ef233c!important;
background:#fff!important;
color:#ef233c!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content h2{
scroll-margin-top:132px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-content h3{
scroll-margin-top:132px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-comments{
width:min(var(--lv-blog-copy), 100%)!important;
margin:36px 0 0 calc(var(--lv-blog-toc) + var(--lv-blog-gap))!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-below{
width:100%!important;
max-width:var(--lv-blog-shell)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav{
border-color:rgba(148,163,184,.2)!important;
background:#101828!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools button,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs span,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a{
color:#cbd5e1!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools button.is-active,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools button:hover{
background:#fff!important;
color:#101828!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a:hover,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a.is-current{
background:rgba(239,35,60,.14)!important;
color:#ff7b8d!important;
}
@media (max-width:1120px){
.lv-blog-detail-page.lv-blog-detail-page-v16{
--lv-blog-shell:760px;
--lv-blog-hero-media:100%;
--lv-blog-toc:100%;
--lv-blog-copy:680px;
--lv-blog-gap:18px;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
width:min(680px,100%)!important;
grid-template-columns:1fr!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reader-grid{
width:min(680px,100%)!important;
grid-template-columns:1fr!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card{
position:relative!important;
top:auto!important;
width:100%!important;
max-height:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-comments{
margin:36px auto 0!important;
}
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16{
padding-top:14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
margin-top:16px!important;
margin-bottom:24px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card h1{
max-width:100%!important;
font-size:26px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-font-tools{
height:32px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-tabs span,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-toc-card nav a{
font-size:13px!important;
}
}
/* v78: blog usefulness rating widget */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness{
display:block!important;
width:100%!important;
margin-top:18px!important;
padding:18px!important;
border:0!important;
border-radius:12px!important;
background:#eef3ff!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness > h3{
margin:0 0 14px!important;
color:#111827!important;
font-size:18px!important;
line-height:1.35!important;
font-weight:600!important;
letter-spacing:0!important;
}
.lv-post-usefulness-options{
display:grid!important;
grid-template-columns:repeat(5,minmax(0,1fr))!important;
gap:10px!important;
}
.lv-post-usefulness-options button{
position:relative!important;
display:flex!important;
min-height:96px!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
padding:12px 10px!important;
border:1px solid #dbe2ee!important;
border-radius:8px!important;
background:rgba(255,255,255,.86)!important;
color:#202939!important;
font-size:15px!important;
font-weight:400!important;
line-height:1.25!important;
text-align:center!important;
cursor:pointer!important;
transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease!important;
}
.lv-post-usefulness-options button:hover{
transform:translateY(-1px)!important;
border-color:#7c9cff!important;
background:#fff!important;
box-shadow:0 10px 22px rgba(64,99,255,.12)!important;
}
.lv-post-usefulness-options button.is-selected{
border-color:#4772ff!important;
background:#fff!important;
box-shadow:0 0 0 1px rgba(71,114,255,.16)!important;
}
.lv-post-usefulness-options.is-modal button.is-selected::after{
content:""!important;
position:absolute!important;
top:0!important;
right:0!important;
width:0!important;
height:0!important;
border-top:22px solid #4772ff!important;
border-left:22px solid transparent!important;
border-radius:0 7px 0 0!important;
}
.lv-post-usefulness-emoji{
display:block!important;
font-size:30px!important;
line-height:1!important;
}
.lv-post-usefulness .lv-post-rating-message{
display:none!important;
margin-top:12px!important;
color:#2563eb!important;
font-size:14px!important;
font-weight:500!important;
}
.lv-post-usefulness .lv-post-rating-message.is-visible{
display:block!important;
}
.lv-post-usefulness .lv-post-rating-message.is-error{
color:#dc2626!important;
}
.lv-post-usefulness-modal[hidden]{
display:none!important;
}
.lv-post-usefulness-modal{
position:fixed!important;
inset:0!important;
z-index:100000!important;
display:grid!important;
place-items:center!important;
padding:18px!important;
}
.lv-post-usefulness-backdrop{
position:absolute!important;
inset:0!important;
background:rgba(15,23,42,.46)!important;
backdrop-filter:blur(10px)!important;
-webkit-backdrop-filter:blur(10px)!important;
}
.lv-post-usefulness-dialog{
position:relative!important;
width:min(600px,100%)!important;
padding:18px 16px 16px!important;
border:1px solid rgba(255,255,255,.68)!important;
border-radius:10px!important;
background:rgba(255,255,255,.96)!important;
box-shadow:0 30px 80px rgba(15,23,42,.28)!important;
transform:translateY(10px) scale(.98)!important;
opacity:0!important;
transition:transform .18s ease, opacity .18s ease!important;
}
.lv-post-usefulness-modal.is-open .lv-post-usefulness-dialog{
transform:translateY(0) scale(1)!important;
opacity:1!important;
}
.lv-post-usefulness-dialog > h3{
margin:0 36px 22px!important;
color:#111827!important;
font-size:25px!important;
line-height:1.2!important;
font-weight:600!important;
text-align:center!important;
letter-spacing:0!important;
}
.lv-post-usefulness-close{
position:absolute!important;
top:14px!important;
right:14px!important;
display:grid!important;
width:34px!important;
height:34px!important;
place-items:center!important;
border:0!important;
border-radius:50%!important;
background:transparent!important;
color:#111827!important;
font-size:22px!important;
cursor:pointer!important;
}
.lv-post-usefulness-close:hover{
background:#f1f5f9!important;
}
.lv-post-usefulness-options.is-modal{
gap:8px!important;
}
.lv-post-usefulness-options.is-modal button{
min-height:78px!important;
gap:6px!important;
padding:10px 8px!important;
font-size:15px!important;
}
.lv-post-usefulness-options.is-modal .lv-post-usefulness-emoji{
font-size:29px!important;
}
.lv-post-usefulness-dialog textarea{
display:block!important;
width:100%!important;
min-height:120px!important;
margin-top:10px!important;
padding:14px 16px!important;
resize:none!important;
border:1px solid #cbd5e1!important;
border-radius:8px!important;
background:#fff!important;
color:#111827!important;
font-size:16px!important;
line-height:1.55!important;
outline:0!important;
box-shadow:none!important;
}
.lv-post-usefulness-dialog textarea:focus{
border-color:#4772ff!important;
box-shadow:0 0 0 3px rgba(71,114,255,.14)!important;
}
.lv-post-usefulness-dialog textarea::placeholder{
color:#667085!important;
}
.lv-post-usefulness-count{
margin-top:6px!important;
color:#111827!important;
font-size:13px!important;
line-height:1!important;
text-align:right!important;
}
.lv-post-usefulness-submit{
display:flex!important;
width:100%!important;
min-height:48px!important;
align-items:center!important;
justify-content:center!important;
margin-top:16px!important;
border:0!important;
border-radius:999px!important;
background:linear-gradient(135deg,#4772ff,#3157dc)!important;
color:#fff!important;
font-size:16px!important;
font-weight:600!important;
cursor:pointer!important;
box-shadow:0 16px 34px rgba(49,87,220,.25)!important;
}
.lv-post-usefulness.is-saving .lv-post-usefulness-submit{
pointer-events:none!important;
opacity:.72!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness{
background:rgba(37,99,235,.13)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness > h3,
html.lv-theme-dark .lv-post-usefulness-dialog > h3,
html.lv-theme-dark .lv-post-usefulness-close,
html.lv-theme-dark .lv-post-usefulness-count{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-post-usefulness-options button{
border-color:rgba(148,163,184,.22)!important;
background:rgba(15,23,42,.78)!important;
color:#dbe6f7!important;
}
html.lv-theme-dark .lv-post-usefulness-options button.is-selected,
html.lv-theme-dark .lv-post-usefulness-options button:hover{
border-color:#7c9cff!important;
background:rgba(30,41,59,.94)!important;
}
html.lv-theme-dark .lv-post-usefulness-dialog{
border-color:rgba(148,163,184,.2)!important;
background:rgba(15,23,42,.96)!important;
}
html.lv-theme-dark .lv-post-usefulness-dialog textarea{
border-color:rgba(148,163,184,.28)!important;
background:rgba(2,6,23,.88)!important;
color:#f8fafc!important;
}
@media (max-width:700px){
.lv-post-usefulness-options{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.lv-post-usefulness-options button{
min-height:86px!important;
font-size:14px!important;
}
.lv-post-usefulness-dialog{
padding:18px 14px 14px!important;
border-radius:14px!important;
}
.lv-post-usefulness-dialog > h3{
margin:0 34px 18px!important;
font-size:22px!important;
}
.lv-post-usefulness-options.is-modal button{
min-height:74px!important;
}
}
/* v79: blog comments, reply hierarchy, reactions, and related-post containment */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell > .lv-post-comments{
width:min(var(--lv-blog-copy),100%)!important;
max-width:var(--lv-blog-copy)!important;
margin:38px 0 0 calc(var(--lv-blog-toc) + var(--lv-blog-gap))!important;
padding:0!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell > .lv-post-related-below{
width:min(var(--lv-blog-copy),100%)!important;
max-width:var(--lv-blog-copy)!important;
margin:38px 0 0 calc(var(--lv-blog-toc) + var(--lv-blog-gap))!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-area{
width:100%!important;
max-width:100%!important;
margin:0!important;
padding:22px!important;
border:1px solid #e6ebf3!important;
border-radius:18px!important;
background:rgba(255,255,255,.94)!important;
box-shadow:0 22px 60px rgba(15,23,42,.08)!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-title-row{
align-items:center!important;
margin:0 0 16px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-title-row span,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head span{
color:#4772ff!important;
font-size:12px!important;
font-weight:600!important;
letter-spacing:.02em!important;
text-transform:uppercase!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-title-row h2,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head h3{
margin:2px 0 0!important;
color:#111827!important;
font-size:24px!important;
line-height:1.2!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head{
display:flex!important;
align-items:end!important;
justify-content:space-between!important;
gap:12px!important;
margin:22px 0 16px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-panel{
width:100%!important;
margin:0 0 18px!important;
padding:16px!important;
border:1px solid #e6ebf3!important;
border-radius:16px!important;
background:#f8fafc!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-head{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
margin:0 0 12px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reply-cancel a{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:30px!important;
padding:0 11px!important;
border-radius:999px!important;
background:#fff1f2!important;
color:#e11d48!important;
font-size:13px!important;
font-weight:500!important;
text-decoration:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list{
display:flex!important;
flex-direction:column!important;
gap:18px!important;
width:100%!important;
margin:0!important;
padding:0!important;
list-style:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item{
position:relative!important;
display:grid!important;
grid-template-columns:42px minmax(0,1fr)!important;
column-gap:11px!important;
row-gap:0!important;
width:100%!important;
margin:0!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item.is-hidden-by-default{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item.is-revealed{
display:grid!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .children{
grid-column:2 / -1!important;
display:flex!important;
flex-direction:column!important;
gap:13px!important;
margin:13px 0 0!important;
padding:0 0 0 16px!important;
border-left:2px solid #e5eaf2!important;
list-style:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .children .lv-comment-item::before{
content:""!important;
position:absolute!important;
top:19px!important;
left:-16px!important;
width:12px!important;
border-top:2px solid #e5eaf2!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-avatar img,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-form-avatar img{
display:block!important;
width:42px!important;
height:42px!important;
border-radius:50%!important;
object-fit:cover!important;
box-shadow:0 0 0 3px #fff!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item.is-reply{
grid-template-columns:34px minmax(0,1fr)!important;
column-gap:10px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item.is-reply .lv-comment-avatar img{
width:34px!important;
height:34px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-body{
min-width:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-bubble{
width:100%!important;
padding:12px 14px!important;
border:1px solid #e5eaf2!important;
border-radius:16px!important;
background:#f8fafc!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item.is-reply .lv-comment-bubble{
background:#fff!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:7px!important;
margin:0 0 6px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head strong{
color:#111827!important;
font-size:14px!important;
line-height:1.2!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reply-context{
display:inline-flex!important;
align-items:center!important;
min-height:22px!important;
padding:0 8px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#4772ff!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text p{
margin:0!important;
color:#334155!important;
font-size:14px!important;
line-height:1.6!important;
font-weight:400!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-awaiting{
margin:0 0 6px!important;
color:#b45309!important;
font-size:13px!important;
font-weight:500!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:7px!important;
margin:7px 0 0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
min-height:28px!important;
padding:0 9px!important;
border:0!important;
border-radius:999px!important;
background:transparent!important;
color:#667085!important;
font-size:13px!important;
line-height:1!important;
font-weight:500!important;
text-decoration:none!important;
cursor:pointer!important;
transition:background .16s ease,color .16s ease,transform .16s ease!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button.is-active{
background:#eef4ff!important;
color:#3157dc!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button.is-active{
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social time{
margin-left:auto!important;
color:#98a2b3!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item > #respond,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item > .lv-comment-compose-panel{
grid-column:2 / -1!important;
margin:12px 0 0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-load-more{
display:flex!important;
align-items:center!important;
justify-content:center!important;
width:100%!important;
min-height:42px!important;
margin:18px 0 0!important;
border:1px solid #dbe5f4!important;
border-radius:999px!important;
background:#fff!important;
color:#4772ff!important;
font-size:14px!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-below .lv-section-title-row{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:16px!important;
margin:0 0 14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-below .lv-section-title-row h2{
margin:0!important;
color:#111827!important;
font-size:23px!important;
line-height:1.25!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:16px!important;
width:100%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card{
display:block!important;
min-width:0!important;
padding:0!important;
border:0!important;
border-radius:12px!important;
background:transparent!important;
box-shadow:none!important;
overflow:hidden!important;
text-decoration:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card > span{
display:grid!important;
width:100%!important;
aspect-ratio:16/10!important;
place-items:center!important;
border-radius:12px!important;
background:#eef2f7!important;
overflow:hidden!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card img{
width:100%!important;
height:100%!important;
object-fit:cover!important;
transition:transform .22s ease!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card:hover img{
transform:scale(1.035)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card strong{
display:block!important;
margin:9px 0 4px!important;
color:#111827!important;
font-size:14px!important;
line-height:1.35!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card small{
display:block!important;
color:#667085!important;
font-size:12px!important;
font-weight:400!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-area{
border-color:rgba(148,163,184,.18)!important;
background:rgba(15,23,42,.9)!important;
box-shadow:0 22px 60px rgba(0,0,0,.28)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-panel,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-bubble{
border-color:rgba(148,163,184,.18)!important;
background:rgba(30,41,59,.76)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item.is-reply .lv-comment-bubble{
background:rgba(15,23,42,.82)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-title-row h2,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head h3,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head strong,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-below .lv-section-title-row h2,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card strong{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text p{
color:#cbd5e1!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social time,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card small{
color:#94a3b8!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button:hover,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link:hover,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button.is-active{
background:rgba(71,114,255,.18)!important;
color:#9db5ff!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .children,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .children .lv-comment-item::before{
border-color:rgba(148,163,184,.2)!important;
}
@media (max-width:1120px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell > .lv-post-comments,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-shell > .lv-post-related-below{
width:min(680px,100%)!important;
max-width:680px!important;
margin:36px auto 0!important;
}
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-area{
padding:16px!important;
border-radius:16px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-title-row h2,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head h3{
font-size:21px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-head,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head{
align-items:flex-start!important;
flex-direction:column!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item{
grid-template-columns:36px minmax(0,1fr)!important;
column-gap:9px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-avatar img{
width:36px!important;
height:36px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .children{
grid-column:1 / -1!important;
margin-left:18px!important;
padding-left:14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social time{
width:100%!important;
margin-left:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{
grid-template-columns:1fr!important;
}
}
/* v80: direct nested WordPress replies and compact 3-card related posts */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply{
grid-column:2 / -1!important;
display:grid!important;
grid-template-columns:34px minmax(0,1fr)!important;
column-gap:10px!important;
width:100%!important;
min-width:0!important;
margin:13px 0 0!important;
padding:0 0 0 16px!important;
border-left:2px solid #e5eaf2!important;
border-radius:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::before{
content:""!important;
position:absolute!important;
left:-2px!important;
top:18px!important;
width:14px!important;
transform:translateX(-100%)!important;
border-top:2px solid #e5eaf2!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply .lv-comment-body{
width:100%!important;
min-width:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply .lv-comment-bubble{
width:100%!important;
max-width:100%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply .lv-comment-social{
width:100%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link{
white-space:nowrap!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reply-context{
white-space:nowrap!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card > span{
aspect-ratio:16/9!important;
border-radius:10px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card strong{
margin-top:8px!important;
font-size:13px!important;
line-height:1.32!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-card small{
font-size:11px!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::before{
border-color:rgba(148,163,184,.22)!important;
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply{
grid-column:1 / -1!important;
grid-template-columns:32px minmax(0,1fr)!important;
margin-left:18px!important;
padding-left:14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social{
gap:5px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social button,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link{
padding:0 7px!important;
font-size:12px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-related-grid{
grid-template-columns:1fr!important;
}
}
/* v81: LinkedIn-style comment stream and reaction tray */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-area{
padding:0!important;
border:1px solid #d9dee8!important;
border-radius:10px!important;
background:#fff!important;
box-shadow:none!important;
overflow:visible!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-title-row{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar{
display:grid!important;
grid-template-columns:56px repeat(4,1fr)!important;
align-items:center!important;
gap:4px!important;
min-height:58px!important;
padding:8px 12px!important;
border-bottom:1px solid #d9dee8!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-toolbar-user{
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
color:#344054!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-toolbar-user img{
width:32px!important;
height:32px!important;
border-radius:50%!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar button{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
width:100%!important;
min-height:40px!important;
padding:0 8px!important;
border:0!important;
border-radius:8px!important;
background:transparent!important;
color:#344054!important;
font-size:14px!important;
font-weight:500!important;
white-space:nowrap!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar button:hover{
background:#f2f4f7!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-panel{
margin:0!important;
padding:10px 12px!important;
border:0!important;
border-bottom:1px solid #d9dee8!important;
border-radius:0!important;
background:#fff!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-head{
margin:0 0 8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-login-note{
margin:0!important;
color:#667085!important;
font-size:12px!important;
line-height:1.4!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-row,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-box{
position:relative!important;
display:grid!important;
grid-template-columns:40px minmax(0,1fr)!important;
align-items:center!important;
gap:8px!important;
margin:0!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-form-avatar,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-avatar{
display:grid!important;
width:40px!important;
height:40px!important;
place-items:center!important;
border-radius:50%!important;
background:#f2f4f7!important;
color:#667085!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-form-avatar img{
width:40px!important;
height:40px!important;
border-radius:50%!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-row textarea,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-box textarea{
display:block!important;
width:100%!important;
min-height:42px!important;
max-height:96px!important;
margin:0!important;
padding:11px 74px 10px 14px!important;
resize:vertical!important;
border:1px solid #98a2b3!important;
border-radius:999px!important;
background:#fff!important;
color:#111827!important;
font-size:14px!important;
line-height:1.35!important;
font-weight:400!important;
box-shadow:none!important;
outline:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-row textarea:focus{
border-color:#4772ff!important;
box-shadow:0 0 0 3px rgba(71,114,255,.12)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-tools{
position:absolute!important;
right:12px!important;
top:50%!important;
display:flex!important;
align-items:center!important;
gap:12px!important;
color:#344054!important;
transform:translateY(-50%)!important;
pointer-events:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-submit-row{
display:flex!important;
justify-content:flex-end!important;
margin:8px 0 0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-submit{
min-height:34px!important;
padding:0 16px!important;
border-radius:999px!important;
font-size:13px!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-panel{
padding:10px 12px 14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
margin:0 0 8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head span{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head h3{
margin:0!important;
color:#111827!important;
font-size:16px!important;
line-height:1.3!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-sort-row{
display:flex!important;
justify-content:flex-start!important;
margin:0 0 12px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-sort-row button{
display:inline-flex!important;
align-items:center!important;
gap:5px!important;
padding:0!important;
border:0!important;
background:transparent!important;
color:#667085!important;
font-size:13px!important;
font-weight:500!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list{
gap:18px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item{
grid-template-columns:40px minmax(0,1fr)!important;
column-gap:10px!important;
align-items:start!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-avatar img{
width:40px!important;
height:40px!important;
border-radius:50%!important;
box-shadow:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head{
display:flex!important;
align-items:flex-start!important;
justify-content:space-between!important;
gap:10px!important;
margin:0 0 5px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-block{
min-width:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line{
display:flex!important;
align-items:center!important;
flex-wrap:wrap!important;
gap:4px!important;
color:#667085!important;
font-size:12px!important;
line-height:1.25!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line strong{
color:#111827!important;
font-size:14px!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line span::before{
content:"• "!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reply-context{
display:block!important;
min-height:0!important;
margin-top:1px!important;
padding:0!important;
border-radius:0!important;
background:transparent!important;
color:#0a66c2!important;
font-size:13px!important;
line-height:1.3!important;
font-weight:500!important;
white-space:normal!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools{
display:flex!important;
align-items:center!important;
gap:8px!important;
flex:0 0 auto!important;
color:#667085!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools time{
color:#667085!important;
font-size:12px!important;
font-weight:400!important;
white-space:nowrap!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools button{
display:grid!important;
width:26px!important;
height:26px!important;
place-items:center!important;
border:0!important;
border-radius:50%!important;
background:transparent!important;
color:#667085!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools button:hover{
background:#f2f4f7!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text p{
margin:0!important;
color:#111827!important;
font-size:14px!important;
line-height:1.55!important;
font-weight:400!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social{
position:relative!important;
display:flex!important;
align-items:center!important;
gap:6px!important;
margin:7px 0 0!important;
color:#667085!important;
font-size:13px!important;
line-height:1.2!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-action-divider{
color:#c4cad4!important;
font-size:12px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-wrap{
position:relative!important;
display:inline-flex!important;
align-items:center!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-wrap::before{
content:""!important;
position:absolute!important;
left:-14px!important;
right:-72px!important;
bottom:100%!important;
height:14px!important;
z-index:14!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-trigger,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reply-count{
display:inline-flex!important;
align-items:center!important;
gap:4px!important;
min-height:20px!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
color:#667085!important;
font-size:13px!important;
line-height:1.2!important;
font-weight:500!important;
text-decoration:none!important;
white-space:nowrap!important;
box-shadow:none!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-trigger:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link:hover{
color:#0a66c2!important;
background:transparent!important;
text-decoration:underline!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-trigger.is-active{
color:#0a66c2!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-trigger [data-lv-comment-reaction-icon]:empty{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-summary{
display:inline-flex!important;
align-items:center!important;
gap:2px!important;
min-height:18px!important;
color:#667085!important;
font-size:12px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-summary[hidden]{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray{
position:absolute!important;
left:-12px!important;
bottom:calc(100% + 3px)!important;
z-index:15!important;
display:flex!important;
align-items:center!important;
gap:4px!important;
padding:6px 8px!important;
border:1px solid rgba(15,23,42,.08)!important;
border-radius:999px!important;
background:#fff!important;
box-shadow:0 10px 28px rgba(15,23,42,.18)!important;
opacity:0!important;
visibility:hidden!important;
transform:translateY(6px) scale(.96)!important;
transform-origin:left bottom!important;
transition:opacity .14s ease, transform .14s ease, visibility .14s ease!important;
pointer-events:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-wrap:hover .lv-comment-reaction-tray,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-wrap:focus-within .lv-comment-reaction-tray{
opacity:1!important;
visibility:visible!important;
transform:translateY(0) scale(1)!important;
pointer-events:auto!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray button{
display:grid!important;
width:34px!important;
height:34px!important;
min-height:34px!important;
place-items:center!important;
padding:0!important;
border:0!important;
border-radius:50%!important;
background:transparent!important;
color:#111827!important;
font-size:22px!important;
line-height:1!important;
cursor:pointer!important;
transform:translateY(0)!important;
transition:transform .12s ease, background .12s ease!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray button:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray button.is-active{
background:#eef4ff!important;
transform:translateY(-5px) scale(1.16)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply{
grid-column:2 / -1!important;
grid-template-columns:34px minmax(0,1fr)!important;
margin:14px 0 0!important;
padding:0 0 0 18px!important;
border-left:2px solid #d9dee8!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::before{
left:-2px!important;
top:18px!important;
width:14px!important;
border-top:2px solid #d9dee8!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-item.is-reply .lv-comment-avatar img{
width:34px!important;
height:34px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-load-more{
justify-content:flex-start!important;
width:auto!important;
min-height:32px!important;
margin:18px 0 0!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
color:#111827!important;
font-size:14px!important;
font-weight:600!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-area,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-panel{
border-color:rgba(148,163,184,.2)!important;
background:rgba(15,23,42,.92)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar{
border-color:rgba(148,163,184,.2)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar button:hover,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools button:hover{
background:rgba(148,163,184,.12)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar button,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-toolbar-user,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line span,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools time,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-trigger,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-social .comment-reply-link,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reply-count{
color:#94a3b8!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comments-list-head h3,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line strong,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-text p{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-row textarea,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-box textarea,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray{
border-color:rgba(148,163,184,.26)!important;
background:#111827!important;
color:#f8fafc!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::before{
border-color:rgba(148,163,184,.26)!important;
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar{
grid-template-columns:40px repeat(4,minmax(0,1fr))!important;
gap:2px!important;
padding:6px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar button{
gap:0!important;
font-size:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar button i{
font-size:18px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-row,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-box{
grid-template-columns:34px minmax(0,1fr)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-form-avatar,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-avatar,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-form-avatar img{
width:34px!important;
height:34px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item{
grid-template-columns:34px minmax(0,1fr)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-avatar img{
width:34px!important;
height:34px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head{
gap:8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools time{
font-size:11px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply{
grid-column:2 / -1!important;
grid-template-columns:30px minmax(0,1fr)!important;
margin-left:0!important;
padding-left:12px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray{
left:-8px!important;
gap:2px!important;
padding:5px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray button{
width:30px!important;
height:30px!important;
min-height:30px!important;
font-size:19px!important;
}
}
/* v82: unified post feedback and functional comment actions */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness{
padding:18px!important;
border:1px solid #dfe7f4!important;
border-radius:12px!important;
background:#f6f8fd!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-head{
display:flex!important;
align-items:flex-start!important;
justify-content:space-between!important;
gap:14px!important;
margin:0 0 14px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-kicker{
display:block!important;
margin:0 0 3px!important;
color:#4772ff!important;
font-size:12px!important;
line-height:1.2!important;
font-weight:700!important;
letter-spacing:0!important;
text-transform:uppercase!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-head h3{
margin:0!important;
color:#111827!important;
font-size:18px!important;
line-height:1.35!important;
font-weight:650!important;
letter-spacing:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-summary{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:30px!important;
padding:0 10px!important;
border:1px solid #dbe5f4!important;
border-radius:999px!important;
background:#fff!important;
color:#475467!important;
font-size:13px!important;
line-height:1!important;
font-weight:600!important;
white-space:nowrap!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options{
grid-template-columns:repeat(5,minmax(0,1fr))!important;
gap:10px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button{
display:grid!important;
grid-template-rows:34px minmax(38px,auto) 22px!important;
justify-items:center!important;
align-items:center!important;
min-height:116px!important;
gap:6px!important;
padding:12px 8px!important;
border-color:#dbe5f4!important;
border-radius:10px!important;
background:#fff!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button.is-selected{
border-color:#4772ff!important;
background:#fff!important;
box-shadow:0 12px 28px rgba(71,114,255,.12)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-emoji{
display:grid!important;
width:34px!important;
height:34px!important;
place-items:center!important;
font-size:29px!important;
line-height:1!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-label{
display:flex!important;
align-items:center!important;
justify-content:center!important;
min-height:38px!important;
color:#202939!important;
font-size:14px!important;
line-height:1.25!important;
font-weight:600!important;
text-align:center!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-count-badge{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:22px!important;
padding:0 8px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#4772ff!important;
font-size:12px!important;
line-height:1!important;
font-weight:700!important;
white-space:nowrap!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions{
display:flex!important;
flex-wrap:wrap!important;
gap:8px!important;
margin:14px 0 0!important;
padding:14px 0 0!important;
border-top:1px solid #dfe7f4!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions a,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
min-height:38px!important;
padding:0 13px!important;
border:1px solid #dbe5f4!important;
border-radius:999px!important;
background:#fff!important;
color:#344054!important;
font-size:14px!important;
line-height:1!important;
font-weight:600!important;
text-decoration:none!important;
cursor:pointer!important;
transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions a:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button.is-copied{
border-color:#4772ff!important;
background:#eef4ff!important;
color:#3157dc!important;
transform:translateY(-1px)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button.is-copy-error{
border-color:#fecaca!important;
background:#fff1f2!important;
color:#dc2626!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-linkedin-toolbar{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-compose-panel:first-child{
border-radius:10px 10px 0 0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-tray{
gap:6px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-reaction-summary{
margin-right:2px!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness{
border-color:rgba(148,163,184,.2)!important;
background:rgba(15,23,42,.78)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-head h3,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-label{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button{
border-color:rgba(148,163,184,.22)!important;
background:rgba(30,41,59,.86)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button:hover,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button.is-selected{
border-color:#7c9cff!important;
background:rgba(30,41,59,.96)!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-summary,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions a,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button{
border-color:rgba(148,163,184,.22)!important;
background:rgba(30,41,59,.86)!important;
color:#cbd5e1!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-count-badge{
background:rgba(71,114,255,.18)!important;
color:#9db5ff!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions{
border-color:rgba(148,163,184,.18)!important;
}
@media (max-width:700px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-head{
flex-direction:column!important;
gap:8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-summary{
white-space:normal!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button{
min-height:112px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions a,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button{
flex:1 1 150px!important;
}
}
/* v83: comment report menu, clean author line, and reply connectors */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line{
gap:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line span{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-author-line span::before{
content:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-wrap{
position:relative!important;
display:inline-flex!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-head-tools .lv-comment-more-button{
display:grid!important;
width:26px!important;
height:26px!important;
min-height:26px!important;
place-items:center!important;
padding:0!important;
border:0!important;
border-radius:50%!important;
background:transparent!important;
color:#667085!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-menu{
position:absolute!important;
top:calc(100% + 6px)!important;
right:0!important;
z-index:30!important;
min-width:168px!important;
padding:6px!important;
border:1px solid #d9dee8!important;
border-radius:8px!important;
background:#fff!important;
box-shadow:0 14px 34px rgba(15,23,42,.16)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-menu[hidden]{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-menu button{
display:flex!important;
align-items:center!important;
justify-content:flex-start!important;
gap:10px!important;
width:100%!important;
min-height:36px!important;
padding:0 10px!important;
border:0!important;
border-radius:6px!important;
background:transparent!important;
color:#344054!important;
font-size:14px!important;
font-weight:600!important;
text-align:left!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-menu button:hover{
background:#f2f4f7!important;
color:#dc2626!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply{
grid-column:1 / -1!important;
grid-template-columns:34px minmax(0,1fr)!important;
column-gap:10px!important;
margin:14px 0 0!important;
padding:0 0 0 58px!important;
border-left:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::before{
content:""!important;
position:absolute!important;
left:20px!important;
top:17px!important;
width:28px!important;
height:0!important;
transform:none!important;
border-top:2px solid #d9dee8!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::after{
content:""!important;
position:absolute!important;
left:20px!important;
top:-14px!important;
height:31px!important;
border-left:2px solid #d9dee8!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply .lv-comment-body{
min-width:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-modal[hidden]{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-modal{
position:fixed!important;
inset:0!important;
z-index:100001!important;
display:grid!important;
place-items:center!important;
padding:18px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-backdrop{
position:absolute!important;
inset:0!important;
background:rgba(15,23,42,.48)!important;
backdrop-filter:blur(8px)!important;
-webkit-backdrop-filter:blur(8px)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog{
position:relative!important;
width:min(480px,100%)!important;
padding:18px!important;
border:1px solid rgba(255,255,255,.66)!important;
border-radius:12px!important;
background:#fff!important;
box-shadow:0 28px 72px rgba(15,23,42,.24)!important;
opacity:0!important;
transform:translateY(10px) scale(.98)!important;
transition:opacity .16s ease,transform .16s ease!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-modal.is-open .lv-comment-report-dialog{
opacity:1!important;
transform:translateY(0) scale(1)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-close{
position:absolute!important;
top:12px!important;
right:12px!important;
display:grid!important;
width:32px!important;
height:32px!important;
place-items:center!important;
border:0!important;
border-radius:50%!important;
background:#f2f4f7!important;
color:#344054!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-head{
padding-right:34px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-head span{
display:block!important;
color:#4772ff!important;
font-size:12px!important;
font-weight:800!important;
text-transform:uppercase!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-head h3{
margin:4px 0 6px!important;
color:#111827!important;
font-size:22px!important;
line-height:1.2!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-head p{
margin:0 0 14px!important;
color:#667085!important;
font-size:13px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-reasons{
display:flex!important;
flex-wrap:wrap!important;
gap:8px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-reasons button{
display:inline-flex!important;
min-height:34px!important;
align-items:center!important;
justify-content:center!important;
padding:0 12px!important;
border:1px solid #dbe5f4!important;
border-radius:999px!important;
background:#fff!important;
color:#344054!important;
font-size:13px!important;
font-weight:700!important;
cursor:pointer!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-reasons button.is-selected{
border-color:#4772ff!important;
background:#eef4ff!important;
color:#3157dc!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog textarea{
display:block!important;
width:100%!important;
min-height:92px!important;
margin:12px 0 0!important;
padding:12px 14px!important;
resize:vertical!important;
border:1px solid #cbd5e1!important;
border-radius:8px!important;
color:#111827!important;
font-size:14px!important;
line-height:1.5!important;
outline:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog textarea:focus{
border-color:#4772ff!important;
box-shadow:0 0 0 3px rgba(71,114,255,.13)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-message{
display:none!important;
margin:10px 0 0!important;
color:#166534!important;
font-size:13px!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-message.is-visible{
display:block!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-message.is-error{
color:#dc2626!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-submit{
display:flex!important;
width:100%!important;
min-height:42px!important;
align-items:center!important;
justify-content:center!important;
margin-top:14px!important;
border:0!important;
border-radius:999px!important;
background:#111827!important;
color:#fff!important;
font-size:14px!important;
font-weight:800!important;
cursor:pointer!important;
}
.lv-account-notifications{
display:grid;
gap:16px;
padding:24px;
border:1px solid rgba(148,163,184,.16);
border-radius:22px;
background:#fff;
box-shadow:0 14px 36px rgba(15,23,42,.05);
}
.lv-account-notifications-head span{
display:block;
color:#3e6cea;
font-size:12px;
font-weight:800;
text-transform:uppercase;
}
.lv-account-notifications-head h2{
margin:4px 0 0;
color:#0f172a;
font-size:26px;
}
.lv-account-notification-list{
display:grid;
gap:10px;
}
.lv-account-notification-item{
display:grid;
grid-template-columns:42px minmax(0,1fr);
gap:12px;
padding:14px;
border:1px solid #e2e8f0;
border-radius:14px;
background:#f8fafc;
color:#0f172a;
text-decoration:none;
}
.lv-account-notification-icon{
display:grid;
width:42px;
height:42px;
place-items:center;
border-radius:50%;
background:#eef4ff;
color:#3157dc;
}
.lv-account-notification-item strong,
.lv-account-notification-item em,
.lv-account-notification-item small{
display:block;
}
.lv-account-notification-item em{
margin-top:4px;
color:#475569;
font-style:normal;
line-height:1.5;
}
.lv-account-notification-item small{
margin-top:5px;
color:#94a3b8;
font-size:12px;
}
.lv-account-notification-empty{
padding:22px;
border:1px dashed #cbd5e1;
border-radius:16px;
color:#64748b;
background:#f8fafc;
}
.lv-account-notification-empty strong{
display:block;
margin-bottom:4px;
color:#0f172a;
}
.lv-account-notification-empty p{
margin:0;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-menu,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog{
border-color:rgba(148,163,184,.22)!important;
background:#111827!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-more-menu button,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-head h3,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog textarea{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog textarea,
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-reasons button{
border-color:rgba(148,163,184,.24)!important;
background:#0f172a!important;
}
html.lv-theme-dark .lv-account-notifications,
html.lv-theme-dark .lv-account-notification-item,
html.lv-theme-dark .lv-account-notification-empty{
border-color:rgba(148,163,184,.18);
background:rgba(15,23,42,.86);
}
html.lv-theme-dark .lv-account-notifications-head h2,
html.lv-theme-dark .lv-account-notification-item strong,
html.lv-theme-dark .lv-account-notification-empty strong{
color:#f8fafc;
}
html.lv-theme-dark .lv-account-notification-item em,
html.lv-theme-dark .lv-account-notification-empty{
color:#cbd5e1;
}
@media (max-width:640px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply{
grid-column:1 / -1!important;
grid-template-columns:30px minmax(0,1fr)!important;
padding-left:44px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::before{
left:17px!important;
width:20px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-list .lv-comment-item > .lv-comment-item.is-reply::after{
left:17px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-report-dialog{
padding:16px!important;
}
}
/* v84: single post reading time placement */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-kicker-row{
display:none!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reading-note{
display:inline-flex!important;
align-items:center!important;
gap:7px!important;
margin-top:10px!important;
color:#667085!important;
font-size:13px!important;
line-height:1.2!important;
font-weight:600!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reading-note i{
color:#4772ff!important;
font-size:14px!important;
}
html.lv-theme-dark .lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-reading-note{
color:#94a3b8!important;
}
/* v85: prevent legacy title card overlap on single blog hero */
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-single-nav{
margin-bottom:24px!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-hero{
margin-top:0!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-title-card{
width:auto!important;
max-width:none!important;
margin:0!important;
}
/* v86: category archive layout */
.lv-blog-category-page{
box-sizing:border-box;
min-height:70vh;
padding:28px 0 72px;
background:#fff;
color:#0f172a;
}
.lv-blog-category-page *,
.lv-blog-category-page *::before,
.lv-blog-category-page *::after{
box-sizing:border-box;
}
.lv-blog-category-shell{
width:min(1240px, calc(100% - 40px));
margin:0 auto;
}
.lv-cat-featured-section h1,
.lv-cat-main-section h2{
margin:0 0 22px;
color:#020617;
font-size:30px;
line-height:1.15;
font-weight:800;
letter-spacing:0;
}
.lv-cat-featured-grid{
display:grid;
grid-template-columns:repeat(4, minmax(0, 1fr));
gap:16px;
}
.lv-cat-featured-card{
display:block;
min-width:0;
color:#0f172a;
text-decoration:none;
}
.lv-cat-featured-media{
display:block;
aspect-ratio:16 / 10.6;
overflow:hidden;
border-radius:8px;
background:#e5e7eb;
}
.lv-cat-featured-media img,
.lv-cat-list-thumb img,
.lv-cat-latest-thumb img{
display:block;
width:100%;
height:100%;
object-fit:cover;
}
.lv-cat-featured-card strong{
display:-webkit-box;
min-height:44px;
margin-top:12px;
overflow:hidden;
color:#111827;
font-size:16px;
line-height:1.38;
font-weight:800;
letter-spacing:0;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
.lv-cat-featured-card:hover strong,
.lv-cat-list-body h3 a:hover,
.lv-cat-latest-item:hover strong{
color:#3157dc;
}
.lv-cat-meta{
display:flex;
min-width:0;
align-items:center;
gap:6px;
margin-top:7px;
color:#667085;
font-size:13px;
line-height:1.25;
font-weight:500;
}
.lv-cat-meta span{
display:inline-flex;
min-width:0;
align-items:center;
gap:5px;
}
.lv-cat-meta i{
color:#667085;
font-size:12px;
}
.lv-cat-meta-dot{
color:#98a2b3;
}
.lv-cat-content-grid{
display:grid;
grid-template-columns:minmax(0, 1fr) 360px;
gap:32px;
align-items:start;
}
.lv-cat-featured-section + .lv-cat-content-grid{
margin-top:58px;
}
.lv-cat-post-list{
display:grid;
}
.lv-cat-list-item{
display:grid;
grid-template-columns:260px minmax(0, 1fr);
gap:24px;
align-items:center;
padding:28px 0;
border-bottom:1px solid #e5e7eb;
}
.lv-cat-list-item:first-child{
padding-top:0;
}
.lv-cat-list-thumb{
display:block;
aspect-ratio:16 / 10.7;
overflow:hidden;
border-radius:6px;
background:#e5e7eb;
color:#64748b;
text-decoration:none;
}
.lv-cat-list-body{
min-width:0;
}
.lv-cat-list-body h3{
margin:0 0 8px;
color:#020617;
font-size:21px;
line-height:1.32;
font-weight:800;
letter-spacing:0;
}
.lv-cat-list-body h3 a{
display:-webkit-box;
overflow:hidden;
color:inherit;
text-decoration:none;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
.lv-cat-list-body p{
display:-webkit-box;
margin:0;
overflow:hidden;
color:#111827;
font-size:15px;
line-height:1.55;
letter-spacing:0;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
.lv-cat-latest-card{
position:sticky;
top:96px;
overflow:hidden;
border:1px solid #d7dce5;
border-radius:8px;
background:#fff;
}
.lv-cat-latest-card h2{
margin:0;
padding:18px 20px;
background:#f3f4f6;
color:#020617;
text-align:center;
font-size:20px;
line-height:1.2;
font-weight:800;
letter-spacing:0;
}
.lv-cat-latest-list{
display:grid;
padding:12px 16px 14px;
}
.lv-cat-latest-item{
display:grid;
grid-template-columns:96px minmax(0, 1fr);
gap:12px;
align-items:center;
padding:8px 0;
color:#111827;
text-decoration:none;
}
.lv-cat-latest-thumb{
display:block;
width:96px;
height:64px;
overflow:hidden;
border-radius:6px;
background:#e5e7eb;
}
.lv-cat-latest-body{
display:block;
min-width:0;
}
.lv-cat-latest-item strong{
display:-webkit-box;
overflow:hidden;
color:#111827;
font-size:14px;
line-height:1.35;
font-weight:800;
letter-spacing:0;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
.lv-cat-latest-item .lv-cat-meta{
margin-top:5px;
font-size:12px;
}
.lv-cat-latest-item .lv-cat-meta i{
font-size:11px;
}
.lv-cat-thumb-placeholder{
display:grid;
width:100%;
height:100%;
min-height:64px;
place-items:center;
background:#eef2f7;
color:#64748b;
}
.lv-cat-thumb-placeholder i{
font-size:24px;
}
.lv-cat-empty{
display:grid;
gap:5px;
padding:22px 0;
border-bottom:1px solid #e5e7eb;
color:#64748b;
font-size:14px;
}
.lv-cat-empty strong{
color:#0f172a;
font-size:16px;
}
.lv-cat-more-wrap{
display:flex;
justify-content:center;
margin-top:28px;
}
.lv-cat-more-button{
display:inline-flex;
min-height:36px;
align-items:center;
justify-content:center;
gap:8px;
padding:0 16px;
border:1px solid #d1d5db;
border-radius:999px;
background:#fff;
color:#111827;
font-size:14px;
font-weight:700;
line-height:1;
text-decoration:none;
}
.lv-cat-more-button:hover{
border-color:#3157dc;
color:#3157dc;
}
html.lv-theme-dark .lv-blog-category-page{
background:#0f172a;
color:#e5e7eb;
}
html.lv-theme-dark .lv-cat-featured-section h1,
html.lv-theme-dark .lv-cat-main-section h2,
html.lv-theme-dark .lv-cat-featured-card strong,
html.lv-theme-dark .lv-cat-list-body h3,
html.lv-theme-dark .lv-cat-list-body p,
html.lv-theme-dark .lv-cat-latest-card h2,
html.lv-theme-dark .lv-cat-latest-item strong,
html.lv-theme-dark .lv-cat-empty strong{
color:#f8fafc;
}
html.lv-theme-dark .lv-cat-latest-card,
html.lv-theme-dark .lv-cat-more-button{
border-color:rgba(148,163,184,.22);
background:#111827;
}
html.lv-theme-dark .lv-cat-latest-card h2{
background:#1f2937;
}
html.lv-theme-dark .lv-cat-list-item,
html.lv-theme-dark .lv-cat-empty{
border-color:rgba(148,163,184,.18);
}
html.lv-theme-dark .lv-cat-meta,
html.lv-theme-dark .lv-cat-meta i,
html.lv-theme-dark .lv-cat-empty{
color:#cbd5e1;
}
@media (max-width:1100px){
.lv-cat-content-grid{
grid-template-columns:minmax(0, 1fr) 320px;
gap:26px;
}
.lv-cat-list-item{
grid-template-columns:220px minmax(0, 1fr);
gap:20px;
}
}
@media (max-width:920px){
.lv-cat-featured-grid{
grid-template-columns:repeat(2, minmax(0, 1fr));
}
.lv-cat-content-grid{
grid-template-columns:1fr;
}
.lv-cat-latest-card{
position:static;
}
}
@media (max-width:640px){
.lv-blog-category-page{
padding:22px 0 56px;
}
.lv-blog-category-shell{
width:min(100% - 28px, 1240px);
}
.lv-cat-featured-section h1,
.lv-cat-main-section h2{
margin-bottom:16px;
font-size:25px;
}
.lv-cat-featured-grid,
.lv-cat-list-item{
grid-template-columns:1fr;
}
.lv-cat-featured-section + .lv-cat-content-grid{
margin-top:42px;
}
.lv-cat-list-item{
gap:14px;
align-items:start;
}
.lv-cat-list-body h3{
font-size:19px;
}
.lv-cat-latest-item{
grid-template-columns:86px minmax(0, 1fr);
}
.lv-cat-latest-thumb{
width:86px;
height:58px;
}
}
/* v87: header notification badge and hover panel */
.lv-header-notification{
position:relative!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
}
.lv-header-notification::after{
content:"";
position:absolute;
top:100%;
right:-12px;
width:380px;
height:16px;
}
.lv-header-notification .lv-notification-link{
position:relative!important;
display:inline-grid!important;
overflow:visible!important;
place-items:center!important;
}
.lv-header-notification .lv-notification-link svg,
.lv-header-notification .lv-notification-link .lv-nav-custom-svg svg{
transform-origin:50% 6%;
}
.lv-header-notification.has-unread .lv-notification-link svg,
.lv-header-notification.has-unread .lv-notification-link .lv-nav-custom-svg svg{
animation:lv-bell-ring 1.65s ease-in-out infinite;
}
.lv-header-notification .lv-notification-link span.lv-notification-count{
position:absolute!important;
top:-5px!important;
right:-6px!important;
display:inline-flex!important;
width:auto!important;
min-width:17px!important;
height:17px!important;
min-height:17px!important;
align-items:center!important;
justify-content:center!important;
padding:0 5px!important;
clip:auto!important;
overflow:visible!important;
border:2px solid #fff!important;
border-radius:999px!important;
background:#ef233c!important;
color:#fff!important;
font-size:10px!important;
line-height:1!important;
font-weight:800!important;
letter-spacing:0!important;
white-space:nowrap!important;
box-shadow:0 6px 14px rgba(239,35,60,.26)!important;
}
.lv-notification-popover{
position:absolute!important;
top:calc(100% + 14px)!important;
right:-8px!important;
z-index:1800!important;
width:360px!important;
max-width:calc(100vw - 28px)!important;
overflow:visible!important;
border:1px solid rgba(148,163,184,.18)!important;
border-radius:18px!important;
background:#fff!important;
box-shadow:0 24px 70px rgba(15,23,42,.16)!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translateY(-8px)!important;
transition:opacity .18s ease, visibility .18s ease, transform .18s ease!important;
}
.lv-notification-popover::before{
content:"";
position:absolute;
top:-8px;
right:18px;
width:16px;
height:16px;
border-top:1px solid rgba(148,163,184,.18);
border-left:1px solid rgba(148,163,184,.18);
border-radius:4px 0 0 0;
background:#fff;
transform:rotate(45deg);
}
.lv-header-notification:hover .lv-notification-popover,
.lv-header-notification:focus-within .lv-notification-popover{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translateY(0)!important;
}
.lv-notification-popover-head{
position:relative;
z-index:1;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:16px 16px 12px;
border-bottom:1px solid #eef2f7;
}
.lv-notification-popover-head strong{
color:#111827;
font-size:16px;
line-height:1.2;
font-weight:800;
}
.lv-notification-popover-head span{
display:inline-flex;
min-height:24px;
align-items:center;
padding:0 9px;
border-radius:999px;
background:#fff1f2;
color:#ef233c;
font-size:12px;
font-weight:800;
}
.lv-notification-popover-list{
position:relative;
z-index:1;
display:grid;
max-height:360px;
overflow:auto;
padding:8px;
}
.lv-notification-popover-item{
display:grid!important;
grid-template-columns:38px minmax(0,1fr)!important;
gap:10px!important;
align-items:flex-start!important;
padding:10px 8px!important;
border-radius:12px!important;
color:#111827!important;
text-decoration:none!important;
}
.lv-notification-popover-item:hover{
background:#f5f7fb!important;
}
.lv-notification-popover-item.is-unread{
background:#f8fbff!important;
}
.lv-notification-item-icon{
display:grid!important;
width:38px!important;
height:38px!important;
place-items:center!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#3157dc!important;
font-size:15px!important;
}
.lv-notification-popover-item.is-unread .lv-notification-item-icon{
background:#fff1f2!important;
color:#ef233c!important;
}
.lv-notification-item-copy{
display:block!important;
min-width:0!important;
}
.lv-notification-item-copy strong,
.lv-notification-item-copy em,
.lv-notification-item-copy small{
display:block!important;
}
.lv-notification-item-copy strong{
overflow:hidden!important;
color:#111827!important;
font-size:14px!important;
line-height:1.35!important;
font-weight:800!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-notification-item-copy em{
display:-webkit-box!important;
margin-top:3px!important;
overflow:hidden!important;
color:#667085!important;
font-size:12px!important;
font-style:normal!important;
line-height:1.42!important;
-webkit-box-orient:vertical!important;
-webkit-line-clamp:2!important;
}
.lv-notification-item-copy small{
margin-top:5px!important;
color:#98a2b3!important;
font-size:11px!important;
line-height:1.2!important;
}
.lv-notification-popover-empty{
position:relative;
z-index:1;
display:grid;
justify-items:center;
gap:8px;
padding:26px 18px;
color:#667085;
text-align:center;
}
.lv-notification-popover-empty i{
display:grid;
width:42px;
height:42px;
place-items:center;
border-radius:999px;
background:#f2f4f7;
color:#667085;
font-size:17px;
}
.lv-notification-popover-empty strong{
color:#344054;
font-size:14px;
}
.lv-notification-popover-all{
position:relative;
z-index:1;
display:flex!important;
min-height:42px!important;
align-items:center!important;
justify-content:center!important;
border-top:1px solid #eef2f7!important;
color:#3157dc!important;
font-size:13px!important;
font-weight:800!important;
text-decoration:none!important;
}
.lv-notification-popover-all:hover{
background:#f8fbff!important;
}
@keyframes lv-bell-ring{
0%, 42%, 100%{transform:rotate(0)}
6%{transform:rotate(16deg)}
12%{transform:rotate(-14deg)}
18%{transform:rotate(12deg)}
24%{transform:rotate(-8deg)}
30%{transform:rotate(5deg)}
}
@media (prefers-reduced-motion:reduce){
.lv-header-notification.has-unread .lv-notification-link svg,
.lv-header-notification.has-unread .lv-notification-link .lv-nav-custom-svg svg{
animation:none!important;
}
}
html.lv-theme-dark .lv-notification-popover,
html.lv-theme-dark .lv-notification-popover::before{
border-color:rgba(148,163,184,.18)!important;
background:#101827!important;
}
html.lv-theme-dark .lv-header-notification .lv-notification-link span.lv-notification-count{
border-color:#101827!important;
}
html.lv-theme-dark .lv-notification-popover-head{
border-color:rgba(148,163,184,.16)!important;
}
html.lv-theme-dark .lv-notification-popover-head strong,
html.lv-theme-dark .lv-notification-item-copy strong,
html.lv-theme-dark .lv-notification-popover-empty strong{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-notification-popover-head span{
background:rgba(239,35,60,.14)!important;
}
html.lv-theme-dark .lv-notification-popover-item:hover,
html.lv-theme-dark .lv-notification-popover-item.is-unread,
html.lv-theme-dark .lv-notification-popover-all:hover{
background:rgba(148,163,184,.08)!important;
}
html.lv-theme-dark .lv-notification-item-copy em,
html.lv-theme-dark .lv-notification-popover-empty{
color:#cbd5e1!important;
}
html.lv-theme-dark .lv-notification-item-copy small{
color:#94a3b8!important;
}
html.lv-theme-dark .lv-notification-popover-all,
html.lv-theme-dark .lv-notification-popover-head,
html.lv-theme-dark .lv-notification-popover-all{
border-color:rgba(148,163,184,.16)!important;
}
@media (max-width:768px){
.lv-header-notification{
display:none!important;
}
}
/* v88: app-style mobile filter bottom sheet */
@media (max-width:768px){
body.lv-sidebar-open{
overflow:hidden!important;
touch-action:none;
}
.sidebar-overlay,
.lv-discover-section .sidebar-overlay,
.lv-design-archive-page .sidebar-overlay{
display:block!important;
position:fixed!important;
inset:0!important;
z-index:2490!important;
background:rgba(15,23,42,.40)!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
-webkit-backdrop-filter:blur(8px) saturate(120%)!important;
backdrop-filter:blur(8px) saturate(120%)!important;
transition:opacity .22s ease, visibility .22s ease!important;
}
.sidebar-overlay.active,
.lv-discover-section .sidebar-overlay.active,
.lv-design-archive-page .sidebar-overlay.active{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
}
.sidebar,
.lv-discover-section .sidebar,
.lv-design-archive-page .sidebar{
position:fixed!important;
top:auto!important;
right:0!important;
bottom:0!important;
left:0!important;
z-index:2500!important;
display:block!important;
width:100%!important;
max-width:none!important;
height:auto!important;
max-height:min(84dvh, 720px)!important;
min-height:44vh!important;
padding:0 18px max(24px, env(safe-area-inset-bottom))!important;
overflow-y:auto!important;
border:0!important;
border-radius:24px 24px 0 0!important;
background:#fff!important;
box-shadow:0 -22px 54px rgba(15,23,42,.22)!important;
-webkit-overflow-scrolling:touch!important;
transform:translate3d(0, 105%, 0)!important;
transition:transform .28s cubic-bezier(.22,1,.36,1)!important;
}
.sidebar.active,
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
left:0!important;
transform:translate3d(0, 0, 0)!important;
}
.sidebar-mobile-header,
.lv-discover-section .sidebar-mobile-header,
.lv-design-archive-page .sidebar-mobile-header{
position:sticky!important;
top:0!important;
z-index:12!important;
display:flex!important;
min-height:72px!important;
align-items:center!important;
justify-content:flex-end!important;
margin:0 -18px 2px!important;
padding:20px 18px 12px!important;
border:0!important;
background:#fff!important;
}
.sidebar-mobile-header::before,
.lv-discover-section .sidebar-mobile-header::before,
.lv-design-archive-page .sidebar-mobile-header::before{
content:""!important;
position:absolute!important;
top:12px!important;
left:50%!important;
width:42px!important;
height:4px!important;
border-radius:999px!important;
background:#d4d8e2!important;
transform:translateX(-50%)!important;
}
.sidebar-mobile-header h3,
.lv-discover-section .sidebar-mobile-header h3,
.lv-design-archive-page .sidebar-mobile-header h3{
position:absolute!important;
width:1px!important;
height:1px!important;
overflow:hidden!important;
clip:rect(0,0,0,0)!important;
white-space:nowrap!important;
}
.sidebar-close-btn,
.lv-discover-section .sidebar-close-btn,
.lv-design-archive-page .sidebar-close-btn{
display:grid!important;
width:42px!important;
height:42px!important;
min-width:42px!important;
place-items:center!important;
padding:0!important;
border:0!important;
border-radius:999px!important;
background:#f5f7fb!important;
color:#111827!important;
box-shadow:none!important;
}
.sidebar-close-btn svg,
.lv-discover-section .sidebar-close-btn svg,
.lv-design-archive-page .sidebar-close-btn svg{
width:18px!important;
height:18px!important;
stroke:currentColor!important;
stroke-width:2.2!important;
}
.sidebar .active-filters{
margin:0!important;
}
.sidebar .filter-section,
.lv-discover-section .sidebar .filter-section,
.lv-design-archive-page .sidebar .filter-section,
.lv-discover-section .sidebar .active-filters .filter-section,
.lv-design-archive-page .sidebar .active-filters .filter-section{
margin:0!important;
padding:0!important;
border:0!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
}
.sidebar .filter-section + .filter-section,
.sidebar .active-filters + .filter-section,
.sidebar .filter-section + .tags-filter-section{
margin-top:16px!important;
}
.sidebar .filter-section > h3,
.sidebar .filter-header,
.lv-discover-section .sidebar .filter-section > h3,
.lv-design-archive-page .sidebar .filter-section > h3{
position:relative!important;
display:flex!important;
min-height:34px!important;
align-items:center!important;
gap:8px!important;
margin:0 0 12px!important;
padding:0 30px 10px 0!important;
border-bottom:2px solid #3157ff!important;
color:#020617!important;
font-size:14px!important;
line-height:1!important;
font-weight:900!important;
letter-spacing:.02em!important;
text-transform:uppercase!important;
}
.sidebar .filter-section > h3::after,
.lv-discover-section .sidebar .filter-section > h3::after,
.lv-design-archive-page .sidebar .filter-section > h3::after{
content:""!important;
position:absolute!important;
top:6px!important;
right:1px!important;
width:9px!important;
height:9px!important;
border-top:1.6px solid #111827!important;
border-left:1.6px solid #111827!important;
transform:rotate(45deg)!important;
}
.sidebar .filter-section > h3 svg,
.lv-discover-section .sidebar .filter-section > h3 svg,
.lv-design-archive-page .sidebar .filter-section > h3 svg{
width:18px!important;
height:18px!important;
flex:0 0 18px!important;
margin:0!important;
color:#020617!important;
stroke:currentColor!important;
}
.sidebar .filter-header{
justify-content:space-between!important;
padding-right:0!important;
}
.sidebar .filter-header h3{
margin:0!important;
padding:0!important;
border:0!important;
color:inherit!important;
font-size:14px!important;
}
.sidebar .filter-header .clear-filters-btn{
min-height:28px!important;
padding:0 10px!important;
border:1px solid #dbe5f4!important;
border-radius:999px!important;
background:#fff!important;
color:#3157dc!important;
font-size:12px!important;
font-weight:800!important;
}
.sidebar .filter-options{
display:grid!important;
gap:0!important;
}
.sidebar .filter-options .filter-option{
display:flex!important;
min-height:40px!important;
align-items:center!important;
gap:11px!important;
margin:0!important;
padding:0!important;
color:#020617!important;
}
.sidebar .filter-options .filter-option input[type="checkbox"],
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]{
appearance:none!important;
-webkit-appearance:none!important;
display:inline-grid!important;
width:17px!important;
height:17px!important;
min-width:17px!important;
place-items:center!important;
margin:0!important;
border:1.5px solid #b7c4d8!important;
border-radius:3px!important;
background:#fff!important;
box-shadow:none!important;
}
.sidebar .filter-options .filter-option input[type="checkbox"]:checked,
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked{
border-color:#3157ff!important;
background:#3157ff!important;
}
.sidebar .filter-options .filter-option input[type="checkbox"]:checked::after,
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked::after{
content:""!important;
width:8px!important;
height:5px!important;
border-left:2px solid #fff!important;
border-bottom:2px solid #fff!important;
transform:rotate(-45deg) translate(1px,-1px)!important;
}
.sidebar .filter-options .filter-option label{
display:flex!important;
min-width:0!important;
flex:1 1 auto!important;
align-items:center!important;
gap:5px!important;
margin:0!important;
color:#020617!important;
font-size:15px!important;
line-height:1.35!important;
font-weight:500!important;
}
.sidebar .filter-options .filter-option label span{
color:#98a2b3!important;
font-size:12px!important;
}
.sidebar .lv-resource-filter-list{
display:grid!important;
grid-template-columns:repeat(2, minmax(0, 1fr))!important;
gap:10px!important;
margin-bottom:4px!important;
}
.sidebar .lv-resource-filter-option,
.sidebar .lv-resource-filter-option label{
width:auto!important;
height:44px!important;
min-height:44px!important;
}
.sidebar .lv-format-filter-list{
display:grid!important;
grid-template-columns:repeat(4, minmax(0, 1fr))!important;
gap:9px!important;
}
.sidebar .color-palette{
display:flex!important;
flex-wrap:wrap!important;
gap:10px!important;
padding-bottom:4px!important;
}
.sidebar .tags-filter-cloud{
display:flex!important;
flex-wrap:wrap!important;
gap:8px!important;
padding-bottom:4px!important;
}
.sidebar .tag-filter-item{
min-height:34px!important;
align-items:center!important;
padding:0 11px!important;
border:1px solid #dbe5f4!important;
border-radius:999px!important;
background:#fff!important;
font-size:13px!important;
}
.sidebar .selected-filters{
display:flex!important;
flex-wrap:wrap!important;
gap:8px!important;
}
.sidebar .filter-tag{
min-height:30px!important;
padding:0 10px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#3157dc!important;
font-size:12px!important;
font-weight:800!important;
}
}
@media (max-width:420px){
.sidebar,
.lv-discover-section .sidebar,
.lv-design-archive-page .sidebar{
max-height:82dvh!important;
border-radius:22px 22px 0 0!important;
}
.sidebar .lv-format-filter-list{
grid-template-columns:repeat(3, minmax(0, 1fr))!important;
}
}
@media (max-width:768px){
html.lv-theme-dark .sidebar,
html.lv-theme-dark .lv-discover-section .sidebar,
html.lv-theme-dark .lv-design-archive-page .sidebar,
html.lv-theme-dark .sidebar-mobile-header,
html.lv-theme-dark .lv-discover-section .sidebar-mobile-header,
html.lv-theme-dark .lv-design-archive-page .sidebar-mobile-header{
background:#0f172a!important;
color:#f8fafc!important;
}
html.lv-theme-dark .sidebar .filter-section,
html.lv-theme-dark .lv-discover-section .sidebar .filter-section,
html.lv-theme-dark .lv-design-archive-page .sidebar .filter-section,
html.lv-theme-dark .lv-discover-section .sidebar .active-filters .filter-section,
html.lv-theme-dark .lv-design-archive-page .sidebar .active-filters .filter-section{
background:transparent!important;
border:0!important;
box-shadow:none!important;
}
html.lv-theme-dark .sidebar .filter-section > h3,
html.lv-theme-dark .sidebar .filter-header,
html.lv-theme-dark .sidebar .filter-header h3,
html.lv-theme-dark .sidebar .filter-options .filter-option,
html.lv-theme-dark .sidebar .filter-options .filter-option label{
color:#f8fafc!important;
}
html.lv-theme-dark .sidebar .filter-section > h3::after{
border-color:#f8fafc!important;
}
html.lv-theme-dark .sidebar .filter-options .filter-option input[type="checkbox"],
html.lv-theme-dark .sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]{
background:#111827!important;
border-color:#64748b!important;
}
html.lv-theme-dark .sidebar .filter-options .filter-option input[type="checkbox"]:checked,
html.lv-theme-dark .sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked{
background:#4772ff!important;
border-color:#7aa2ff!important;
}
html.lv-theme-dark .sidebar-close-btn{
background:#1f2937!important;
color:#f8fafc!important;
}
}
/* v89: clean mobile filter controls for resource, format and color */
@media (max-width:768px){
.sidebar .lv-filter-section-resource,
.sidebar .lv-filter-section-format,
.sidebar .lv-filter-section-color{
padding-bottom:4px!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-list{
display:grid!important;
grid-template-columns:90px 90px!important;
justify-content:space-between!important;
align-items:center!important;
gap:16px!important;
padding:0 2px 6px!important;
margin:0!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-option{
width:90px!important;
height:44px!important;
min-width:90px!important;
min-height:44px!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-option label{
width:90px!important;
height:44px!important;
min-height:44px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
padding:0 12px!important;
border:1px solid #dbe4ef!important;
border-radius:12px!important;
background:#fff!important;
box-shadow:0 12px 28px rgba(15,23,42,.06)!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
transform:none!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-icon,
.sidebar .lv-filter-section-resource .lv-resource-filter-icon .lv-icon-svg,
.sidebar .lv-filter-section-resource .lv-resource-filter-icon .lv-nav-custom-svg,
.sidebar .lv-filter-section-resource .lv-resource-filter-icon .lv-nav-custom-svg svg{
width:18px!important;
height:18px!important;
flex-basis:18px!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-name{
color:inherit!important;
font-size:13px!important;
line-height:1!important;
font-weight:800!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-free label{
color:#2faa5b!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-vip label{
color:#f59e0b!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-option input[type="checkbox"]:checked + label{
border-color:#3157ff!important;
background:#f8fbff!important;
color:#3157ff!important;
box-shadow:0 14px 30px rgba(49,87,255,.12)!important;
}
.sidebar .lv-filter-section-resource .lv-resource-filter-option input[type="checkbox"]:checked + label::before{
top:7px!important;
right:7px!important;
width:6px!important;
height:6px!important;
background:#3157ff!important;
box-shadow:none!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-list{
display:grid!important;
grid-template-columns:repeat(3, 92px)!important;
justify-content:start!important;
align-items:start!important;
gap:10px!important;
padding:0 0 6px!important;
margin:0!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option{
width:92px!important;
height:92px!important;
min-width:92px!important;
aspect-ratio:auto!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option label{
width:92px!important;
height:92px!important;
min-height:92px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:1px solid #dbe4ef!important;
border-radius:7px!important;
background:#fff!important;
box-shadow:0 10px 24px rgba(15,23,42,.045)!important;
transform:none!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option label::after{
display:none!important;
content:none!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option input[type="checkbox"]:checked + label{
border-color:#3157ff!important;
background:#f8fbff!important;
box-shadow:0 12px 26px rgba(49,87,255,.12), inset 0 0 0 1px rgba(49,87,255,.08)!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option input[type="checkbox"]:checked + label::before{
top:7px!important;
right:7px!important;
width:7px!important;
height:7px!important;
background:#3157ff!important;
box-shadow:none!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option .lv-format-icon.is-filter-format{
width:30px!important;
height:30px!important;
min-width:30px!important;
display:grid!important;
place-items:center!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner,
.sidebar .lv-filter-section-format .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner svg,
.sidebar .lv-filter-section-format .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner img{
width:24px!important;
height:24px!important;
max-width:24px!important;
max-height:24px!important;
}
.sidebar .lv-filter-section-color .color-palette{
display:flex!important;
flex-wrap:nowrap!important;
align-items:center!important;
gap:10px!important;
min-height:24px!important;
padding:0 0 8px!important;
margin:0!important;
overflow-x:auto!important;
scrollbar-width:none!important;
}
.sidebar .lv-filter-section-color .color-palette::-webkit-scrollbar{
display:none!important;
}
.sidebar .lv-filter-section-color .color-swatch-wrapper{
display:inline-flex!important;
width:18px!important;
height:28px!important;
min-width:18px!important;
align-items:center!important;
justify-content:center!important;
margin:0!important;
padding:0!important;
}
.sidebar .lv-filter-section-color .color-swatch{
width:11px!important;
height:11px!important;
min-width:11px!important;
min-height:11px!important;
border:0!important;
border-radius:999px!important;
box-shadow:none!important;
transform:none!important;
}
.sidebar .lv-filter-section-color .color-swatch:hover{
transform:scale(1.35)!important;
}
.sidebar .lv-filter-section-color .color-swatch.selected{
width:14px!important;
height:14px!important;
min-width:14px!important;
min-height:14px!important;
outline:2px solid rgba(49,87,255,.22)!important;
outline-offset:2px!important;
box-shadow:0 0 0 1px rgba(255,255,255,.96)!important;
}
.sidebar .lv-filter-section-color .color-swatch.selected::after{
display:none!important;
content:none!important;
}
}
@media (max-width:360px){
.sidebar .lv-filter-section-format .lv-format-filter-list{
grid-template-columns:repeat(3, minmax(0, 1fr))!important;
}
.sidebar .lv-filter-section-format .lv-format-filter-option,
.sidebar .lv-filter-section-format .lv-format-filter-option label{
width:100%!important;
height:auto!important;
min-width:0!important;
min-height:82px!important;
}
}
@media (max-width:768px){
html.lv-theme-dark .sidebar .lv-filter-section-resource .lv-resource-filter-option label,
html.lv-theme-dark .sidebar .lv-filter-section-format .lv-format-filter-option label{
background:#111827!important;
border-color:rgba(148,163,184,.26)!important;
box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
}
html.lv-theme-dark .sidebar .lv-filter-section-resource .lv-resource-filter-option input[type="checkbox"]:checked + label,
html.lv-theme-dark .sidebar .lv-filter-section-format .lv-format-filter-option input[type="checkbox"]:checked + label{
border-color:#7aa2ff!important;
background:#13213d!important;
color:#9bb8ff!important;
}
}
.lv-account-sheet-close{
display:none;
}
/* v90: mobile account menu matches app-style sheet */
@media (max-width:768px){
body > .lv-account-menu[data-lv-account-ported="true"],
.lv-account-menu{
box-sizing:border-box!important;
max-height:min(88dvh,760px)!important;
padding:44px 14px max(20px, env(safe-area-inset-bottom))!important;
border:0!important;
border-radius:20px 20px 0 0!important;
background:#fff!important;
box-shadow:0 -22px 54px rgba(15,23,42,.22)!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
}
body > .lv-account-menu[data-lv-account-ported="true"]::before,
.lv-account-menu::before{
content:""!important;
position:absolute!important;
top:14px!important;
left:50%!important;
display:block!important;
width:48px!important;
height:4px!important;
border:0!important;
border-radius:999px!important;
background:#d4d8e2!important;
transform:translateX(-50%)!important;
}
.lv-account-sheet-close{
position:absolute!important;
top:18px!important;
right:14px!important;
z-index:2!important;
display:grid!important;
width:42px!important;
height:42px!important;
place-items:center!important;
padding:0!important;
border:0!important;
border-radius:999px!important;
background:#f5f7fb!important;
color:#0f172a!important;
font-size:20px!important;
line-height:1!important;
font-weight:600!important;
cursor:pointer!important;
}
.lv-account-sheet-close span{
display:block!important;
transform:translateY(-1px)!important;
}
.lv-account-profile{
display:grid!important;
grid-template-columns:58px minmax(0,1fr)!important;
gap:13px!important;
align-items:center!important;
margin:0 56px 16px 4px!important;
}
.lv-account-avatar{
width:58px!important;
height:58px!important;
min-width:58px!important;
border-radius:999px!important;
object-fit:cover!important;
background:#e5e7eb!important;
}
.lv-account-profile strong{
display:block!important;
overflow:hidden!important;
color:#020617!important;
font-size:19px!important;
line-height:1.2!important;
font-weight:500!important;
letter-spacing:0!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-profile span{
display:block!important;
margin-top:3px!important;
color:#4b5f86!important;
font-size:13px!important;
line-height:1.25!important;
font-weight:400!important;
}
.lv-account-stats{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:0!important;
overflow:hidden!important;
margin:0 0 16px!important;
border:1px solid #e3e9f4!important;
border-radius:15px!important;
background:#fff!important;
text-align:center!important;
}
.lv-account-stats div{
min-width:0!important;
padding:11px 6px 12px!important;
}
.lv-account-stats div + div{
border-left:1px solid #e9eef6!important;
}
.lv-account-stats strong{
display:block!important;
overflow:hidden!important;
color:#020617!important;
font-size:17px!important;
line-height:1.15!important;
font-weight:500!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-stats span{
display:block!important;
margin-top:7px!important;
overflow:hidden!important;
color:#6b7da3!important;
font-size:12px!important;
line-height:1.2!important;
font-weight:400!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
.lv-account-plan{
margin:0 0 14px!important;
padding:12px!important;
border-radius:16px!important;
background:linear-gradient(180deg,#eef4ff,#e9f0ff)!important;
}
.lv-plan-title{
display:flex!important;
align-items:center!important;
gap:8px!important;
margin:0 0 10px!important;
color:#111827!important;
}
.lv-plan-title svg{
width:19px!important;
height:19px!important;
color:#f59e0b!important;
fill:none!important;
stroke:currentColor!important;
}
.lv-plan-title strong{
color:#111827!important;
font-size:16px!important;
line-height:1.2!important;
font-weight:500!important;
}
.lv-plan-card{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
gap:12px!important;
align-items:center!important;
margin:8px 0 0!important;
padding:13px 12px!important;
border:0!important;
border-radius:14px!important;
background:#fff!important;
box-shadow:none!important;
}
.lv-plan-card strong{
display:block!important;
margin:0 0 5px!important;
color:#111827!important;
font-size:14px!important;
line-height:1.2!important;
font-weight:500!important;
}
.lv-plan-card p{
display:-webkit-box!important;
margin:0!important;
overflow:hidden!important;
color:#63708f!important;
font-size:12px!important;
line-height:1.35!important;
font-weight:400!important;
-webkit-box-orient:vertical!important;
-webkit-line-clamp:2!important;
}
.lv-plan-card a{
display:inline-flex!important;
min-height:40px!important;
align-items:center!important;
justify-content:center!important;
padding:0 15px!important;
border-radius:999px!important;
background:#ffd66d!important;
color:#9a5a00!important;
font-size:13px!important;
line-height:1!important;
font-weight:500!important;
text-decoration:none!important;
white-space:nowrap!important;
}
.lv-account-menu .dropdown-divider{
display:none!important;
}
.lv-account-menu .dropdown-item{
display:flex!important;
min-height:49px!important;
align-items:center!important;
gap:13px!important;
margin:0 -14px!important;
padding:0 20px!important;
border-top:1px solid #eef2f7!important;
border-radius:0!important;
background:#fff!important;
color:#020617!important;
font-size:15px!important;
line-height:1.2!important;
font-weight:500!important;
text-decoration:none!important;
}
.lv-account-menu .dropdown-item svg{
width:20px!important;
height:20px!important;
flex:0 0 20px!important;
color:#3157ff!important;
fill:none!important;
stroke:currentColor!important;
stroke-width:1.8!important;
stroke-linecap:round!important;
stroke-linejoin:round!important;
}
.lv-account-menu .dropdown-item:hover,
.lv-account-menu .dropdown-item:focus-visible{
background:#f8fbff!important;
color:#3157ff!important;
}
.lv-account-menu .dropdown-item.logout{
color:#dc2626!important;
}
.lv-account-menu .dropdown-item.logout svg{
color:#dc2626!important;
}
body.lv-account-sheet-open .lv-account-sheet-backdrop{
background:rgba(15,23,42,.45)!important;
-webkit-backdrop-filter:blur(8px) saturate(120%)!important;
backdrop-filter:blur(8px) saturate(120%)!important;
}
}
@media (max-width:768px){
html.lv-theme-dark body > .lv-account-menu[data-lv-account-ported="true"],
html.lv-theme-dark .lv-account-menu{
background:#0f172a!important;
color:#f8fafc!important;
}
html.lv-theme-dark .lv-account-sheet-close{
background:#1f2937!important;
color:#f8fafc!important;
}
html.lv-theme-dark .lv-account-profile strong,
html.lv-theme-dark .lv-account-stats strong,
html.lv-theme-dark .lv-plan-title strong,
html.lv-theme-dark .lv-plan-card strong,
html.lv-theme-dark .lv-account-menu .dropdown-item{
color:#f8fafc!important;
}
html.lv-theme-dark .lv-account-profile span,
html.lv-theme-dark .lv-account-stats span,
html.lv-theme-dark .lv-plan-card p{
color:#cbd5e1!important;
}
html.lv-theme-dark .lv-account-stats,
html.lv-theme-dark .lv-plan-card,
html.lv-theme-dark .lv-account-menu .dropdown-item{
border-color:rgba(148,163,184,.18)!important;
background:#111827!important;
}
html.lv-theme-dark .lv-account-stats div + div{
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-account-plan{
background:#17223a!important;
}
}
/* Modern archive filter bar - v91 */
.lv-modern-filter-bar{
position:relative;
z-index:1300;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:14px!important;
margin:0 0 22px!important;
padding:0!important;
overflow:visible!important;
}
.lv-modern-filter-bar + .sort-filter-wrapper:not(.lv-modern-filter-bar){
display:none!important;
}
.lv-modern-filter-left,
.lv-modern-filter-meta,
.lv-modern-filter-quick{
display:flex;
align-items:center;
gap:10px;
min-width:0;
}
.lv-modern-filter-left{
flex:1 1 auto;
flex-wrap:wrap;
overflow:visible;
}
.lv-modern-filter-meta{
flex:0 0 auto;
margin-left:auto;
}
.lv-modern-filter-hidden{
display:none!important;
}
.lv-modern-filter-open,
.lv-modern-filter-chip,
.lv-modern-filter-trigger,
.lv-modern-clear,
.lv-modern-sort .sort-select,
.lv-modern-sort.custom-select .custom-select-trigger{
height:38px!important;
min-height:38px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:8px!important;
padding:0 14px!important;
border:1px solid #e4e9f2!important;
border-radius:999px!important;
background:#f8fafc!important;
color:#151b2b!important;
box-shadow:none!important;
font-size:14px!important;
font-weight:500!important;
line-height:1!important;
letter-spacing:0!important;
white-space:nowrap!important;
cursor:pointer!important;
transition:background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease;
}
.lv-modern-filter-open:hover,
.lv-modern-filter-chip:hover,
.lv-modern-filter-trigger:hover,
.lv-modern-clear:hover,
.lv-modern-sort.custom-select .custom-select-trigger:hover{
background:#fff!important;
border-color:#cfd8e8!important;
color:#0f172a!important;
box-shadow:0 8px 22px rgba(15,23,42,.07)!important;
transform:none!important;
}
.lv-modern-filter-open svg,
.lv-modern-filter-chip svg,
.lv-modern-filter-trigger svg,
.lv-modern-clear svg,
.lv-modern-sort-icon svg{
width:16px;
height:16px;
display:block;
fill:none;
stroke:currentColor;
stroke-width:1.8;
stroke-linecap:round;
stroke-linejoin:round;
}
.lv-modern-filter-trigger-icon,
.lv-modern-filter-chip > span:first-child,
.lv-modern-sort-icon{
display:inline-flex;
align-items:center;
justify-content:center;
color:#111827;
}
.lv-modern-filter-chip.is-active,
.lv-modern-filter-group.is-active .lv-modern-filter-trigger{
background:#eef4ff!important;
border-color:#b9c9ff!important;
color:#2457d6!important;
}
.lv-modern-filter-chip-vip.is-active{
background:#fff7d7!important;
border-color:#f5d46d!important;
color:#805300!important;
}
.lv-modern-filter-chip-free.is-active{
background:#ecfdf3!important;
border-color:#a8e7bd!important;
color:#16843a!important;
}
.lv-modern-active-count,
.lv-modern-filter-badge{
min-width:18px;
height:18px;
padding:0 6px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:999px;
background:#2f68ff;
color:#fff;
font-size:11px;
font-weight:500;
line-height:1;
}
.lv-modern-filter-separator{
width:1px;
height:24px;
background:#e5eaf3;
flex:0 0 auto;
}
.lv-modern-filter-group{
position:relative;
flex:0 0 auto;
}
.lv-modern-filter-chevron{
display:inline-flex;
transition:transform .16s ease;
}
.lv-modern-filter-chevron svg{
width:14px;
height:14px;
}
.lv-modern-filter-group.is-open .lv-modern-filter-chevron{
transform:rotate(180deg);
}
.lv-modern-filter-dropdown{
position:absolute;
top:calc(100% + 8px);
left:0;
width:230px;
max-height:430px;
display:none;
overflow:auto;
padding:10px;
border:1px solid #dce3ee;
border-radius:8px;
background:#fff;
box-shadow:0 24px 58px rgba(15,23,42,.16);
z-index:1350;
}
.lv-modern-filter-group.is-open .lv-modern-filter-dropdown{
display:grid;
gap:4px;
}
.lv-modern-filter-dropdown::-webkit-scrollbar{
width:8px;
}
.lv-modern-filter-dropdown::-webkit-scrollbar-track{
background:#f1f5f9;
border-radius:999px;
}
.lv-modern-filter-dropdown::-webkit-scrollbar-thumb{
background:#9ca3af;
border-radius:999px;
}
.lv-modern-filter-option{
width:100%;
min-height:38px;
display:flex;
align-items:center;
gap:10px;
padding:7px 9px;
border:0;
border-radius:8px;
background:transparent;
color:#111827;
text-align:left;
font-size:14px;
font-weight:400;
line-height:1.25;
cursor:pointer;
}
.lv-modern-filter-option:hover{
background:#f5f7fb;
}
.lv-modern-filter-option.is-active{
background:#eef4ff;
color:#2457d6;
}
.lv-modern-filter-option-icon,
.lv-modern-filter-color-dot,
.lv-modern-filter-check{
width:22px;
height:22px;
min-width:22px;
display:inline-flex;
align-items:center;
justify-content:center;
}
.lv-modern-filter-option .lv-format-icon.is-modern-filter{
width:22px!important;
height:22px!important;
min-width:22px!important;
border-radius:5px!important;
}
.lv-modern-filter-option .lv-format-icon.is-modern-filter svg{
width:100%!important;
height:100%!important;
}
.lv-modern-filter-option-icon .lv-ratio-option-icon{
position:relative;
display:inline-block;
border:1.5px solid #9aa8bd;
border-radius:2px;
background:#fff;
box-sizing:border-box;
}
.lv-ratio-option-icon.is-square{
width:17px;
height:17px;
}
.lv-ratio-option-icon.is-portrait{
width:13px;
height:22px;
}
.lv-ratio-option-icon.is-landscape{
width:23px;
height:12px;
}
.lv-ratio-option-icon.is-landing-page{
width:12px;
height:24px;
}
.lv-ratio-option-icon.is-landing-page::after{
content:'';
position:absolute;
left:-4px;
bottom:-4px;
width:12px;
height:1.5px;
border-radius:999px;
background:#9aa8bd;
}
.lv-ratio-option-icon.is-other{
width:23px;
height:20px;
border:0;
background:transparent;
}
.lv-ratio-option-icon.is-other span{
position:absolute;
display:block;
border:1.5px solid #9aa8bd;
border-radius:2px;
background:#fff;
box-sizing:border-box;
}
.lv-ratio-option-icon.is-other span:first-child{
left:0;
top:1px;
width:17px;
height:15px;
}
.lv-ratio-option-icon.is-other span:last-child{
right:0;
bottom:0;
width:12px;
height:10px;
}
.lv-modern-filter-option.is-active .lv-ratio-option-icon,
.lv-modern-filter-option.is-active .lv-ratio-option-icon.is-other span{
border-color:#2f68ff;
}
.lv-modern-filter-option.is-active .lv-ratio-option-icon.is-landing-page::after{
background:#2f68ff;
}
.lv-modern-filter-color-dot{
width:18px;
height:18px;
min-width:18px;
border-radius:999px;
background:var(--lv-filter-color,#cbd5e1);
border:1px solid rgba(15,23,42,.16);
}
.lv-modern-filter-check{
width:17px;
height:17px;
min-width:17px;
border:1.5px solid #b8c2d3;
border-radius:4px;
background:#fff;
}
.lv-modern-filter-option.is-active .lv-modern-filter-check{
border-color:#2f68ff;
background:#2f68ff;
box-shadow:inset 0 0 0 4px #fff;
}
.lv-modern-filter-option-label{
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
}
.lv-modern-clear{
background:#fff!important;
color:#ef4444!important;
border-color:transparent!important;
padding:0 8px!important;
font-weight:400!important;
}
.lv-modern-clear:hover{
background:#fff5f5!important;
border-color:#ffd6d6!important;
box-shadow:none!important;
}
.lv-modern-result-count{
color:#384152;
font-size:14px;
font-weight:400;
white-space:nowrap;
}
.lv-modern-sort{
position:relative;
display:inline-flex!important;
align-items:center!important;
gap:0!important;
}
.lv-modern-sort-icon{
position:absolute;
left:14px;
z-index:2;
pointer-events:none;
color:#4278c7;
}
.lv-modern-sort .sort-select{
min-width:130px!important;
padding-left:38px!important;
padding-right:34px!important;
}
.lv-modern-sort.custom-select .sort-select{
display:none!important;
}
.lv-modern-sort.custom-select .custom-select-trigger{
min-width:130px!important;
padding-left:38px!important;
padding-right:34px!important;
}
.lv-modern-sort.custom-select .custom-select-text{
font-weight:500;
}
.lv-modern-sort.custom-select .custom-select-arrow{
position:absolute;
right:13px;
display:inline-flex;
}
.lv-modern-sort.custom-select .custom-select-options{
top:calc(100% + 8px)!important;
right:0!important;
left:auto!important;
min-width:170px!important;
border-radius:8px!important;
border:1px solid #dce3ee!important;
box-shadow:0 22px 46px rgba(15,23,42,.14)!important;
}
.lv-modern-sort.custom-select .custom-select-option{
font-weight:400!important;
}
html.lv-theme-dark .lv-modern-filter-open,
html.lv-theme-dark .lv-modern-filter-chip,
html.lv-theme-dark .lv-modern-filter-trigger,
html.lv-theme-dark .lv-modern-sort .sort-select,
html.lv-theme-dark .lv-modern-sort.custom-select .custom-select-trigger{
background:#151a24!important;
border-color:#283244!important;
color:#e5edf7!important;
}
html.lv-theme-dark .lv-modern-filter-dropdown,
html.lv-theme-dark .lv-modern-sort.custom-select .custom-select-options{
background:#121722!important;
border-color:#283244!important;
}
html.lv-theme-dark .lv-modern-filter-option{
color:#e5edf7;
}
html.lv-theme-dark .lv-modern-filter-option:hover,
html.lv-theme-dark .lv-modern-filter-option.is-active{
background:#1d2738;
}
html.lv-theme-dark .lv-modern-result-count{
color:#aab6c8;
}
@media (max-width: 960px){
.lv-modern-filter-bar{
align-items:flex-start!important;
flex-direction:column;
}
.lv-modern-filter-meta{
width:100%;
margin-left:0;
justify-content:space-between;
}
}
@media (min-width: 961px) and (max-width: 1500px){
.lv-modern-filter-bar{
gap:10px!important;
}
.lv-modern-filter-left,
.lv-modern-filter-meta,
.lv-modern-filter-quick{
gap:8px;
}
.lv-modern-filter-open,
.lv-modern-filter-chip,
.lv-modern-filter-trigger,
.lv-modern-clear,
.lv-modern-sort .sort-select,
.lv-modern-sort.custom-select .custom-select-trigger{
height:36px!important;
min-height:36px!important;
gap:6px!important;
padding-left:10px!important;
padding-right:10px!important;
font-size:13px!important;
}
.lv-modern-sort .sort-select,
.lv-modern-sort.custom-select .custom-select-trigger{
min-width:120px!important;
padding-left:34px!important;
}
.lv-modern-sort-icon{
left:11px;
}
.lv-modern-result-count{
font-size:13px;
}
}
@media (max-width: 768px){
.lv-modern-filter-bar{
flex-direction:row;
align-items:center!important;
gap:10px!important;
margin-bottom:16px!important;
}
.lv-modern-filter-left{
flex:0 0 auto;
}
.lv-modern-filter-quick,
.lv-modern-filter-separator,
.lv-modern-filter-group,
.lv-modern-clear,
.lv-modern-result-count{
display:none!important;
}
.lv-modern-filter-meta{
width:auto;
margin-left:auto;
}
.lv-modern-filter-open{
width:auto!important;
}
}
/* v96: desktop advanced filter drawer - lighter glass panel, less blur, faster actions */
.lv-sidebar-filter-footer{
display:none;
}
@media (min-width:769px){
body.lv-sidebar-open{
overflow:auto!important;
}
.lv-discover-section .sidebar-overlay.active,
.lv-design-archive-page .sidebar-overlay.active{
display:block!important;
position:fixed!important;
inset:0!important;
z-index:2490!important;
background:rgba(15,23,42,.07)!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
}
.lv-discover-section .sidebar,
.lv-design-archive-page .sidebar{
left:var(--lv-rail-width,84px)!important;
top:96px!important;
width:min(382px, calc(100vw - var(--lv-rail-width,84px) - 32px))!important;
height:calc(100dvh - 112px)!important;
padding:0 14px 0!important;
border:1px solid rgba(203,213,225,.58)!important;
border-left:0!important;
border-radius:0 24px 24px 0!important;
background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(248,251,255,.82))!important;
-webkit-backdrop-filter:blur(22px) saturate(165%)!important;
backdrop-filter:blur(22px) saturate(165%)!important;
box-shadow:22px 24px 72px rgba(15,23,42,.18), inset 1px 0 0 rgba(255,255,255,.72)!important;
transform:translate3d(calc(-100% - 28px),0,0)!important;
transition:transform .24s cubic-bezier(.2,.8,.2,1), box-shadow .24s ease!important;
scrollbar-width:thin!important;
scrollbar-color:#aab3c2 transparent!important;
}
body.admin-bar .lv-discover-section .sidebar,
body.admin-bar .lv-design-archive-page .sidebar{
top:128px!important;
height:calc(100dvh - 144px)!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
transform:translate3d(0,0,0)!important;
}
.lv-discover-section .sidebar::-webkit-scrollbar,
.lv-design-archive-page .sidebar::-webkit-scrollbar{
width:8px!important;
}
.lv-discover-section .sidebar::-webkit-scrollbar-thumb,
.lv-design-archive-page .sidebar::-webkit-scrollbar-thumb{
border-radius:999px!important;
background:#aab3c2!important;
}
.lv-discover-section .sidebar-mobile-header,
.lv-design-archive-page .sidebar-mobile-header{
position:sticky!important;
top:0!important;
z-index:12!important;
display:flex!important;
min-height:70px!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
margin:0 -14px 12px!important;
padding:14px 16px!important;
border-bottom:1px solid rgba(203,213,225,.54)!important;
background:rgba(255,255,255,.78)!important;
-webkit-backdrop-filter:blur(18px) saturate(150%)!important;
backdrop-filter:blur(18px) saturate(150%)!important;
}
.lv-discover-section .sidebar-mobile-header h3,
.lv-design-archive-page .sidebar-mobile-header h3{
margin:0!important;
color:#111827!important;
font-size:17px!important;
line-height:1.15!important;
font-weight:650!important;
letter-spacing:0!important;
}
.lv-sidebar-active-count{
margin-left:auto!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-width:24px!important;
height:24px!important;
padding:0 9px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#3157ff!important;
font-size:12px!important;
font-weight:600!important;
white-space:nowrap!important;
}
.lv-sidebar-active-count[hidden]{
display:none!important;
}
.lv-discover-section .sidebar-close-btn:not(.lv-sidebar-done-btn),
.lv-design-archive-page .sidebar-close-btn:not(.lv-sidebar-done-btn){
width:36px!important;
height:36px!important;
min-width:36px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:1px solid rgba(203,213,225,.55)!important;
border-radius:999px!important;
background:rgba(248,250,252,.92)!important;
color:#111827!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar .filter-section,
.lv-design-archive-page .sidebar .filter-section,
.lv-discover-section .sidebar .active-filters .filter-section,
.lv-design-archive-page .sidebar .active-filters .filter-section{
margin:0 0 12px!important;
padding:15px!important;
border:1px solid rgba(222,229,239,.82)!important;
border-radius:18px!important;
background:rgba(255,255,255,.68)!important;
box-shadow:0 10px 28px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.72)!important;
}
.lv-discover-section .sidebar .filter-section > h3,
.lv-design-archive-page .sidebar .filter-section > h3,
.lv-discover-section .sidebar .filter-header,
.lv-design-archive-page .sidebar .filter-header{
display:flex!important;
align-items:center!important;
gap:9px!important;
margin:0 0 13px!important;
padding:0!important;
color:#172033!important;
font-size:14px!important;
line-height:1.15!important;
font-weight:650!important;
letter-spacing:0!important;
text-transform:none!important;
}
.lv-discover-section .sidebar .filter-section > h3 svg,
.lv-design-archive-page .sidebar .filter-section > h3 svg,
.lv-discover-section .sidebar .filter-header svg,
.lv-design-archive-page .sidebar .filter-header svg{
width:18px!important;
height:18px!important;
margin-right:0!important;
color:#1f2a3d!important;
stroke-width:1.9!important;
}
.lv-discover-section .sidebar .filter-header .clear-filters-btn,
.lv-design-archive-page .sidebar .filter-header .clear-filters-btn{
height:30px!important;
padding:0 10px!important;
border-radius:999px!important;
background:#fff5f5!important;
color:#ef4444!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-discover-section .sidebar .filter-tag,
.lv-design-archive-page .sidebar .filter-tag{
min-height:30px!important;
padding:0 10px!important;
border-radius:999px!important;
background:#f8fbff!important;
border-color:#dfe7f5!important;
box-shadow:none!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-discover-section .sidebar .lv-resource-filter-list,
.lv-design-archive-page .sidebar .lv-resource-filter-list{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:10px!important;
}
.lv-discover-section .sidebar .lv-resource-filter-option,
.lv-design-archive-page .sidebar .lv-resource-filter-option,
.lv-discover-section .sidebar .lv-resource-filter-option label,
.lv-design-archive-page .sidebar .lv-resource-filter-option label{
width:100%!important;
height:46px!important;
min-height:46px!important;
}
.lv-discover-section .sidebar .lv-resource-filter-option label,
.lv-design-archive-page .sidebar .lv-resource-filter-option label{
border-radius:16px!important;
background:rgba(255,255,255,.76)!important;
box-shadow:0 10px 22px rgba(15,23,42,.045)!important;
font-weight:600!important;
}
.lv-discover-section .sidebar .lv-format-filter-list,
.lv-design-archive-page .sidebar .lv-format-filter-list{
grid-template-columns:repeat(5,minmax(0,1fr))!important;
gap:9px!important;
}
.lv-discover-section .sidebar .lv-format-filter-option label,
.lv-design-archive-page .sidebar .lv-format-filter-option label{
border-radius:14px!important;
background:rgba(255,255,255,.76)!important;
box-shadow:0 8px 20px rgba(15,23,42,.04)!important;
}
.lv-discover-section .sidebar .color-palette,
.lv-design-archive-page .sidebar .color-palette{
display:grid!important;
grid-template-columns:repeat(6,38px)!important;
gap:9px!important;
align-items:center!important;
}
.lv-discover-section .sidebar .color-swatch,
.lv-design-archive-page .sidebar .color-swatch{
width:38px!important;
height:38px!important;
border-radius:12px!important;
border:2px solid rgba(255,255,255,.96)!important;
box-shadow:0 8px 18px rgba(15,23,42,.10)!important;
}
.lv-discover-section .sidebar .color-swatch:hover,
.lv-design-archive-page .sidebar .color-swatch:hover{
transform:translateY(-1px)!important;
}
.lv-discover-section .sidebar .color-swatch.selected,
.lv-design-archive-page .sidebar .color-swatch.selected{
outline:2px solid #3157ff!important;
outline-offset:2px!important;
transform:none!important;
}
.lv-discover-section .sidebar .filter-options,
.lv-design-archive-page .sidebar .filter-options{
gap:4px!important;
max-height:260px!important;
overflow:auto!important;
padding-right:3px!important;
}
.lv-discover-section .sidebar .filter-options .filter-option,
.lv-design-archive-page .sidebar .filter-options .filter-option{
min-height:36px!important;
gap:9px!important;
padding:4px 2px!important;
border-radius:10px!important;
}
.lv-discover-section .sidebar .filter-option label,
.lv-design-archive-page .sidebar .filter-option label{
flex:1 1 auto!important;
min-width:0!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:10px!important;
color:#172033!important;
font-size:14px!important;
font-weight:400!important;
line-height:1.35!important;
}
.lv-discover-section .sidebar .filter-option label span,
.lv-design-archive-page .sidebar .filter-option label span{
font-size:12px!important;
font-weight:400!important;
color:#7b8798!important;
}
.lv-discover-section .sidebar .tags-filter-cloud,
.lv-design-archive-page .sidebar .tags-filter-cloud{
gap:7px!important;
}
.lv-discover-section .sidebar .tag-filter-item,
.lv-design-archive-page .sidebar .tag-filter-item{
height:32px!important;
padding:0 11px!important;
border-radius:999px!important;
background:#f8fafc!important;
border:1px solid #e4e9f2!important;
box-shadow:none!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-sidebar-filter-footer{
position:sticky!important;
bottom:0!important;
z-index:12!important;
display:flex!important;
align-items:center!important;
gap:10px!important;
margin:14px -14px 0!important;
padding:14px 16px 16px!important;
border-top:1px solid rgba(203,213,225,.55)!important;
background:rgba(255,255,255,.82)!important;
-webkit-backdrop-filter:blur(18px) saturate(150%)!important;
backdrop-filter:blur(18px) saturate(150%)!important;
}
.lv-sidebar-clear-btn,
.lv-sidebar-done-btn{
height:42px!important;
min-height:42px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
border-radius:999px!important;
padding:0 16px!important;
font-size:14px!important;
font-weight:550!important;
line-height:1!important;
box-shadow:none!important;
}
.lv-sidebar-clear-btn{
flex:0 0 auto!important;
border:1px solid transparent!important;
background:transparent!important;
color:#ef4444!important;
}
.lv-sidebar-clear-btn.is-disabled,
.lv-sidebar-clear-btn:disabled{
color:#98a2b3!important;
cursor:not-allowed!important;
}
.lv-sidebar-done-btn{
flex:1 1 auto!important;
border:0!important;
background:#111827!important;
color:#fff!important;
}
}
@media (max-width:768px){
.lv-sidebar-filter-footer{
position:sticky!important;
bottom:0!important;
z-index:12!important;
display:flex!important;
gap:10px!important;
margin:18px -18px 0!important;
padding:12px 18px max(18px, env(safe-area-inset-bottom))!important;
border-top:1px solid #eef2f7!important;
background:#fff!important;
}
.lv-sidebar-filter-footer .clear-filters-btn,
.lv-sidebar-filter-footer .sidebar-close-btn{
height:42px!important;
min-height:42px!important;
border-radius:999px!important;
padding:0 16px!important;
font-size:14px!important;
font-weight:550!important;
}
.lv-sidebar-filter-footer .clear-filters-btn{
flex:0 0 auto!important;
background:#fff5f5!important;
color:#ef4444!important;
border:1px solid #ffd6d6!important;
}
.lv-sidebar-filter-footer .sidebar-close-btn{
flex:1 1 auto!important;
width:auto!important;
background:#111827!important;
color:#fff!important;
}
}
html.lv-theme-dark .lv-discover-section .sidebar,
html.lv-theme-dark .lv-design-archive-page .sidebar{
background:linear-gradient(145deg,rgba(17,24,39,.94),rgba(15,23,42,.86))!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar-mobile-header,
html.lv-theme-dark .lv-design-archive-page .sidebar-mobile-header,
html.lv-theme-dark .lv-sidebar-filter-footer{
background:rgba(15,23,42,.84)!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-sidebar-active-count{
background:rgba(49,87,255,.18)!important;
color:#9db5ff!important;
}
/* v97: desktop filter should be a compact popover, not a left drawer */
@media (min-width:769px){
body.lv-sidebar-open{
overflow:auto!important;
}
.lv-discover-section .sidebar-overlay.active,
.lv-design-archive-page .sidebar-overlay.active{
display:block!important;
position:fixed!important;
inset:0!important;
z-index:2480!important;
background:transparent!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover,
.lv-design-archive-page .sidebar.is-desktop-popover{
position:fixed!important;
left:var(--lv-filter-popover-left,124px)!important;
top:var(--lv-filter-popover-top,120px)!important;
right:auto!important;
bottom:auto!important;
z-index:2600!important;
display:block!important;
width:var(--lv-filter-popover-width,360px)!important;
max-width:calc(100vw - 24px)!important;
height:auto!important;
max-height:min(620px, calc(100dvh - var(--lv-filter-popover-top,120px) - 16px))!important;
min-height:0!important;
padding:0 12px 12px!important;
overflow:auto!important;
border:1px solid rgba(203,213,225,.78)!important;
border-radius:20px!important;
background:#fff!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
box-shadow:0 22px 58px rgba(15,23,42,.18)!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
transform:translate3d(0,-6px,0) scale(.985)!important;
transition:opacity .14s ease, transform .14s ease, visibility .14s ease!important;
scrollbar-width:thin!important;
scrollbar-color:#b7c0cf transparent!important;
}
.lv-discover-section .sidebar.is-desktop-popover.active,
.lv-design-archive-page .sidebar.is-desktop-popover.active{
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translate3d(0,0,0) scale(1)!important;
}
.lv-discover-section .sidebar.is-desktop-popover .sidebar-mobile-header,
.lv-design-archive-page .sidebar.is-desktop-popover .sidebar-mobile-header{
position:sticky!important;
top:0!important;
z-index:5!important;
display:flex!important;
min-height:56px!important;
align-items:center!important;
justify-content:space-between!important;
gap:10px!important;
margin:0 -12px 10px!important;
padding:10px 12px!important;
border-bottom:1px solid #edf1f7!important;
background:#fff!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .sidebar-mobile-header h3,
.lv-design-archive-page .sidebar.is-desktop-popover .sidebar-mobile-header h3{
margin:0!important;
padding:0!important;
color:#111827!important;
font-size:16px!important;
line-height:1.2!important;
font-weight:600!important;
letter-spacing:0!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-sidebar-active-count,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-sidebar-active-count{
margin-left:auto!important;
height:24px!important;
min-width:24px!important;
padding:0 8px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#3157ff!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-discover-section .sidebar.is-desktop-popover .sidebar-close-btn:not(.lv-sidebar-done-btn),
.lv-design-archive-page .sidebar.is-desktop-popover .sidebar-close-btn:not(.lv-sidebar-done-btn){
width:34px!important;
height:34px!important;
min-width:34px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:1px solid #e5eaf3!important;
border-radius:999px!important;
background:#f8fafc!important;
color:#111827!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-section,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-section,
.lv-discover-section .sidebar.is-desktop-popover .active-filters .filter-section,
.lv-design-archive-page .sidebar.is-desktop-popover .active-filters .filter-section{
margin:0 0 10px!important;
padding:12px!important;
border:1px solid #edf1f7!important;
border-radius:16px!important;
background:#fff!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-section > h3,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-section > h3,
.lv-discover-section .sidebar.is-desktop-popover .filter-header,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-header{
display:flex!important;
align-items:center!important;
gap:8px!important;
min-height:22px!important;
margin:0 0 10px!important;
padding:0!important;
border:0!important;
color:#172033!important;
font-size:14px!important;
line-height:1.2!important;
font-weight:600!important;
letter-spacing:0!important;
text-transform:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-section > h3::after,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-section > h3::after{
content:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-section > h3 svg,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-section > h3 svg,
.lv-discover-section .sidebar.is-desktop-popover .filter-header svg,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-header svg{
width:18px!important;
height:18px!important;
margin:0!important;
color:#273244!important;
}
.lv-discover-section .sidebar.is-desktop-popover .active-filters,
.lv-design-archive-page .sidebar.is-desktop-popover .active-filters{
margin:0!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-header .clear-filters-btn,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-header .clear-filters-btn{
height:28px!important;
padding:0 10px!important;
border-radius:999px!important;
background:#fff5f5!important;
color:#ef4444!important;
font-size:12px!important;
font-weight:500!important;
}
.lv-discover-section .sidebar.is-desktop-popover .selected-filters,
.lv-design-archive-page .sidebar.is-desktop-popover .selected-filters{
gap:6px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-tag,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-tag{
min-height:28px!important;
padding:0 9px!important;
border-radius:999px!important;
border-color:#dfe7f5!important;
background:#f8fbff!important;
box-shadow:none!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-resource-filter-list,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-resource-filter-list{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-resource-filter-option,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-resource-filter-option,
.lv-discover-section .sidebar.is-desktop-popover .lv-resource-filter-option label,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-resource-filter-option label{
width:100%!important;
height:42px!important;
min-height:42px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-resource-filter-option label,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-resource-filter-option label{
font-size:0!important;
line-height:0!important;
border-radius:14px!important;
background:#f8fafc!important;
border-color:#dfe7f0!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-resource-filter-name,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-resource-filter-name{
font-size:13px!important;
line-height:1!important;
font-weight:500!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-format-filter-list,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-format-filter-list{
grid-template-columns:repeat(6,minmax(0,1fr))!important;
gap:8px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-format-filter-option label,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-format-filter-option label{
border-radius:12px!important;
background:#f8fafc!important;
border-color:#dfe7f0!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .lv-format-filter-option .lv-format-icon.is-filter-format,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-format-filter-option .lv-format-icon.is-filter-format{
width:26px!important;
height:26px!important;
min-width:26px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .color-palette,
.lv-design-archive-page .sidebar.is-desktop-popover .color-palette{
display:grid!important;
grid-template-columns:repeat(7,30px)!important;
gap:8px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .color-swatch,
.lv-design-archive-page .sidebar.is-desktop-popover .color-swatch{
width:30px!important;
height:30px!important;
border-radius:10px!important;
border:2px solid #fff!important;
box-shadow:0 5px 13px rgba(15,23,42,.12)!important;
}
.lv-discover-section .sidebar.is-desktop-popover .color-swatch:hover,
.lv-design-archive-page .sidebar.is-desktop-popover .color-swatch:hover{
transform:translateY(-1px)!important;
}
.lv-discover-section .sidebar.is-desktop-popover .color-swatch.selected,
.lv-design-archive-page .sidebar.is-desktop-popover .color-swatch.selected{
outline:2px solid #3157ff!important;
outline-offset:2px!important;
transform:none!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-options,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-options{
gap:2px!important;
max-height:210px!important;
overflow:auto!important;
padding-right:2px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-options .filter-option,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-options .filter-option{
min-height:32px!important;
gap:8px!important;
padding:2px 0!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"],
.lv-design-archive-page .sidebar.is-desktop-popover .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]{
width:16px!important;
height:16px!important;
min-width:16px!important;
border-radius:5px!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-option label,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-option label{
min-width:0!important;
color:#172033!important;
font-size:14px!important;
font-weight:400!important;
line-height:1.3!important;
}
.lv-discover-section .sidebar.is-desktop-popover .filter-option label span,
.lv-design-archive-page .sidebar.is-desktop-popover .filter-option label span{
color:#7b8798!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-discover-section .sidebar.is-desktop-popover .tags-filter-section,
.lv-design-archive-page .sidebar.is-desktop-popover .tags-filter-section,
.lv-discover-section .sidebar.is-desktop-popover .lv-sidebar-filter-footer,
.lv-design-archive-page .sidebar.is-desktop-popover .lv-sidebar-filter-footer{
display:none!important;
}
}
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-popover,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-popover,
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-popover .sidebar-mobile-header,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-popover .sidebar-mobile-header,
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-popover .filter-section,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-popover .filter-section{
background:#111827!important;
border-color:rgba(148,163,184,.18)!important;
}
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-popover .sidebar-mobile-header h3,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-popover .sidebar-mobile-header h3,
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-popover .filter-section > h3,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-popover .filter-section > h3,
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-popover .filter-option label,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-popover .filter-option label{
color:#f8fafc!important;
}
/* v92: unified content width, creator directory, and public profile polish */
:root{
--lv-content-shell-width:1180px;
--lv-content-shell-gutter:48px;
}
.lv-blog-shell,
.lv-blog-detail-page-v16 .lv-blog-detail-shell,
.lv-blog-category-shell,
.lv-seller-page .lv-container,
.lv-author-directory-shell{
width:min(calc(100% - var(--lv-content-shell-gutter)), var(--lv-content-shell-width))!important;
max-width:var(--lv-content-shell-width)!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-blog-detail-page-v16 .lv-post-hero{width:100%!important;max-width:100%!important}
.lv-blog-category-page,
.lv-blog-hub,
.lv-blog-detail-page{background:#fff!important}
.lv-seller-page{
box-sizing:border-box!important;
min-height:70vh!important;
padding:30px 0 74px!important;
background:linear-gradient(180deg,#f8fbff 0%,#fff 42%)!important;
color:#0f172a!important;
}
.lv-seller-page *,
.lv-seller-page *::before,
.lv-seller-page *::after,
.lv-author-directory-page *,
.lv-author-directory-page *::before,
.lv-author-directory-page *::after{box-sizing:border-box}
.lv-seller-page .lv-seller-hero-wrap{margin:0 0 24px!important;padding:0!important;background:transparent!important}
.lv-seller-profile.lv-card-clean{
position:relative!important;
min-height:268px!important;
overflow:hidden!important;
border:1px solid rgba(148,163,184,.18)!important;
border-radius:24px!important;
background:radial-gradient(circle at 16% 18%,rgba(66,133,244,.13),transparent 28%),radial-gradient(circle at 86% 18%,rgba(244,114,182,.11),transparent 30%),linear-gradient(135deg,#f9fbff 0%,#eef4ff 100%)!important;
box-shadow:0 22px 56px rgba(15,23,42,.08)!important;
}
.lv-seller-page .lv-seller-profile .lv-seller-cover{
position:absolute!important;
inset:0!important;
height:auto!important;
opacity:.42!important;
background-position:center!important;
background-size:cover!important;
filter:saturate(1.02)!important;
}
.lv-seller-page .lv-seller-profile .lv-seller-cover::after{
content:""!important;
position:absolute!important;
inset:0!important;
background:linear-gradient(90deg,rgba(255,255,255,.78),rgba(255,255,255,.42) 48%,rgba(255,255,255,.86))!important;
}
.lv-seller-page .lv-seller-cover-glow{display:none!important}
.lv-seller-page .lv-seller-head{
position:relative!important;
z-index:2!important;
display:flex!important;
align-items:flex-end!important;
gap:24px!important;
min-height:268px!important;
padding:78px 28px 34px!important;
}
.lv-seller-page .lv-seller-avatar-wrap{flex:0 0 auto!important}
.lv-seller-page .lv-seller-info{min-width:0!important}
.lv-seller-page .lv-seller-name-row h1{
margin:0!important;
color:#101828!important;
font-size:clamp(34px,4vw,48px)!important;
line-height:1.02!important;
font-weight:760!important;
letter-spacing:0!important;
}
.lv-seller-page .lv-seller-headline{
margin:12px 0 0!important;
color:#475569!important;
font-size:15px!important;
font-weight:400!important;
}
.lv-seller-page .lv-seller-meta-line{
display:flex!important;
flex-wrap:wrap!important;
gap:10px!important;
margin-top:22px!important;
}
.lv-seller-page .lv-seller-meta-line span{
display:inline-flex!important;
align-items:center!important;
gap:7px!important;
min-height:34px!important;
padding:0 13px!important;
border:1px solid rgba(148,163,184,.22)!important;
border-radius:999px!important;
background:rgba(255,255,255,.76)!important;
color:#64748b!important;
font-size:13px!important;
font-weight:500!important;
box-shadow:0 10px 28px rgba(15,23,42,.045)!important;
}
.lv-seller-page .lv-seller-content{
display:grid!important;
grid-template-columns:320px minmax(0,1fr)!important;
gap:22px!important;
align-items:start!important;
}
.lv-author-directory-page{
min-height:70vh;
padding:30px 0 76px;
background:linear-gradient(180deg,#f8fbff 0%,#fff 36%);
color:#101828;
}
.lv-author-directory-breadcrumb{
display:flex;
align-items:center;
gap:8px;
margin:0 0 18px;
color:#94a3b8;
font-size:13px;
font-weight:400;
}
.lv-author-directory-breadcrumb a{color:#3e6cea;text-decoration:none}
.lv-author-directory-breadcrumb strong{color:#64748b;font-weight:500}
.lv-author-directory-hero{
display:flex;
justify-content:space-between;
gap:24px;
align-items:flex-end;
padding:28px;
border:1px solid rgba(148,163,184,.18);
border-radius:24px;
background:radial-gradient(circle at 10% 0%,rgba(62,108,234,.12),transparent 30%),radial-gradient(circle at 88% 8%,rgba(20,184,166,.10),transparent 28%),linear-gradient(135deg,#fff,#f4f8ff);
box-shadow:0 22px 58px rgba(15,23,42,.07);
}
.lv-author-directory-hero span{
display:inline-flex;
width:max-content;
margin-bottom:10px;
padding:6px 12px;
border-radius:999px;
background:#eaf1ff;
color:#3e6cea;
font-size:13px;
font-weight:500;
}
.lv-author-directory-hero h1{
margin:0;
color:#101828;
font-size:clamp(34px,4vw,52px);
line-height:1.02;
font-weight:760;
letter-spacing:0;
}
.lv-author-directory-hero p{
max-width:720px;
margin:14px 0 0;
color:#64748b;
font-size:15px;
line-height:1.65;
font-weight:400;
}
.lv-author-directory-hero>strong{
flex:0 0 auto;
display:inline-flex;
align-items:center;
min-height:38px;
padding:0 15px;
border-radius:999px;
background:#101828;
color:#fff;
font-size:14px;
font-weight:600;
}
.lv-author-directory-toolbar{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin:22px 0 20px;
}
.lv-author-directory-toolbar>span{color:#475569;font-size:14px;font-weight:500}
.lv-author-sort-pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.lv-author-sort-pills a{
display:inline-flex;
align-items:center;
gap:8px;
min-height:36px;
padding:0 14px;
border:1px solid rgba(148,163,184,.24);
border-radius:999px;
background:#fff;
color:#1f2937;
text-decoration:none;
font-size:14px;
font-weight:500;
box-shadow:0 10px 24px rgba(15,23,42,.04);
}
.lv-author-sort-pills a.is-active,
.lv-author-sort-pills a:hover{border-color:rgba(62,108,234,.28);background:#eef4ff;color:#3157dc}
.lv-author-card-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
}
.lv-author-card{
display:grid;
gap:16px;
min-width:0;
padding:18px;
border:1px solid rgba(148,163,184,.18);
border-radius:22px;
background:#fff;
box-shadow:0 18px 42px rgba(15,23,42,.055);
}
.lv-author-card.rank-1{border-color:rgba(250,204,21,.42);background:linear-gradient(180deg,#fffdf3,#fff)}
.lv-author-card-head{
display:grid;
grid-template-columns:auto 62px minmax(0,1fr);
align-items:center;
gap:12px;
color:inherit;
text-decoration:none;
}
.lv-author-rank{
display:grid;
place-items:center;
width:34px;
height:34px;
border-radius:999px;
background:#eef4ff;
color:#3157dc;
font-size:13px;
font-weight:700;
}
.lv-author-avatar{
position:relative;
display:block;
width:62px;
height:62px;
padding:3px;
border-radius:999px;
background:#e2e8f0;
}
.lv-author-avatar.is-pro{background:linear-gradient(135deg,#fde68a,#f59e0b 52%,#60a5fa)}
.lv-author-avatar img{
display:block;
width:100%;
height:100%;
object-fit:cover;
border:3px solid #fff;
border-radius:999px;
}
.lv-author-copy{display:grid;min-width:0;gap:3px}
.lv-author-copy strong{
display:flex;
align-items:center;
gap:6px;
min-width:0;
color:#101828;
font-size:17px;
font-weight:650;
}
.lv-author-copy strong i{color:#3e6cea;font-size:13px}
.lv-author-copy small{color:#64748b;font-size:13px;font-weight:400}
.lv-author-card-body{min-width:0}
.lv-author-pro-badge{
display:inline-flex;
align-items:center;
gap:7px;
min-height:28px;
margin-bottom:10px;
padding:0 11px;
border-radius:999px;
background:#111827;
color:#fff;
font-size:12px;
font-weight:600;
}
.lv-author-card h2{
display:-webkit-box;
min-height:44px;
margin:0;
overflow:hidden;
color:#101828;
font-size:18px;
line-height:1.24;
font-weight:650;
letter-spacing:0;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
.lv-author-card p{
display:-webkit-box;
min-height:44px;
margin:10px 0 0;
overflow:hidden;
color:#64748b;
font-size:14px;
line-height:1.55;
font-weight:400;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
.lv-author-skills{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}
.lv-author-skills span{
display:inline-flex;
min-height:26px;
align-items:center;
padding:0 10px;
border-radius:999px;
background:#f1f5f9;
color:#475569;
font-size:12px;
font-weight:500;
}
.lv-author-stats{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
border:1px solid rgba(148,163,184,.16);
border-radius:16px;
overflow:hidden;
background:#f8fafc;
}
.lv-author-stats span{display:grid;gap:2px;padding:11px 8px;text-align:center}
.lv-author-stats span+span{border-left:1px solid rgba(148,163,184,.16)}
.lv-author-stats strong{color:#101828;font-size:15px;font-weight:650}
.lv-author-stats small{color:#64748b;font-size:11px;font-weight:400}
.lv-author-open-profile{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
min-height:40px;
border-radius:999px;
background:#3e6cea;
color:#fff;
text-decoration:none;
font-size:14px;
font-weight:600;
}
.lv-author-directory-empty{
padding:36px 20px;
border:1px dashed rgba(148,163,184,.35);
border-radius:22px;
background:#fff;
text-align:center;
color:#64748b;
}
.lv-author-directory-empty strong{display:block;color:#101828;font-size:20px;font-weight:650}
html.lv-theme-dark .lv-author-directory-page,
html.lv-theme-dark .lv-seller-page,
html.lv-theme-dark .lv-blog-category-page,
html.lv-theme-dark .lv-blog-hub,
html.lv-theme-dark .lv-blog-detail-page{background:#0b1220!important;color:#e5edf9!important}
html.lv-theme-dark .lv-author-directory-hero,
html.lv-theme-dark .lv-author-card,
html.lv-theme-dark .lv-author-directory-empty,
html.lv-theme-dark .lv-seller-profile.lv-card-clean{
background:linear-gradient(180deg,#111b31,#0d1629)!important;
border-color:rgba(148,163,184,.18)!important;
box-shadow:0 22px 58px rgba(0,0,0,.26)!important;
}
html.lv-theme-dark .lv-author-directory-hero h1,
html.lv-theme-dark .lv-author-card h2,
html.lv-theme-dark .lv-author-copy strong,
html.lv-theme-dark .lv-author-stats strong,
html.lv-theme-dark .lv-seller-name-row h1{color:#e5edf9!important}
html.lv-theme-dark .lv-author-directory-hero p,
html.lv-theme-dark .lv-author-card p,
html.lv-theme-dark .lv-author-copy small,
html.lv-theme-dark .lv-author-stats small,
html.lv-theme-dark .lv-seller-headline{color:#9aa8bd!important}
html.lv-theme-dark .lv-author-sort-pills a,
html.lv-theme-dark .lv-author-skills span,
html.lv-theme-dark .lv-author-stats,
html.lv-theme-dark .lv-seller-meta-line span{
background:#172033!important;
color:#dce8ff!important;
border-color:rgba(148,163,184,.18)!important;
}
@media (max-width:1180px){
:root{--lv-content-shell-gutter:36px}
.lv-author-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.lv-seller-page .lv-seller-content{grid-template-columns:280px minmax(0,1fr)!important}
}
@media (max-width:900px){
.lv-blog-layout,
.lv-cat-content-grid,
.lv-seller-page .lv-seller-content{grid-template-columns:1fr!important}
.lv-blog-side-nav,
.lv-blog-right-rail,
.lv-seller-page .lv-seller-sidebar{position:static!important}
.lv-seller-page .lv-seller-head{align-items:flex-start!important;padding:52px 20px 24px!important}
}
@media (max-width:768px){
:root{--lv-content-shell-gutter:24px}
.lv-author-directory-page,
.lv-seller-page{padding:22px 0 92px!important}
.lv-author-directory-hero,
.lv-seller-page .lv-seller-profile.lv-card-clean{border-radius:20px!important}
.lv-author-directory-hero{display:grid;padding:20px}
.lv-author-directory-toolbar{align-items:flex-start;flex-direction:column}
.lv-author-sort-pills{
width:100%;
justify-content:flex-start;
overflow-x:auto;
flex-wrap:nowrap;
padding-bottom:4px;
scrollbar-width:none;
}
.lv-author-sort-pills::-webkit-scrollbar{display:none}
.lv-author-sort-pills a{flex:0 0 auto}
.lv-author-card-grid{grid-template-columns:1fr}
.lv-seller-page .lv-seller-head{display:grid!important;min-height:0!important}
.lv-seller-page .lv-seller-meta-line span{min-height:32px!important;font-size:12px!important}
}
/* v93: public seller profile hero alignment and continuous page background */
body.author,
body.author .site-wrapper,
body.author .site-content,
body.author .content-area{
background:#f8fbff!important;
}
body.author .lv-seller-page{
padding-top:30px!important;
background:linear-gradient(180deg,#f8fbff 0%,#ffffff 58%)!important;
}
.lv-seller-page .lv-seller-profile.lv-card-clean{
min-height:0!important;
display:block!important;
padding:0!important;
overflow:hidden!important;
}
.lv-seller-page .lv-seller-profile .lv-seller-cover{
position:absolute!important;
inset:0!important;
min-height:0!important;
opacity:.34!important;
pointer-events:none!important;
}
.lv-seller-page .lv-seller-head{
position:relative!important;
z-index:2!important;
display:grid!important;
grid-template-columns:132px minmax(0,1fr) auto!important;
align-items:center!important;
gap:20px!important;
min-height:0!important;
margin:0!important;
padding:76px 28px 36px!important;
}
.lv-seller-page .lv-seller-avatar-wrap{
width:132px!important;
height:132px!important;
align-self:center!important;
margin:0!important;
}
.lv-seller-page .lv-seller-info{
display:grid!important;
gap:10px!important;
align-self:center!important;
}
.lv-seller-page .lv-seller-name-row{
display:flex!important;
align-items:center!important;
gap:10px!important;
margin:0!important;
}
.lv-seller-page .lv-seller-name-row h1{
margin:0!important;
font-size:clamp(38px,4vw,54px)!important;
line-height:1!important;
}
.lv-seller-page .lv-seller-headline{
margin:0!important;
max-width:720px!important;
line-height:1.5!important;
}
.lv-seller-page .lv-seller-meta-actions{
display:grid!important;
grid-template-columns:minmax(0,1fr) auto!important;
align-items:center!important;
gap:18px!important;
margin-top:8px!important;
}
.lv-seller-page .lv-seller-meta-line{
margin:0!important;
gap:9px!important;
}
.lv-seller-page .lv-seller-actions{
align-self:center!important;
justify-self:end!important;
}
@media (max-width:900px){
.lv-seller-page .lv-seller-head{
grid-template-columns:104px minmax(0,1fr)!important;
padding:48px 20px 24px!important;
}
.lv-seller-page .lv-seller-avatar-wrap{
width:104px!important;
height:104px!important;
}
.lv-seller-page .lv-seller-meta-actions{
grid-column:1 / -1!important;
grid-template-columns:1fr!important;
}
.lv-seller-page .lv-seller-actions{
justify-self:start!important;
}
}
@media (max-width:640px){
.lv-seller-page .lv-seller-head{
grid-template-columns:1fr!important;
justify-items:center!important;
text-align:center!important;
padding:30px 18px 22px!important;
}
.lv-seller-page .lv-seller-info,
.lv-seller-page .lv-seller-meta-actions{
width:100%!important;
}
.lv-seller-page .lv-seller-name-row,
.lv-seller-page .lv-seller-meta-line,
.lv-seller-page .lv-seller-actions{
justify-content:center!important;
justify-self:center!important;
}
}
/* v94: author directory continuous background + liquid glass creator cards */
body.lv-author-directory-route,
body.lv-author-directory-route .site-wrapper,
body.lv-author-directory-route .site-content,
body.lv-author-directory-route .content-area{
background:#f7fbff!important;
}
body.lv-author-directory-route .top-menu{
background:linear-gradient(180deg,rgba(247,251,255,.94),rgba(247,251,255,.78))!important;
border-bottom:1px solid rgba(148,163,184,.14)!important;
}
body.lv-author-directory-route .lv-author-directory-page{
position:relative;
padding-top:30px!important;
background:
radial-gradient(circle at 18% 0%,rgba(62,108,234,.10),transparent 28%),
radial-gradient(circle at 88% 6%,rgba(20,184,166,.10),transparent 26%),
linear-gradient(180deg,#f7fbff 0%,#ffffff 62%)!important;
overflow:hidden;
}
body.lv-author-directory-route .lv-author-directory-page::before{
content:"";
position:absolute;
inset:0 0 auto 0;
height:220px;
pointer-events:none;
background:linear-gradient(180deg,rgba(247,251,255,.94),rgba(247,251,255,0));
}
body.lv-author-directory-route .lv-author-directory-shell{
position:relative;
z-index:1;
}
body.lv-author-directory-route .lv-author-directory-hero{
position:relative;
overflow:hidden;
border:1px solid rgba(255,255,255,.72)!important;
background:
linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,.42)),
radial-gradient(circle at 18% 8%,rgba(62,108,234,.14),transparent 34%),
radial-gradient(circle at 92% 10%,rgba(20,184,166,.16),transparent 32%)!important;
box-shadow:0 24px 70px rgba(31,41,55,.08), inset 0 1px 0 rgba(255,255,255,.92)!important;
backdrop-filter:blur(24px) saturate(170%)!important;
-webkit-backdrop-filter:blur(24px) saturate(170%)!important;
}
body.lv-author-directory-route .lv-author-card-grid{
display:grid!important;
grid-template-columns:1fr!important;
gap:16px!important;
}
body.lv-author-directory-route .lv-author-card{
position:relative;
isolation:isolate;
display:grid!important;
grid-template-columns:minmax(250px,.86fr) minmax(250px,1fr) minmax(340px,.9fr) auto!important;
align-items:center!important;
gap:18px!important;
min-height:158px;
padding:18px!important;
overflow:hidden;
border:1px solid rgba(255,255,255,.72)!important;
border-radius:28px!important;
background:
linear-gradient(135deg,rgba(255,255,255,.76),rgba(255,255,255,.42)),
radial-gradient(circle at 8% 8%,rgba(62,108,234,.13),transparent 34%),
radial-gradient(circle at 92% 10%,rgba(20,184,166,.10),transparent 30%)!important;
box-shadow:0 22px 58px rgba(15,23,42,.075), inset 0 1px 0 rgba(255,255,255,.96)!important;
backdrop-filter:blur(26px) saturate(175%)!important;
-webkit-backdrop-filter:blur(26px) saturate(175%)!important;
transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
body.lv-author-directory-route .lv-author-card::before{
content:"";
position:absolute;
inset:1px;
z-index:-1;
border-radius:27px;
background:linear-gradient(120deg,rgba(255,255,255,.72),rgba(255,255,255,.12) 38%,rgba(255,255,255,.58));
pointer-events:none;
}
body.lv-author-directory-route .lv-author-card:hover{
transform:translateY(-2px);
border-color:rgba(99,125,255,.28)!important;
box-shadow:0 28px 76px rgba(15,23,42,.11), inset 0 1px 0 rgba(255,255,255,.98)!important;
}
body.lv-author-directory-route .lv-author-card.rank-1{
border-color:rgba(255,255,255,.82)!important;
background:
linear-gradient(135deg,rgba(255,255,255,.78),rgba(255,255,255,.44)),
radial-gradient(circle at 10% 10%,rgba(250,204,21,.16),transparent 34%),
radial-gradient(circle at 88% 16%,rgba(62,108,234,.12),transparent 30%)!important;
}
body.lv-author-directory-route .lv-author-card-head{
grid-template-columns:42px 74px minmax(0,1fr)!important;
gap:13px!important;
}
body.lv-author-directory-route .lv-author-rank{
width:38px!important;
height:38px!important;
background:rgba(255,255,255,.64)!important;
color:#3157dc!important;
border:1px solid rgba(255,255,255,.75);
box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 10px 24px rgba(62,108,234,.10);
backdrop-filter:blur(14px) saturate(160%);
-webkit-backdrop-filter:blur(14px) saturate(160%);
}
body.lv-author-directory-route .lv-author-avatar{
width:74px!important;
height:74px!important;
padding:3px!important;
background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(226,232,240,.72))!important;
box-shadow:0 16px 32px rgba(15,23,42,.11), inset 0 1px 0 rgba(255,255,255,.95);
}
body.lv-author-directory-route .lv-author-avatar.is-pro{
background:conic-gradient(from 180deg,#facc15,#60a5fa,#a78bfa,#facc15)!important;
}
body.lv-author-directory-route .lv-author-copy strong{
font-size:18px!important;
font-weight:650!important;
}
body.lv-author-directory-route .lv-author-card-body{
display:grid;
gap:8px;
}
body.lv-author-directory-route .lv-author-pro-badge{
width:max-content;
margin:0!important;
background:rgba(15,23,42,.92)!important;
box-shadow:0 12px 26px rgba(15,23,42,.12);
}
body.lv-author-directory-route .lv-author-card h2{
min-height:0!important;
font-size:19px!important;
line-height:1.22!important;
font-weight:650!important;
}
body.lv-author-directory-route .lv-author-card p{
min-height:0!important;
margin:0!important;
color:#5f6f89!important;
}
body.lv-author-directory-route .lv-author-skills{
display:flex!important;
align-items:center!important;
gap:8px!important;
min-height:28px!important;
margin:0 0 0 -12px!important;
}
body.lv-author-directory-route .lv-author-skills span{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
min-height:28px!important;
height:28px!important;
padding:0 12px!important;
border-radius:999px!important;
background:rgba(255,255,255,.62)!important;
border:1px solid rgba(255,255,255,.72);
color:#52627a!important;
font-size:12px!important;
font-weight:500!important;
line-height:1!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.88);
backdrop-filter:blur(12px) saturate(150%);
-webkit-backdrop-filter:blur(12px) saturate(150%);
}
body.lv-author-directory-route .lv-author-stats{
min-width:0;
border:1px solid rgba(255,255,255,.68)!important;
background:rgba(255,255,255,.54)!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 12px 26px rgba(15,23,42,.045);
backdrop-filter:blur(18px) saturate(165%);
-webkit-backdrop-filter:blur(18px) saturate(165%);
}
body.lv-author-directory-route .lv-author-stats span{
padding:12px 10px!important;
}
body.lv-author-directory-route .lv-author-open-profile{
min-width:132px;
padding:0 16px;
background:rgba(15,23,42,.94)!important;
color:#fff!important;
box-shadow:0 16px 30px rgba(15,23,42,.14);
}
@media (max-width:1180px){
body.lv-author-directory-route .lv-author-card{
grid-template-columns:minmax(250px,.9fr) minmax(260px,1fr)!important;
}
body.lv-author-directory-route .lv-author-stats,
body.lv-author-directory-route .lv-author-open-profile{
grid-column:1 / -1;
}
body.lv-author-directory-route .lv-author-open-profile{
justify-self:start;
}
}
@media (max-width:720px){
body.lv-author-directory-route .lv-author-card{
grid-template-columns:1fr!important;
border-radius:24px!important;
padding:16px!important;
}
body.lv-author-directory-route .lv-author-card-head{
grid-template-columns:38px 68px minmax(0,1fr)!important;
}
body.lv-author-directory-route .lv-author-avatar{
width:68px!important;
height:68px!important;
}
body.lv-author-directory-route .lv-author-stats{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
body.lv-author-directory-route .lv-author-stats span:nth-child(3){
border-left:0!important;
border-top:1px solid rgba(148,163,184,.16);
}
body.lv-author-directory-route .lv-author-stats span:nth-child(4){
border-top:1px solid rgba(148,163,184,.16);
}
body.lv-author-directory-route .lv-author-open-profile{
width:100%;
}
}
/* v98: desktop filter drawer restored, flush from the viewport left edge */
@media (min-width:769px){
body.lv-sidebar-open{
overflow:hidden!important;
}
.lv-discover-section .sidebar-overlay.active,
.lv-design-archive-page .sidebar-overlay.active{
display:block!important;
position:fixed!important;
inset:0!important;
z-index:2690!important;
background:rgba(15,23,42,.22)!important;
-webkit-backdrop-filter:blur(2px) saturate(110%)!important;
backdrop-filter:blur(2px) saturate(110%)!important;
}
.lv-discover-section .sidebar.is-desktop-drawer,
.lv-design-archive-page .sidebar.is-desktop-drawer{
position:fixed!important;
top:0!important;
left:0!important;
right:auto!important;
bottom:0!important;
z-index:2700!important;
display:block!important;
width:min(410px, calc(100vw - 28px))!important;
max-width:min(410px, calc(100vw - 28px))!important;
height:100dvh!important;
max-height:100dvh!important;
min-height:100dvh!important;
padding:0 14px 18px!important;
overflow-x:hidden!important;
overflow-y:auto!important;
border:0!important;
border-right:1px solid rgba(203,213,225,.72)!important;
border-radius:0 24px 24px 0!important;
background:#fff!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
box-shadow:26px 0 72px rgba(15,23,42,.24)!important;
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:translate3d(-105%,0,0)!important;
transition:transform .25s cubic-bezier(.22,1,.36,1)!important;
scrollbar-width:thin!important;
scrollbar-color:#aeb8c8 transparent!important;
}
body.admin-bar .lv-discover-section .sidebar.is-desktop-drawer,
body.admin-bar .lv-design-archive-page .sidebar.is-desktop-drawer{
top:32px!important;
height:calc(100dvh - 32px)!important;
max-height:calc(100dvh - 32px)!important;
min-height:calc(100dvh - 32px)!important;
}
.lv-discover-section .sidebar.is-desktop-drawer.active,
.lv-design-archive-page .sidebar.is-desktop-drawer.active{
transform:translate3d(0,0,0)!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .sidebar-mobile-header,
.lv-design-archive-page .sidebar.is-desktop-drawer .sidebar-mobile-header{
position:sticky!important;
top:0!important;
z-index:12!important;
display:flex!important;
min-height:68px!important;
align-items:center!important;
justify-content:space-between!important;
gap:12px!important;
margin:0 -14px 12px!important;
padding:14px 16px!important;
border-bottom:1px solid #e7edf6!important;
background:rgba(255,255,255,.94)!important;
-webkit-backdrop-filter:blur(14px) saturate(150%)!important;
backdrop-filter:blur(14px) saturate(150%)!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .sidebar-mobile-header h3,
.lv-design-archive-page .sidebar.is-desktop-drawer .sidebar-mobile-header h3{
margin:0!important;
padding:0!important;
color:#111827!important;
font-size:18px!important;
line-height:1.2!important;
font-weight:650!important;
letter-spacing:0!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-sidebar-active-count,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-sidebar-active-count{
margin-left:auto!important;
display:inline-flex!important;
height:26px!important;
min-width:26px!important;
align-items:center!important;
justify-content:center!important;
padding:0 9px!important;
border-radius:999px!important;
background:#eef4ff!important;
color:#3157ff!important;
font-size:12px!important;
font-weight:550!important;
white-space:nowrap!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .sidebar-close-btn:not(.lv-sidebar-done-btn),
.lv-design-archive-page .sidebar.is-desktop-drawer .sidebar-close-btn:not(.lv-sidebar-done-btn){
width:38px!important;
height:38px!important;
min-width:38px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border:1px solid #dfe7f0!important;
border-radius:999px!important;
background:#f8fafc!important;
color:#111827!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-section,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-section,
.lv-discover-section .sidebar.is-desktop-drawer .active-filters .filter-section,
.lv-design-archive-page .sidebar.is-desktop-drawer .active-filters .filter-section{
margin:0 0 12px!important;
padding:14px!important;
border:1px solid #e8eef6!important;
border-radius:18px!important;
background:#fff!important;
box-shadow:0 10px 28px rgba(15,23,42,.045)!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-section > h3,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-section > h3,
.lv-discover-section .sidebar.is-desktop-drawer .filter-header,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-header{
display:flex!important;
align-items:center!important;
gap:9px!important;
min-height:24px!important;
margin:0 0 12px!important;
padding:0!important;
border:0!important;
color:#172033!important;
font-size:14px!important;
line-height:1.2!important;
font-weight:650!important;
letter-spacing:0!important;
text-transform:none!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-section > h3::after,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-section > h3::after{
content:none!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-section > h3 svg,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-section > h3 svg,
.lv-discover-section .sidebar.is-desktop-drawer .filter-header svg,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-header svg{
width:18px!important;
height:18px!important;
margin:0!important;
color:#273244!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-resource-filter-list,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-resource-filter-list{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:9px!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-resource-filter-option,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-resource-filter-option,
.lv-discover-section .sidebar.is-desktop-drawer .lv-resource-filter-option label,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-resource-filter-option label{
width:100%!important;
height:44px!important;
min-height:44px!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-resource-filter-option label,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-resource-filter-option label{
font-size:0!important;
line-height:0!important;
border-radius:15px!important;
background:#f8fafc!important;
border-color:#dfe7f0!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-resource-filter-name,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-resource-filter-name{
font-size:13px!important;
line-height:1!important;
font-weight:550!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-format-filter-list,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-format-filter-list{
grid-template-columns:repeat(5,minmax(0,1fr))!important;
gap:9px!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-format-filter-option label,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-format-filter-option label{
border-radius:14px!important;
background:#f8fafc!important;
border-color:#dfe7f0!important;
box-shadow:none!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .color-palette,
.lv-design-archive-page .sidebar.is-desktop-drawer .color-palette{
display:grid!important;
grid-template-columns:repeat(6,36px)!important;
gap:9px!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .color-swatch,
.lv-design-archive-page .sidebar.is-desktop-drawer .color-swatch{
width:36px!important;
height:36px!important;
border-radius:12px!important;
border:2px solid #fff!important;
box-shadow:0 7px 16px rgba(15,23,42,.12)!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .color-swatch.selected,
.lv-design-archive-page .sidebar.is-desktop-drawer .color-swatch.selected{
outline:2px solid #3157ff!important;
outline-offset:2px!important;
transform:none!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-options,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-options{
gap:3px!important;
max-height:none!important;
overflow:visible!important;
padding-right:0!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-options .filter-option,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-options .filter-option{
min-height:34px!important;
gap:8px!important;
padding:3px 0!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"],
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]{
width:16px!important;
height:16px!important;
min-width:16px!important;
border-radius:5px!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-option label,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-option label{
color:#172033!important;
font-size:14px!important;
font-weight:400!important;
line-height:1.35!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .filter-option label span,
.lv-design-archive-page .sidebar.is-desktop-drawer .filter-option label span{
color:#7b8798!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .tags-filter-cloud,
.lv-design-archive-page .sidebar.is-desktop-drawer .tags-filter-cloud{
gap:7px!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .tag-filter-item,
.lv-design-archive-page .sidebar.is-desktop-drawer .tag-filter-item{
height:32px!important;
padding:0 11px!important;
border-radius:999px!important;
background:#f8fafc!important;
border:1px solid #e4e9f2!important;
box-shadow:none!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-discover-section .sidebar.is-desktop-drawer .lv-sidebar-filter-footer,
.lv-design-archive-page .sidebar.is-desktop-drawer .lv-sidebar-filter-footer{
display:none!important;
}
}
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-drawer,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-drawer,
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-drawer .sidebar-mobile-header,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-drawer .sidebar-mobile-header,
html.lv-theme-dark .lv-discover-section .sidebar.is-desktop-drawer .filter-section,
html.lv-theme-dark .lv-design-archive-page .sidebar.is-desktop-drawer .filter-section{
background:#111827!important;
border-color:rgba(148,163,184,.18)!important;
}
/* v100: tighten desktop drawer resource, format, and color filter grids */
@media (min-width:769px){
.lv-discover-section .sidebar.active .lv-resource-filter-option label,
.lv-design-archive-page .sidebar.active .lv-resource-filter-option label{
font-size:0!important;
line-height:0!important;
gap:8px!important;
}
.lv-discover-section .sidebar.active .lv-resource-filter-name,
.lv-design-archive-page .sidebar.active .lv-resource-filter-name{
font-size:13px!important;
line-height:1!important;
font-weight:550!important;
}
.lv-discover-section .sidebar.active .lv-format-filter-list,
.lv-design-archive-page .sidebar.active .lv-format-filter-list{
display:grid!important;
grid-template-columns:repeat(6,48px)!important;
gap:9px!important;
justify-content:start!important;
}
.lv-discover-section .sidebar.active .lv-format-filter-option,
.lv-design-archive-page .sidebar.active .lv-format-filter-option,
.lv-discover-section .sidebar.active .lv-format-filter-option label,
.lv-design-archive-page .sidebar.active .lv-format-filter-option label{
width:48px!important;
height:48px!important;
min-width:48px!important;
min-height:48px!important;
aspect-ratio:auto!important;
}
.lv-discover-section .sidebar.active .lv-format-filter-option label,
.lv-design-archive-page .sidebar.active .lv-format-filter-option label{
display:grid!important;
place-items:center!important;
padding:0!important;
border-radius:13px!important;
background:#f8fafc!important;
}
.lv-discover-section .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format,
.lv-design-archive-page .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format{
width:32px!important;
height:32px!important;
min-width:32px!important;
display:grid!important;
place-items:center!important;
}
.lv-discover-section .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner,
.lv-design-archive-page .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner,
.lv-discover-section .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner svg,
.lv-design-archive-page .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner svg,
.lv-discover-section .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner img,
.lv-design-archive-page .sidebar.active .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner img{
width:30px!important;
height:30px!important;
max-width:30px!important;
max-height:30px!important;
}
.lv-discover-section .sidebar.active .color-palette,
.lv-design-archive-page .sidebar.active .color-palette{
display:grid!important;
grid-template-columns:repeat(9,32px)!important;
gap:8px!important;
justify-content:start!important;
align-items:center!important;
}
.lv-discover-section .sidebar.active .color-swatch-wrapper,
.lv-design-archive-page .sidebar.active .color-swatch-wrapper,
.lv-discover-section .sidebar.active .color-swatch,
.lv-design-archive-page .sidebar.active .color-swatch{
width:32px!important;
height:32px!important;
min-width:32px!important;
}
.lv-discover-section .sidebar.active .color-swatch,
.lv-design-archive-page .sidebar.active .color-swatch{
border-radius:10px!important;
}
}
/* v99: keep desktop filter drawer fully hidden until the filter button is clicked */
@media (min-width:769px){
.lv-discover-section .sidebar:not(.active),
.lv-design-archive-page .sidebar:not(.active){
left:0!important;
transform:translate3d(-112%,0,0)!important;
opacity:0!important;
visibility:hidden!important;
pointer-events:none!important;
}
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active{
visibility:visible!important;
opacity:1!important;
pointer-events:auto!important;
}
.lv-collections-page .sidebar.active:not(.is-desktop-drawer){
position:fixed!important;
top:0!important;
left:0!important;
z-index:2700!important;
width:min(410px, calc(100vw - 28px))!important;
height:100dvh!important;
max-height:100dvh!important;
overflow-y:auto!important;
transform:translate3d(0,0,0)!important;
background:#fff!important;
filter:none!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
}
}
/* v101: collection term single archive - match modern sort and clean desktop sidebar */
@media (min-width:769px){
.sidebar:not(.is-desktop-drawer) > .lv-sidebar-filter-footer{
display:none!important;
}
.lv-collection-term-page{
width:min(calc(100% - 48px), 1520px)!important;
max-width:1520px!important;
padding-left:24px!important;
padding-right:24px!important;
}
.lv-collection-term-page .content-layout{
grid-template-columns:252px minmax(0,1fr)!important;
gap:24px!important;
align-items:start!important;
padding-top:32px!important;
}
.lv-collection-term-page .main-content{
min-width:0!important;
}
.lv-collection-term-page .sidebar,
.lv-collection-term-page .sidebar:not(.active){
position:sticky!important;
top:118px!important;
left:auto!important;
right:auto!important;
bottom:auto!important;
z-index:2!important;
display:block!important;
width:252px!important;
max-width:252px!important;
height:auto!important;
min-height:0!important;
max-height:calc(100dvh - 138px)!important;
overflow-x:hidden!important;
overflow-y:auto!important;
padding:10px 10px 18px 0!important;
border:0!important;
border-right:1px solid rgba(203,213,225,.78)!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
opacity:1!important;
visibility:visible!important;
pointer-events:auto!important;
transform:none!important;
-webkit-backdrop-filter:none!important;
backdrop-filter:none!important;
}
body.admin-bar .lv-collection-term-page .sidebar,
body.admin-bar .lv-collection-term-page .sidebar:not(.active){
top:150px!important;
max-height:calc(100dvh - 170px)!important;
}
.lv-collection-term-page .sidebar-mobile-header,
.lv-collection-term-page .sidebar-overlay,
.lv-collection-term-page .sidebar .active-filters,
.lv-collection-term-page .sidebar .tags-filter-section,
.lv-collection-term-page .sidebar .lv-sidebar-filter-footer{
display:none!important;
}
.lv-collection-term-page .sidebar .filter-section{
margin:0 0 18px!important;
padding:0 12px 17px 0!important;
border:0!important;
border-bottom:1px solid #e6edf6!important;
border-radius:0!important;
background:transparent!important;
box-shadow:none!important;
}
.lv-collection-term-page .sidebar .filter-section:last-of-type{
margin-bottom:0!important;
border-bottom:0!important;
}
.lv-collection-term-page .sidebar .filter-section > h3,
.lv-collection-term-page .sidebar .filter-header{
display:flex!important;
align-items:center!important;
gap:9px!important;
min-height:24px!important;
margin:0 0 14px!important;
padding:0!important;
border:0!important;
color:#172033!important;
font-size:15px!important;
line-height:1.2!important;
font-weight:600!important;
letter-spacing:0!important;
text-transform:none!important;
}
.lv-collection-term-page .sidebar .filter-section > h3::after{
content:none!important;
}
.lv-collection-term-page .sidebar .filter-section > h3 svg,
.lv-collection-term-page .sidebar .filter-header svg{
width:20px!important;
height:20px!important;
margin:0!important;
color:#273244!important;
}
.lv-collection-term-page .sidebar .lv-resource-filter-list{
display:grid!important;
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:10px!important;
}
.lv-collection-term-page .sidebar .lv-resource-filter-option,
.lv-collection-term-page .sidebar .lv-resource-filter-option label{
width:100%!important;
height:42px!important;
min-height:42px!important;
}
.lv-collection-term-page .sidebar .lv-resource-filter-option label{
gap:8px!important;
padding:0 12px!important;
border:1px solid #dfe7f0!important;
border-radius:14px!important;
background:#f8fafc!important;
box-shadow:none!important;
font-size:0!important;
line-height:0!important;
}
.lv-collection-term-page .sidebar .lv-resource-filter-name{
font-size:13px!important;
line-height:1!important;
font-weight:550!important;
}
.lv-collection-term-page .sidebar .lv-format-filter-list{
display:grid!important;
grid-template-columns:repeat(4,42px)!important;
gap:9px!important;
justify-content:start!important;
}
.lv-collection-term-page .sidebar .lv-format-filter-option,
.lv-collection-term-page .sidebar .lv-format-filter-option label{
width:42px!important;
height:42px!important;
min-width:42px!important;
min-height:42px!important;
}
.lv-collection-term-page .sidebar .lv-format-filter-option label{
display:grid!important;
place-items:center!important;
padding:0!important;
border:1px solid #dfe7f0!important;
border-radius:13px!important;
background:#f8fafc!important;
box-shadow:none!important;
}
.lv-collection-term-page .sidebar .lv-format-filter-name{
display:none!important;
}
.lv-collection-term-page .sidebar .lv-format-filter-option .lv-format-icon.is-filter-format,
.lv-collection-term-page .sidebar .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner,
.lv-collection-term-page .sidebar .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner svg,
.lv-collection-term-page .sidebar .lv-format-filter-option .lv-format-icon.is-filter-format .lv-format-icon-inner img{
width:28px!important;
height:28px!important;
max-width:28px!important;
max-height:28px!important;
}
.lv-collection-term-page .sidebar .color-palette{
display:grid!important;
grid-template-columns:repeat(5,36px)!important;
gap:8px!important;
justify-content:start!important;
}
.lv-collection-term-page .sidebar .color-swatch-wrapper,
.lv-collection-term-page .sidebar .color-swatch{
width:36px!important;
height:36px!important;
min-width:36px!important;
}
.lv-collection-term-page .sidebar .color-swatch{
border:2px solid #fff!important;
border-radius:11px!important;
box-shadow:0 8px 18px rgba(15,23,42,.12)!important;
}
.lv-collection-term-page .sidebar .color-swatch.selected{
outline:2px solid #3157ff!important;
outline-offset:2px!important;
transform:none!important;
}
.lv-collection-term-page .sidebar .filter-options{
display:grid!important;
gap:4px!important;
max-height:none!important;
overflow:visible!important;
padding-right:0!important;
}
.lv-collection-term-page .sidebar .filter-options .filter-option{
min-height:32px!important;
gap:8px!important;
padding:2px 0!important;
}
.lv-collection-term-page .sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]{
width:16px!important;
height:16px!important;
min-width:16px!important;
border-radius:5px!important;
}
.lv-collection-term-page .sidebar .filter-option label{
color:#172033!important;
font-size:14px!important;
font-weight:400!important;
line-height:1.35!important;
}
.lv-collection-term-page .sidebar .filter-option label span{
color:#7b8798!important;
font-size:12px!important;
font-weight:400!important;
}
.lv-collection-term-page .collection-controls{
margin:0 0 20px!important;
padding:0!important;
}
.lv-collection-term-page .control-left{
display:flex!important;
align-items:center!important;
}
.lv-collection-term-page .control-left span{
color:#273244!important;
font-size:14px!important;
font-weight:550!important;
}
.lv-collection-term-page .control-right{
display:flex!important;
align-items:center!important;
margin-left:auto!important;
}
.lv-collection-term-page .lv-collection-sort .sort-select,
.lv-collection-term-page .lv-collection-sort.custom-select .custom-select-trigger{
min-width:148px!important;
height:38px!important;
min-height:38px!important;
padding-left:38px!important;
padding-right:34px!important;
border:1px solid #e4e9f2!important;
border-radius:999px!important;
background:#f8fafc!important;
color:#151b2b!important;
box-shadow:none!important;
font-size:14px!important;
font-weight:500!important;
}
.lv-collection-term-page .lv-collection-sort.custom-select .custom-select-trigger:hover{
background:#fff!important;
border-color:#cfd8e8!important;
box-shadow:0 8px 22px rgba(15,23,42,.07)!important;
}
.lv-collection-term-page .lv-collection-sort .lv-modern-sort-icon{
left:14px!important;
color:#4278c7!important;
}
.lv-collection-term-page .lv-collection-sort.custom-select .custom-select-options{
right:0!important;
left:auto!important;
min-width:180px!important;
border-radius:10px!important;
border:1px solid #dce3ee!important;
box-shadow:0 22px 46px rgba(15,23,42,.14)!important;
}
}
@media (max-width:768px){
.lv-collection-term-page .control-right .lv-collection-sort{
width:auto!important;
}
.lv-collection-term-page .lv-collection-sort .sort-select,
.lv-collection-term-page .lv-collection-sort.custom-select .custom-select-trigger{
width:auto!important;
min-width:132px!important;
padding-left:34px!important;
border-radius:999px!important;
}
}
/* v102: collection term page uses a full-width modern filter bar, no left filter rail */
.lv-collection-term-page .collection-controls{
display:none!important;
}
.lv-collection-term-page .lv-collection-filter-bar a{
text-decoration:none!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-option{
text-decoration:none!important;
}
@media (min-width:769px){
.lv-collection-term-page{
width:min(calc(100% - 48px), 1280px)!important;
max-width:1280px!important;
padding-left:24px!important;
padding-right:24px!important;
}
.lv-collection-term-page .content-layout,
.lv-collection-term-page .content-layout.no-sidebar,
.lv-collection-term-page .lv-collection-term-layout{
display:block!important;
width:100%!important;
max-width:none!important;
margin:0 auto!important;
padding-top:34px!important;
}
.lv-collection-term-page .main-content{
width:100%!important;
max-width:none!important;
margin:0!important;
}
.lv-collection-term-page .sidebar,
.lv-collection-term-page .sidebar-overlay{
display:none!important;
}
.lv-collection-term-page .collection-header{
width:100%!important;
margin-bottom:26px!important;
}
.lv-collection-term-page .lv-collection-filter-bar{
width:100%!important;
margin:0 0 22px!important;
padding:0!important;
z-index:50!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left{
flex-wrap:wrap!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-option{
color:#111827!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-option:hover{
background:#f5f7fb!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-option.is-active{
background:#eef4ff!important;
color:#2457d6!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-open{
display:inline-flex!important;
}
.lv-collection-term-page .lv-collection-filter-label{
cursor:default!important;
}
.lv-collection-term-page .posts-grid{
width:100%!important;
}
}
@media (max-width:768px){
.lv-collection-term-page{
padding-left:14px!important;
padding-right:14px!important;
}
.lv-collection-term-page .content-layout,
.lv-collection-term-page .content-layout.no-sidebar,
.lv-collection-term-page .lv-collection-term-layout{
display:block!important;
padding-top:16px!important;
}
.lv-collection-term-page .lv-collection-filter-bar{
align-items:flex-start!important;
flex-direction:column!important;
gap:10px!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left{
width:100%!important;
flex-wrap:nowrap!important;
overflow-x:auto!important;
padding-bottom:4px!important;
scrollbar-width:none!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left::-webkit-scrollbar{
display:none!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-meta{
width:100%!important;
justify-content:space-between!important;
}
}
/* v103: collection single is not a filter archive; keep full listing width and sort only */
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left,
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-clear{
display:none!important;
}
@media (min-width:769px){
.lv-collection-term-page{
width:100%!important;
max-width:none!important;
margin:0!important;
padding-left:40px!important;
padding-right:40px!important;
}
.lv-collection-term-page .content-layout,
.lv-collection-term-page .content-layout.no-sidebar,
.lv-collection-term-page .lv-collection-term-layout{
width:100%!important;
max-width:none!important;
margin:0!important;
padding-top:34px!important;
}
.lv-collection-term-page .collection-header{
width:100%!important;
max-width:none!important;
margin-left:0!important;
margin-right:0!important;
}
.lv-collection-term-page .lv-collection-filter-bar{
display:flex!important;
width:100%!important;
max-width:none!important;
justify-content:flex-end!important;
margin:0 0 22px!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-meta{
width:auto!important;
margin-left:auto!important;
justify-content:flex-end!important;
}
}
@media (max-width:768px){
.lv-collection-term-page .lv-collection-filter-bar{
align-items:flex-end!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-meta{
width:100%!important;
justify-content:flex-end!important;
}
}
/* v104: collection single keeps only quick FREE/VIP filters on the left */
.lv-collection-term-page .lv-collection-filter-bar .lv-collection-filter-label,
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-separator,
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-group,
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-clear{
display:none!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left{
display:flex!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-quick{
display:flex!important;
}
@media (min-width:769px){
.lv-collection-term-page .lv-collection-filter-bar{
justify-content:space-between!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left{
flex:1 1 auto!important;
width:auto!important;
flex-wrap:wrap!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-meta{
flex:0 0 auto!important;
}
}
@media (max-width:768px){
.lv-collection-term-page .lv-collection-filter-bar{
align-items:center!important;
flex-direction:row!important;
justify-content:space-between!important;
}
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-left,
.lv-collection-term-page .lv-collection-filter-bar .lv-modern-filter-meta{
width:auto!important;
}
}
/* v105: smart sponsored ads, matched to file cards and blog layouts */
.lv-ad-card{
position:relative;
isolation:isolate;
}
.lv-ad-card a,
.lv-ad-card a:hover{
color:inherit;
text-decoration:none;
}
.lv-ad-card .lv-ad-media{
display:block;
width:100%;
max-width:100%;
object-fit:cover;
transition:transform .45s ease, filter .45s ease;
}
.lv-ad-card-file .post-thumbnail-wrapper{
overflow:hidden;
background:linear-gradient(145deg,rgba(248,250,252,.96),rgba(238,244,255,.88));
}
.lv-ad-card-file .lv-ad-file-link{
display:block;
position:relative;
z-index:1;
}
.lv-ad-card-file .lv-ad-media{
height:auto;
}
.lv-ad-card:hover .lv-ad-media{
transform:scale(1.025);
filter:saturate(1.04) contrast(1.02);
}
.lv-ad-badge{
position:absolute;
top:10px;
right:10px;
z-index:14;
display:inline-flex;
align-items:center;
justify-content:center;
min-height:26px;
padding:5px 10px;
border:1px solid rgba(255,255,255,.34);
border-radius:999px;
background:rgba(15,23,42,.74);
color:#fff;
box-shadow:0 10px 26px rgba(15,23,42,.2);
backdrop-filter:blur(14px);
-webkit-backdrop-filter:blur(14px);
font-size:11px;
font-weight:600;
letter-spacing:0;
line-height:1;
white-space:nowrap;
}
.lv-ad-card-file .lv-ad-hover .overlay-title span{
color:#fff;
}
.lv-ad-card-file .lv-ad-cta{
display:inline-flex;
width:max-content;
margin-top:8px;
padding:6px 10px;
border-radius:999px;
background:rgba(255,255,255,.18);
color:#fff;
font-size:12px;
font-weight:600;
backdrop-filter:blur(10px);
}
.lv-blog-ad-slot{
margin:20px 0 26px;
}
.lv-ad-blog-card{
overflow:hidden;
border:1px solid rgba(203,213,225,.72);
border-radius:18px;
background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(241,246,255,.74));
box-shadow:0 18px 45px rgba(15,23,42,.08);
backdrop-filter:blur(18px) saturate(1.18);
-webkit-backdrop-filter:blur(18px) saturate(1.18);
}
.lv-ad-blog-horizontal .lv-ad-blog-link{
display:grid;
grid-template-columns:minmax(170px,38%) minmax(0,1fr);
min-height:156px;
}
.lv-ad-blog-media{
position:relative;
display:block;
min-height:156px;
overflow:hidden;
background:#eef2f7;
}
.lv-ad-blog-media .lv-ad-media{
height:100%;
}
.lv-ad-blog-body{
display:flex;
flex-direction:column;
justify-content:center;
gap:8px;
min-width:0;
padding:22px 24px;
}
.lv-ad-kicker{
width:max-content;
max-width:100%;
padding:5px 10px;
border-radius:999px;
background:#edf4ff;
color:#3567f6;
font-size:12px;
font-weight:600;
}
.lv-ad-blog-body strong{
display:block;
color:#111827;
font-size:20px;
font-weight:650;
line-height:1.25;
}
.lv-ad-blog-body em{
display:block;
color:#64748b;
font-size:14px;
font-style:normal;
line-height:1.55;
}
.lv-ad-blog-body .lv-ad-cta{
display:inline-flex;
align-items:center;
width:max-content;
padding:8px 13px;
border-radius:999px;
background:#111827;
color:#fff;
font-size:13px;
font-weight:600;
}
.lv-blog-right-rail .lv-blog-ad-widget,
.lv-cat-ad-widget{
padding:0!important;
border:0!important;
background:transparent!important;
box-shadow:none!important;
}
.lv-ad-blog-vertical .lv-ad-vertical-link{
position:relative;
display:block;
min-height:280px;
overflow:hidden;
border-radius:18px;
background:#eef2f7;
}
.lv-ad-blog-vertical .lv-ad-media{
width:100%;
height:100%;
min-height:280px;
aspect-ratio:3/4;
object-fit:cover;
}
.lv-ad-vertical-caption{
position:absolute;
right:12px;
bottom:12px;
left:12px;
z-index:12;
display:flex;
flex-direction:column;
gap:3px;
padding:12px;
border:1px solid rgba(255,255,255,.28);
border-radius:14px;
background:rgba(15,23,42,.66);
color:#fff;
box-shadow:0 12px 32px rgba(15,23,42,.22);
backdrop-filter:blur(16px);
-webkit-backdrop-filter:blur(16px);
}
.lv-ad-vertical-caption strong{
font-size:14px;
font-weight:650;
line-height:1.25;
}
.lv-ad-vertical-caption em{
color:rgba(255,255,255,.82);
font-size:12px;
font-style:normal;
font-weight:500;
}
.lv-ad-side-rails{
position:fixed;
inset:0;
z-index:45;
pointer-events:none;
}
.lv-ad-side-rail{
position:fixed;
top:190px;
width:164px;
pointer-events:auto;
}
.lv-ad-side-rail.is-left{
left:max(102px,calc((100vw - 1220px)/2 - 204px));
}
.lv-ad-side-rail.is-right{
right:max(20px,calc((100vw - 1220px)/2 - 204px));
}
.lv-ad-side-rail .lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-ad-side-rail .lv-ad-blog-vertical .lv-ad-media{
min-height:390px;
}
.lv-post-ad-horizontal{
width:min(var(--lv-blog-shell,1008px),calc(100% - 32px));
max-width:var(--lv-blog-shell,1008px);
margin:24px auto;
}
html.lv-theme-dark .lv-ad-blog-card{
border-color:rgba(148,163,184,.24);
background:linear-gradient(135deg,rgba(15,23,42,.86),rgba(30,41,59,.76));
}
html.lv-theme-dark .lv-ad-blog-body strong{
color:#f8fafc;
}
html.lv-theme-dark .lv-ad-blog-body em{
color:#cbd5e1;
}
@media (max-width:1500px){
.lv-ad-side-rails{
display:none;
}
}
@media (max-width:768px){
.lv-ad-badge{
top:8px;
right:8px;
min-height:24px;
padding:5px 9px;
font-size:10px;
}
.lv-ad-blog-horizontal .lv-ad-blog-link{
grid-template-columns:1fr;
}
.lv-ad-blog-media{
min-height:0;
aspect-ratio:16/9;
}
.lv-ad-blog-body{
padding:16px;
}
.lv-ad-blog-body strong{
font-size:17px;
}
.lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-ad-blog-vertical .lv-ad-media{
min-height:220px;
}
}
/* v106: blog ad sizing and separation fixes */
.lv-cat-content-grid > .lv-cat-ad-widget{
grid-column:2;
align-self:start;
width:100%;
margin-top:20px;
}
.lv-cat-content-grid > .lv-cat-ad-widget .lv-ad-blog-card{
width:100%;
}
.lv-cat-content-grid > .lv-cat-ad-widget .lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-cat-content-grid > .lv-cat-ad-widget .lv-ad-blog-vertical .lv-ad-media{
min-height:360px;
}
@media (min-width:1501px){
.lv-ad-side-rail{
top:118px;
width:224px;
}
.lv-ad-side-rail.is-left{
left:max(116px,calc((100vw - 1180px)/2 - 266px));
}
.lv-ad-side-rail.is-right{
right:max(34px,calc((100vw - 1180px)/2 - 266px));
}
.lv-ad-side-rail .lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-ad-side-rail .lv-ad-blog-vertical .lv-ad-media{
min-height:480px;
}
.lv-ad-side-rail .lv-ad-vertical-caption{
right:14px;
bottom:14px;
left:14px;
}
}
@media (min-width:1800px){
.lv-ad-side-rail{
width:236px;
}
.lv-ad-side-rail.is-left{
left:max(126px,calc((100vw - 1180px)/2 - 292px));
}
.lv-ad-side-rail.is-right{
right:max(46px,calc((100vw - 1180px)/2 - 292px));
}
}
@media (max-width:768px){
.lv-cat-content-grid > .lv-cat-ad-widget{
grid-column:auto;
margin-top:16px;
}
.lv-cat-content-grid > .lv-cat-ad-widget .lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-cat-content-grid > .lv-cat-ad-widget .lv-ad-blog-vertical .lv-ad-media{
min-height:300px;
}
}
/* v107: single blog side ads balanced around centered article */
.lv-blog-detail-page.lv-blog-detail-page-v16{
--lv-single-side-ad-width:224px;
--lv-single-side-ad-gap:32px;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-stage{
width:min(calc(100% - 48px),calc(var(--lv-blog-shell) + (var(--lv-single-side-ad-width) * 2) + (var(--lv-single-side-ad-gap) * 2)));
max-width:calc(var(--lv-blog-shell) + (var(--lv-single-side-ad-width) * 2) + (var(--lv-single-side-ad-gap) * 2));
margin:0 auto;
display:grid;
grid-template-columns:minmax(0,var(--lv-single-side-ad-width)) minmax(0,var(--lv-blog-shell)) minmax(0,var(--lv-single-side-ad-width));
column-gap:var(--lv-single-side-ad-gap);
align-items:start;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-stage > .lv-blog-detail-shell{
grid-column:2;
width:100%!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad{
position:sticky;
top:116px;
align-self:start;
width:100%;
z-index:4;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad.is-left{grid-column:1;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad.is-right{grid-column:3;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-blog-card,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-blog-vertical,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-vertical-link,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-media{
width:100%;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-blog-vertical .lv-ad-media{
min-height:520px;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad .lv-ad-vertical-caption{
right:14px;
bottom:14px;
left:14px;
}
@media (min-width:1800px){
.lv-blog-detail-page.lv-blog-detail-page-v16{
--lv-single-side-ad-width:236px;
--lv-single-side-ad-gap:36px;
}
}
@media (max-width:1540px){
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-stage{
width:min(calc(100% - 32px),var(--lv-blog-shell));
max-width:var(--lv-blog-shell);
grid-template-columns:minmax(0,1fr);
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-blog-detail-stage > .lv-blog-detail-shell{
grid-column:auto;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-single-side-ad{
display:none;
}
}
/* v108: category archive centered shell and ad stacked directly under latest posts */
.lv-blog-category-page .lv-blog-category-shell{
width:min(calc(100% - 48px), var(--lv-content-shell-width, 1180px))!important;
max-width:var(--lv-content-shell-width, 1180px)!important;
margin-left:auto!important;
margin-right:auto!important;
}
.lv-cat-content-grid{
grid-template-columns:minmax(0, 1fr) 300px!important;
gap:28px!important;
align-items:start!important;
}
.lv-cat-main-section{
min-width:0;
}
.lv-cat-sidebar{
position:sticky;
top:96px;
display:grid;
gap:18px;
align-self:start;
}
.lv-cat-latest-card{
position:static!important;
}
.lv-cat-content-grid > .lv-cat-sidebar{
grid-column:2;
}
.lv-cat-sidebar .lv-cat-ad-widget{
margin-top:0!important;
width:100%;
}
.lv-cat-sidebar .lv-ad-blog-card{
width:100%;
}
.lv-cat-sidebar .lv-ad-blog-vertical .lv-ad-vertical-link,
.lv-cat-sidebar .lv-ad-blog-vertical .lv-ad-media{
min-height:360px;
}
@media (max-width:1100px){
.lv-cat-content-grid{
grid-template-columns:minmax(0, 1fr) 288px!important;
gap:24px!important;
}
}
@media (max-width:920px){
.lv-cat-content-grid{
grid-template-columns:1fr!important;
}
.lv-cat-sidebar{
position:static;
top:auto;
}
.lv-cat-content-grid > .lv-cat-sidebar{
grid-column:auto;
}
}
@media (max-width:640px){
.lv-blog-category-page .lv-blog-category-shell{
width:min(calc(100% - 28px), var(--lv-content-shell-width, 1180px))!important;
}
}
/* v41 - Logical left rail logo builder: static media logo + animated SVG logo */
@media (min-width: 769px){
.lv-side-rail .lv-rail-brand,
.lv-rail-actions-editable .lv-rail-brand{
width:52px!important;
height:52px!important;
min-height:52px!important;
display:grid!important;
place-items:center!important;
padding:0!important;
border-radius:16px!important;
background:transparent!important;
color:var(--lv-logo-primary,var(--color-primary,#f59e0b))!important;
box-shadow:none!important;
overflow:visible!important;
text-decoration:none!important;
}
.lv-side-rail .lv-rail-brand:hover,
.lv-side-rail .lv-rail-brand:focus-visible{
background:rgba(245,158,11,.08)!important;
box-shadow:0 14px 28px rgba(245,158,11,.12)!important;
}
.lv-rail-brand-media{
width:42px!important;
height:42px!important;
display:grid!important;
place-items:center!important;
overflow:visible!important;
}
.lv-rail-brand img,
.lv-rail-brand svg{
width:42px!important;
height:42px!important;
max-width:42px!important;
max-height:42px!important;
display:block!important;
object-fit:contain!important;
overflow:visible!important;
}
.lv-rail-brand svg .cls-1{
fill:var(--lv-logo-primary,var(--color-primary,#f59e0b))!important;
transform-box:fill-box;
transform-origin:center;
}
.lv-rail-brand svg .cls-2{
fill:var(--lv-logo-secondary,var(--color-secondary,#ffc176))!important;
transform-box:fill-box;
transform-origin:center;
}
.lv-logo-anim-download svg .cls-1{
animation:lvLogoArrowDrop 1.95s cubic-bezier(.2,.9,.25,1) infinite;
}
.lv-logo-anim-download svg .cls-2{
animation:lvLogoSoftBreath 1.95s ease-in-out infinite;
}
.lv-logo-anim-orbit svg .cls-2{
transform-origin:50% 50%;
animation:lvLogoOrbit 5.6s linear infinite;
}
.lv-logo-anim-orbit svg .cls-1{
animation:lvLogoPointerNudge 2.4s ease-in-out infinite;
}
.lv-logo-anim-duotone svg .cls-1{
animation:lvLogoDuoPrimary 2.6s ease-in-out infinite;
}
.lv-logo-anim-duotone svg .cls-2{
animation:lvLogoDuoSecondary 2.6s ease-in-out infinite;
}
}
@keyframes lvLogoArrowDrop{
0%,100%{transform:translateY(0) scale(1)}
34%{transform:translateY(-11px) scale(.98)}
58%{transform:translateY(3px) scale(1.04)}
72%{transform:translateY(0) scale(1)}
}
@keyframes lvLogoSoftBreath{
0%,100%{opacity:.78;transform:scale(1)}
48%{opacity:1;transform:scale(1.035)}
}
@keyframes lvLogoOrbit{
0%{transform:rotate(0deg) scale(1)}
50%{transform:rotate(180deg) scale(1.025)}
100%{transform:rotate(360deg) scale(1)}
}
@keyframes lvLogoPointerNudge{
0%,100%{transform:translateY(0) rotate(0deg)}
50%{transform:translateY(-4px) rotate(-3deg)}
}
@keyframes lvLogoDuoPrimary{
0%,100%{opacity:.92;filter:saturate(1)}
50%{opacity:1;filter:saturate(1.28) brightness(1.04)}
}
@keyframes lvLogoDuoSecondary{
0%,100%{opacity:.72;filter:saturate(.95)}
50%{opacity:1;filter:saturate(1.2) brightness(1.06)}
}
@media (prefers-reduced-motion: reduce){
.lv-rail-brand svg .cls-1,
.lv-rail-brand svg .cls-2{animation:none!important}
}
/* v1.1.2 - shared admin logo for mobile header + 5 animated logo presets */
.lv-logo-mark-media{
position:relative!important;
display:grid!important;
place-items:center!important;
overflow:visible!important;
isolation:isolate!important;
}
.lv-logo-mark-media svg .cls-1,
.lv-logo-mark-media svg [class~="cls-1"]{
fill:var(--lv-logo-primary,var(--color-primary,#f59e0b))!important;
transform-box:fill-box!important;
transform-origin:center!important;
}
.lv-logo-mark-media svg .cls-2,
.lv-logo-mark-media svg [class~="cls-2"]{
fill:var(--lv-logo-secondary,var(--color-secondary,#ffc176))!important;
transform-box:fill-box!important;
transform-origin:center!important;
}
.lv-logo-mark-media svg .cls-3,
.lv-logo-mark-media svg [class~="cls-3"]{
fill:var(--lv-logo-text,var(--color-text,#1f222d))!important;
transform-box:fill-box!important;
transform-origin:center!important;
}
.lv-logo-mark-media svg path{
transform-box:fill-box!important;
transform-origin:center!important;
}
@media (min-width:769px){
.lv-side-rail .lv-rail-brand-media.lv-logo-mark-media{
width:46px!important;
height:46px!important;
}
.lv-side-rail .lv-rail-brand svg,
.lv-side-rail .lv-rail-brand img{
width:46px!important;
height:auto!important;
max-width:46px!important;
max-height:46px!important;
object-fit:contain!important;
}
}
@media (max-width:768px){
.top-menu .lv-mobile-brand.lv-mobile-brand--logo{
min-width:0!important;
width:auto!important;
max-width:142px!important;
height:34px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:flex-start!important;
flex:0 0 auto!important;
padding:0!important;
border:0!important;
background:transparent!important;
box-shadow:none!important;
text-decoration:none!important;
overflow:visible!important;
}
.top-menu .lv-mobile-brand-media{
width:120px!important;
height:26px!important;
}
.top-menu .lv-mobile-brand svg,
.top-menu .lv-mobile-brand img{
width:120px!important;
height:auto!important;
max-width:120px!important;
max-height:28px!important;
display:block!important;
object-fit:contain!important;
overflow:visible!important;
}
.top-menu .lv-mobile-brand img{
height:auto!important;
}
}
@media (max-width:374px){
.top-menu .lv-mobile-brand-media,
.top-menu .lv-mobile-brand svg,
.top-menu .lv-mobile-brand img{
width:108px!important;
max-width:108px!important;
}
}
.lv-logo-anim-download svg .cls-1,
.lv-logo-anim-download svg [class~="cls-1"]{
animation:none!important;
}
.lv-logo-anim-download svg path.cls-1:nth-of-type(2){
animation:lvLogoArrowDropV112 1.85s cubic-bezier(.2,.9,.25,1) infinite!important;
}
.lv-logo-anim-download svg path.cls-2:first-of-type{
animation:lvLogoRingBreathV112 1.85s ease-in-out infinite!important;
}
.lv-logo-anim-shimmer .lv-logo-mark-media{
overflow:hidden!important;
border-radius:7px!important;
}
.lv-logo-anim-shimmer .lv-logo-mark-media::after{
content:""!important;
position:absolute!important;
z-index:2!important;
inset:-28% auto -28% -55%!important;
width:42%!important;
pointer-events:none!important;
background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,.18) 30%,rgba(255,255,255,.78) 50%,rgba(255,255,255,.18) 70%,transparent 100%)!important;
transform:skewX(-18deg)!important;
animation:lvLogoShimmerSweepV112 2.4s ease-in-out infinite!important;
mix-blend-mode:screen!important;
}
.lv-logo-anim-shimmer svg path{
animation:lvLogoShimmerInkV112 2.4s ease-in-out infinite!important;
}
.lv-logo-anim-orbit svg path.cls-2:first-of-type{
transform-origin:50% 50%!important;
animation:lvLogoOrbitV112 5.2s linear infinite!important;
}
.lv-logo-anim-orbit svg path.cls-1:nth-of-type(2){
animation:lvLogoPointerNudgeV112 2.25s ease-in-out infinite!important;
}
.lv-logo-anim-duotone svg .cls-1,
.lv-logo-anim-duotone svg [class~="cls-1"]{
animation:lvLogoDuoPrimaryV112 2.65s ease-in-out infinite!important;
}
.lv-logo-anim-duotone svg .cls-2,
.lv-logo-anim-duotone svg [class~="cls-2"]{
animation:lvLogoDuoSecondaryV112 2.65s ease-in-out infinite!important;
}
.lv-logo-anim-duotone svg .cls-3,
.lv-logo-anim-duotone svg [class~="cls-3"]{
animation:lvLogoDuoTextV112 2.65s ease-in-out infinite!important;
}
.lv-logo-anim-pop .lv-logo-mark-media{
animation:lvLogoPopFloatV112 2.9s cubic-bezier(.2,.85,.22,1) infinite!important;
}
.lv-logo-anim-pop svg path.cls-1:nth-of-type(2){
animation:lvLogoPopArrowV112 2.9s cubic-bezier(.2,.85,.22,1) infinite!important;
}
@keyframes lvLogoArrowDropV112{
0%{opacity:0;transform:translateY(-8px) scale(.92) rotate(-2deg)}
18%{opacity:1;transform:translateY(-3px) scale(1) rotate(0deg)}
46%{opacity:1;transform:translateY(2px) scale(1.05) rotate(0deg)}
63%,100%{opacity:1;transform:translateY(0) scale(1) rotate(0deg)}
}
@keyframes lvLogoRingBreathV112{
0%,100%{opacity:.78;filter:saturate(.98) brightness(1);transform:scale(1)}
52%{opacity:1;filter:saturate(1.18) brightness(1.04);transform:scale(1.025)}
}
@keyframes lvLogoShimmerSweepV112{
0%,30%{left:-55%;opacity:0}
42%{opacity:1}
72%,100%{left:120%;opacity:0}
}
@keyframes lvLogoShimmerInkV112{
0%,100%{filter:brightness(1) saturate(1)}
48%{filter:brightness(1.08) saturate(1.12)}
}
@keyframes lvLogoOrbitV112{
0%{filter:hue-rotate(0deg) saturate(1);transform:rotate(0deg) scale(1)}
50%{filter:hue-rotate(10deg) saturate(1.16);transform:rotate(180deg) scale(1.025)}
100%{filter:hue-rotate(0deg) saturate(1);transform:rotate(360deg) scale(1)}
}
@keyframes lvLogoPointerNudgeV112{
0%,100%{transform:translateY(0) rotate(0deg)}
50%{transform:translateY(-2px) rotate(-4deg)}
}
@keyframes lvLogoDuoPrimaryV112{
0%,100%{opacity:.9;filter:saturate(1) brightness(1)}
50%{opacity:1;filter:saturate(1.35) brightness(1.07)}
}
@keyframes lvLogoDuoSecondaryV112{
0%,100%{opacity:.68;filter:saturate(.95) brightness(1)}
50%{opacity:1;filter:saturate(1.22) brightness(1.06)}
}
@keyframes lvLogoDuoTextV112{
0%,100%{opacity:.88;filter:brightness(1)}
50%{opacity:1;filter:brightness(1.08)}
}
@keyframes lvLogoPopFloatV112{
0%,100%{transform:translateY(0) scale(1);filter:drop-shadow(0 0 0 rgba(245,158,11,0))}
38%{transform:translateY(-1px) scale(1.035);filter:drop-shadow(0 5px 10px rgba(245,158,11,.14))}
58%{transform:translateY(0) scale(.995);filter:drop-shadow(0 0 0 rgba(245,158,11,0))}
}
@keyframes lvLogoPopArrowV112{
0%,100%{transform:scale(1) rotate(0deg)}
38%{transform:scale(1.08) rotate(-3deg)}
58%{transform:scale(.98) rotate(0deg)}
}
@media (prefers-reduced-motion: reduce){
.lv-logo-mark-media,
.lv-logo-mark-media::after,
.lv-logo-mark-media svg *,
.lv-logo-anim-pop .lv-logo-mark-media,
.lv-logo-anim-shimmer .lv-logo-mark-media::after{
animation:none!important;
transition:none!important;
}
}
/* v1.1.3 - Separate desktop icon logo and mobile full wordmark logo */
@media (min-width:769px){
.lv-side-rail .lv-rail-brand svg.lv-animated-logo-svg--mark,
.lv-side-rail .lv-rail-brand img{
width:42px!important;
height:42px!important;
max-width:42px!important;
max-height:42px!important;
object-fit:contain!important;
}
.lv-side-rail .lv-rail-brand svg.lv-animated-logo-svg--wordmark{
width:46px!important;
max-width:46px!important;
height:auto!important;
}
}
@media (max-width:768px){
.top-menu .lv-mobile-brand svg.lv-animated-logo-svg--wordmark,
.top-menu .lv-mobile-brand img{
width:124px!important;
max-width:124px!important;
height:auto!important;
max-height:30px!important;
}
.top-menu .lv-mobile-brand svg.lv-animated-logo-svg--mark{
width:34px!important;
height:34px!important;
max-width:34px!important;
max-height:34px!important;
}
}
@media (max-width:374px){
.top-menu .lv-mobile-brand svg.lv-animated-logo-svg--wordmark,
.top-menu .lv-mobile-brand img{
width:112px!important;
max-width:112px!important;
}
}
/* v1.1.4 - refined logo animation presets: keep download + add Aperture + Trion */
.lv-logo-mark-media svg{
position:relative!important;
z-index:2!important;
}
.lv-logo-mark-media{
--lv-logo-orbit-x:50%;
--lv-logo-ring-size:34px;
}
.top-menu .lv-logo-mark-media{
--lv-logo-orbit-x:14px;
--lv-logo-ring-size:26px;
}
.lv-logo-anim-aperture .lv-logo-mark-media::before,
.lv-logo-anim-trion .lv-logo-mark-media::before,
.lv-logo-anim-trion .lv-logo-mark-media::after{
content:""!important;
position:absolute!important;
top:50%!important;
left:var(--lv-logo-orbit-x)!important;
pointer-events:none!important;
border-radius:999px!important;
z-index:1!important;
transform:translate(-50%,-50%) scale(.4)!important;
opacity:0!important;
}
.lv-logo-anim-aperture .lv-logo-mark-media::before{
width:var(--lv-logo-ring-size)!important;
height:var(--lv-logo-ring-size)!important;
border:1.5px solid rgba(31,34,45,.18)!important;
box-shadow:0 0 0 1px rgba(255,255,255,.32) inset, 0 0 18px rgba(245,158,11,.12)!important;
animation:lvLogoApertureHalo 4.8s cubic-bezier(.34,1.56,.64,1) infinite!important;
}
.lv-logo-anim-aperture svg path:nth-of-type(1){
animation:lvLogoApertureRing 4.8s cubic-bezier(.34,1.56,.64,1) infinite!important;
}
.lv-logo-anim-aperture svg path:nth-of-type(2){
animation:lvLogoApertureArrow 4.8s cubic-bezier(.34,1.56,.64,1) infinite!important;
}
.lv-logo-anim-aperture svg path:nth-of-type(n+3){
animation:lvLogoApertureText 4.8s ease-out infinite!important;
}
.lv-logo-anim-trion .lv-logo-mark-media::before,
.lv-logo-anim-trion .lv-logo-mark-media::after{
border:1.25px solid rgba(31,34,45,.18)!important;
box-shadow:0 0 0 1px rgba(255,255,255,.32) inset!important;
}
.lv-logo-anim-trion .lv-logo-mark-media::before{
width:var(--lv-logo-ring-size)!important;
height:var(--lv-logo-ring-size)!important;
animation:lvLogoTrionOuter 6.8s linear infinite!important;
}
.lv-logo-anim-trion .lv-logo-mark-media::after{
width:calc(var(--lv-logo-ring-size) - 6px)!important;
height:calc(var(--lv-logo-ring-size) - 6px)!important;
animation:lvLogoTrionInner 6.8s linear infinite!important;
}
.lv-logo-anim-trion svg path:nth-of-type(1){
animation:lvLogoTrionMarkA 6.8s cubic-bezier(.34,1.56,.64,1) infinite!important;
}
.lv-logo-anim-trion svg path:nth-of-type(2){
animation:lvLogoTrionMarkB 6.8s cubic-bezier(.34,1.56,.64,1) infinite!important;
}
.lv-logo-anim-trion svg path:nth-of-type(n+3){
animation:lvLogoTrionText 6.8s ease-out infinite!important;
}
@keyframes lvLogoApertureHalo{
0%,16%{opacity:0;transform:translate(-50%,-50%) scale(.42)}
28%{opacity:.72;transform:translate(-50%,-50%) scale(1.12)}
36%,84%{opacity:.48;transform:translate(-50%,-50%) scale(1)}
100%{opacity:0;transform:translate(-50%,-50%) scale(.96)}
}
@keyframes lvLogoApertureRing{
0%,4%{opacity:0;transform:scale(.3) rotate(-28deg)}
18%{opacity:1;transform:scale(1.08) rotate(8deg)}
26%,100%{opacity:1;transform:scale(1) rotate(0deg)}
}
@keyframes lvLogoApertureArrow{
0%,10%{opacity:0;transform:translateY(-7px) scale(.32) rotate(-30deg)}
24%{opacity:1;transform:translateY(1px) scale(1.08) rotate(5deg)}
32%,100%{opacity:1;transform:translateY(0) scale(1) rotate(0deg)}
}
@keyframes lvLogoApertureText{
0%,28%{opacity:0;transform:translateY(5px) scale(.98)}
42%{opacity:1;transform:translateY(0) scale(1)}
100%{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes lvLogoTrionOuter{
0%,10%{opacity:0;transform:translate(-50%,-50%) scale(.7) rotate(0deg)}
20%{opacity:.55;transform:translate(-50%,-50%) scale(1) rotate(0deg)}
38%{opacity:.55;transform:translate(-50%,-50%) scale(1) rotate(0deg)}
100%{opacity:.28;transform:translate(-50%,-50%) scale(1) rotate(360deg)}
}
@keyframes lvLogoTrionInner{
0%,16%{opacity:0;transform:translate(-50%,-50%) scale(.62) rotate(0deg)}
28%{opacity:.65;transform:translate(-50%,-50%) scale(1) rotate(0deg)}
45%{opacity:.58;transform:translate(-50%,-50%) scale(1) rotate(0deg)}
100%{opacity:.24;transform:translate(-50%,-50%) scale(1) rotate(-360deg)}
}
@keyframes lvLogoTrionMarkA{
0%,4%{opacity:0;transform:scale(0) rotate(180deg)}
18%{opacity:1;transform:scale(1.08) rotate(-10deg)}
28%,100%{opacity:1;transform:scale(1) rotate(0deg)}
}
@keyframes lvLogoTrionMarkB{
0%,8%{opacity:0;transform:scale(0) rotate(180deg)}
22%{opacity:1;transform:scale(1.06) rotate(6deg)}
30%,100%{opacity:1;transform:scale(1) rotate(0deg)}
}
@keyframes lvLogoTrionText{
0%,24%{opacity:0;transform:translateY(4px)}
36%{opacity:1;transform:translateY(0)}
100%{opacity:1;transform:translateY(0)}
}
@media (prefers-reduced-motion: reduce){
.lv-logo-anim-aperture .lv-logo-mark-media::before,
.lv-logo-anim-trion .lv-logo-mark-media::before,
.lv-logo-anim-trion .lv-logo-mark-media::after,
.lv-logo-anim-aperture svg path,
.lv-logo-anim-trion svg path{
animation:none!important;
}
}
/* v1.1.5 - footer full logo + stronger scope-specific logo animation */
.lv-logo-scope-desktop{--lv-logo-orbit-x:50%;--lv-logo-ring-size:36px;--lv-logo-download-y:-9px;--lv-logo-text-delay:.24s}
.lv-logo-scope-mobile{--lv-logo-orbit-x:13px;--lv-logo-ring-size:26px;--lv-logo-download-y:-7px;--lv-logo-text-delay:.18s}
.lv-logo-scope-footer{--lv-logo-orbit-x:13px;--lv-logo-ring-size:30px;--lv-logo-download-y:-8px;--lv-logo-text-delay:.22s}
.site-footer .lv-footer-logo-slot{display:flex!important;align-items:center!important;justify-content:flex-start!important;margin-bottom:14px!important}
.site-footer .lv-footer-brand{display:inline-flex!important;align-items:center!important;text-decoration:none!important;line-height:1!important;width:auto!important;max-width:220px!important;overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.site-footer .lv-footer-brand-media{display:grid!important;place-items:center!important;position:relative!important;isolation:isolate!important;overflow:visible!important;width:158px!important;height:38px!important}
.site-footer .lv-footer-brand svg.lv-animated-logo-svg--wordmark,
.site-footer .lv-footer-brand img{display:block!important;width:158px!important;max-width:158px!important;height:auto!important;max-height:40px!important;object-fit:contain!important;overflow:visible!important}
.site-footer .lv-footer-brand svg.lv-animated-logo-svg--mark{display:block!important;width:42px!important;height:42px!important;max-width:42px!important;max-height:42px!important;overflow:visible!important}
.site-footer .lv-footer-brand svg .cls-1,.site-footer .lv-footer-brand svg [class~="cls-1"]{fill:var(--lv-logo-primary,var(--color-primary,#f59e0b))!important;transform-box:fill-box!important;transform-origin:center!important}.site-footer .lv-footer-brand svg .cls-2,.site-footer .lv-footer-brand svg [class~="cls-2"]{fill:var(--lv-logo-secondary,var(--color-secondary,#ffc176))!important;transform-box:fill-box!important;transform-origin:center!important}.site-footer .lv-footer-brand svg .cls-3,.site-footer .lv-footer-brand svg [class~="cls-3"]{fill:var(--lv-logo-text,var(--color-text,#1f222d))!important;transform-box:fill-box!important;transform-origin:center!important}.site-footer .lv-footer-brand svg path{transform-box:fill-box!important;transform-origin:center!important}
.lv-logo-scope-mobile.lv-logo-anim-download svg path.cls-1:nth-of-type(2),.lv-logo-scope-footer.lv-logo-anim-download svg path.cls-1:nth-of-type(2){animation:lvLogoMobileFooterDownloadArrow 1.95s cubic-bezier(.2,.9,.25,1) infinite!important}.lv-logo-scope-mobile.lv-logo-anim-download svg path:nth-of-type(n+3),.lv-logo-scope-footer.lv-logo-anim-download svg path:nth-of-type(n+3){animation:lvLogoMobileFooterTextHold 1.95s ease-in-out infinite!important}
.lv-logo-scope-desktop.lv-logo-anim-aperture .lv-logo-mark-media::before{--lv-logo-ring-size:38px}.lv-logo-scope-mobile.lv-logo-anim-aperture .lv-logo-mark-media::before,.lv-logo-scope-footer.lv-logo-anim-aperture .lv-logo-mark-media::before{left:var(--lv-logo-orbit-x)!important}
.lv-logo-scope-mobile.lv-logo-anim-aperture svg path:nth-of-type(n+3),.lv-logo-scope-footer.lv-logo-anim-aperture svg path:nth-of-type(n+3){animation:lvLogoWordmarkRevealSoft 4.8s ease-out infinite!important}.lv-logo-scope-mobile.lv-logo-anim-trion svg path:nth-of-type(n+3),.lv-logo-scope-footer.lv-logo-anim-trion svg path:nth-of-type(n+3){animation:lvLogoWordmarkRevealPremium 6.8s ease-out infinite!important}
.lv-logo-scope-footer.lv-logo-anim-trion .lv-logo-mark-media::before{box-shadow:0 0 14px rgba(245,158,11,.16),0 0 0 1px rgba(255,255,255,.35) inset!important}.lv-logo-scope-footer.lv-logo-anim-trion .lv-logo-mark-media::after{box-shadow:0 0 10px rgba(255,193,118,.12)!important}
@keyframes lvLogoMobileFooterDownloadArrow{0%{opacity:0;transform:translateY(var(--lv-logo-download-y,-8px)) scale(.9) rotate(-2deg)}18%{opacity:1;transform:translateY(-3px) scale(1) rotate(0)}46%{opacity:1;transform:translateY(2px) scale(1.06) rotate(0)}64%,100%{opacity:1;transform:translateY(0) scale(1) rotate(0)}}
@keyframes lvLogoMobileFooterTextHold{0%,12%{opacity:.82;filter:brightness(1)}45%{opacity:1;filter:brightness(1.08)}100%{opacity:.9;filter:brightness(1)}}
@keyframes lvLogoWordmarkRevealSoft{0%,26%{opacity:0;transform:translateX(-4px) translateY(3px)}42%,100%{opacity:1;transform:translateX(0) translateY(0)}}
@keyframes lvLogoWordmarkRevealPremium{0%,24%{opacity:0;transform:translateY(4px);filter:brightness(.95)}36%{opacity:1;transform:translateY(0);filter:brightness(1.08)}100%{opacity:1;transform:translateY(0);filter:brightness(1)}}
@media (max-width:768px){.site-footer .lv-footer-logo-slot{justify-content:center!important}.site-footer .lv-footer-brand-media{width:148px!important;height:36px!important}.site-footer .lv-footer-brand svg.lv-animated-logo-svg--wordmark,.site-footer .lv-footer-brand img{width:148px!important;max-width:148px!important}}
/* v1.1.6 - Brand color lock: primary #ffa727, secondary #ffc176, text #1f222d */
:root{
--color-primary:#ffa727;
--color-primary-hover:#ffa727;
--color-secondary:#ffc176;
--color-text:#1f222d;
--lv-text:#1f222d;
--lv-ink:#1f222d;
--lv-primary:#ffa727;
--lv-accent:#ffa727;
--lv-warning:#ffc176;
--lv-blue:#ffa727;
--lv-blue-2:#ffc176;
--lv-logo-primary:#ffa727;
--lv-logo-secondary:#ffc176;
--lv-logo-text:#1f222d;
--lv-button-color:#ffa727;
--lv-brand-soft:rgba(255,167,39,.12);
--lv-brand-soft-2:rgba(255,193,118,.24);
--lv-brand-border:rgba(255,167,39,.34);
--lv-brand-shadow:rgba(255,167,39,.22);
}
body{color:var(--color-text)!important;}
body :where(.lv-hero-search > button[type="submit"],.search-submit,.larxvo-download-btn,.larxvo-download-btn-main,.larxvo-download-btn-floating,.download-button,.download-btn,.single-download-button,.btn-download-favorite,.btn-download-invoice,.checkout-button,.woocommerce a.button.alt,.woocommerce button.button.alt,.lv-post-usefulness-submit,.form-submit .submit,.comment-form input[type="submit"],.comment-submit,.lv-aff-btn,.lv-btn-primary,.btn-primary,.button-primary,input[type="submit"]){background:linear-gradient(135deg,var(--lv-button-color),var(--color-secondary))!important;border-color:var(--lv-button-color)!important;color:#fff!important;box-shadow:0 12px 26px var(--lv-brand-shadow)!important}
body :where(.lv-search-mode .is-active,.lv-ranking-tabs button.is-active,.lv-period-tabs a.is-active,.lv-period-tabs button.is-active,.lv-collection-sort-option.is-active,.lv-modern-filter-option.is-active,.lv-modern-filter-chip.is-active){background:linear-gradient(135deg,var(--color-primary),var(--color-secondary))!important;border-color:var(--color-primary)!important;color:#fff!important;box-shadow:0 12px 26px var(--lv-brand-shadow)!important}
body :where(.lv-filter-chip:hover,.lv-term-strip a:hover,.lv-modern-filter-open:hover,.lv-modern-filter-chip:hover,.lv-modern-filter-trigger:hover,.lv-modern-clear:hover){background:var(--lv-brand-soft)!important;color:var(--color-primary)!important;border-color:var(--lv-brand-border)!important}
body .lv-tool-icon-star,body .lv-tool-icon-download,body .lv-tool-item:hover .lv-tool-icon{color:var(--color-primary)!important;border-color:var(--lv-brand-border)!important;background:linear-gradient(180deg,#fff,var(--lv-brand-soft))!important}
body :where(.collection-header,.lv-collection-term-page .collection-header){background:linear-gradient(135deg,var(--color-primary),var(--color-secondary))!important;box-shadow:0 18px 40px var(--lv-brand-shadow)!important}
body :where(.collection-header h1,.collection-header p,.collection-header a,.collection-header span,.collection-header strong){color:var(--color-text)!important}
body .collection-header :where(svg,path){stroke:var(--color-text)!important;color:var(--color-text)!important}
body :where(.category-badge,.file-category-badge,.post-category-badge,.taxonomy-chip,.tag-chip,.resource-tag,.file-tags a,.design-file-tags a,.single-file-meta a,.lv-post-tags a,.lv-post-category a){background:var(--lv-brand-soft)!important;color:var(--color-primary)!important;border-color:var(--lv-brand-border)!important}
body :where(.lv-blog-detail-page-v16 .lv-post-toc-tabs span.is-active){background:var(--color-text)!important;color:#fff!important}
body :where(.lv-blog-detail-page-v16 .lv-post-toc-card nav a.is-active,.lv-blog-detail-page-v16 .lv-post-toc-card nav a:hover){border-left-color:var(--color-primary)!important;background:var(--lv-brand-soft)!important;color:var(--color-primary)!important}
body :where(.lv-post-usefulness,.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness){border-color:var(--lv-brand-border)!important;background:linear-gradient(180deg,#fff,var(--lv-brand-soft))!important}
body :where(.lv-post-usefulness-options button:hover,.lv-post-usefulness-options button.is-selected,.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button:hover,.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button.is-selected){border-color:var(--color-primary)!important;box-shadow:0 12px 28px var(--lv-brand-shadow)!important}
body .lv-post-usefulness-options.is-modal button.is-selected::after{border-top-color:var(--color-primary)!important}
body :where(.lv-post-usefulness-count-badge,.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-count-badge,.lv-post-usefulness-summary){background:var(--lv-brand-soft)!important;color:var(--color-primary)!important;border-color:var(--lv-brand-border)!important}
body :where(.lv-post-usefulness-submit,.lv-post-usefulness-dialog textarea:focus,.comment-form textarea:focus,.comment-form input:focus,.lv-comment-compose-panel textarea:focus){border-color:var(--color-primary)!important;box-shadow:0 0 0 3px var(--lv-brand-soft-2)!important}
body :where(.lv-post-feedback-actions a:hover,.lv-post-feedback-actions button:hover,.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions a:hover,.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button:hover){border-color:var(--color-primary)!important;background:var(--lv-brand-soft)!important;color:var(--color-primary)!important}
body :where(.comment-reply-link,.logged-in-as a,.comment-metadata a,.comment-edit-link,.cancel-comment-reply-link,.lv-post-share-row button,.lv-post-share-row a,.lv-share a,.lv-share button,.post-share a,.post-share button,.reading-time,.lv-reading-time,.post-reading-time,.lv-post-meta svg,.lv-post-share-row svg){color:var(--color-primary)!important;border-color:var(--lv-brand-border)!important}
body :where(.lv-rating-stars-input button.is-active,.lv-post-rating-stars button.is-active,.lv-post-rating-stars button:hover){color:var(--color-primary)!important;text-shadow:0 6px 18px var(--lv-brand-shadow)!important}
/* v1.1.6 exact specificity overrides */
.lv-hero-search > button[type="submit"],
.search-submit,
.single-design-file .larxvo-download-btn-main,
.single-design-file .larxvo-download-btn-floating,
.larxvo-download-btn,
.lv-post-usefulness-submit,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-submit,
.lv-comment-submit{
background:linear-gradient(135deg,var(--lv-button-color),var(--color-secondary))!important;
border-color:var(--lv-button-color)!important;
color:#fff!important;
box-shadow:0 12px 26px var(--lv-brand-shadow)!important;
}
.lv-hero-search > button[type="submit"]{background:linear-gradient(135deg,var(--lv-button-color),var(--color-secondary))!important;}
.lv-hero-copy h1 span,
.lv-tool-icon-download,
.lv-tool-icon-star,
.lv-tool-item:hover,
.lv-filter-chip:hover,
.lv-term-strip a:hover{color:var(--color-primary)!important;}
.lv-filter-chip:hover,
.lv-term-strip a:hover{border-color:var(--lv-brand-border)!important;background:var(--lv-brand-soft)!important;}
.lv-tool-item:hover .lv-tool-icon,
.lv-tool-icon-download,
.lv-tool-icon-star{border-color:var(--lv-brand-border)!important;background:linear-gradient(180deg,#fff,var(--lv-brand-soft))!important;}
.lv-ranking-tabs button.is-active,
body.page-template-page-top-download .lv-ranking-tabs button.is-active{
background:linear-gradient(135deg,var(--color-primary),var(--color-secondary))!important;
color:#fff!important;
box-shadow:0 12px 24px var(--lv-brand-shadow)!important;
}
.lv-period-tabs a.is-active,
body.page-template-page-top-download .lv-period-tabs a.is-active{
background:var(--lv-brand-soft)!important;
color:var(--color-primary)!important;
box-shadow:inset 0 0 0 1px var(--lv-brand-border)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-kicker,
.lv-post-usefulness-kicker{color:var(--color-primary)!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-options button.is-selected,
.lv-post-usefulness-options button:hover,
.lv-post-usefulness-options button.is-selected{
border-color:var(--color-primary)!important;
box-shadow:0 12px 28px var(--lv-brand-shadow)!important;
}
.lv-post-usefulness-options.is-modal button.is-selected::after{border-top-color:var(--color-primary)!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-count-badge,
.lv-post-usefulness-count-badge,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-usefulness-summary{
background:var(--lv-brand-soft)!important;
color:var(--color-primary)!important;
border-color:var(--lv-brand-border)!important;
}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-input-row textarea:focus,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-comment-guest-box textarea:focus,
.lv-post-usefulness-dialog textarea:focus{
border-color:var(--color-primary)!important;
box-shadow:0 0 0 3px var(--lv-brand-soft-2)!important;
}
.lv-blog-detail-page-v16 .lv-post-toc-tabs span.is-active{background:var(--color-text)!important;color:#fff!important;}
.lv-blog-detail-page-v16 .lv-post-toc-card nav a.is-active,
.lv-blog-detail-page-v16 .lv-post-toc-card nav a:hover{border-left-color:var(--color-primary)!important;background:var(--lv-brand-soft)!important;color:var(--color-primary)!important;}
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions a:hover,
.lv-blog-detail-page.lv-blog-detail-page-v16 .lv-post-feedback-actions button:hover,
.lv-post-feedback-actions a:hover,
.lv-post-feedback-actions button:hover{border-color:var(--color-primary)!important;background:var(--lv-brand-soft)!important;color:var(--color-primary)!important;}
.lv-blog-detail-page .lv-post-share-row button,
.lv-blog-detail-page .lv-post-share-row a,
.lv-post-share-row button,
.lv-post-share-row a,
.comment-reply-link,
.logged-in-as a,
.cancel-comment-reply-link{color:var(--color-primary)!important;border-color:var(--lv-brand-border)!important;}
/* v1.1.7 - mobile filter alignment + brand color + card title scale fixes */
:root{
--color-primary:#ffa727!important;
--color-secondary:#ffc176!important;
--color-text:#1f222d!important;
--lv-button-color:#ffa727!important;
--lv-brand-soft:rgba(255,167,39,.12)!important;
--lv-brand-soft-2:rgba(255,193,118,.24)!important;
--lv-brand-border:rgba(255,167,39,.34)!important;
--lv-brand-shadow:rgba(255,167,39,.22)!important;
}
/* unify card titles, especially related/same-category cards on desktop */
.post-card.pinterest-style .overlay-title,
.posts-grid .post-card.pinterest-style .overlay-title,
.related-posts-grid .post-card.pinterest-style .overlay-title,
.recently-viewed-grid .post-card.pinterest-style .overlay-title,
.larxvo-single-product-grid .post-card.pinterest-style .overlay-title,
.single-design-file .related-posts-grid h3.overlay-title,
.single-design-file .related-posts-grid .overlay-title,
.single-design-file .recently-viewed-grid h3.overlay-title,
.single-design-file .recently-viewed-grid .overlay-title,
.lv-collection-term-page .posts-grid .overlay-title{
margin:0!important;
font-size:13px!important;
line-height:1.28!important;
font-weight:500!important;
letter-spacing:0!important;
color:#fff!important;
}
.post-card.pinterest-style .overlay-title a,
.posts-grid .overlay-title a,
.related-posts-grid .overlay-title a,
.recently-viewed-grid .overlay-title a,
.larxvo-single-product-grid .overlay-title a{
color:#fff!important;
font-size:inherit!important;
line-height:inherit!important;
font-weight:inherit!important;
display:-webkit-box!important;
-webkit-line-clamp:2!important;
-webkit-box-orient:vertical!important;
overflow:hidden!important;
text-decoration:none!important;
}
.post-card.pinterest-style .overlay-title a:hover,
.posts-grid .overlay-title a:hover,
.related-posts-grid .overlay-title a:hover,
.recently-viewed-grid .overlay-title a:hover{
color:#fff!important;
}
@media(max-width:768px){
.post-card.pinterest-style .overlay-title,
.posts-grid .post-card.pinterest-style .overlay-title,
.related-posts-grid .post-card.pinterest-style .overlay-title,
.recently-viewed-grid .post-card.pinterest-style .overlay-title{
font-size:12px!important;
line-height:1.24!important;
font-weight:500!important;
}
}
/* brand CTA in top header */
.top-menu .lv-vip-link,
body .top-menu .lv-vip-link,
.lv-top-actions .lv-vip-link{
background:linear-gradient(135deg,#ffa727,#ffc176)!important;
border-color:rgba(255,167,39,.58)!important;
color:#1f222d!important;
box-shadow:0 16px 34px rgba(255,167,39,.24), inset 0 1px 0 rgba(255,255,255,.46)!important;
}
.top-menu .lv-vip-link span,
body .top-menu .lv-vip-link span{
color:#1f222d!important;
font-weight:650!important;
}
.top-menu .lv-vip-link svg,
.top-menu .lv-vip-link .lv-nav-custom-svg,
.top-menu .lv-vip-link .lv-nav-custom-svg svg{
color:#1f222d!important;
fill:#1f222d!important;
stroke:#1f222d!important;
}
.top-menu .lv-vip-link:hover,
.top-menu .lv-vip-link:focus-visible{
box-shadow:0 20px 42px rgba(255,167,39,.30), inset 0 1px 0 rgba(255,255,255,.52)!important;
}
.top-menu .lv-vip-link::after{
background:linear-gradient(115deg,transparent,rgba(255,255,255,.68),transparent)!important;
}
.lv-top-theme-toggle.lv-theme-toggle,
.top-menu .lv-top-theme-toggle.lv-theme-toggle,
.top-menu .lv-theme-toggle{
background:rgba(255,255,255,.74)!important;
border-color:rgba(255,167,39,.28)!important;
color:#ffa727!important;
box-shadow:0 10px 24px rgba(255,167,39,.12)!important;
}
.lv-top-theme-toggle.lv-theme-toggle svg,
.top-menu .lv-theme-toggle svg{
color:#ffa727!important;
stroke:#ffa727!important;
fill:none!important;
}
html.lv-theme-dark .lv-top-theme-toggle.lv-theme-toggle,
html.lv-theme-dark .top-menu .lv-top-theme-toggle.lv-theme-toggle,
html.lv-theme-dark .top-menu .lv-theme-toggle{
background:rgba(255,167,39,.14)!important;
border-color:rgba(255,167,39,.32)!important;
color:#ffc176!important;
box-shadow:0 10px 24px rgba(255,167,39,.14)!important;
}
html.lv-theme-dark .lv-top-theme-toggle.lv-theme-toggle svg,
html.lv-theme-dark .top-menu .lv-theme-toggle svg{
stroke:#ffc176!important;
}
/* mobile filter drawer: keep inside viewport and align check marks */
@media(max-width:768px){
body.lv-sidebar-open{overflow:hidden!important;}
.sidebar.active,
.lv-discover-section .sidebar.active,
.lv-design-archive-page .sidebar.active,
.lv-collection-term-page .sidebar.active{
left:0!important;
right:0!important;
bottom:0!important;
width:100vw!important;
max-width:100vw!important;
box-sizing:border-box!important;
padding-left:14px!important;
padding-right:14px!important;
overflow-x:hidden!important;
border-radius:22px 22px 0 0!important;
}
.sidebar .filter-options .filter-option,
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option){
display:grid!important;
grid-template-columns:18px minmax(0,1fr)!important;
align-items:center!important;
column-gap:9px!important;
min-height:36px!important;
padding:2px 0!important;
}
.sidebar .filter-options .filter-option input[type="checkbox"],
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]{
appearance:none!important;
-webkit-appearance:none!important;
display:grid!important;
place-items:center!important;
width:16px!important;
height:16px!important;
min-width:16px!important;
margin:0!important;
padding:0!important;
border:1.4px solid #c6d2e2!important;
border-radius:4px!important;
background:#fff!important;
box-shadow:none!important;
transform:none!important;
vertical-align:middle!important;
}
.sidebar .filter-options .filter-option input[type="checkbox"]:checked,
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked{
border-color:#ffa727!important;
background:#ffa727!important;
}
.sidebar .filter-options .filter-option input[type="checkbox"]:checked::after,
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked::after{
content:""!important;
width:7px!important;
height:4px!important;
border-left:2px solid #fff!important;
border-bottom:2px solid #fff!important;
transform:rotate(-45deg) translate(0,0)!important;
margin-top:-1px!important;
box-sizing:border-box!important;
}
.sidebar .filter-option label{
min-width:0!important;
margin:0!important;
color:#1f222d!important;
font-size:14px!important;
font-weight:500!important;
line-height:1.35!important;
}
.sidebar .filter-option label span{
color:#8a96a8!important;
font-size:12px!important;
font-weight:500!important;
}
.sidebar .filter-section > h3,
.sidebar .filter-header{
color:#1f222d!important;
border-bottom-color:rgba(255,167,39,.44)!important;
}
.sidebar .filter-section > h3 svg,
.sidebar .filter-header svg{
color:#1f222d!important;
stroke:#1f222d!important;
}
.sidebar .tag-filter-item,
.sidebar .tags-filter-cloud .tag-filter-item{
border-color:rgba(255,167,39,.22)!important;
background:#fff!important;
color:#1f222d!important;
box-shadow:0 4px 14px rgba(31,34,45,.04)!important;
}
.sidebar .tag-filter-item.selected,
.sidebar .tag-filter-item:has(input:checked){
background:rgba(255,167,39,.12)!important;
border-color:rgba(255,167,39,.48)!important;
color:#ffa727!important;
}
.lv-sidebar-filter-footer{
left:0!important;
right:0!important;
width:auto!important;
max-width:100%!important;
margin:16px -14px 0!important;
padding:12px 14px max(16px, env(safe-area-inset-bottom))!important;
box-sizing:border-box!important;
display:grid!important;
grid-template-columns:1fr auto!important;
gap:10px!important;
background:rgba(255,255,255,.94)!important;
border-top:1px solid #eef2f7!important;
}
.lv-sidebar-filter-footer .clear-filters-btn,
.lv-sidebar-filter-footer .sidebar-close-btn{
box-sizing:border-box!important;
max-width:100%!important;
min-width:0!important;
height:42px!important;
min-height:42px!important;
padding:0 14px!important;
border-radius:999px!important;
font-size:14px!important;
font-weight:650!important;
white-space:nowrap!important;
}
.lv-sidebar-filter-footer .clear-filters-btn,
.lv-sidebar-clear-btn{
width:100%!important;
border:1px solid rgba(255,167,39,.30)!important;
background:rgba(255,167,39,.10)!important;
color:#ffa727!important;
box-shadow:0 8px 20px rgba(255,167,39,.10)!important;
}
.lv-sidebar-filter-footer .sidebar-close-btn,
.lv-sidebar-done-btn{
width:auto!important;
min-width:86px!important;
border:0!important;
background:#1f222d!important;
color:#fff!important;
}
.lv-sidebar-clear-btn.is-disabled,
.lv-sidebar-clear-btn:disabled{
opacity:.5!important;
color:#ffa727!important;
cursor:pointer!important;
}
}
/* desktop/collection sidebar selected states should use brand, not blue */
.sidebar .filter-options .filter-option input[type="checkbox"]:checked,
.sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked,
.lv-discover-section .sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked,
.lv-design-archive-page .sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked,
.lv-collection-term-page .sidebar .filter-option:not(.lv-format-filter-option):not(.lv-resource-filter-option) input[type="checkbox"]:checked{
border-color:#ffa727!important;
background:#ffa727!important;
}
.sidebar .lv-resource-filter-option input[type="checkbox"]:checked + label,
.sidebar .lv-format-filter-option input[type="checkbox"]:checked + label,
.lv-collection-term-page .sidebar .lv-resource-filter-option input[type="checkbox"]:checked + label,
.lv-collection-term-page .sidebar .lv-format-filter-option input[type="checkbox"]:checked + label{
border-color:#ffa727!important;
background:rgba(255,167,39,.10)!important;
color:#ffa727!important;
box-shadow:0 12px 26px rgba(255,167,39,.14)!important;
}
.sidebar .lv-resource-filter-option input[type="checkbox"]:checked + label::before,
.sidebar .lv-format-filter-option input[type="checkbox"]:checked + label::before,
.lv-collection-term-page .sidebar .lv-resource-filter-option input[type="checkbox"]:checked + label::before,
.lv-collection-term-page .sidebar .lv-format-filter-option input[type="checkbox"]:checked + label::before{
background:#ffa727!important;
box-shadow:none!important;
}
.sidebar .tag-filter-item.selected,
.sidebar .tag-filter-item:has(input:checked){
color:#ffa727!important;
background:rgba(255,167,39,.10)!important;
border-color:rgba(255,167,39,.42)!important;
}
/* ===== 1991files v1.2.2 — International payment options + Malaysia QR ===== */
.lv-payment-choice-intro{
margin:0 0 16px;
padding:0 0 14px;
border-bottom:1px solid #e8edf5;
}
.lv-payment-choice-kicker{
display:block;
margin:0 0 4px;
color:#68748a;
font-size:11px;
line-height:1.4;
font-weight:600;
letter-spacing:.08em;
text-transform:uppercase;
}
.lv-payment-choice-intro h3{
margin:0 0 5px!important;
color:#1f2937!important;
font-size:17px!important;
line-height:1.35!important;
font-weight:650!important;
}
.lv-payment-choice-intro p{
margin:0!important;
color:#667085!important;
font-size:13px!important;
line-height:1.55!important;
}
.woocommerce-checkout-payment ul.wc_payment_methods,
.woocommerce-checkout-payment ul.payment_methods{
display:grid;
gap:10px;
margin:0!important;
padding:0!important;
}
.woocommerce-checkout-payment ul.wc_payment_methods > li,
.woocommerce-checkout-payment ul.payment_methods > li{
position:relative;
margin:0!important;
padding:13px 14px!important;
border:1px solid #e3e9f2;
border-radius:10px;
background:#fff;
transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;
}
.woocommerce-checkout-payment ul.wc_payment_methods > li:has(input[type="radio"]:checked),
.woocommerce-checkout-payment ul.payment_methods > li:has(input[type="radio"]:checked){
border-color:#2f6fed;
background:#f8fbff;
box-shadow:0 0 0 3px rgba(47,111,237,.08);
}
.woocommerce-checkout-payment ul.payment_methods li input[type="radio"]{
width:16px;
height:16px;
margin:2px 9px 0 0!important;
accent-color:#2f6fed;
flex:0 0 auto;
}
.woocommerce-checkout-payment ul.payment_methods li > label{
display:flex!important;
align-items:flex-start!important;
gap:0!important;
margin:0!important;
color:#232a36!important;
font-size:14px!important;
line-height:1.45!important;
font-weight:600!important;
}
.woocommerce-checkout-payment ul.payment_methods li > label img{
max-height:23px!important;
width:auto!important;
margin-left:auto!important;
}
.woocommerce-checkout-payment .payment_box{
margin:10px 0 0!important;
padding:11px 12px!important;
border:0!important;
border-radius:8px!important;
background:#f2f5f9!important;
color:#5c6678!important;
font-size:12.5px!important;
line-height:1.55!important;
}
.woocommerce-checkout-payment .payment_box:before{display:none!important}
.lv-pay-instructions{margin:28px 0;padding:24px;border:1px solid #e2e8f0;border-radius:12px;background:#fff;box-shadow:0 10px 40px rgba(0,0,0,.04)}
.lv-pay-instructions h3{margin:0 0 16px;color:#1f2937;font-size:20px;font-weight:650}
.lv-pay-grid{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:start}
.lv-pay-qr img{display:block;width:100%;height:auto;border:1px solid #edf0f5;border-radius:10px;background:#fff;padding:6px}
.lv-pay-note{margin-top:12px!important;color:#7a8599!important;font-size:12px!important}
.lv-pay-warning{color:#a44747!important;font-size:13px!important;line-height:1.55!important}
.lv-pay-wallet{overflow-wrap:anywhere}
@media(max-width:640px){.lv-pay-grid{grid-template-columns:1fr}.lv-pay-qr{max-width:230px;margin-inline:auto}}