﻿/**
 * ProID Account & Admin SPA Panel Stylesheet (proid-spa-panel.css)
 *
 * Extracted from modules/admin-panel-ui.php for browser caching, zero FOUC,
 * and cleaner modular architecture.
 *
 * Sections:
 * 1. Fullscreen Card Edit & Preview Modal (#proid-preview-overlay)
 * 2. Account & Admin SPA Layout, Sidebar & Responsive Navigation (.proid-spa-*)
 * 3. Admin Card Sync Modal (.proid-sync-modal)
 * 4. Google-Sheets Bulk Card Editor Modal (.proid-sheet-modal)
 * 5. Product Popup 264624 Enhanced Mobile Card UI (#jet-popup-264624)
 */

/* ==========================================================================
   1-4. SPA PANEL, NAVIGATION, CARD PREVIEW/EDIT, SYNC & BULK SHEET MODALS
   ========================================================================== */
@keyframes proidOverlayFadeIn{0%{opacity:0}100%{opacity:1}}
@keyframes proidOverlayFadeOut{0%{opacity:1}100%{opacity:0}}
@keyframes proidDialogSpringIn{0%{opacity:0;transform:translateY(28px) scale(.94)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes proidDialogZoomOut{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(18px) scale(.95)}}
@keyframes proidModeSwitchPulse{0%{opacity:.78;transform:scale(.988)}100%{opacity:1;transform:scale(1)}}
#proid-preview-overlay{position:fixed!important;inset:0!important;top:0!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;height:100vh!important;z-index:999999999!important;background:rgba(15,23,42,.85)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;display:none!important;box-sizing:border-box!important;margin:0!important;padding:0!important;will-change:opacity!important}
#proid-preview-overlay.is-open{display:flex!important;align-items:center!important;justify-content:center!important;animation:proidOverlayFadeIn .24s cubic-bezier(0.22,1,0.36,1) forwards!important}
#proid-preview-overlay.is-closing{animation:proidOverlayFadeOut .2s ease-in forwards!important;pointer-events:none!important}
#proid-preview-overlay.is-fullscreen{padding:0!important}
#proid-preview-dialog{display:flex!important;flex-direction:column!important;background:#f8fafc!important;overflow:hidden!important;position:relative!important;box-sizing:border-box!important;margin:0!important;padding:0!important;transform-origin:center center!important;will-change:transform,opacity!important;transition:all .24s cubic-bezier(0.22,1,0.36,1)!important}
#proid-preview-overlay.is-open #proid-preview-dialog{animation:proidDialogSpringIn .34s cubic-bezier(0.22,1,0.36,1) forwards!important}
#proid-preview-overlay.is-closing #proid-preview-dialog{animation:proidDialogZoomOut .2s cubic-bezier(0.4,0,1,1) forwards!important}
#proid-preview-overlay.is-switching-mode #proid-preview-dialog{animation:proidModeSwitchPulse .26s cubic-bezier(0.22,1,0.36,1) forwards!important}
#proid-preview-overlay.is-fullscreen #proid-preview-dialog{width:100vw!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;border-radius:0!important;border:none!important;box-shadow:none!important}
#proid-preview-overlay:not(.is-fullscreen) #proid-preview-dialog{width:min(1060px,calc(100vw - 32px))!important;height:min(900px,92vh)!important;border-radius:20px!important;box-shadow:0 25px 80px rgba(0,0,0,.5)!important}
#proid-preview-header{display:flex!important;flex:0 0 58px!important;height:58px!important;min-height:58px!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;padding:0 20px!important;background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%)!important;color:#fff!important;box-shadow:0 4px 16px rgba(0,0,0,.22)!important;z-index:10!important;box-sizing:border-box!important;border-bottom:1px solid rgba(255,255,255,.1)!important}
#proid-preview-header-left{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;overflow:hidden!important;flex:1 1 auto!important}
#proid-preview-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:32px!important;height:32px!important;min-width:32px!important;border-radius:9px!important;background:rgba(56,189,248,.14)!important;border:1px solid rgba(56,189,248,.3)!important;font-size:16px!important;line-height:1!important;color:#38bdf8!important;flex-shrink:0!important}
#proid-preview-icon svg{width:16px!important;height:16px!important;min-width:16px!important;flex-shrink:0!important;display:block!important}
#proid-preview-title{font-family:'Montserrat',sans-serif!important;font-size:14.5px!important;font-weight:800!important;letter-spacing:.04em!important;text-transform:uppercase!important;color:#f8fafc!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
#proid-preview-header-actions{display:flex!important;align-items:center!important;gap:10px!important;flex-shrink:0!important}
#proid-preview-edit-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;width:auto!important;min-width:116px!important;max-width:none!important;height:40px!important;min-height:40px!important;max-height:40px!important;padding:0 18px!important;margin:0!important;border-radius:11px!important;background:linear-gradient(135deg,#0284c7 0%,#0369a1 100%)!important;border:1px solid rgba(125,211,252,.45)!important;color:#fff!important;font-family:'Montserrat',sans-serif!important;font-size:12.5px!important;font-weight:800!important;line-height:1!important;letter-spacing:.03em!important;text-transform:uppercase!important;cursor:pointer!important;outline:none!important;box-shadow:0 4px 14px rgba(2,132,199,.38),inset 0 1px 0 rgba(255,255,255,.25)!important;white-space:nowrap!important;flex:0 0 auto!important;flex-shrink:0!important;box-sizing:border-box!important;transition:transform .2s cubic-bezier(0.22,1,0.36,1),box-shadow .2s ease,background .2s ease!important}
#proid-preview-edit-btn:hover{background:linear-gradient(135deg,#0369a1 0%,#075985 100%)!important;border-color:rgba(186,230,253,.7)!important;color:#fff!important;transform:translateY(-1.5px) scale(1.02)!important;box-shadow:0 8px 20px rgba(2,132,199,.5),inset 0 1px 0 rgba(255,255,255,.35)!important}
#proid-preview-edit-btn:active{transform:translateY(0) scale(.96)!important}
#proid-preview-edit-btn svg{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important;flex:0 0 15px!important;flex-shrink:0!important;display:inline-block!important;fill:none!important;stroke:currentColor!important;stroke-width:2.4!important;stroke-linecap:round!important;stroke-linejoin:round!important}
#proid-preview-edit-btn span{display:inline-block!important;flex:0 0 auto!important;flex-shrink:0!important;color:#fff!important;font-weight:800!important;line-height:1!important;white-space:nowrap!important}
#proid-preview-overlay.is-mode-edit #proid-preview-edit-btn{display:none!important}
#proid-preview-close{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:auto!important;min-width:112px!important;max-width:none!important;height:40px!important;min-height:40px!important;max-height:40px!important;padding:0 20px!important;margin:0!important;border-radius:11px!important;background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%)!important;border:1px solid rgba(252,165,165,.45)!important;color:#fff!important;font-family:'Montserrat',sans-serif!important;font-size:13px!important;font-weight:800!important;line-height:1!important;letter-spacing:.04em!important;text-transform:uppercase!important;cursor:pointer!important;outline:none!important;box-shadow:0 4px 14px rgba(239,68,68,.4),inset 0 1px 0 rgba(255,255,255,.25)!important;white-space:nowrap!important;flex:0 0 auto!important;flex-shrink:0!important;box-sizing:border-box!important;transition:transform .2s cubic-bezier(0.22,1,0.36,1),box-shadow .2s ease,background .2s ease!important}
#proid-preview-close:hover{background:linear-gradient(135deg,#f87171 0%,#ef4444 100%)!important;border-color:rgba(254,202,202,.7)!important;color:#fff!important;transform:translateY(-1.5px) scale(1.02)!important;box-shadow:0 8px 20px rgba(239,68,68,.52),inset 0 1px 0 rgba(255,255,255,.35)!important}
#proid-preview-close:active{transform:translateY(0) scale(.96)!important;box-shadow:0 2px 8px rgba(239,68,68,.35)!important}
#proid-preview-close svg{width:16px!important;height:16px!important;min-width:16px!important;min-height:16px!important;flex:0 0 16px!important;flex-shrink:0!important;display:inline-block!important;fill:none!important;stroke:#fff!important;stroke-width:2.6!important;stroke-linecap:round!important;stroke-linejoin:round!important;transition:transform .22s cubic-bezier(0.22,1,0.36,1)!important}
#proid-preview-close:hover svg{transform:rotate(90deg) scale(1.08)!important}
#proid-preview-close span{display:inline-block!important;flex:0 0 auto!important;flex-shrink:0!important;color:#fff!important;font-weight:800!important;line-height:1!important;letter-spacing:.04em!important;white-space:nowrap!important}
#proid-spa-bar{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:3px!important;z-index:99999999!important;pointer-events:none!important;transition:opacity .25s ease!important;opacity:0}
#proid-spa-bar-progress{width:0%;height:100%!important;background:linear-gradient(90deg,#3b82f6,#06b6d4,#10b981)!important;box-shadow:0 0 10px rgba(59,130,246,.7)!important;transition:width .2s ease!important}
body.page-id-8 .site-main,body.page-id-8 .page-content{max-width:100%!important;width:100%!important;padding:0!important;margin:0!important}
body .proid-spa-outer-sec{background:#f1f5f9!important;background-image:none!important;padding:12px 14px!important;margin:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}
body .proid-spa-outer-sec>.e-con-inner,body .proid-spa-row-wrap,body .proid-spa-row-wrap>.e-con-inner,body .proid-spa-ancestor-con{max-width:1560px!important;width:100%!important;padding:0!important;margin:0 auto!important;background:transparent!important;border:none!important;box-shadow:none!important;box-sizing:border-box!important}
body .proid-spa-layout-row{background:#ffffff!important;border-radius:20px!important;border:1px solid #cbd5e1!important;box-shadow:0 10px 32px rgba(15,23,42,.06)!important;overflow:hidden!important;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:stretch!important;width:100%!important;max-width:1560px!important;margin:0 auto!important;padding:0!important;gap:0!important;box-sizing:border-box!important}
body .proid-spa-sidebar-col,body.page-id-8 .elementor-element.proid-spa-sidebar-col{background:#ffffff!important;background-image:none!important;border-right:1px solid #e2e8f0!important;padding:18px 16px!important;margin:0!important;border-radius:0!important;width:305px!important;min-width:305px!important;max-width:305px!important;flex:0 0 305px!important;display:block!important;--display:block!important;flex-direction:column!important;flex-wrap:nowrap!important;--flex-wrap:nowrap!important;--flex-wrap-mobile:nowrap!important;box-sizing:border-box!important}
body .proid-spa-sidebar-col::before,body .proid-spa-sidebar-col>.elementor-background-overlay{display:none!important}
body .proid-spa-content-col,body.page-id-8 .elementor-element.proid-spa-content-col{flex:1 1 0%!important;min-width:0!important;width:auto!important;max-width:100%!important;background:#f8fafc!important;padding:20px 22px!important;margin:0!important;border:none!important;border-radius:0!important;box-sizing:border-box!important}
#proid-spa-sidebar-header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:14px 15px!important;margin:0 0 12px 0!important;background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%)!important;border-radius:15px!important;color:#fff!important;box-shadow:0 6px 18px rgba(15,23,42,.16)!important;font-family:'Montserrat',sans-serif!important}
.proid-spa-user-meta{display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;flex:1 1 auto!important}
.proid-spa-user-avatar{width:42px!important;height:42px!important;min-width:42px!important;border-radius:12px!important;background:linear-gradient(135deg,#38bdf8 0%,#2563eb 100%)!important;color:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;font-weight:800!important;font-size:17px!important;flex-shrink:0!important;box-shadow:0 3px 10px rgba(37,99,235,.35)!important}
.proid-spa-user-text{min-width:0!important;overflow:hidden!important}
.proid-spa-user-name{font-size:14.5px!important;font-weight:800!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;line-height:1.25!important}
.proid-spa-user-sub{font-size:12px!important;color:#cbd5e1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin-top:2px!important}
.proid-spa-badge{display:inline-flex!important;align-items:center!important;gap:4px!important;padding:5px 10px!important;border-radius:9999px!important;background:rgba(56,189,248,.18)!important;border:1px solid rgba(56,189,248,.45)!important;color:#38bdf8!important;font-size:10.5px!important;font-weight:800!important;letter-spacing:.04em!important;flex-shrink:0!important;text-transform:uppercase!important}
.proid-spa-nav-heading{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;font-family:'Montserrat',sans-serif!important;font-size:11.5px!important;font-weight:800!important;letter-spacing:.06em!important;text-transform:uppercase!important;color:#64748b!important;margin:2px 0 10px 0!important;padding:0!important}
body .proid-spa-sidebar-col .elementor-widget-jet-engine-profile-menu,body .proid-spa-sidebar-col .elementor-widget-jet-engine-profile-menu>.elementor-widget-container,body.page-id-8 .elementor-widget-jet-engine-profile-menu>.elementor-widget-container{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;max-height:none!important;opacity:1!important;visibility:visible!important;overflow:visible!important;padding:0!important;margin:0!important;background:transparent!important;border:none!important;box-shadow:none!important;border-radius:0!important;box-sizing:border-box!important}
body .proid-spa-sidebar-col .jet-profile-menu,body.page-id-8 .elementor-widget-jet-engine-profile-menu .jet-profile-menu{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch!important;justify-content:flex-start!important;gap:8px!important;width:100%!important;max-width:100%!important;height:auto!important;margin:0!important;padding:0!important;visibility:visible!important;opacity:1!important;overflow:visible!important;box-sizing:border-box!important}
body .proid-spa-sidebar-col .jet-profile-menu__item,body.page-id-8 .elementor-widget-jet-engine-profile-menu .jet-profile-menu__item{display:block!important;margin:0!important;padding:0!important;width:100%!important;max-width:100%!important;height:auto!important;list-style:none!important;visibility:visible!important;opacity:1!important;box-sizing:border-box!important}
/* Tạm thời ẩn mục Gói dịch vụ & Gia hạn và Thẻ ProID Finder trong thanh điều hướng */
body .proid-spa-sidebar-col .jet-profile-menu__item:has(a[href*="manage-subscription"]),body .proid-spa-sidebar-col .jet-profile-menu__item:has(a[href*="proid-kid"]),body.page-id-8 .elementor-widget-jet-engine-profile-menu .jet-profile-menu__item:has(a[href*="manage-subscription"]),body.page-id-8 .elementor-widget-jet-engine-profile-menu .jet-profile-menu__item:has(a[href*="proid-kid"]),body .jet-profile-menu__item a[href*="manage-subscription"],body .jet-profile-menu__item a[href*="proid-kid"]{display:none!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item-link,body.page-id-8 .elementor-element .jet-profile-menu .jet-profile-menu__item-link{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;width:100%!important;min-height:52px!important;box-sizing:border-box!important;padding:10px 14px!important;margin:0!important;border-radius:14px!important;background:#f8fafc!important;border:1.5px solid #e2e8f0!important;color:#0f172a!important;font-family:'Montserrat',sans-serif!important;font-size:15px!important;font-weight:700!important;text-transform:none!important;text-align:left!important;line-height:1.3!important;white-space:normal!important;overflow:visible!important;box-shadow:0 1px 2px rgba(15,23,42,.03)!important;transition:all .18s cubic-bezier(0.22,1,0.36,1)!important;text-decoration:none!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item-link:hover,body.page-id-8 .elementor-element .jet-profile-menu .jet-profile-menu__item-link:hover{background:#eff6ff!important;border-color:#93c5fd!important;color:#1d4ed8!important;transform:translateY(-1px)!important;box-shadow:0 4px 12px rgba(37,99,235,.08)!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item.is-active .jet-profile-menu__item-link,body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item.jet-profile-menu__item--active .jet-profile-menu__item-link,body.page-id-8 .elementor-element .jet-profile-menu .jet-profile-menu__item.is-active .jet-profile-menu__item-link,body.page-id-8 .elementor-element .jet-profile-menu .is-active .jet-profile-menu__item-link{background:linear-gradient(135deg,#0f172a 0%,#1e293b 100%)!important;border-color:#0f172a!important;color:#ffffff!important;font-weight:800!important;box-shadow:0 8px 20px rgba(15,23,42,.22)!important;transform:none!important}
.proid-nav-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:36px!important;height:36px!important;min-width:36px!important;border-radius:10px!important;background:#ffffff!important;border:1px solid #e2e8f0!important;font-size:18px!important;flex-shrink:0!important;box-shadow:0 1px 2px rgba(15,23,42,.04)!important;transition:all .18s ease!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item-link:hover .proid-nav-icon{background:#dbeafe!important;border-color:#93c5fd!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item.is-active .proid-nav-icon,body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item.jet-profile-menu__item--active .proid-nav-icon{background:rgba(56,189,248,.18)!important;border-color:rgba(56,189,248,.45)!important;color:#38bdf8!important}
.proid-nav-label{flex:1 1 auto!important;min-width:0!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word!important;line-height:1.3!important;color:inherit!important}
.proid-nav-arrow{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:20px!important;height:20px!important;color:#94a3b8!important;flex-shrink:0!important;margin-left:auto!important;transition:transform .18s ease,color .18s ease!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item-link:hover .proid-nav-arrow{color:#2563eb!important;transform:translateX(3px)!important}
body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item.is-active .proid-nav-arrow,body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item.jet-profile-menu__item--active .proid-nav-arrow{color:#38bdf8!important;transform:translateX(2px)!important}
@media (max-width:1024px) and (min-width:768px){body .proid-spa-outer-sec{padding:10px!important}}
@media (max-width:767px){body .proid-spa-outer-sec{padding:6px!important}}
.proid-sync-modal{position:fixed!important;inset:0!important;z-index:999999999!important;display:none!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important}
.proid-sync-modal.is-open{display:flex!important;}
.proid-sync-overlay{position:absolute!important;inset:0!important;background:rgba(15,23,42,.75)!important;backdrop-filter:blur(6px)!important;-webkit-backdrop-filter:blur(6px)!important}
.proid-sync-dialog{position:relative!important;z-index:2!important;width:min(660px,calc(100vw - 32px))!important;max-height:90vh!important;background:#fff!important;border-radius:18px!important;box-shadow:0 25px 50px -12px rgba(0,0,0,.4)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;border:1px solid rgba(226,232,240,.8)!important}
.proid-sync-header{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;padding:20px 24px 16px 24px!important;background:#0f172a!important;color:#fff!important;border-bottom:1px solid rgba(255,255,255,.1)!important}
.proid-sync-header-left{display:flex!important;align-items:flex-start!important;gap:12px!important}
.proid-sync-icon{font-size:24px!important;line-height:1!important;color:#f59e0b!important}
.proid-sync-title{font-family:'Montserrat',sans-serif!important;font-size:16px!important;font-weight:700!important;margin:0 0 4px 0!important;color:#fff!important;text-transform:uppercase!important;letter-spacing:.02em!important}
.proid-sync-desc{font-size:12.5px!important;line-height:1.45!important;color:#94a3b8!important;margin:0!important}
.proid-sync-close-x{background:rgba(255,255,255,.1)!important;border:none!important;color:#fff!important;font-size:16px!important;width:32px!important;height:32px!important;border-radius:50%!important;cursor:pointer!important;display:flex!important;align-items:center!important;justify-content:center!important}
.proid-sync-close-x:hover{background:rgba(239,68,68,.8)!important}
.proid-sync-body{padding:20px 24px!important;overflow-y:auto!important;max-height:calc(90vh - 150px)!important;font-family:'Montserrat',sans-serif!important}
.proid-sync-notice{display:flex!important;align-items:center!important;gap:10px!important;background:#eff6ff!important;border:1px solid #bfdbfe!important;color:#1e40af!important;padding:12px 16px!important;border-radius:12px!important;font-size:12.5px!important;line-height:1.45!important;margin-bottom:18px!important}
.proid-sync-notice svg{flex-shrink:0!important}
.proid-sync-modes{display:flex!important;flex-direction:column!important;gap:12px!important;margin-bottom:18px!important}
.proid-sync-mode-option{display:flex!important;align-items:flex-start!important;gap:12px!important;padding:14px 16px!important;background:#f8fafc!important;border:2px solid #e2e8f0!important;border-radius:12px!important;cursor:pointer!important;transition:all .2s ease!important}
.proid-sync-mode-option:hover{border-color:#3b82f6!important;background:#f0f9ff!important}
.proid-sync-mode-option input[type="radio"]{margin-top:3px!important;accent-color:#2563eb!important;cursor:pointer!important}
.proid-sync-mode-title{display:block!important;font-weight:700!important;font-size:13.5px!important;color:#0f172a!important;margin-bottom:3px!important}
.proid-sync-mode-subtitle{display:block!important;font-size:12px!important;color:#64748b!important;line-height:1.4!important}
.proid-sync-fields-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;background:#f8fafc!important;padding:14px!important;border-radius:12px!important;border:1px solid #e2e8f0!important;margin-bottom:18px!important}
.proid-sync-field-item label{display:flex!important;align-items:center!important;gap:8px!important;font-size:12px!important;font-weight:600!important;color:#334155!important;cursor:pointer!important}
.proid-sync-field-item input[type="checkbox"]{accent-color:#2563eb!important;width:16px!important;height:16px!important}
.proid-sync-footer{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:12px!important;padding:14px 24px!important;background:#f8fafc!important;border-top:1px solid #e2e8f0!important}
.proid-sync-cancel-btn{height:38px!important;padding:0 18px!important;border-radius:10px!important;background:#fff!important;border:1px solid #cbd5e1!important;color:#475569!important;font-weight:600!important;font-size:12.5px!important;cursor:pointer!important}
.proid-sync-submit-btn{height:38px!important;padding:0 20px!important;border-radius:10px!important;background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%)!important;border:none!important;color:#fff!important;font-weight:700!important;font-size:12.5px!important;cursor:pointer!important;box-shadow:0 4px 12px rgba(217,119,6,.3)!important;display:flex!important;align-items:center!important;gap:6px!important}
.proid-sheet-modal{position:fixed!important;inset:0!important;z-index:999999999!important;background:rgba(15,23,42,.88)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;display:none!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;padding:12px!important}
.proid-sheet-modal.is-open{display:flex!important;}
.proid-sheet-container{width:100%!important;height:100%!important;max-width:1600px!important;max-height:98vh!important;background:#fff!important;border-radius:16px!important;box-shadow:0 25px 60px rgba(0,0,0,.45)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;border:1px solid rgba(226,232,240,.9)!important}
.proid-sheet-header{display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:wrap!important;gap:12px!important;padding:12px 18px!important;background:#0f172a!important;color:#fff!important;border-bottom:1px solid rgba(255,255,255,.1)!important;flex-shrink:0!important;width:100%!important;box-sizing:border-box!important}
.proid-sheet-header-left{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;flex:1 1 auto!important}
.proid-sheet-title-badge{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important}
.proid-sheet-icon{font-size:22px!important;flex-shrink:0!important}
.proid-sheet-title{font-family:'Montserrat',sans-serif!important;font-size:14px!important;font-weight:700!important;color:#fff!important;margin:0!important;letter-spacing:.02em!important;white-space:nowrap!important}
.proid-sheet-subtitle{font-size:11px!important;color:#94a3b8!important;display:none!important}
.proid-sheet-count-tag{display:inline-flex!important;align-items:center!important;padding:3px 8px!important;background:rgba(16,185,129,.2)!important;border:1px solid #10b981!important;color:#34d399!important;border-radius:9999px!important;font-size:11px!important;font-weight:700!important;flex-shrink:0!important}
.proid-sheet-header-center{flex:1 1 200px!important;max-width:320px!important;min-width:150px!important}
.proid-sheet-search-wrap{display:flex!important;align-items:center!important;gap:8px!important;background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:10px!important;padding:6px 12px!important;color:#fff!important}
.proid-sheet-search-wrap input{background:transparent!important;border:none!important;outline:none!important;color:#fff!important;font-size:12.5px!important;width:100%!important}
.proid-sheet-search-wrap input::placeholder{color:#94a3b8!important}
.proid-sheet-header-right{display:flex!important;align-items:center!important;gap:10px!important;flex-shrink:0!important;margin-left:auto!important}
.proid-sheet-save-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;flex-shrink:0!important;width:auto!important;min-width:max-content!important;max-width:none!important;gap:7px!important;height:36px!important;padding:0 16px!important;border-radius:10px!important;background:#10b981!important;border:1px solid #34d399!important;color:#fff!important;font-family:'Montserrat',sans-serif!important;font-weight:700!important;font-size:12px!important;line-height:1.2!important;letter-spacing:0!important;text-transform:none!important;cursor:pointer!important;transition:all .2s ease!important;white-space:nowrap!important;overflow:visible!important;box-sizing:border-box!important}
.proid-sheet-save-btn:disabled{background:#475569!important;border-color:#64748b!important;color:#94a3b8!important;cursor:not-allowed!important;box-shadow:none!important}
.proid-sheet-save-btn:not(:disabled):hover{background:#059669!important;box-shadow:0 4px 14px rgba(16,185,129,.4)!important}
.proid-sheet-dirty-badge{display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#ef4444!important;color:#fff!important;font-size:10px!important;font-weight:800!important;padding:1px 6px!important;border-radius:9999px!important}
.proid-sheet-close-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;flex-shrink:0!important;width:auto!important;min-width:max-content!important;max-width:none!important;gap:6px!important;height:36px!important;padding:0 15px!important;border-radius:10px!important;background:#ef4444!important;border:1px solid #f87171!important;color:#fff!important;font-family:'Montserrat',sans-serif!important;font-weight:700!important;font-size:12px!important;line-height:1.2!important;letter-spacing:0!important;text-transform:none!important;cursor:pointer!important;white-space:nowrap!important;overflow:visible!important;box-sizing:border-box!important;box-shadow:0 4px 12px rgba(239,68,68,.35)!important}
.proid-sheet-tabs-bar{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:8px!important;padding:10px 16px!important;background:#f1f5f9!important;border-bottom:1px solid #e2e8f0!important;overflow:visible!important;flex-shrink:0!important;width:100%!important;box-sizing:border-box!important}
.proid-sheet-tab{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;flex-shrink:0!important;width:auto!important;min-width:max-content!important;max-width:none!important;height:32px!important;padding:0 13px!important;border-radius:8px!important;background:#fff!important;border:1px solid #cbd5e1!important;color:#334155!important;font-family:'Montserrat',sans-serif!important;font-size:12px!important;font-weight:600!important;line-height:1.2!important;letter-spacing:0!important;text-transform:none!important;cursor:pointer!important;white-space:nowrap!important;overflow:visible!important;box-sizing:border-box!important;transition:all .15s ease!important}
.proid-sheet-tab.is-active{background:#2563eb!important;border-color:#2563eb!important;color:#fff!important;font-weight:700!important}
.proid-sheet-tab-hint{margin-left:auto!important;font-size:11px!important;color:#64748b!important;white-space:nowrap!important;padding-left:10px!important}
.proid-sheet-table-wrap{flex:1 1 auto!important;overflow:auto!important;position:relative!important;background:#fff!important}
.proid-sheet-table{border-collapse:separate!important;border-spacing:0!important;width:100%!important;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif!important;font-size:12.5px!important}
.proid-sheet-table th{position:sticky!important;top:0!important;background:#f8fafc!important;color:#1e293b!important;font-weight:700!important;text-align:left!important;padding:8px 12px!important;border-bottom:2px solid #cbd5e1!important;border-right:1px solid #e2e8f0!important;z-index:20!important;white-space:nowrap!important}
.proid-sheet-table th.col-sticky-1{left:0!important;z-index:30!important;background:#f1f5f9!important}
.proid-sheet-table th.col-sticky-2{left:70px!important;z-index:30!important;background:#f1f5f9!important}
.proid-sheet-table th.col-sticky-3{left:125px!important;z-index:30!important;background:#f1f5f9!important}
.proid-sheet-table td{padding:6px 10px!important;border-bottom:1px solid #e2e8f0!important;border-right:1px solid #e2e8f0!important;color:#334155!important;white-space:nowrap!important;min-width:130px!important;max-width:280px!important;overflow:hidden!important;text-overflow:ellipsis!important;background:#fff!important}
.proid-sheet-table tr:hover td{background:#f8fafc!important}
.proid-sheet-table td.col-sticky-1{position:sticky!important;left:0!important;z-index:10!important;background:#fff!important;width:70px!important;min-width:70px!important;max-width:70px!important;text-align:center!important;font-weight:700!important;color:#64748b!important}
.proid-sheet-table td.col-sticky-2{position:sticky!important;left:70px!important;z-index:10!important;background:#fff!important;width:55px!important;min-width:55px!important;max-width:55px!important;text-align:center!important}
.proid-sheet-table td.col-sticky-3{position:sticky!important;left:125px!important;z-index:10!important;background:#fff!important;min-width:150px!important;font-weight:600!important}
.proid-sheet-cell[contenteditable="true"]{outline:none!important;cursor:text!important;min-height:22px!important;border-radius:4px!important;padding:2px 4px!important;transition:all .15s ease!important}
.proid-sheet-cell[contenteditable="true"]:focus{background:#fff!important;box-shadow:0 0 0 2px #2563eb!important;border-radius:3px!important}
.proid-sheet-cell.is-dirty{background:#fef08a!important;color:#854d0e!important;position:relative!important}
.proid-sheet-cell.is-dirty::after{content:''!important;position:absolute!important;top:2px!important;right:2px!important;width:6px!important;height:6px!important;border-radius:50%!important;background:#ea580c!important}
.proid-sheet-avatar-img{width:34px!important;height:34px!important;border-radius:50%!important;object-fit:cover!important;border:1px solid #cbd5e1!important;display:block!important;margin:0 auto!important}
.proid-sheet-footer{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:8px 18px!important;background:#f8fafc!important;border-top:1px solid #e2e8f0!important;font-size:11.5px!important;color:#64748b!important;flex-shrink:0!important}
#proid-preview-frame-container{position:relative!important;flex:1 1 auto!important;width:100%!important;height:calc(100% - 54px)!important;min-height:0!important;overflow:hidden!important;background:#f8fafc!important}
#proid-preview-frame{display:block!important;width:100%!important;height:100%!important;min-height:0!important;border:0!important;background:#f8fafc!important;-webkit-overflow-scrolling:touch!important;opacity:0!important;transform:translateY(10px) scale(.992)!important;transition:opacity .32s cubic-bezier(0.22,1,0.36,1),transform .32s cubic-bezier(0.22,1,0.36,1)!important}
#proid-preview-overlay.is-frame-loaded #proid-preview-frame{opacity:1!important;transform:translateY(0) scale(1)!important}
#proid-preview-loading{position:absolute!important;inset:0!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:14px!important;background:#f8fafc!important;color:#0f172a!important;font-family:'Montserrat',sans-serif!important;font-size:14px!important;font-weight:600!important;z-index:5!important;opacity:1!important;visibility:visible!important;transform:scale(1)!important;transition:opacity .26s ease,visibility .26s ease,transform .26s cubic-bezier(0.22,1,0.36,1)!important}
#proid-preview-loading.is-hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:scale(.96)!important}
#proid-preview-spinner{width:38px!important;height:38px!important;border:3.5px solid #cbd5e1!important;border-top-color:#0f172a!important;border-radius:50%!important;animation:proidSpin .75s linear infinite!important}
@keyframes proidSpin{to{transform:rotate(360deg)}}
#proid-modal-toast{position:fixed!important;bottom:32px!important;left:50%!important;transform:translateX(-50%) translateY(20px) scale(0.96)!important;background:rgba(15,23,42,0.94)!important;-webkit-backdrop-filter:blur(16px) saturate(180%)!important;backdrop-filter:blur(16px) saturate(180%)!important;color:#f8fafc!important;padding:9px 20px 9px 12px!important;border-radius:9999px!important;border:1px solid rgba(255,255,255,0.12)!important;font-family:'Montserrat',-apple-system,BlinkMacSystemFont,sans-serif!important;font-size:13.5px!important;font-weight:600!important;line-height:1.2!important;letter-spacing:.01em!important;white-space:nowrap!important;box-shadow:0 14px 40px -4px rgba(0,0,0,0.4),0 0 0 1px rgba(255,255,255,0.06),0 4px 16px rgba(16,185,129,0.18)!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;z-index:999999999!important;opacity:0!important;pointer-events:none!important;max-width:calc(100vw - 32px)!important;box-sizing:border-box!important;transition:opacity .28s cubic-bezier(0.16,1,0.3,1),transform .28s cubic-bezier(0.16,1,0.3,1)!important}
#proid-modal-toast.is-show{opacity:1!important;transform:translateX(-50%) translateY(0) scale(1)!important;pointer-events:auto!important}
#proid-modal-toast .proid-toast-icon-wrap{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:22px!important;height:22px!important;min-width:22px!important;border-radius:50%!important;background:rgba(16,185,129,0.18)!important;border:1px solid rgba(52,211,153,0.3)!important;flex-shrink:0!important}
#proid-modal-toast .proid-toast-icon-wrap svg{width:12px!important;height:12px!important;fill:none!important;stroke:#34d399!important;stroke-width:2.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
#proid-modal-toast-text{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:inline-block!important}
@media (max-width: 480px){#proid-modal-toast{bottom:20px!important;padding:8px 16px 8px 10px!important;font-size:12.5px!important;gap:8px!important;max-width:calc(100vw - 24px)!important}#proid-modal-toast .proid-toast-icon-wrap{width:20px!important;height:20px!important;min-width:20px!important}#proid-modal-toast .proid-toast-icon-wrap svg{width:11px!important;height:11px!important}}
@media (max-width: 768px){#proid-preview-dialog{width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}#proid-preview-frame-container{height:calc(100dvh - 54px)!important}#proid-preview-header{height:54px!important;min-height:54px!important;flex:0 0 54px!important;padding:0 14px!important;gap:10px!important}#proid-preview-icon{width:30px!important;height:30px!important;min-width:30px!important}#proid-preview-title{font-size:13px!important}#proid-preview-edit-btn{height:38px!important;min-height:38px!important;max-height:38px!important;width:auto!important;min-width:104px!important;padding:0 15px!important;font-size:12px!important;gap:6px!important;border-radius:10px!important}#proid-preview-close{height:38px!important;min-height:38px!important;max-height:38px!important;width:auto!important;min-width:100px!important;padding:0 16px!important;font-size:12.5px!important;gap:7px!important;border-radius:10px!important}}@media (max-width: 520px){#proid-preview-header{height:52px!important;min-height:52px!important;flex:0 0 52px!important;padding:0 12px!important;gap:8px!important}#proid-preview-frame-container{height:calc(100dvh - 52px)!important}#proid-preview-title{font-size:12.5px!important}#proid-preview-edit-btn{height:38px!important;min-height:38px!important;max-height:38px!important;width:auto!important;min-width:100px!important;padding:0 14px!important;font-size:11.5px!important;gap:6px!important;border-radius:10px!important}#proid-preview-close{height:38px!important;min-height:38px!important;max-height:38px!important;width:auto!important;min-width:96px!important;padding:0 15px!important;font-size:12px!important;gap:6px!important;border-radius:10px!important}}

/* ==========================================================================
   5. PRODUCT POPUP (ID: 264624) ENHANCED MOBILE CARD UI
   ========================================================================== */
/* ProID Product Popup (264624) Container */
    #jet-popup-264624 .jet-popup__container,
    .jet-popup[data-popup-id="264624"] .jet-popup__container {
        max-width: 480px !important;
        width: 480px !important;
        border-radius: 20px !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.35) !important;
        overflow: hidden !important;
        border: 1px solid rgba(226, 232, 240, 0.8) !important;
        background: #ffffff !important;
        position: relative !important;
    }

    @media (max-width: 520px) {
        #jet-popup-264624 .jet-popup__container,
        .jet-popup[data-popup-id="264624"] .jet-popup__container {
            width: 92% !important;
            max-width: 92% !important;
            border-radius: 16px !important;
        }
    }

    #jet-popup-264624 .jet-popup__container-inner,
    .jet-popup[data-popup-id="264624"] .jet-popup__container-inner {
        border-radius: 20px !important;
        background: #ffffff !important;
        max-height: 88vh !important;
        overflow-y: auto !important;
        scrollbar-width: thin;
        scrollbar-color: #cbd5e1 transparent;
        padding: 0 !important;
    }

    #jet-popup-264624 .jet-popup__container-inner::-webkit-scrollbar,
    .jet-popup[data-popup-id="264624"] .jet-popup__container-inner::-webkit-scrollbar {
        width: 6px;
    }
    #jet-popup-264624 .jet-popup__container-inner::-webkit-scrollbar-track,
    .jet-popup[data-popup-id="264624"] .jet-popup__container-inner::-webkit-scrollbar-track {
        background: transparent;
    }
    #jet-popup-264624 .jet-popup__container-inner::-webkit-scrollbar-thumb,
    .jet-popup[data-popup-id="264624"] .jet-popup__container-inner::-webkit-scrollbar-thumb {
        background-color: #cbd5e1;
        border-radius: 10px;
    }

    /* Floating Modern Close Button */
    #jet-popup-264624 .jet-popup__close-button,
    .jet-popup[data-popup-id="264624"] .jet-popup__close-button {
        position: absolute !important;
        top: 12px !important;
        right: 12px !important;
        width: 34px !important;
        height: 34px !important;
        border-radius: 50% !important;
        background: rgba(15, 23, 42, 0.65) !important;
        backdrop-filter: blur(6px) !important;
        -webkit-backdrop-filter: blur(6px) !important;
        color: #ffffff !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 100 !important;
        border: 1px solid rgba(255, 255, 255, 0.3) !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25) !important;
    }

    #jet-popup-264624 .jet-popup__close-button:hover,
    .jet-popup[data-popup-id="264624"] .jet-popup__close-button:hover {
        background: rgba(15, 23, 42, 0.9) !important;
        transform: scale(1.08) !important;
    }

    #jet-popup-264624 .jet-popup__close-button svg,
    #jet-popup-264624 .jet-popup__close-button i,
    .jet-popup[data-popup-id="264624"] .jet-popup__close-button svg,
    .jet-popup[data-popup-id="264624"] .jet-popup__close-button i {
        font-size: 15px !important;
        color: #ffffff !important;
        fill: #ffffff !important;
    }

    /* Top Banner / Image */
    #jet-popup-264624 .elementor-widget-image,
    .jet-popup[data-popup-id="264624"] .elementor-widget-image {
        margin: 0 !important;
        width: 100% !important;
    }
    #jet-popup-264624 .elementor-widget-image img,
    .jet-popup[data-popup-id="264624"] .elementor-widget-image img {
        width: 100% !important;
        max-height: 280px !important;
        object-fit: cover !important;
        display: block !important;
        border-top-left-radius: 18px !important;
        border-top-right-radius: 18px !important;
    }

    /* Gallery & Video */
    #jet-popup-264624 .elementor-widget-gallery,
    .jet-popup[data-popup-id="264624"] .elementor-widget-gallery {
        padding: 0 16px !important;
        margin-top: 10px !important;
    }
    #jet-popup-264624 .elementor-widget-video,
    .jet-popup[data-popup-id="264624"] .elementor-widget-video {
        padding: 0 16px !important;
        margin-top: 10px !important;
    }

    /* Product Title */
    #jet-popup-264624 .elementor-widget-heading,
    .jet-popup[data-popup-id="264624"] .elementor-widget-heading {
        margin: 16px 20px 6px 20px !important;
    }
    #jet-popup-264624 .elementor-widget-heading .elementor-heading-title,
    .jet-popup[data-popup-id="264624"] .elementor-widget-heading .elementor-heading-title {
        font-size: 20px !important;
        font-weight: 700 !important;
        color: #0f172a !important;
        line-height: 1.35 !important;
        text-align: center !important;
        text-transform: uppercase !important;
        margin: 0 !important;
    }

    /* Price Field */
    #jet-popup-264624 .elementor-widget-jet-listing-dynamic-field,
    .jet-popup[data-popup-id="264624"] .elementor-widget-jet-listing-dynamic-field {
        margin: 0 20px 14px 20px !important;
        text-align: center !important;
    }
    #jet-popup-264624 .elementor-widget-jet-listing-dynamic-field .jet-listing-dynamic-field__content,
    .jet-popup[data-popup-id="264624"] .elementor-widget-jet-listing-dynamic-field .jet-listing-dynamic-field__content {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #e11d48 !important;
        letter-spacing: 0.3px !important;
    }

    /* Description */
    #jet-popup-264624 .elementor-widget-text-editor,
    .jet-popup[data-popup-id="264624"] .elementor-widget-text-editor {
        padding: 0 22px !important;
        margin: 0 0 16px 0 !important;
        font-size: 14.5px !important;
        line-height: 1.65 !important;
        color: #334155 !important;
        text-align: justify !important;
    }

    /* Action Button (Product Link) */
    #jet-popup-264624 .elementor-widget-button,
    .jet-popup[data-popup-id="264624"] .elementor-widget-button {
        padding: 0 20px !important;
        margin: 6px 0 14px 0 !important;
    }
    #jet-popup-264624 .elementor-widget-button .elementor-button,
    .jet-popup[data-popup-id="264624"] .elementor-widget-button .elementor-button {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: linear-gradient(135deg, #0f172a 0%, #334155 100%) !important;
        color: #ffffff !important;
        border-radius: 12px !important;
        font-weight: 600 !important;
        font-size: 15px !important;
        padding: 12px 20px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18) !important;
        transition: all 0.25s ease !important;
        border: none !important;
    }
    #jet-popup-264624 .elementor-widget-button .elementor-button:hover,
    .jet-popup[data-popup-id="264624"] .elementor-widget-button .elementor-button:hover {
        transform: translateY(-2px) !important;
        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.25) !important;
        background: linear-gradient(135deg, #1e293b 0%, #475569 100%) !important;
    }

    /* Order Form */
    #jet-popup-264624 .elementor-widget-form,
    .jet-popup[data-popup-id="264624"] .elementor-widget-form {
        padding: 0 20px 24px 20px !important;
        margin: 0 !important;
    }
    #jet-popup-264624 .elementor-widget-form input,
    #jet-popup-264624 .elementor-widget-form textarea,
    .jet-popup[data-popup-id="264624"] .elementor-widget-form input,
    .jet-popup[data-popup-id="264624"] .elementor-widget-form textarea {
        border-radius: 10px !important;
        border: 1px solid #cbd5e1 !important;
        font-size: 14px !important;
        padding: 10px 14px !important;
        background: #f8fafc !important;
    }
    #jet-popup-264624 .elementor-widget-form input:focus,
    #jet-popup-264624 .elementor-widget-form textarea:focus,
    .jet-popup[data-popup-id="264624"] .elementor-widget-form input:focus,
    .jet-popup[data-popup-id="264624"] .elementor-widget-form textarea:focus {
        border-color: #3b82f6 !important;
        background: #ffffff !important;
        outline: none !important;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
    }
    #jet-popup-264624 .elementor-widget-form .elementor-button,
    .jet-popup[data-popup-id="264624"] .elementor-widget-form .elementor-button {
        border-radius: 10px !important;
        font-weight: 700 !important;
        padding: 12px !important;
    }
.proid-reset-pass-btn { display: none !important; }


/* ==========================================================================
   NAVIGATION PANEL EXPAND / COLLAPSE (ACCORDION TOGGLE) FOR MOBILE & DESKTOP
   ========================================================================== */
.proid-spa-nav-heading {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: #475569 !important;
    margin: 4px 0 10px 0 !important;
    padding: 9px 12px !important;
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.proid-spa-nav-heading:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}

.proid-spa-nav-heading-left {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
}

.proid-spa-nav-heading-icon {
    color: #64748b !important;
    flex-shrink: 0 !important;
}

.proid-spa-nav-count-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #e2e8f0 !important;
    color: #334155 !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    padding: 1.5px 7px !important;
    border-radius: 999px !important;
}

.proid-spa-nav-toggle-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 999px !important;
    padding: 4px 10px !important;
    color: #1e293b !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
    transition: all 0.18s ease !important;
}

.proid-spa-nav-toggle-btn:hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
}

.proid-spa-toggle-icon {
    transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Collapsed State: Rotate toggle arrow */
.proid-spa-sidebar-col.is-nav-collapsed .proid-spa-toggle-icon {
    transform: rotate(-180deg) !important;
}

/* Menu items container: always visible and vertically stacked */
body .proid-spa-sidebar-col .elementor-widget-jet-engine-profile-menu {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
}

body .proid-spa-sidebar-col.is-legacy-nav-collapsed .elementor-widget-jet-engine-profile-menu {
    display: block !important;
    max-height: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Active Tab Preview Bar when collapsed */
.proid-spa-active-preview-bar {
    display: none;
    align-items: center !important;
    justify-content: space-between !important;
    background: #ffffff !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 14px !important;
    padding: 10px 14px !important;
    margin: 4px 0 8px 0 !important;
    box-shadow: 0 2px 8px rgba(15,23,42,0.05) !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: all 0.18s ease !important;
}

.proid-spa-active-preview-bar:hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
}

.proid-spa-sidebar-col.is-nav-collapsed .proid-spa-active-preview-bar {
    display: flex !important;
    animation: proidSpaFadeIn 0.22s ease !important;
}

.proid-spa-preview-left {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 14px !important;
    color: #1e293b !important;
}

.proid-spa-preview-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    height: 34px !important;
    background: #eff6ff !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 10px !important;
    font-size: 17px !important;
    flex-shrink: 0 !important;
}

.proid-spa-preview-text strong {
    font-weight: 700 !important;
    color: #0f172a !important;
}

.proid-spa-preview-hint {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #2563eb !important;
    background: #eff6ff !important;
    padding: 4px 10px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
}

@keyframes proidSpaFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}





/* ==========================================================================
   6. NATIVE PROID APP HEADER & FOOTER UI SHELL
   ========================================================================== */

/* Completely hide legacy Elementor Pro Header (ID 438) & Footer (ID 455) */
body.proid-has-app-shell header.elementor-438,
body.proid-has-app-shell footer.elementor-455,
body.proid-has-app-shell .elementor-element-533f56d,
body.proid-has-app-shell .elementor-element-04ac5c2,
body.proid-has-app-shell .elementor-element-eb1ac9e,
body.page-id-8 header.elementor-438,
body.page-id-8 footer.elementor-455 {
    display: none !important;
}

/* Base Body Adjustments */
body.proid-has-app-shell {
    background-color: #f8fafc !important;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    overflow-x: hidden !important;
}

/* Spacing for Main Account Container below sticky header */
body.proid-has-app-shell .elementor-element-79d2a0e2,
body.page-id-8 .elementor-element-79d2a0e2 {
    margin-top: 24px !important;
    margin-bottom: 32px !important;
}

@media (max-width: 767px) {
    body.proid-has-app-shell .elementor-element-79d2a0e2,
    body.page-id-8 .elementor-element-79d2a0e2 {
        margin-top: 14px !important;
        margin-bottom: 20px !important;
    }
}

/* Top App Header */
#proid-app-header {
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 66px !important;
    min-height: 66px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.85) !important;
    box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.04) !important;
    z-index: 99999 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

.proid-header-container {
    max-width: 1440px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    gap: 16px !important;
}

/* Header Left: Brand & Workspace Badge */
.proid-header-left {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-shrink: 0 !important;
}

.proid-header-brand {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    outline: none !important;
    transition: opacity 0.2s ease !important;
}

.proid-header-brand:hover {
    opacity: 0.88 !important;
}

.proid-header-logo {
    height: 38px !important;
    width: auto !important;
    max-height: 38px !important;
    object-fit: contain !important;
    display: block !important;
}

.proid-header-workspace-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    background: rgba(217, 48, 37, 0.07) !important;
    border: 1px solid rgba(217, 48, 37, 0.16) !important;
    color: #d93025 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    white-space: nowrap !important;
    user-select: none !important;
}

.proid-badge-pulse-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #d93025 !important;
    box-shadow: 0 0 0 0 rgba(217, 48, 37, 0.5) !important;
    animation: proidHeaderPulse 2s infinite !important;
}

@keyframes proidHeaderPulse {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(217, 48, 37, 0.6); }
    70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(217, 48, 37, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(217, 48, 37, 0); }
}

/* Header Right: Actions, Lang, Profile */
.proid-header-right {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
}

/* AI Assistant Button */
.proid-header-ai-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    height: 40px !important;
    padding: 0 14px !important;
    border-radius: 11px !important;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
    border: 1px solid #e2e8f0 !important;
    color: #1e293b !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    outline: none !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
    box-sizing: border-box !important;
}

.proid-header-ai-btn:hover {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
    border-color: #93c5fd !important;
    color: #1d4ed8 !important;
    transform: translateY(-1.5px) !important;
    box-shadow: 0 4px 14px rgba(29, 78, 216, 0.14) !important;
}

.proid-ai-icon-wrap {
    display: inline-flex !important;
    color: #d93025 !important;
    transition: transform 0.2s ease !important;
}

.proid-header-ai-btn:hover .proid-ai-icon-wrap {
    transform: rotate(15deg) scale(1.1) !important;
    color: #2563eb !important;
}

/* GTranslate Wrapper */
/* Language Switcher Interactive UI */
.proid-header-lang-wrapper {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
}

.proid-header-lang-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    height: 38px !important;
    padding: 0 11px !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #1e293b !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
    outline: none !important;
}

.proid-header-lang-btn:hover {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06) !important;
}

.proid-header-lang-btn[aria-expanded="true"] {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
    background: #f0f9ff !important;
}

.proid-header-lang-btn[aria-expanded="true"] .proid-lang-chevron {
    transform: rotate(180deg) !important;
    color: #2563eb !important;
}

.proid-lang-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #475569 !important;
}

.proid-header-lang-btn:hover .proid-lang-icon {
    color: #0f172a !important;
}

.proid-lang-active-code {
    display: inline-block !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    letter-spacing: 0.04em !important;
    color: #0f172a !important;
}

.proid-lang-chevron {
    color: #64748b !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

/* Language Dropdown Popover */
.proid-lang-dropdown {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    width: 200px !important;
    min-width: 200px !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.14) !important;
    padding: 6px !important;
    z-index: 9999999 !important;
    display: none;
    flex-direction: column !important;
    gap: 3px !important;
    box-sizing: border-box !important;
    animation: proidLangFadeDown 0.18s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

@keyframes proidLangFadeDown {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.proid-lang-dropdown.is-open {
    display: flex !important;
}

.proid-lang-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 12px !important;
    border-radius: 10px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: #1e293b !important;
    width: 100% !important;
    text-align: left !important;
    cursor: pointer !important;
    font-family: 'Montserrat', sans-serif !important;
    box-sizing: border-box !important;
    transition: all 0.15s ease !important;
}

.proid-lang-item:hover {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

.proid-lang-item.is-active {
    background: #eff6ff !important;
    border-color: #bfdbfe !important;
    color: #1d4ed8 !important;
}

.proid-lang-flag {
    font-size: 19px !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}

.proid-lang-text {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

.proid-lang-name {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.proid-lang-sub {
    font-size: 10.5px !important;
    color: #64748b !important;
    line-height: 1.2 !important;
    margin-top: 1px !important;
}

.proid-lang-item.is-active .proid-lang-sub {
    color: #3b82f6 !important;
}

.proid-lang-check {
    margin-left: auto !important;
    flex-shrink: 0 !important;
    color: #2563eb !important;
    opacity: 0 !important;
    transform: scale(0.8) !important;
    transition: all 0.15s ease !important;
}

.proid-lang-item.is-active .proid-lang-check {
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* Hide Google Translate original toolbar and banners so they don't break layout */
.goog-te-banner-frame,
.skiptranslate,
#goog-gt-tt,
.goog-te-balloon-frame {
    display: none !important;
    visibility: hidden !important;
}

body {
    top: 0px !important;
    position: static !important;
}

/* User Menu & Trigger */
.proid-header-user-menu {
    position: relative !important;
}

.proid-header-user-trigger {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    height: 44px !important;
    padding: 4px 12px 4px 5px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    cursor: pointer !important;
    outline: none !important;
    box-sizing: border-box !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.proid-header-user-trigger:hover,
.proid-header-user-trigger[aria-expanded="true"] {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

.proid-header-avatar-wrap {
    position: relative !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
}

.proid-header-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: block !important;
    border: 1.5px solid #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.proid-avatar-online-dot {
    position: absolute !important;
    bottom: -1px !important;
    right: -1px !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: #10b981 !important;
    border: 2px solid #ffffff !important;
    box-sizing: border-box !important;
}

.proid-header-user-meta {
    display: flex !important;
    flex-direction: column !important;
    text-align: left !important;
    line-height: 1.2 !important;
}

.proid-header-user-name {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    max-width: 140px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.proid-header-user-role {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

.proid-header-user-role.is-admin {
    color: #d93025 !important;
}

.proid-header-user-role.is-enterprise {
    color: #0284c7 !important;
}

.proid-header-user-role.is-member {
    color: #64748b !important;
}

.proid-header-chevron {
    color: #64748b !important;
    flex-shrink: 0 !important;
    transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.proid-header-user-trigger[aria-expanded="true"] .proid-header-chevron {
    transform: rotate(180deg) !important;
}

/* User Popover Dropdown */
.proid-header-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    width: 290px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    box-shadow: 0 20px 45px -10px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(15, 23, 42, 0.05) !important;
    padding: 12px !important;
    box-sizing: border-box !important;
    z-index: 100000 !important;
    display: none !important;
    opacity: 0 !important;
    transform: translateY(8px) scale(0.96) !important;
    transform-origin: top right !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.proid-header-dropdown-menu.is-open {
    display: block !important;
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

.proid-dropdown-user-banner {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    color: inherit !important;
    transition: background 0.15s ease !important;
}

.proid-dropdown-user-banner:hover {
    background: #f8fafc !important;
}

.proid-dropdown-avatar img {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 1px solid #e2e8f0 !important;
    display: block !important;
}

.proid-dropdown-info {
    min-width: 0 !important;
    overflow: hidden !important;
}

.proid-dropdown-name {
    font-size: 14.5px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.proid-dropdown-email {
    font-size: 12px !important;
    color: #64748b !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin-top: 1px !important;
}

.proid-dropdown-role-pill {
    display: inline-block !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    padding: 2px 7px !important;
    border-radius: 999px !important;
    margin-top: 5px !important;
}

.proid-dropdown-role-pill.is-admin {
    background: #fef2f2 !important;
    color: #b91c1c !important;
    border: 1px solid #fecaca !important;
}

.proid-dropdown-role-pill.is-enterprise {
    background: #f0f9ff !important;
    color: #0369a1 !important;
    border: 1px solid #bae6fd !important;
}

.proid-dropdown-role-pill.is-member {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border: 1px solid #e2e8f0 !important;
}

.proid-dropdown-sep {
    height: 1px !important;
    background: #f1f5f9 !important;
    margin: 8px 0 !important;
}

.proid-dropdown-items {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.proid-dropdown-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 9px 10px !important;
    border-radius: 11px !important;
    text-decoration: none !important;
    color: #1e293b !important;
    transition: all 0.15s ease !important;
    outline: none !important;
}

.proid-dropdown-item:hover {
    background: #f8fafc !important;
    color: #0f172a !important;
    transform: translateX(2px) !important;
}

.proid-dropdown-icon {
    font-size: 17px !important;
    width: 22px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.proid-dropdown-item-text {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
}

.proid-dropdown-item-title {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    line-height: 1.3 !important;
}

.proid-dropdown-item-desc {
    font-size: 11px !important;
    color: #64748b !important;
    line-height: 1.2 !important;
}

.proid-dropdown-logout-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 11px !important;
    border-radius: 11px !important;
    background: #fff1f2 !important;
    border: 1px solid #ffe4e6 !important;
    color: #e11d48 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    box-sizing: border-box !important;
}

.proid-dropdown-logout-btn:hover {
    background: #ffe4e6 !important;
    border-color: #fecdd3 !important;
    color: #be123c !important;
}

/* ==========================================================================
   APP FOOTER
   ========================================================================== */
#proid-app-footer {
    width: 100% !important;
    margin-top: 48px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    color: #64748b !important;
    box-sizing: border-box !important;
    padding: 0 !important;
}

.proid-footer-container {
    max-width: 1440px !important;
    margin: 0 auto !important;
    padding: 28px 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
    box-sizing: border-box !important;
}

.proid-footer-left {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.proid-footer-brand-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.proid-footer-brand-title {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.01em !important;
}

.proid-footer-dot {
    color: #cbd5e1 !important;
    font-weight: 700 !important;
}

.proid-footer-copyright {
    font-size: 13px !important;
    color: #475569 !important;
    font-weight: 500 !important;
}

.proid-footer-desc {
    font-size: 12px !important;
    color: #94a3b8 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

.proid-footer-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: 8px !important;
}

.proid-footer-status {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 4px 11px !important;
    border-radius: 999px !important;
    background: #ecfdf5 !important;
    border: 1px solid #a7f3d0 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #065f46 !important;
}

.proid-status-pulse-dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #10b981 !important;
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6) !important;
    animation: proidPulseGreen 2s infinite !important;
}

@keyframes proidPulseGreen {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6); }
    70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

.proid-footer-nav {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    font-size: 12.5px !important;
}

.proid-footer-nav-link {
    color: #64748b !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: color 0.15s ease !important;
}

.proid-footer-nav-link:hover {
    color: #0f172a !important;
    text-decoration: underline !important;
}

.proid-footer-nav-sep {
    color: #cbd5e1 !important;
}

/* ==========================================================================
   MOBILE & RESPONSIVE BEHAVIOR
   ========================================================================== */
@media (max-width: 900px) {
    .proid-header-workspace-badge {
        display: none !important;
    }
    .proid-footer-container {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .proid-footer-right {
        align-items: flex-start !important;
    }
}

@media (max-width: 640px) {
    #proid-app-header {
        height: 58px !important;
        min-height: 58px !important;
    }
    .proid-header-container {
        padding: 0 12px !important;
        gap: 6px !important;
    }
    .proid-header-right {
        gap: 6px !important;
    }
    .proid-header-logo {
        height: 28px !important;
        max-height: 28px !important;
        width: auto !important;
    }
    .proid-header-user-meta {
        display: none !important;
    }
    .proid-header-chevron {
        display: none !important;
    }
    .proid-header-user-trigger {
        padding: 2px !important;
        height: 38px !important;
        width: 38px !important;
        min-width: 38px !important;
        border-radius: 50% !important;
        justify-content: center !important;
    }
    .proid-ai-btn-text {
        display: none !important;
    }
    .proid-header-ai-btn {
        padding: 0 !important;
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        border-radius: 11px !important;
        justify-content: center !important;
    }
    .proid-header-lang-wrapper {
        padding: 0 !important;
        height: 38px !important;
    }
    .proid-header-dropdown-menu {
        width: min(310px, calc(100vw - 24px)) !important;
        right: 0 !important;
    }
}
/* ==========================================================================
   SLIDE IN / SLIDE OUT SIDEBAR & FULL-WIDTH DESKTOP WORKSPACE EXPANSION
   ========================================================================== */

/* Suppress sidebar transitions during initial page load to prevent ghost sliding */
html.proid-no-sidebar-transition .proid-spa-sidebar-col,
html.proid-no-sidebar-transition .proid-sidebar-expand-tab,
html.proid-no-sidebar-transition .proid-sidebar-backdrop {
    transition: none !important;
}

/* Topbar Sidebar Toggle Button */
.proid-header-sidebar-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    border-radius: 11px !important;
    background: rgba(241, 245, 249, 0.95) !important;
    border: 1px solid #cbd5e1 !important;
    color: #1e293b !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin-right: 2px !important;
    box-sizing: border-box !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
    outline: none !important;
}

.proid-header-sidebar-toggle:hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
}

.proid-header-sidebar-toggle.is-active {
    background: #0f172a !important;
    color: #ffffff !important;
    border-color: #0f172a !important;
}

.proid-header-sidebar-toggle:active {
    transform: scale(0.96) !important;
}

/* Dedicated Setting Button in Topbar */
.proid-header-setting-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    height: 38px !important;
    padding: 0 13px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #334155 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
    box-sizing: border-box !important;
}

.proid-header-setting-btn:hover,
.proid-header-setting-btn.is-active {
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06) !important;
}

.proid-header-setting-btn.is-active {
    background: #fef2f2 !important;
    border-color: #fca5a5 !important;
    color: #dc2626 !important;
}

.proid-header-setting-btn.is-active .proid-setting-icon-wrap {
    color: #dc2626 !important;
}

.proid-header-setting-btn:hover .proid-setting-icon-wrap svg {
    transform: rotate(45deg) !important;
}

.proid-setting-icon-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #64748b !important;
    transition: transform 0.3s ease !important;
}

.proid-header-setting-btn:hover .proid-setting-icon-wrap {
    color: #0f172a !important;
}

/* Clickable Avatar Link in User Pill */
.proid-header-avatar-wrap,
a.proid-header-avatar-link {
    cursor: pointer !important;
    transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
    text-decoration: none !important;
}

.proid-header-avatar-wrap:hover,
a.proid-header-avatar-link:hover {
    transform: scale(1.08) !important;
}

.proid-header-avatar-wrap:hover .proid-header-avatar,
a.proid-header-avatar-link:hover .proid-header-avatar {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.3) !important;
}

/* Sidebar Heading & Collapse Toggle Button */
.proid-spa-nav-heading {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 12px !important;
    margin: 10px 0 12px 0 !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
}

.proid-spa-nav-heading-left {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #475569 !important;
    letter-spacing: 0.5px !important;
}

.proid-spa-nav-count-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 5px !important;
    border-radius: 10px !important;
    background: #e2e8f0 !important;
    color: #334155 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    flex-shrink: 0 !important;
}

.proid-spa-nav-toggle-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 5px 9px !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    color: #475569 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.proid-spa-nav-toggle-btn:hover {
    background: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #dc2626 !important;
    transform: translateX(-2px) !important;
}

/* ==========================================================================
   PROID SMOOTH SIDEBAR SLIDE-IN / SLIDE-OUT (60FPS HARDWARE ACCELERATED)
   ZERO BLUR - ZERO JANK - 100% CRISP RENDERING - ZERO DEPENDENCY ON ELEMENTOR
   ========================================================================== */

/* Floating menu toggle */
.proid-sidebar-expand-tab {
    position: fixed !important;
    left: 0 !important;
    top: 140px !important;
    bottom: auto !important;
    z-index: 1000000 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 16px 10px 12px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    border: 1.5px solid rgba(255, 255, 255, 0.22) !important;
    border-radius: 0 12px 12px 0 !important;
    box-shadow: 4px 6px 20px rgba(15, 23, 42, 0.25) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transform: translate3d(0, 0, 0) !important;
    transition: transform 0.25s cubic-bezier(0.25, 1, 0.5, 1), background 0.2s ease !important;
    pointer-events: auto !important;
    opacity: 1 !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.proid-sidebar-expand-tab:hover {
    background: #dc2626 !important;
    padding-left: 15px !important;
    box-shadow: 6px 8px 24px rgba(220, 38, 38, 0.35) !important;
}

@media (min-width: 768px) {
    body:not(.proid-sidebar-collapsed) .proid-sidebar-expand-tab {
        justify-content: center !important;
        padding: 10px 12px !important;
    }

    body:not(.proid-sidebar-collapsed) .proid-sidebar-expand-tab .proid-expand-label {
        display: none !important;
    }

    /* When sidebar IS collapsed on desktop: hide label by default, reveal on hover only */
    body.proid-sidebar-collapsed .proid-sidebar-expand-tab .proid-expand-label {
        display: none !important;
        transition: display 0s;
    }
    body.proid-sidebar-collapsed .proid-sidebar-expand-tab:hover .proid-expand-label {
        display: inline !important;
    }
    body.proid-sidebar-collapsed .proid-sidebar-expand-tab {
        padding: 10px 12px !important;
    }
    body.proid-sidebar-collapsed .proid-sidebar-expand-tab:hover {
        padding: 10px 16px 10px 12px !important;
    }
}

/* Base Layout Row Container: Always a continuous flex row on Desktop */
body .proid-spa-layout-row,
body.page-id-8 .elementor-element.proid-spa-layout-row,
body.page-id-8 .elementor-element.elementor-element-4057666f > .e-con-inner {
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 1560px !important;
    margin: 0 auto !important;
    background: #ffffff !important;
    border-radius: 20px !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 10px 32px rgba(15, 23, 42, 0.06) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    gap: 0 !important;
}

/* ==========================================================================
   DESKTOP (>= 768px): SILKY SMOOTH 60FPS SLIDE-IN / SLIDE-OUT
   ========================================================================== */
@media (min-width: 768px) {
    /* Backdrop NEVER displays on desktop */
    .proid-sidebar-backdrop {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
        opacity: 0 !important;
    }

    .proid-spa-drawer-close {
        display: none !important;
    }

    /* Fixed-width Sidebar: 305px constant width prevents text reflow/wrapping jank */
    body .proid-spa-sidebar-col,
    body.page-id-8 .elementor-element.proid-spa-sidebar-col,
    body.page-id-8 .elementor-element.elementor-element-4d8b7e06 {
        width: 305px !important;
        min-width: 305px !important;
        max-width: 305px !important;
        flex: 0 0 305px !important;
        box-sizing: border-box !important;
        padding: 18px 16px !important;
        margin: 0 !important;
        margin-left: 0 !important;
        background: #ffffff !important;
        border-right: 1px solid #e2e8f0 !important;
        border-bottom: none !important;
        opacity: 1 !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        transform: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        visibility: visible !important;
        pointer-events: auto !important;
        /* Single hardware-accelerated margin-left transition: 60FPS ultra smooth */
        transition: margin-left 0.28s cubic-bezier(0.25, 1, 0.5, 1), visibility 0s !important;
        will-change: margin-left !important;
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale !important;
    }

    /* Collapsed (Slid-out) State: Sidebar tucks smoothly into the left edge */
    html.proid-sidebar-collapsed body .proid-spa-sidebar-col,
    html.proid-sidebar-collapsed body.page-id-8 .elementor-element.proid-spa-sidebar-col,
    html.proid-sidebar-collapsed body.page-id-8 .elementor-element.elementor-element-4d8b7e06,
    body.proid-sidebar-collapsed .proid-spa-sidebar-col,
    body.proid-sidebar-collapsed.page-id-8 .elementor-element.proid-spa-sidebar-col,
    body.proid-sidebar-collapsed.page-id-8 .elementor-element.elementor-element-4d8b7e06,
    body.page-id-8 .elementor-element.proid-spa-sidebar-col.is-sidebar-collapsed,
    body .proid-spa-sidebar-col.is-sidebar-collapsed {
        margin-left: -305px !important;
        width: 305px !important;
        min-width: 305px !important;
        max-width: 305px !important;
        flex: 0 0 305px !important;
        padding: 18px 16px !important;
        opacity: 1 !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        transform: none !important;
        pointer-events: none !important;
        visibility: hidden !important;
        transition: margin-left 0.28s cubic-bezier(0.25, 1, 0.5, 1), visibility 0s linear 0.28s !important;
    }

    /* Content Column: Expands dynamically to 100% width on desktop when sidebar slides out */
    body .proid-spa-content-col,
    body.page-id-8 .elementor-element.proid-spa-content-col {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: 100% !important;
        background: #f8fafc !important;
        padding: 22px 24px !important;
        box-sizing: border-box !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* ==========================================================================
   MOBILE & NARROW SCREENS (< 768px): CLEAN DRAWER (ZERO BLUR, ZERO DIMMING)
   ========================================================================== */
@media (max-width: 767px) {
    .proid-sidebar-expand-tab {
        display: inline-flex !important;
        left: 0 !important;
        top: 112px !important;
        bottom: auto !important;
    }

    body.proid-mobile-sidebar-open .proid-sidebar-expand-tab {
        justify-content: center !important;
        padding: 10px 12px !important;
    }

    body.proid-mobile-sidebar-open .proid-sidebar-expand-tab .proid-expand-label {
        display: none !important;
    }

    /* Break Elementor .e-con stacking context trap so mobile drawer is always on top & interactive */
    body .elementor-8,
    body .proid-spa-outer-sec,
    body.page-id-8 .elementor-element.proid-spa-outer-sec,
    body .proid-spa-outer-sec > .e-con-inner,
    body .proid-spa-row-wrap,
    body .proid-spa-row-wrap > .e-con-inner,
    body .proid-spa-ancestor-con {
        position: static !important;
        z-index: auto !important;
        transform: none !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        isolation: auto !important;
        contain: none !important;
    }

    body .proid-spa-outer-sec,
    body.page-id-8 .elementor-element.proid-spa-outer-sec {
        padding: 8px !important;
    }

    body .proid-spa-layout-row,
    body.page-id-8 .elementor-element.proid-spa-layout-row,
    body.page-id-8 .elementor-element.elementor-element-4057666f > .e-con-inner {
        position: static !important;
        z-index: auto !important;
        transform: none !important;
        filter: none !important;
        isolation: auto !important;
        overflow: visible !important;
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        display: block !important;
    }

    /* Fixed Drawer Sidebar on Mobile (Starts right below 60px top header, Crisp Solid White, 100% Interactive, Single Vertical Stack) */
    body .proid-spa-sidebar-col,
    body.page-id-8 .elementor-element.proid-spa-sidebar-col,
    body.page-id-8 .elementor-element.elementor-element-4d8b7e06 {
        position: fixed !important;
        top: 60px !important;
        left: 0 !important;
        bottom: 0 !important;
        width: 310px !important;
        max-width: 88vw !important;
        min-width: 0 !important;
        height: calc(100vh - 60px) !important;
        height: calc(100dvh - 60px) !important;
        z-index: 999999 !important;
        display: block !important;
        --display: block !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        --flex-direction: column !important;
        --flex-wrap: nowrap !important;
        --flex-wrap-mobile: nowrap !important;
        justify-content: flex-start !important;
        align-items: stretch !important;
        align-content: stretch !important;
        background: #ffffff !important;
        border-right: 1px solid #cbd5e1 !important;
        border-bottom: none !important;
        box-shadow: 12px 0 36px rgba(15, 23, 42, 0.18) !important;
        transform: translate3d(-105%, 0, 0) !important;
        transition: transform 0.24s cubic-bezier(0.25, 1, 0.5, 1), visibility 0.24s !important;
        margin: 0 !important;
        margin-left: 0 !important;
        opacity: 1 !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 14px 12px 28px 12px !important;
        box-sizing: border-box !important;
    }

    body .proid-spa-sidebar-col > .e-con-inner,
    body.page-id-8 .elementor-element.proid-spa-sidebar-col > .e-con-inner {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        flex-wrap: nowrap !important;
        --flex-wrap: nowrap !important;
        --flex-wrap-mobile: nowrap !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Drawer Open State */
    body.proid-mobile-sidebar-open .proid-spa-sidebar-col,
    body.page-id-8.proid-mobile-sidebar-open .elementor-element.proid-spa-sidebar-col,
    body.page-id-8.proid-mobile-sidebar-open .elementor-element.elementor-element-4d8b7e06 {
        transform: translate3d(0, 0, 0) !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    body.proid-mobile-sidebar-open .proid-spa-sidebar-col *,
    body.page-id-8.proid-mobile-sidebar-open .elementor-element.proid-spa-sidebar-col * {
        pointer-events: auto !important;
    }

    /* Guarantee all navigation items inside mobile drawer are visible and stacked vertically */
    body .proid-spa-sidebar-col .elementor-widget-jet-engine-profile-menu,
    body.page-id-8 .proid-spa-sidebar-col .elementor-widget-jet-engine-profile-menu,
    body.page-id-8 .elementor-element.elementor-element-b97702d,
    body .proid-spa-sidebar-col .elementor-widget-jet-engine-profile-menu > .elementor-widget-container,
    body.page-id-8 .elementor-element.elementor-element-b97702d > .elementor-widget-container {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    body .proid-spa-sidebar-col .jet-profile-menu,
    body.page-id-8 .proid-spa-sidebar-col .jet-profile-menu,
    body.page-id-8 .elementor-element.elementor-element-b97702d .jet-profile-menu {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 9px !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    body .proid-spa-sidebar-col .jet-profile-menu__item,
    body.page-id-8 .proid-spa-sidebar-col .jet-profile-menu__item,
    body.page-id-8 .elementor-element.elementor-element-b97702d .jet-profile-menu__item {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        opacity: 1 !important;
        visibility: visible !important;
        box-sizing: border-box !important;
    }

    body .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item-link,
    body.page-id-8 .proid-spa-sidebar-col .jet-profile-menu .jet-profile-menu__item-link,
    body.page-id-8 .elementor-element.elementor-element-b97702d .jet-profile-menu__item-link {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 50px !important;
        padding: 10px 12px !important;
        gap: 11px !important;
        font-size: 14.5px !important;
        opacity: 1 !important;
        visibility: visible !important;
        box-sizing: border-box !important;
    }

    /* Compact Mobile Drawer Header & Heading so nothing overflows horizontally */
    #proid-spa-sidebar-header {
        width: 100% !important;
        max-width: 100% !important;
        padding: 12px 12px !important;
        margin: 0 0 10px 0 !important;
        gap: 8px !important;
        box-sizing: border-box !important;
    }

    .proid-spa-user-meta {
        gap: 9px !important;
        min-width: 0 !important;
        flex: 1 1 0% !important;
    }

    .proid-spa-user-avatar {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        font-size: 15px !important;
    }

    .proid-spa-badge {
        padding: 4px 8px !important;
        font-size: 9.5px !important;
    }

    .proid-spa-nav-heading {
        width: 100% !important;
        max-width: 100% !important;
        padding: 8px 10px !important;
        margin: 0 0 10px 0 !important;
        gap: 6px !important;
        box-sizing: border-box !important;
    }

    .proid-spa-nav-heading-left {
        gap: 6px !important;
        font-size: 11px !important;
        letter-spacing: 0.02em !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
        white-space: nowrap !important;
    }

    .proid-spa-nav-toggle-btn {
        padding: 4px 8px !important;
        font-size: 11px !important;
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }

    /* Mobile Close Button (✕) in Drawer Header */
    .proid-spa-drawer-close {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        flex-shrink: 0 !important;
        border-radius: 8px !important;
        background: rgba(255, 255, 255, 0.15) !important;
        border: 1px solid rgba(255, 255, 255, 0.25) !important;
        color: #ffffff !important;
        cursor: pointer !important;
        padding: 0 !important;
        margin-left: 4px !important;
        transition: background 0.18s ease !important;
    }

    .proid-spa-drawer-close:hover {
        background: rgba(220, 38, 38, 0.85) !important;
        border-color: #dc2626 !important;
    }

    /* Completely disable backdrop overlay so screen is NEVER dimmed/blurred or blocked */
    .proid-sidebar-backdrop,
    body.proid-mobile-sidebar-open .proid-sidebar-backdrop {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        filter: none !important;
    }

    /* Content Column on Mobile */
    body .proid-spa-content-col,
    body.page-id-8 .elementor-element.proid-spa-content-col {
        width: 100% !important;
        max-width: 100% !important;
        background: #ffffff !important;
        border-radius: 16px !important;
        border: 1px solid #cbd5e1 !important;
        box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05) !important;
        padding: 14px 12px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .proid-setting-btn-text {
        display: none !important;
    }

    .proid-header-setting-btn {
        padding: 0 !important;
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        border-radius: 11px !important;
        justify-content: center !important;
    }

    .proid-header-lang-btn {
        height: 38px !important;
        padding: 0 9px !important;
        gap: 4px !important;
        border-radius: 11px !important;
    }

    .proid-lang-active-code {
        font-size: 11.5px !important;
    }

    .proid-lang-dropdown {
        right: 0 !important;
        width: 195px !important;
        min-width: 195px !important;
    }
}


/* ==========================================================================
   PROID NATIVE ADMIN MODALS & FORMS (ZERO ELEMENTOR DEPENDENCY)
   ========================================================================== */
.proid-native-modal-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999999 !important;
    background: rgba(15, 23, 42, 0.75) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    box-sizing: border-box !important;
    animation: pnmFadeIn 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

@keyframes pnmFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.proid-native-modal-box {
    position: relative !important;
    background: #ffffff !important;
    border-radius: 20px !important;
    box-shadow: 0 25px 60px rgba(15, 23, 42, 0.35) !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    width: 100% !important;
    max-width: 520px !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    animation: pnmScaleIn 0.26s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.proid-native-modal-box.pnm-box-lg {
    max-width: 680px !important;
}

@keyframes pnmScaleIn {
    from { transform: scale(0.94) translateY(12px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}

.pnm-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 18px 22px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    background: #f8fafc !important;
    border-radius: 20px 20px 0 0 !important;
}

.pnm-header-danger {
    background: #fef2f2 !important;
    border-bottom-color: #fee2e2 !important;
}

.pnm-title {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.2px !important;
}

.pnm-close {
    background: transparent !important;
    border: none !important;
    font-size: 26px !important;
    line-height: 1 !important;
    color: #94a3b8 !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin: 0 !important;
    transition: color 0.15s ease !important;
}

.pnm-close:hover {
    color: #0f172a !important;
}

.pnm-form {
    padding: 22px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.pnm-field {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.pnm-field label {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
}

.pnm-desc {
    font-size: 13.5px !important;
    line-height: 1.5 !important;
    color: #64748b !important;
    background: #f8fafc !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
    border: 1px solid #e2e8f0 !important;
}

.pnm-hint {
    font-size: 12px !important;
    color: #64748b !important;
    line-height: 1.4 !important;
    margin-top: 3px !important;
}

.pnm-input,
.pnm-select,
.pnm-textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 14px !important;
    border-radius: 10px !important;
    border: 1.5px solid #cbd5e1 !important;
    background: #ffffff !important;
    font-family: inherit !important;
    font-size: 14px !important;
    color: #0f172a !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.pnm-input:focus,
.pnm-select:focus,
.pnm-textarea:focus {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15) !important;
}

.pnm-readonly {
    background: #f1f5f9 !important;
    color: #64748b !important;
    cursor: not-allowed !important;
    border-color: #e2e8f0 !important;
}

.pnm-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    margin-top: 8px !important;
    padding-top: 14px !important;
    border-top: 1px solid #f1f5f9 !important;
}

.pnm-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 42px !important;
    padding: 0 20px !important;
    border-radius: 10px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
    border: none !important;
    outline: none !important;
}

.pnm-btn-cancel {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
}

.pnm-btn-cancel:hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
}

.pnm-btn-primary {
    background: #dc2626 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25) !important;
}

.pnm-btn-primary:hover {
    background: #b91c1c !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(220, 38, 38, 0.35) !important;
}

.pnm-btn-danger {
    background: #991b1b !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(153, 27, 27, 0.3) !important;
}

.pnm-btn-danger:hover {
    background: #7f1d1d !important;
    transform: translateY(-1px) !important;
}

/* Toast Notification */
.pnm-toast {
    position: fixed !important;
    bottom: 24px !important;
    right: 24px !important;
    z-index: 999999999 !important;
    display: none;
    padding: 14px 22px !important;
    border-radius: 12px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25) !important;
    max-width: 450px !important;
    line-height: 1.4 !important;
}

.pnm-toast-success {
    background: #059669 !important;
    border: 1px solid #10b981 !important;
}

.pnm-toast-error {
    background: #dc2626 !important;
    border: 1px solid #ef4444 !important;
}


/* === PROID ROW VIEW SAFETY OVERRIDES === */
@media (min-width: 769px) {
  /* 1 Cột duy nhất trên desktop khi ở chế độ Row View: Mỗi một thẻ là một hàng */
  html.proid-cards-row-view .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-75 .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-75 .elementor-element .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .elementor-412014 .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view #admin_listing .jet-listing-grid__items,
  body.proid-cards-row-view #user_listing_2 .jet-listing-grid__items,
  .jet-listing-grid.proid-view-row > .jet-listing-grid__items {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Mỗi thẻ chiếm 100% chiều rộng dòng */
  html.proid-cards-row-view .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-75 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-75 .elementor-element .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view .elementor-412014 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
  body.proid-cards-row-view #admin_listing .jet-listing-grid__item,
  body.proid-cards-row-view #user_listing_2 .jet-listing-grid__item,
  .jet-listing-grid.proid-view-row > .jet-listing-grid__items > .jet-listing-grid__item {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex: 1 1 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Khung thẻ 100% bề rộng hàng */
  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-9fb6348,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-9fb6348,
  .jet-listing-grid.proid-view-row .elementor-394869 .elementor-element.elementor-element-9fb6348,
  body.proid-cards-row-view .jet-listing-grid--394869 .elementor-element-9fb6348,
  html.proid-cards-row-view .elementor-331823 .elementor-element.elementor-element-a1b4b01,
  body.proid-cards-row-view .elementor-331823 .elementor-element.elementor-element-a1b4b01,
  .jet-listing-grid.proid-view-row .elementor-331823 .elementor-element.elementor-element-a1b4b01,
  body.proid-cards-row-view .jet-listing-grid--331823 .elementor-element-a1b4b01 {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    --width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    padding: 14px 20px !important;
    min-height: 112px !important;
    height: auto !important;
    border-radius: 16px !important;
    border: 1px solid #e2e8f0 !important;
    background: #ffffff !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04) !important;
    gap: 22px !important;
    position: relative !important;
    box-sizing: border-box !important;
  }

  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-9fb6348.is-proid-admin-card,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-9fb6348.is-proid-admin-card,
  .jet-listing-grid.proid-view-row .elementor-394869 .elementor-element.elementor-element-9fb6348.is-proid-admin-card,
  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-9fb6348:has(.proid-card-bio[data-is-admin="1"]),
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-9fb6348:has(.proid-card-bio[data-is-admin="1"]) {
    border: 1.5px solid #f59e0b !important;
    background: linear-gradient(90deg, #fffbeb 0%, #fffdf7 24%, #ffffff 55%) !important;
    box-shadow: 0 4px 16px rgba(245, 158, 11, 0.12) !important;
    animation: none !important;
  }

  /* Column 1: Hide Cover Banner (6b6eb14) completely & show ONLY Circular Avatar (cc4473e) */
  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-5228667,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-5228667,
  .jet-listing-grid.proid-view-row .elementor-394869 .elementor-element.elementor-element-5228667 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 82px !important;
    min-width: 82px !important;
    max-width: 82px !important;
    flex: 0 0 82px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html.proid-cards-row-view body .jet-listing-grid .elementor-394869 .elementor-element.elementor-element-6b6eb14,
  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-6b6eb14,
  body.proid-cards-row-view .jet-listing-grid .elementor-394869 .elementor-element.elementor-element-6b6eb14,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-6b6eb14,
  .jet-listing-grid.proid-view-row .elementor-394869 .elementor-element.elementor-element-6b6eb14 {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
  }

  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e,
  .jet-listing-grid.proid-view-row .elementor-394869 .elementor-element.elementor-element-cc4473e {
    width: 76px !important;
    height: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
    margin: 0 auto !important;
  }

  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e > .elementor-widget-container,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e > .elementor-widget-container,
  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e a,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e a,
  html.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e img,
  body.proid-cards-row-view .elementor-394869 .elementor-element.elementor-element-cc4473e img {
    width: 76px !important;
    height: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
    border-radius: 50% !important;
  }

  /* High-visibility Language Switcher Pill Bar in Row View */
  html.proid-cards-row-view .elementor-394869 .proid-row-top-bar,
  body.proid-cards-row-view .elementor-394869 .proid-row-top-bar {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 0 7px 0 !important;
    width: 100% !important;
  }

  html.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher,
  body.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher {
    position: static !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 3.5px 5px !important;
    margin: 0 !important;
    background: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.05) !important;
    gap: 4px !important;
  }

  html.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn,
  body.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn {
    height: 27px !important;
    min-height: 27px !important;
    padding: 0 10px !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    gap: 5px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    opacity: 1 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  }

  html.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn:not(:last-child)::after,
  body.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn:not(:last-child)::after {
    display: none !important;
    content: none !important;
  }

  html.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn.is-active,
  body.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn.is-active {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    border: 1px solid #1d4ed8 !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    box-shadow: 0 3px 8px rgba(37, 99, 235, 0.32) !important;
    opacity: 1 !important;
  }

  html.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn.is-active span,
  body.proid-cards-row-view .elementor-394869 .proid-row-lang-switcher .proid-lang-btn.is-active span {
    color: #ffffff !important;
  }
}

/* ==========================================================================
   7. BULK CARD EDITOR (/account/sua-the-hang-loat/ - Template 416058) BUTTON FIXES
   ========================================================================== */
.elementor-416058 .elementor-element.elementor-element-106352ac {
  --padding-top: 0px !important;
  --padding-bottom: 0px !important;
  --padding-left: 0px !important;
  --padding-right: 0px !important;
  --margin-top: 0px !important;
  --margin-bottom: 0px !important;
  --margin-left: 0px !important;
  --margin-right: 0px !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

.proid-bulk-editor-wrapper .proid-sheet-btn,
.elementor-kit-5 .proid-bulk-editor-wrapper button.proid-sheet-btn {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  gap: 6px !important;
  height: 36px !important;
  padding: 0 14px !important;
  margin: 0 !important;
  border-radius: 9px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-indent: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.proid-bulk-editor-wrapper:not(.is-fullscreen) #proid-close-fullscreen {
  display: none !important;
}

.proid-bulk-editor-wrapper.is-fullscreen #proid-toggle-fullscreen {
  display: none !important;
}

.proid-bulk-editor-wrapper.is-fullscreen #proid-close-fullscreen {
  display: inline-flex !important;
}

.proid-bulk-editor-wrapper .proid-sheet-group-tabs {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 10px 16px !important;
  overflow: visible !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.proid-bulk-editor-wrapper .proid-group-tab,
.elementor-kit-5 .proid-bulk-editor-wrapper button.proid-group-tab {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  height: 33px !important;
  padding: 0 13px !important;
  margin: 0 !important;
  gap: 5px !important;
  border-radius: 8px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-indent: 0 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
   8. RESPONSIVE CARD GRID LAYOUT (AUTO-ADAPTS, NEVER CLIPS OR OVERFLOWS)
   ========================================================================== */
/* Wide Screens (>= 1440px): 3 Columns with Sidebar Open */
@media (min-width: 1440px) {
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid.jet-listing-grid--394869:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items.jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #admin_listing .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #user_listing_2 .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-412014 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .proid-spa-content-col .jet-listing-grid:not(.proid-view-row):not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items,
  body.proid-cards-grid-view .jet-listing-grid:not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    gap: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Intermediate Laptop / Desktop (768px - 1439px): Auto-fill (290px) prevents 3rd column clipping */
@media (min-width: 768px) and (max-width: 1439px) {
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid.jet-listing-grid--394869:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items.jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #admin_listing .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #user_listing_2 .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-412014 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .proid-spa-content-col .jet-listing-grid:not(.proid-view-row):not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items,
  body.proid-cards-grid-view .jet-listing-grid:not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)) !important;
    justify-content: stretch !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Sidebar Collapsed: 4 Columns on screens >= 1200px */
@media (min-width: 1200px) {
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid.jet-listing-grid--394869:not(.proid-view-row) > .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items.jet-listing-grid--394869,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid--394869,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #admin_listing .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #user_listing_2 .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-412014 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html.proid-sidebar-collapsed:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .proid-spa-content-col .jet-listing-grid:not(.proid-view-row):not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .jet-listing-grid.jet-listing-grid--394869:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items.jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) #admin_listing .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) #user_listing_2 .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .elementor-412014 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body.proid-sidebar-collapsed:not(.proid-cards-row-view) .proid-spa-content-col .jet-listing-grid:not(.proid-view-row):not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items,
  body.proid-sidebar-collapsed.proid-cards-grid-view .jet-listing-grid:not(.elementor-element-4d2ef28e):not(.jet-listing-grid--377966) > .jet-listing-grid__items {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 18px !important;
  }
}

/* Card Grid Item & Root: Clean 100% fill without min-width overflow */
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items > .jet-listing-grid__item,
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #admin_listing .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items > .jet-listing-grid__item,
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) #user_listing_2 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items > .jet-listing-grid__item,
body.proid-cards-grid-view .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  overflow: hidden !important;
  position: relative !important;
  box-sizing: border-box !important;
}

html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid--394869 .elementor-394869,
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869,
body.proid-cards-grid-view .elementor-394869 {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-9fb6348,
body.proid-cards-grid-view .elementor-394869 .elementor-element.elementor-element-9fb6348 {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  --width: 100% !important;
  height: 100% !important;
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  box-sizing: border-box !important;
}

.elementor-394869 .proid-card-code-box {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

.elementor-394869 .proid-code-info {
  flex: 1 1 0% !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.elementor-394869 .proid-code-label,
.elementor-394869 .proid-code-value {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (min-width: 768px) and (max-width: 1024px) {
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid.jet-listing-grid--394869:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items.jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-412014 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .proid-spa-content-col .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  body.proid-cards-grid-view .jet-listing-grid > .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 767px) {
  html body .jet-listing-grid.jet-listing-grid--394869 > .jet-listing-grid__items,
  html body .jet-listing-grid > .jet-listing-grid__items.jet-listing-grid--394869,
  html body .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid > .jet-listing-grid__items,
  html body .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid > .jet-listing-grid__items,
  html body .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid > .jet-listing-grid__items,
  html body .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid > .jet-listing-grid__items,
  html body .elementor-412014 .jet-listing-grid > .jet-listing-grid__items,
  html body .proid-spa-content-col .jet-listing-grid > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid.jet-listing-grid--394869:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items.jet-listing-grid--394869,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-a7b8f03 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-1805b02 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-6c78d1f .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-75 .elementor-element.elementor-element-166fe72 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-412014 .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .proid-spa-content-col .jet-listing-grid:not(.proid-view-row) > .jet-listing-grid__items,
  body.proid-cards-grid-view .jet-listing-grid > .jet-listing-grid__items,
  body.proid-cards-row-view .jet-listing-grid > .jet-listing-grid__items,
  #admin_listing .jet-listing-grid__items,
  #user_listing_2 .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  html body .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 1 1 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .proid-view-mode-bar,
  .proid-view-mode-group {
    display: none !important;
  }
}

/* ==========================================================================
   9. COMPACT SINGLE-ROW FILTER BAR OPTIMIZATION (SEARCH + SORT + FILTER)
   ========================================================================== */
/* Extra breathing room at bottom so floating action button (FAB) never obstructs card actions */
html body .proid-spa-content-col {
  padding-bottom: 90px !important;
}

@media (min-width: 768px) {
  /* Force dedicated filter parent containers into a sleek single horizontal row on Desktop */
  html body .elementor-75 .elementor-element.elementor-element-5260cab,
  html body .elementor-75 .elementor-element.elementor-element-5260cab > .e-con-inner,
  html body .elementor-412014 .elementor-element.elementor-element-71eb3111,
  html body .elementor-412014 .elementor-element.elementor-element-71eb3111 > .e-con-inner,
  html body .elementor-378244 .elementor-element.elementor-element-76b4627,
  html body .elementor-378244 .elementor-element.elementor-element-76b4627 > .e-con-inner,
  html body .proid-filter-bar-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Outer filter container card styling */
  html body .elementor-75 .elementor-element.elementor-element-5260cab,
  html body .elementor-412014 .elementor-element.elementor-element-71eb3111,
  html body .elementor-378244 .elementor-element.elementor-element-76b4627,
  html body .proid-filter-bar-wrapper {
    padding: 12px 16px !important;
    margin: 0 0 16px 0 !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
  }

  /* Child filter widgets inside the horizontal row: share width evenly on 1 line */
  html body .elementor-75 .elementor-element.elementor-element-5260cab .elementor-widget-jet-smart-filters-search,
  html body .elementor-412014 .elementor-element.elementor-element-71eb3111 .elementor-widget-jet-smart-filters-search,
  html body .elementor-378244 .elementor-element.elementor-element-76b4627 .elementor-widget-jet-smart-filters-search,
  html body .proid-filter-bar-wrapper .elementor-widget-jet-smart-filters-search {
    flex: 1.15 1 0% !important;
    width: auto !important;
    max-width: none !important;
    min-width: 180px !important;
    --container-widget-width: auto !important;
    --container-widget-flex-grow: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body .elementor-75 .elementor-element.elementor-element-5260cab .elementor-widget-jet-smart-filters-sorting,
  html body .elementor-412014 .elementor-element.elementor-element-71eb3111 .elementor-widget-jet-smart-filters-sorting,
  html body .elementor-378244 .elementor-element.elementor-element-76b4627 .elementor-widget-jet-smart-filters-sorting,
  html body .proid-filter-bar-wrapper .elementor-widget-jet-smart-filters-sorting,
  html body .proid-filter-bar-wrapper .elementor-widget-jet-smart-filters-select {
    flex: 0.85 1 0% !important;
    width: auto !important;
    max-width: 280px !important;
    min-width: 155px !important;
    --container-widget-width: auto !important;
    --container-widget-flex-grow: 0.85 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Parent container 377ead9 (Admin/Daily view) and 0f288c5: MUST NOT be flex-row nowrap!
     It houses BOTH the filter bar and the card listing grid in a clean vertical stack. */
  html body .elementor-75 .elementor-element.elementor-element-377ead9,
  html body .elementor-75 .elementor-element.elementor-element-377ead9 > .e-con-inner,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5 > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 16px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Parent mixed containers: ALWAYS clean vertical column stack */
  html body .elementor-75 .elementor-element.elementor-element-377ead9,
  html body .elementor-75 .elementor-element.elementor-element-377ead9 > .e-con-inner,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5 > .e-con-inner,
  html body .elementor-257642 .elementor-element.elementor-element-2413ff50,
  html body .elementor-257642 .elementor-element.elementor-element-2413ff50 > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 16px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Listing grids inside mixed containers ALWAYS span full 100% width on their own line */
  html body .elementor-75 .elementor-element.elementor-element-377ead9 > .e-con-inner > .elementor-widget-jet-listing-grid,
  html body .elementor-75 .elementor-element.elementor-element-377ead9 > .e-con-inner > .elementor-widget-button,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5 > .e-con-inner > .elementor-widget-jet-listing-grid,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5 > .e-con-inner > .elementor-widget-button,
  html body .elementor-257642 .elementor-element.elementor-element-2413ff50 > .e-con-inner > .elementor-widget-jet-listing-grid,
  html body .elementor-257642 .elementor-element.elementor-element-2413ff50 > .e-con-inner > .elementor-widget-button:not(.elementor-element-a4d70e9):not(.elementor-element-8b6ad48) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex: 1 1 100% !important;
    margin-top: 14px !important;
    box-sizing: border-box !important;
  }
}

/* Unified sleek inputs, labels & buttons inside JetSmartFilters (Desktop & Mobile) */
html body .proid-spa-content-col .jet-filter-label,
html body .elementor-75 .jet-filter-label,
html body .elementor-412014 .jet-filter-label,
html body .elementor-378244 .jet-filter-label,
html body .elementor-395429 .jet-filter-label {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #475569 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  margin: 0 0 5px 0 !important;
  padding: 0 !important;
  line-height: 1.25 !important;
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body .proid-spa-content-col .jet-smart-filters-search .jet-search-filter,
html body .elementor-75 .jet-smart-filters-search .jet-search-filter,
html body .elementor-412014 .jet-smart-filters-search .jet-search-filter,
html body .elementor-378244 .jet-smart-filters-search .jet-search-filter,
html body .elementor-395429 .jet-smart-filters-search .jet-search-filter {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 6px !important;
  width: 100% !important;
}

html body .proid-spa-content-col .jet-search-filter__input-wrapper,
html body .elementor-75 .jet-search-filter__input-wrapper,
html body .elementor-412014 .jet-search-filter__input-wrapper,
html body .elementor-378244 .jet-search-filter__input-wrapper,
html body .elementor-395429 .jet-search-filter__input-wrapper {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
}

html body .proid-spa-content-col .jet-search-filter__input,
html body .proid-spa-content-col .jet-sorting-select,
html body .proid-spa-content-col .jet-select__control,
html body .elementor-75 .jet-search-filter__input,
html body .elementor-75 .jet-sorting-select,
html body .elementor-75 .jet-select__control,
html body .elementor-412014 .jet-search-filter__input,
html body .elementor-412014 .jet-sorting-select,
html body .elementor-378244 .jet-search-filter__input,
html body .elementor-378244 .jet-sorting-select,
html body .elementor-395429 .jet-search-filter__input,
html body .elementor-395429 .jet-select__control {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 11px !important;
  margin: 0 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #0f172a !important;
  background-color: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 9px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

html body .proid-spa-content-col .jet-search-filter__input:focus,
html body .proid-spa-content-col .jet-sorting-select:focus,
html body .proid-spa-content-col .jet-select__control:focus,
html body .elementor-75 .jet-search-filter__input:focus,
html body .elementor-75 .jet-sorting-select:focus {
  background-color: #ffffff !important;
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
  outline: none !important;
}

html body .proid-spa-content-col .jet-search-filter__submit,
html body .elementor-75 .jet-search-filter__submit,
html body .elementor-412014 .jet-search-filter__submit,
html body .elementor-378244 .jet-search-filter__submit,
html body .elementor-395429 .jet-search-filter__submit {
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 12px !important;
  margin: 0 !important;
  border-radius: 9px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
}

@media (max-width: 767px) {
  html body .elementor-75 .elementor-element.elementor-element-5260cab,
  html body .elementor-412014 .elementor-element.elementor-element-71eb3111,
  html body .elementor-378244 .elementor-element.elementor-element-76b4627,
  html body .proid-filter-bar-wrapper {
    display: flex !important;
    flex-direction: column !important;
    padding: 12px !important;
    margin: 0 0 14px 0 !important;
    gap: 10px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }

  html body .proid-filter-bar-wrapper .elementor-widget-jet-smart-filters-search,
  html body .proid-filter-bar-wrapper .elementor-widget-jet-smart-filters-sorting,
  html body .proid-filter-bar-wrapper .elementor-widget-jet-smart-filters-select {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
  }

  html body .elementor-75 .elementor-element.elementor-element-377ead9,
  html body .elementor-75 .elementor-element.elementor-element-377ead9 > .e-con-inner,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5,
  html body .elementor-378244 .elementor-element.elementor-element-0f288c5 > .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }
}

/* ==========================================================================
   10. PROID PRODUCT CREATION & EDIT FORM REDESIGN & MULTI-LANG 1-ROW BAR
   ========================================================================== */
.elementor-264590 .elementor-element.elementor-element-b6d6368 p,
.elementor-11144 .elementor-element.elementor-element-66e2f73e p {
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  border-left: 4px solid #2563eb !important;
  color: #1e40af !important;
  padding: 12px 18px !important;
  border-radius: 12px !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  margin: 0 0 20px 0 !important;
  display: block !important;
  font-weight: 500 !important;
  box-sizing: border-box !important;
}

.elementor-264590 .elementor-element.elementor-element-b6d6368 p::before,
.elementor-11144 .elementor-element.elementor-element-66e2f73e p::before {
  content: "ℹ️";
  font-size: 15px;
  margin-right: 8px;
  display: inline-block;
  vertical-align: -1px;
}

.proid-form-wrapper .proid-lang-group-container {
  width: 100% !important;
  margin-top: 14px !important;
}

.proid-form-wrapper .proid-lang-nav {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 6px !important;
  background: #f1f5f9 !important;
  padding: 5px !important;
  border-radius: 12px !important;
  margin-bottom: 20px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.proid-form-wrapper .proid-lang-pill {
  flex: 1 1 0% !important;
  white-space: nowrap !important;
  text-align: center !important;
  justify-content: center !important;
  padding: 8px 10px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.2, 1, 0.3, 1) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  text-transform: uppercase !important;
  border: none !important;
  background: transparent !important;
  color: #475569 !important;
  outline: none !important;
}

.proid-form-wrapper .proid-lang-pill:hover {
  background: rgba(255, 255, 255, 0.8) !important;
  color: #dc2626 !important;
}

.proid-form-wrapper .proid-lang-pill.is-active {
  background: #dc2626 !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.35) !important;
}

.proid-form-wrapper .proid-input-text,
.proid-form-wrapper .proid-textarea {
  width: 100% !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  padding: 10px 14px !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}

.proid-form-wrapper .proid-input-text:focus,
.proid-form-wrapper .proid-textarea:focus {
  background: #ffffff !important;
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12) !important;
  outline: none !important;
}

.proid-form-wrapper .proid-sticky-bar {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 9999 !important;
  background: #ffffff !important;
  border-top: 1px solid #e2e8f0 !important;
  box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.06) !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-radius: 0 0 16px 16px !important;
  margin-top: 24px !important;
}

.proid-form-wrapper .proid-btn-submit-main {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 11px 24px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  cursor: pointer !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  box-shadow: 0 4px 14px rgba(220, 38, 38, 0.3) !important;
}

.proid-form-wrapper .proid-btn-submit-main:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(220, 38, 38, 0.4) !important;
}





/* ==========================================================================
   PROID PRODUCT ROW & GRID VIEW (HIỂN THỊ SẢN PHẨM HÀNG NGANG & LƯỚI)
   Template 11093 | Grid: .jet-listing-grid--11093 | Page: .elementor-264633
   ========================================================================== */

/* --- 1. PRODUCT ROW VIEW: LISTING CONTAINER --- */
html.proid-cards-row-view .jet-listing-grid--11093.proid-view-row > .jet-listing-grid__items,
body.proid-cards-row-view .jet-listing-grid--11093.proid-view-row > .jet-listing-grid__items,
.elementor-264633 .jet-listing-grid.proid-view-row > .jet-listing-grid__items,
html.proid-cards-row-view .elementor-264633 .jet-listing-grid > .jet-listing-grid__items,
body.proid-cards-row-view .elementor-264633 .jet-listing-grid > .jet-listing-grid__items,
.jet-listing-grid--11093.proid-view-row > .jet-listing-grid__items {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
}

/* --- 2. PRODUCT ROW VIEW: EACH PRODUCT ITEM --- */
html.proid-cards-row-view .jet-listing-grid--11093.proid-view-row > .jet-listing-grid__items > .jet-listing-grid__item,
body.proid-cards-row-view .jet-listing-grid--11093.proid-view-row > .jet-listing-grid__items > .jet-listing-grid__item,
.elementor-264633 .jet-listing-grid.proid-view-row > .jet-listing-grid__items > .jet-listing-grid__item,
html.proid-cards-row-view .elementor-264633 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
body.proid-cards-row-view .elementor-264633 .jet-listing-grid > .jet-listing-grid__items > .jet-listing-grid__item,
.jet-listing-grid--11093.proid-view-row > .jet-listing-grid__items > .jet-listing-grid__item {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  flex: 1 1 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* --- 3. PRODUCT ROW VIEW: ROOT CARD CONTAINER (Template 11093) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d,
body.proid-cards-row-view .jet-listing-grid--11093 .elementor-element-305677d,
.jet-listing-grid--11093.proid-view-row .elementor-element-305677d {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  --width: 100% !important;
  --content-width: 100% !important;
  --container-widget-width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  padding: 12px 20px !important;
  min-height: 84px !important;
  height: auto !important;
  border-radius: 14px !important;
  border: 1px solid #e2e8f0 !important;
  background: #ffffff !important;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04) !important;
  gap: 16px !important;
  position: relative !important;
  box-sizing: border-box !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d:hover,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d:hover,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d:hover,
.jet-listing-grid--11093.proid-view-row .elementor-element-305677d:hover {
  border-color: #3b82f6 !important;
  box-shadow: 0 8px 24px rgba(59, 130, 246, 0.12) !important;
  transform: translateY(-1px) !important;
}

/* --- 4. INNER CONTAINER (Override Grid to Horizontal Flex Row) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
}

/* --- 5. HIDDEN UTILITY HEADING (1d9912e) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-1d9912e,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-1d9912e,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-1d9912e,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-1d9912e {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* --- 6. PRODUCT THUMBNAIL (25a0b60) - Compact 64x64px, NO 800px Blowup --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 {
  grid-column: auto !important;
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  flex: 0 0 64px !important;
  order: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  aspect-ratio: auto !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 img {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  border-radius: 10px !important;
  display: block !important;
  margin: 0 !important;
  transform: none !important;
}

/* --- 7. PRODUCT TITLE (e54f0ce) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce {
  grid-column: auto !important;
  flex: 1 1 auto !important;
  order: 2 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title {
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  min-height: auto !important;
}

/* --- 8. PRODUCT PRICE (259a88e) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-259a88e,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-259a88e {
  grid-column: auto !important;
  flex: 0 0 auto !important;
  order: 3 !important;
  margin: 0 8px 0 0 !important;
  padding: 0 !important;
  text-align: right !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e .jet-listing-dynamic-field__content,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e .jet-listing-dynamic-field__content,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-259a88e .jet-listing-dynamic-field__content,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-259a88e .jet-listing-dynamic-field__content {
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #ad2f29 !important;
  background: #fdf2f2 !important;
  padding: 5px 12px !important;
  border-radius: 8px !important;
  border: 1px solid #fed7d7 !important;
  white-space: nowrap !important;
  display: inline-block !important;
}

/* --- 9. EDIT LINK BUTTON (0f53d7e) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e {
  grid-column: auto !important;
  flex: 0 0 auto !important;
  order: 4 !important;
  margin: 0 !important;
  margin-left: auto !important;
  width: auto !important;
  align-self: center !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link {
  width: auto !important;
  display: inline-flex !important;
  margin: 0 !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link {
  width: auto !important;
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  background: #0f172a !important;
  color: #ffffff !important;
  border: 1px solid #0f172a !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12) !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link:hover,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link:hover,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link:hover,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link:hover {
  background: #1e293b !important;
  border-color: #1e293b !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.2) !important;
}

/* --- 10. DELETE LINK BUTTON (7cdd13e) --- */
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e {
  grid-column: auto !important;
  flex: 0 0 auto !important;
  order: 5 !important;
  margin: 0 !important;
  width: auto !important;
  align-self: center !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link {
  width: auto !important;
  display: inline-flex !important;
  margin: 0 !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link {
  width: auto !important;
  height: 36px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  background: #fef2f2 !important;
  color: #dc2626 !important;
  border: 1px solid #fee2e2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: 0 1px 3px rgba(220, 38, 38, 0.05) !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link:hover,
body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link:hover,
.jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link:hover,
.jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link:hover {
  background: #dc2626 !important;
  color: #ffffff !important;
  border-color: #dc2626 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 10px rgba(220, 38, 38, 0.22) !important;
}

html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link:hover .jet-listing-dynamic-link__icon :is(svg, path, i),
html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link:hover .jet-listing-dynamic-link__label {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* --- 11. MOBILE & RESPONSIVE BEHAVIOR FOR PRODUCT LISTING (Template 11093) --- */
@media (max-width: 768px) {
  /* A. ROW VIEW ON MOBILE: Each product takes 100% full width, sleek horizontal flex row */
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d {
    width: 100% !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05) !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
  }

  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Thumbnail 56x56 in Row View */
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 {
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    flex: 0 0 56px !important;
    order: 1 !important;
    margin: 0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
  }

  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container,
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-25a0b60 img {
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    border-radius: 10px !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
  }

  /* Title in Row View: takes middle space, clamped to 2 lines */
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    order: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 1.35 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    margin: 0 !important;
    min-height: auto !important;
  }

  /* Price in Row View */
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-259a88e,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-259a88e {
    order: 3 !important;
    flex: 0 0 auto !important;
    margin: 0 6px 0 0 !important;
  }

  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e .jet-listing-dynamic-field__content,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-259a88e .jet-listing-dynamic-field__content {
    font-size: 12px !important;
    padding: 3px 8px !important;
  }

  /* Buttons SỬA & XÓA in Row View: on the right */
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-0f53d7e {
    order: 4 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    margin-left: auto !important;
    width: auto !important;
  }

  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e,
  .jet-listing-grid.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e,
  .jet-listing-grid--11093.proid-view-row .elementor-11093 .elementor-element.elementor-element-7cdd13e {
    order: 5 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    width: auto !important;
  }

  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
  html.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
  body.proid-cards-row-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link {
    height: 32px !important;
    padding: 0 10px !important;
    font-size: 11px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
  }

  /* B. GRID VIEW ON MOBILE: Clean 2-column e-commerce cards with full square image on top */
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-305677d,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-305677d {
    padding: 10px !important;
    border-radius: 14px !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-305677d > .e-con-inner {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto 1fr auto !important;
    gap: 8px !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-25a0b60,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-25a0b60 {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: 0 !important;
    flex: none !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-25a0b60 img,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-25a0b60 .elementor-widget-container,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-25a0b60 img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 10px !important;
    display: block !important;
    margin: 0 !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-e54f0ce,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-e54f0ce {
    grid-column: 1 / -1 !important;
    margin: 4px 0 2px 0 !important;
    padding: 0 2px !important;
    width: 100% !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-e54f0ce .elementor-heading-title {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    min-height: 34px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-259a88e,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-259a88e {
    grid-column: 1 / -1 !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #e11d48 !important;
    margin-bottom: 2px !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-0f53d7e,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-0f53d7e {
    grid-column: 1 !important;
    width: 100% !important;
    align-self: end !important;
    margin: 0 !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-7cdd13e,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-7cdd13e {
    grid-column: 2 !important;
    width: 100% !important;
    align-self: end !important;
    margin: 0 !important;
  }

  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
  html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-0f53d7e .jet-listing-dynamic-link__link,
  body.proid-cards-grid-view .elementor-11093 .elementor-element.elementor-element-7cdd13e .jet-listing-dynamic-link__link {
    width: 100% !important;
    height: 32px !important;
    padding: 0 4px !important;
    font-size: 11px !important;
    gap: 4px !important;
    border-radius: 8px !important;
    justify-content: center !important;
  }
}
/* === END PROID PRODUCT ROW & GRID VIEW === */


/* ==========================================================================
   PROID ACCOUNT FULL-WIDTH RESPONSIVE LAYOUT & CARDS OVERFLOW FIX
   Templates: 75 (My Cards), 257642 (Admin Panel), 378244 (ProID Finder), 412014 (User Cards)
   ========================================================================== */

/* --- 1. GLOBAL UNBOXING: CONTENT AREA TAKES 100% AVAILABLE SCREEN WIDTH --- */
.elementor-75 .elementor-element.elementor-element-39fca90f,
.elementor-75 .elementor-element.elementor-element-4057666f,
.elementor-257642 .elementor-element.elementor-element-6e8c2a0,
.elementor-257642 .elementor-element.elementor-element-1041e805,
.elementor-378244 .elementor-element.elementor-element-ab30aff,
.elementor-378244 .elementor-element.elementor-element-5fc9159,
.elementor-412014 .elementor-element.elementor-element-68ddd49,
.elementor-412014 .elementor-element.elementor-element-693889f2,
body .proid-spa-outer-sec,
body .proid-spa-row-wrap {
  width: 100% !important;
  max-width: 100% !important;
  --content-width: 100% !important;
  --container-widget-width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 1025px) {
  /* Row containers */
  .elementor-75 .elementor-element.elementor-element-4057666f,
  .elementor-257642 .elementor-element.elementor-element-1041e805,
  .elementor-378244 .elementor-element.elementor-element-5fc9159,
  .elementor-412014 .elementor-element.elementor-element-693889f2,
  body .proid-spa-layout-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 20px !important;
    box-sizing: border-box !important;
  }

  /* Sidebars: fixed 260px */
  .elementor-75 .elementor-element.elementor-element-4d8b7e06,
  .elementor-257642 .elementor-element.elementor-element-50a39786,
  .elementor-378244 .elementor-element.elementor-element-cedee87,
  .elementor-412014 .elementor-element.elementor-element-4a927db5,
  body .proid-spa-sidebar-col {
    flex: 0 0 260px !important;
    width: 260px !important;
    max-width: 260px !important;
    min-width: 260px !important;
    box-sizing: border-box !important;
  }

  /* Content columns: takes ALL remaining width, zero clipping */
  .elementor-75 .elementor-element.elementor-element-43fcbdb0,
  .elementor-257642 .elementor-element.elementor-element-7bc7c859,
  .elementor-378244 .elementor-element.elementor-element-f6864a7,
  .elementor-412014 .elementor-element.elementor-element-68150cca,
  body .proid-spa-content-col {
    flex: 1 1 0% !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    padding: 16px 20px !important;
  }
}

/* --- 2. TEMPLATE 378244 (THẺ PROID FINDER) CLEAN RESPONSIVE GRID --- */
html body .elementor-378244 .elementor-element.elementor-element-0f288c5,
html body .elementor-378244 .elementor-element.elementor-element-0f288c5 > .e-con-inner,
html body .elementor-378244 .elementor-element.elementor-element-d38c091,
html body .elementor-378244 .elementor-element.elementor-element-d38c091 > .e-con-inner {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* ProID Finder Grid: Never squeeze into 220px! Clean auto-fitting multi-column grid */
#admin_listing_kid.jet-listing-grid > .jet-listing-grid__items,
.elementor-378244 .jet-listing-grid > .jet-listing-grid__items,
.jet-listing-grid--377966 {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 16px 0 !important;
}

@media (min-width: 768px) and (max-width: 1024px) {
  #admin_listing_kid.jet-listing-grid > .jet-listing-grid__items,
  .elementor-378244 .jet-listing-grid > .jet-listing-grid__items,
  .jet-listing-grid--377966 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }
}

@media (max-width: 767px) {
  #admin_listing_kid.jet-listing-grid > .jet-listing-grid__items,
  .elementor-378244 .jet-listing-grid > .jet-listing-grid__items,
  .jet-listing-grid--377966 {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

/* Template 377966 Card Structure: Clean, non-overlapping SaaS cards */
.jet-listing-grid--377966 .jet-listing-grid__item,
.jet-listing-grid--377966 .elementor-377966 {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  position: static !important;
  float: none !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-2f2a113 {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04) !important;
  padding: 16px !important;
  gap: 10px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-2f2a113:hover {
  border-color: #3b82f6 !important;
  box-shadow: 0 8px 24px rgba(59, 130, 246, 0.12) !important;
  transform: translateY(-2px) !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-65b413a,
.jet-listing-grid--377966 .elementor-377966 .elementor-element-d937a75 {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-9b849dd img {
  width: 100% !important;
  max-width: 100% !important;
  height: 190px !important;
  object-fit: cover !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06) !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-01e08fe .elementor-heading-title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  text-align: center !important;
  margin: 6px 0 2px 0 !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-ac48410 .jet-listing-dynamic-link__link {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  height: 38px !important;
  border-radius: 10px !important;
  background: #3b82f6 !important;
  color: #ffffff !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(59, 130, 246, 0.25) !important;
  transition: all 0.2s ease !important;
}

.jet-listing-grid--377966 .elementor-377966 .elementor-element-ac48410 .jet-listing-dynamic-link__link:hover {
  background: #2563eb !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.35) !important;
}

/* --- 3. TEMPLATE 257642 (ADMIN PANEL) TOP TOOLBAR & COMPACT SAAS CARDS --- */
html body .elementor-257642 .elementor-element.elementor-element-2413ff50,
html body .elementor-257642 .elementor-element.elementor-element-2413ff50 > .e-con-inner {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Top Action Bar in 2413ff50 */
html body .elementor-257642 .proid-admin-action-bar,
html body .elementor-257642 .proid-filter-bar-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 14px 18px !important;
  margin-bottom: 20px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
  box-sizing: border-box !important;
}

html body .elementor-257642 .elementor-element-a4d70e9,
html body .elementor-257642 .elementor-element-8b6ad48 {
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
}

html body .elementor-257642 .elementor-element-a4d70e9 .elementor-button,
html body .elementor-257642 .elementor-element-8b6ad48 .elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 9px 18px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  border: 1.5px solid #bfdbfe !important;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
  color: #1d4ed8 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
  transition: all 0.2s ease !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

html body .elementor-257642 .elementor-element-a4d70e9 .elementor-button:hover,
html body .elementor-257642 .elementor-element-8b6ad48 .elementor-button:hover {
  background: #3b82f6 !important;
  color: #ffffff !important;
  border-color: #3b82f6 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2) !important;
}

html body .elementor-257642 .elementor-element-660d3ffa {
  flex: 1 1 260px !important;
  width: auto !important;
  margin: 0 !important;
}

/* Admin Listing Grid: 2 Columns on desktop (up to 1549px) -> NEVER cut off Column 3! */
html body .elementor-257642 .elementor-element-4d2ef28e {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 1550px) {
  .elementor-element-4d2ef28e .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (min-width: 769px) and (max-width: 1549px) {
  .elementor-element-4d2ef28e .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 768px) {
  .elementor-element-4d2ef28e .jet-listing-grid__items {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Admin Cards (Template 257636): Compact High-End SaaS Card */
.elementor-257636 .userwarpcon,
.elementor-257636 .elementor-element-b96b047 {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 18px !important;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.elementor-257636 .userwarpcon:hover,
.elementor-257636 .elementor-element-b96b047:hover {
  border-color: #3b82f6 !important;
  box-shadow: 0 8px 24px rgba(59, 130, 246, 0.1) !important;
  transform: translateY(-2px) !important;
}

.elementor-257636 .elementor-element-c5845f7 .elementor-heading-title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  letter-spacing: -0.2px !important;
  margin-bottom: 2px !important;
}

.elementor-257636 .elementor-element-4edcfd4 .elementor-heading-title {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 12.5px !important;
  color: #64748b !important;
  font-weight: 400 !important;
  word-break: break-all !important;
}

.elementor-257636 .elementor-element-e778182 .elementor-heading-title,
.elementor-257636 .elementor-element-70e3395 .elementor-shortcode {
  display: inline-block !important;
  padding: 3px 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  border-radius: 20px !important;
  background: #f1f5f9 !important;
  color: #2563eb !important;
  border: 1px solid #cbd5e1 !important;
}

.elementor-257636 .elementor-widget-button {
  margin: 0 !important;
  width: 100% !important;
}

.elementor-257636 .elementor-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 6px 12px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
  border-radius: 8px !important;
  border: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  color: #334155 !important;
  box-shadow: none !important;
  transition: all 0.15s ease !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
}

.elementor-257636 .elementor-button:hover {
  background: #3b82f6 !important;
  color: #ffffff !important;
  border-color: #3b82f6 !important;
  transform: translateY(-1px) !important;
}

.elementor-257636 .elementor-element-ca44ac1 .elementor-button,
.elementor-257636 .elementor-element-308e1c5 .elementor-button,
.elementor-257636 .blockbtn .elementor-button {
  border-color: #fecaca !important;
  background: #fef2f2 !important;
  color: #ef4444 !important;
}

.elementor-257636 .elementor-element-ca44ac1 .elementor-button:hover,
.elementor-257636 .elementor-element-308e1c5 .elementor-button:hover,
.elementor-257636 .blockbtn .elementor-button:hover {
  background: #ef4444 !important;
  color: #ffffff !important;
  border-color: #ef4444 !important;
}

/* ==========================================================================
   PHASE 2 AUDIT REMEDIATION: MOBILE SHEET MODAL, 320PX HEADER & TOUCH TARGETS
   ========================================================================== */
@media (max-width: 767px) {
    /* P1-RESP-04: Free 227px of horizontal space in Bulk Sheet Editor on Mobile */
    .proid-sheet-table th.col-sticky-1,
    .proid-sheet-table td.col-sticky-1 {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        padding: 6px 4px !important;
    }
    .proid-sheet-table th.col-sticky-2,
    .proid-sheet-table td.col-sticky-2,
    .proid-sheet-table th.col-sticky-3,
    .proid-sheet-table td.col-sticky-3 {
        position: static !important;
        left: auto !important;
        z-index: 1 !important;
    }
    .proid-sheet-tab {
        min-height: 40px !important;
        padding: 0 14px !important;
    }
    .proid-sync-close-x {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
    }
}

@media (max-width: 480px) {
    /* P1-RESP-01: Keep #proid-preview-title visible on 320px - 480px viewports */
    #proid-preview-header {
        padding: 0 10px !important;
        gap: 8px !important;
    }
    #proid-preview-title {
        font-size: 12.5px !important;
        letter-spacing: 0.01em !important;
    }
    #proid-preview-edit-btn,
    #proid-preview-close {
        min-width: auto !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 12px !important;
        font-size: 11.5px !important;
        gap: 5px !important;
    }
}

/* ==========================================================================
   PHASE 3: ADMIN CARD (394869) & SYNC BUTTON (.elementor-element-294a6a3) UI FIX
   Prevents SVG solid-fill distortion, button text overflow, & layout overlap
   ========================================================================== */
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-526b72c,
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-526b72c.edit-btn-1 {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
}

html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-294a6a3,
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-294a6a3 > .elementor-widget-container,
html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
}

html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
    border: 1.5px solid #1e293b !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.18) !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    overflow: hidden !important;
}

html:not(.proid-cards-row-view) body:not(.proid-cards-row-view) .elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button:hover {
    background: linear-gradient(135deg, #0f172a 0%, #334155 100%) !important;
    border-color: #f59e0b !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.28) !important;
}

/* Fix SVG stroke icons in BOTH Grid View and Row View so CSS fill:#fff does NOT fill open paths with solid white triangles */
.elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button svg,
.elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button:hover svg,
.elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button svg *,
.elementor-394869 .elementor-element.elementor-element-294a6a3 .elementor-button:hover svg * {
    fill: none !important;
    stroke: #fbbf24 !important;
}
