/* =========================================================
   STAR WAR CATALOG V18.2
   Scoped catalog UI + full-page hover preview
   ========================================================= */

.catalog-hero-promax{position:relative;overflow:hidden;background:linear-gradient(180deg,#f4f8fd 0%,#f8fbff 72%,#fff 100%);border-bottom:1px solid #e5edf5;padding:72px 0 0}
.catalog-hero-promax .sw-container{z-index:2}
.catalog-ambient{position:absolute;border-radius:999px;filter:blur(4px);opacity:.55;pointer-events:none}
.catalog-ambient-a{width:360px;height:360px;right:5%;top:-140px;background:radial-gradient(circle,#cfe6ff 0,rgba(207,230,255,0) 70%);animation:catalogFloat 9s ease-in-out infinite}
.catalog-ambient-b{width:280px;height:280px;left:-90px;bottom:-120px;background:radial-gradient(circle,#e6f0ff 0,rgba(230,240,255,0) 72%);animation:catalogFloat 11s ease-in-out infinite reverse}
@keyframes catalogFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,16px,0)}}
.catalog-hero-promax .section-kicker{display:inline-flex;align-items:center;gap:8px}
.catalog-hero-promax h1 span{color:#0b6ff5}
.catalog-hero-meta{display:flex;gap:0;margin-top:28px;border-top:1px solid #dce6f0;padding-top:18px}
.catalog-hero-meta>div{padding:0 24px;border-right:1px solid #dce6f0}
.catalog-hero-meta>div:first-child{padding-left:0}.catalog-hero-meta>div:last-child{border-right:0}
.catalog-hero-meta strong{display:block;color:#0c2b4b;font-size:17px;font-weight:800}
.catalog-hero-meta span{display:block;margin-top:2px;color:#7a8da0;font-size:10px}

.catalog-collage-promax{transform-style:preserve-3d}
.catalog-collage-promax .collage-item{transition:transform .35s ease,filter .35s ease}
.catalog-collage-promax:hover .collage-a{transform:translate3d(-7px,-5px,0) rotate(-1deg)}
.catalog-collage-promax:hover .collage-b{transform:translate3d(6px,-7px,0) rotate(1deg)}
.catalog-collage-promax:hover .collage-c{transform:translate3d(2px,8px,0)}
.collage-glow{position:absolute;inset:18% 14%;background:radial-gradient(circle,rgba(11,111,245,.18),rgba(11,111,245,0) 68%);filter:blur(24px);pointer-events:none}
.catalog-float-badge{position:absolute;z-index:5;display:flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid rgba(255,255,255,.95);border-radius:10px;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);box-shadow:0 10px 30px rgba(34,69,105,.12);color:#17314c;font-size:9.5px;font-weight:700}
.catalog-float-badge i{color:#0b6ff5}
.catalog-float-badge.badge-a{right:1%;bottom:12%;animation:badgeBob 4.8s ease-in-out infinite}
.catalog-float-badge.badge-b{left:10%;top:5%;animation:badgeBob 5.6s ease-in-out infinite reverse}
@keyframes badgeBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

.catalog-filter-dock{position:relative;z-index:10;margin-top:42px;transform:translateY(28px);padding:11px;border:1px solid #dbe6f1;border-radius:16px;background:rgba(255,255,255,.95);box-shadow:0 16px 38px rgba(22,54,87,.10);backdrop-filter:blur(14px)}
.catalog-filter-main{display:grid;grid-template-columns:minmax(260px,1.9fr) minmax(180px,.9fr) minmax(165px,.8fr) minmax(175px,.85fr) 116px;gap:9px}
.catalog-search-promax,.catalog-select-promax{position:relative;min-height:48px;border:1px solid #e0e8f0;border-radius:10px;background:#fff;display:flex;align-items:center}
.catalog-search-promax>i,.catalog-select-promax>i{position:absolute;left:14px;color:#8ca0b4;font-size:13px;pointer-events:none}
.catalog-search-promax input,.catalog-select-promax select{width:100%;height:46px;border:0;outline:0;background:transparent;padding:0 35px 0 39px;color:#17314c;font:inherit;font-size:11.5px}
.catalog-select-promax select{appearance:auto}
.catalog-clear-field{position:absolute;right:12px;color:#8ca0b4}
.catalog-submit{min-height:48px;border-radius:10px!important;display:flex!important;align-items:center;justify-content:center;gap:7px;font-size:11px!important}
.catalog-filter-quick{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 5px 1px}
.catalog-price-pills{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.catalog-price-pills .quick-label{margin-right:3px;color:#8a9bad;font-size:9.5px;font-weight:700}
.catalog-price-pills a{padding:6px 9px;border-radius:999px;background:#f5f8fc;color:#536a80;text-decoration:none;font-size:9.5px;font-weight:650;transition:.2s ease}
.catalog-price-pills a:hover,.catalog-price-pills a.active{background:#e9f3ff;color:#0b6ff5;box-shadow:inset 0 0 0 1px #bcd9ff}
.catalog-featured-toggle{display:flex;align-items:center;gap:8px;color:#536a80;font-size:9.8px;font-weight:650;cursor:pointer;white-space:nowrap}
.catalog-featured-toggle input{position:absolute;opacity:0;pointer-events:none}
.toggle-ui{width:32px;height:19px;padding:2px;border-radius:999px;background:#dfe7ef;display:flex;align-items:center;transition:.2s}
.toggle-ui:before{content:"";width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.12);transition:.2s}
.toggle-ui i{display:none}.catalog-featured-toggle input:checked+.toggle-ui{justify-content:flex-end;background:#0b6ff5}.catalog-featured-toggle input:checked+.toggle-ui:before{background:#fff}

.catalog-body-promax{padding-top:74px}
.catalog-topbar-promax{align-items:flex-start;gap:22px}
.catalog-topbar-tools{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.catalog-view-toggle{display:flex;gap:4px;padding:3px;border:1px solid #e1e8f0;border-radius:9px;background:#f8fafc}
.catalog-view-toggle button{width:31px;height:28px;border:0;border-radius:6px;background:transparent;color:#8a9bad;transition:.2s}
.catalog-view-toggle button:hover,.catalog-view-toggle button.active{background:#fff;color:#0b6ff5;box-shadow:0 2px 8px rgba(30,61,91,.09)}
.catalog-active-filters{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:14px 0 22px;padding:10px 12px;border:1px solid #e6edf4;border-radius:10px;background:#fbfdff;color:#718398;font-size:9.5px}
.catalog-active-filters>span{font-weight:700}.catalog-active-filters em{font-style:normal;padding:5px 8px;border-radius:999px;background:#edf5ff;color:#0b6ff5;font-weight:650}.catalog-active-filters a{margin-left:auto;color:#60778e;text-decoration:none;font-weight:650}
.catalog-body-promax .category-scroll.compact a{transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.catalog-body-promax .category-scroll.compact a:hover{transform:translateY(-1px);box-shadow:0 6px 15px rgba(31,76,120,.08)}
.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.catalog-grid.is-compact{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.catalog-card-col{min-width:0;animation:catalogCardIn .46s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--card-index,0)*45ms)}
@keyframes catalogCardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.catalog-empty-col{grid-column:1/-1}

/* Card catalog only — không còn dùng .template-card toàn site */
.sw-catalog-card{height:100%;border:1px solid #dce6f0;border-radius:15px;background:#fff;overflow:hidden;box-shadow:0 8px 28px rgba(20,55,90,.055);transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .28s}
.sw-catalog-card:hover{transform:translateY(-5px);border-color:#bcd8f8;box-shadow:0 20px 46px rgba(20,58,96,.12)}
.sw-catalog-media{position:relative;display:block;color:inherit;text-decoration:none;background:#edf3f8;overflow:hidden}
.sw-catalog-browser{height:34px;padding:0 11px;display:flex;align-items:center;gap:5px;border-bottom:1px solid #e3eaf1;background:#f7f9fc;position:relative;z-index:6}
.sw-catalog-dots{display:flex;gap:4px}.sw-catalog-dots span{width:5px;height:5px;border-radius:50%}.sw-catalog-dots span:nth-child(1){background:#ff6b64}.sw-catalog-dots span:nth-child(2){background:#f4bd4f}.sw-catalog-dots span:nth-child(3){background:#45c981}
.sw-catalog-browser em{min-width:0;flex:1;text-align:center;color:#8d9dad;font-size:8.5px;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sw-catalog-browser>i{color:#8ca0b4;font-size:10px}
.sw-catalog-shot{position:relative;aspect-ratio:16/10;overflow:hidden;background:#eef3f7}
.sw-catalog-shot-image{display:block;width:100%;height:auto;min-height:100%;object-fit:cover;object-position:top center;transform:translate3d(0,0,0);will-change:transform;backface-visibility:hidden}
.sw-catalog-shot.is-loading:after{content:"Đang tải preview…";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;padding:7px 9px;border-radius:7px;background:rgba(255,255,255,.94);box-shadow:0 6px 18px rgba(16,43,69,.12);color:#486179;font-size:9px;font-weight:650}
.sw-catalog-hover-hint{position:absolute;left:12px;bottom:11px;z-index:4;opacity:0;transform:translateY(5px);transition:.22s ease;pointer-events:none}
.sw-catalog-hover-hint span{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:8px;background:rgba(6,28,50,.82);color:#fff;font-size:8.5px;font-weight:650;backdrop-filter:blur(8px)}
.sw-catalog-card:hover .sw-catalog-hover-hint{opacity:1;transform:none}
.sw-catalog-badges{position:absolute;left:10px;right:10px;top:44px;z-index:7;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.sw-catalog-badges span{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border:1px solid rgba(255,255,255,.75);border-radius:7px;background:rgba(255,255,255,.92);box-shadow:0 5px 14px rgba(15,43,70,.08);backdrop-filter:blur(8px);font-size:8px;font-weight:800}.sw-catalog-badges .is-featured{color:#9a6500}.sw-catalog-badges .is-live{color:#16714f}.sw-catalog-badges .is-live i{width:5px;height:5px;border-radius:50%;background:#1fc884;box-shadow:0 0 0 4px rgba(31,200,132,.12)}
.sw-catalog-open-cue{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-42%);display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border-radius:8px;background:#fff;color:#102a43;box-shadow:0 10px 28px rgba(12,37,62,.16);font-size:9px;font-weight:750;opacity:0;transition:.22s ease;pointer-events:none}.sw-catalog-card:hover .sw-catalog-open-cue{opacity:1;transform:translate(-50%,-50%)}
.sw-catalog-card-body{padding:17px 17px 16px}
.sw-catalog-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}.sw-catalog-meta>span{color:#0b6ff5;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.035em}.sw-catalog-meta small{color:#93a2b0;font-size:8.5px}
.sw-catalog-card h3{margin:0 0 8px;font-size:16px!important;line-height:1.42;letter-spacing:-.02em}.sw-catalog-card h3 a{color:#102a43;text-decoration:none;transition:color .2s}.sw-catalog-card:hover h3 a{color:#0b6ff5}
.sw-catalog-card-body>p{min-height:42px;margin:0;color:#718398;font-size:10.5px;line-height:1.65}
.sw-catalog-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:14px;padding-top:13px;border-top:1px solid #e9eef3}
.sw-catalog-price{display:flex;flex-direction:column;gap:2px}.sw-catalog-price small{color:#93a2b0;font-size:7.8px}.sw-catalog-price strong{color:#0b6ff5;font-size:13px;line-height:1.2}
.sw-catalog-actions{display:flex;align-items:center;gap:10px}.sw-catalog-actions a{display:inline-flex;align-items:center;gap:4px;color:#102a43;text-decoration:none;font-size:9.5px;font-weight:750}.sw-catalog-actions a:first-child{color:#0b6ff5}
.catalog-grid.is-compact .sw-catalog-card h3{font-size:13px!important}.catalog-grid.is-compact .sw-catalog-card-body>p{font-size:9.5px}.catalog-grid.is-compact .sw-catalog-card-body{padding:14px}.catalog-grid.is-compact .sw-catalog-price strong{font-size:11.5px}.catalog-grid.is-compact .sw-catalog-open-cue{display:none}

@media(max-width:1199.98px){
  .catalog-filter-main{grid-template-columns:minmax(250px,1.5fr) repeat(3,minmax(155px,.7fr))}.catalog-submit{grid-column:1/-1}.catalog-grid,.catalog-grid.is-compact{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:767.98px){
  .catalog-hero-promax{padding-top:46px}.catalog-hero-meta>div{padding:0 12px}.catalog-filter-dock{margin-top:28px;transform:translateY(22px)}.catalog-filter-main{grid-template-columns:1fr 1fr}.catalog-search-promax{grid-column:1/-1}.catalog-filter-main .catalog-select-promax{min-width:0}.catalog-submit{grid-column:1/-1}.catalog-filter-quick{align-items:flex-start;flex-direction:column}.catalog-price-pills{flex-wrap:nowrap;max-width:100%;overflow-x:auto;padding-bottom:4px}.catalog-featured-toggle{align-self:flex-start}.catalog-body-promax{padding-top:60px}.catalog-topbar-promax{display:block}.catalog-topbar-tools{margin-top:12px;justify-content:space-between}.catalog-view-toggle{display:none}.catalog-grid,.catalog-grid.is-compact{grid-template-columns:1fr;gap:18px}.catalog-active-filters a{margin-left:0}.sw-catalog-card:hover{transform:none}.sw-catalog-hover-hint,.sw-catalog-open-cue{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  .catalog-ambient,.catalog-float-badge,.catalog-card-col{animation:none!important}.sw-catalog-card,.catalog-collage-promax .collage-item,.sw-catalog-hover-hint,.sw-catalog-open-cue{transition:none!important}.sw-catalog-shot-image{transition:none!important;transform:none!important}
}
