/* ==========================================================
   ASOMOY theme extras - marquee, drawer, misc
   Loaded after assets/css/asomoy.css
   ========================================================== */

/* ---- react-fast-marquee (rfm) replica ---- */
.rfm-marquee-container{overflow-x:hidden;display:flex;flex-direction:row;position:relative;width:var(--width);transform:var(--transform)}
.rfm-marquee{flex:0 0 auto;min-width:var(--min-width);z-index:1;display:flex;flex-direction:row;align-items:center;animation:rfm-scroll var(--duration) linear var(--delay) var(--iteration-count);animation-play-state:var(--play);animation-direction:var(--direction)}
.rfm-initial-child-container{flex:0 0 auto;display:flex;min-width:auto;flex-direction:row}
.rfm-wrapper{display:flex;flex-direction:row}
.rfm-child{transform:var(--transform)}
@keyframes rfm-scroll{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}

/* ---- Drawer (off-canvas, vaul-style markup) ---- */
.as-drawer-root{position:fixed;inset:0;z-index:50;pointer-events:none}
.as-drawer-root[data-state="open"]{pointer-events:auto}
.as-drawer-overlay{position:fixed;inset:0;z-index:50;background:rgb(0 0 0 / .5);opacity:0;transition:opacity .3s ease}
.as-drawer-root[data-state="open"] .as-drawer-overlay{opacity:1}
.as-drawer-content{position:fixed;z-index:50;display:flex;flex-direction:column;inset-block:0;left:0;width:75%;border-right-width:1px;border-right-style:solid;border-color:#e2e8f0;background:#fff;transition:transform .35s ease;transform:translateX(-100%);max-width:24rem}
.as-drawer-root[data-state="open"] .as-drawer-content{transform:translateX(0)}
@media (min-width:40rem){.as-drawer-content{width:75%;max-width:24rem}}
.as-drawer-sub{display:none;flex-direction:column;gap:0.125rem;padding-left:2.25rem}
.as-drawer-sub.open{display:flex}

/* ---- Sliders ---- */
/* hide the inactive tab panel (only the active one is visible) */
[role="tabpanel"][data-state="inactive"]{display:none!important}
/* sidebar video slider: slide must fill its track, image stacks above the red caption bar */
.videoSlider .swiper-slide{display:block;width:100%}
.videoSlider .swiper-slide > a{flex-direction:column}

/* ---- Popup ad banners (top / bottom) ---- */
.as-top-ad,.as-bottom-ad{justify-content:center;align-items:center}
.as-top-ad img,.as-bottom-ad img{display:inline-block;max-width:min(760px,100%);max-height:100px;width:auto;height:auto;vertical-align:middle}
.as-top-ad + *{scroll-margin-top:110px}
.as-bottom-ad .as-ad-slot{--as-w:760px;--as-h:100px;margin:0 auto}

/* ---- Ad slots (dashboard placements) ----
   Every slot renders inside .as-ad-slot sized by --as-w/--as-h to the
   reference dimensions. A grey dashed placeholder appears while the
   placement has no live ad, so the layout never collapses or turns black. */
.as-ad-slot{width:100%;max-width:var(--as-w,300px);margin:0 auto}
.as-ad-slot>div:not(.as-ad-ph){width:100%;min-height:var(--as-h,0px);display:flex;align-items:center;justify-content:center;overflow:hidden}
.as-ad-slot img{display:block;width:auto;max-width:100%;height:auto;max-height:var(--as-h,250px);margin:0 auto}
.as-ad-ph{width:100%;max-width:var(--as-w,300px);height:var(--as-h,250px);box-sizing:border-box;display:flex;align-items:center;justify-content:center;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:4px;color:#94a3b8;font-size:13px}
.as-ad-ph span{opacity:.9}
/* wrappers around slots must not collapse inside flex-center containers */
.as-side-ad{width:100%}
.slot-ad-container>div{width:100%}
.as-side-ad img{max-height:300px}

/* ---- Tailwind utilities missing from the compiled chunks ---- */
.-left-3\.5{left:-.875rem}
.-ms-2{margin-inline-start:-.5rem}
.-ms-\[30px\]{margin-inline-start:-30px}
.-mx-4{margin-left:-1rem;margin-right:-1rem}
.-translate-y-1\/2{transform:translateY(-50%)}
.h-\[117px\]{height:117px}
.h-\[455px\]{height:455px}
.ring-white{--tw-ring-color:#fff}
.divide-y>:not([hidden])~:not([hidden]){border-top-width:1px;border-top-style:solid}
.divide-gray-100>:not([hidden])~:not([hidden]){border-color:#f3f4f6}
.divide-gray-200>:not([hidden])~:not([hidden]){border-color:#e5e7eb}
.space-y-1>:not([hidden])~:not([hidden]){margin-top:.25rem}
.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}
.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}
.space-y-4>:not([hidden])~:not([hidden]){margin-top:1rem}
.space-y-10>:not([hidden])~:not([hidden]){margin-top:2.5rem}
.hover\:underline:hover{text-decoration-line:underline}
.hover\:opacity-70:hover{opacity:.7}
.hover\:opacity-80:hover{opacity:.8}
.hover\:opacity-95:hover{opacity:.95}
.hover\:scale-105:hover{transform:scale(1.05)}
.hover\:-translate-y-1:hover{transform:translateY(-.25rem)}
.hover\:shadow-md:hover{box-shadow:0 4px 6px -1px rgb(0 0 0/.1),0 2px 4px -2px rgb(0 0 0/.1)}
.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgb(0 0 0/.1),0 4px 6px -4px rgb(0 0 0/.1)}
.hover\:shadow-xl:hover{box-shadow:0 20px 25px -5px rgb(0 0 0/.1),0 8px 10px -6px rgb(0 0 0/.1)}
.hover\:text-red-600:hover{color:#e40014}
.hover\:text-blue-600:hover{color:#155dfc}
.hover\:text-slate-800:hover{color:#1d293d}
.hover\:bg-red-50:hover{background:#fef2f2}
.hover\:bg-red-600:hover{background:#e40014}
.hover\:bg-red-700:hover{background:#bf000f}
.hover\:bg-slate-50:hover{background:#f8fafc}
.hover\:bg-slate-100:hover{background:#f1f5f9}
.hover\:bg-slate-100\/90:hover{background:#f1f5f9e6}
.hover\:bg-slate-200\/80:hover{background:#e2e8f0cc}
.hover\:bg-slate-50\/50:hover{background:#f8fafc80}
.hover\:bg-slate-800:hover{background:#1d293d}
.hover\:bg-gray-50:hover{background:#f9fafb}
.hover\:bg-gray-300:hover{background:#d1d5dc}
.hover\:bg-gray-800:hover{background:#1e2939}
.hover\:bg-\[\#004182\]:hover{background:#004182}
.hover\:bg-\[\#166fe5\]:hover{background:#166fe5}
.hover\:bg-\[\#20bd5a\]:hover{background:#20bd5a}
.hover\:bg-gradient-to-r:hover{background-image:linear-gradient(to right,var(--tw-gradient-stops))}
.hover\:from-red-50:hover{--tw-gradient-from:#fef2f2}
.hover\:to-transparent:hover{--tw-gradient-to:transparent}
.group:hover .group-hover\:opacity-100{opacity:1}
.group:hover .group-hover\:scale-105{transform:scale(1.05)}
.group:hover .group-hover\:scale-110{transform:scale(1.1)}
.group:hover .group-hover\:text-red-600{color:#e40014}
.group:hover .group-hover\:translate-x-1{transform:translateX(.25rem)}
.group:focus-within .group-focus-within\:text-red-600{color:#e40014}
.active\:scale-95:active{transform:scale(.95)}
.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}
.focus\:ring-4:focus{box-shadow:0 0 0 4px #ffe2e2}
.focus\:ring-red-100:focus{box-shadow:0 0 0 4px #ffe2e2}
.focus\:border-red-500:focus{border-color:#fb2c36}
.first\:mt-0:first-child{margin-top:0}
.last\:border-b-0:last-child{border-bottom-width:0}
.last\:border-none:last-child{border-style:none}
.last\:pb-0:last-child{padding-bottom:0}
.last\:pe-none:last-child{padding-inline-end:0}
