.compact-card{transition:all .15s ease-in-out}.compact-card--default{background-color:#f8f9fa;border:2px solid transparent}.compact-card--default:hover{background-color:#f1f3f5;border-color:#dee2e6}.compact-card--current{background:linear-gradient(to right,#faf5ff,#f5f3ff);border:2px solid #a78bfa;box-shadow:0 4px 6px -1px #8b5cf61a,0 2px 4px -1px #8b5cf60f}.compact-card--current:hover{background:linear-gradient(to right,#faf5ff,#f5f3ff);border-color:#a78bfa}.text-purple-900{color:#581c87}.text-purple-700{color:#7c3aed}.text-purple-600{color:#9333ea}.border-purple-200{border-color:#e9d5ff!important}.header-bar{height:56px;z-index:100;box-shadow:0 1px 3px #0000001a}.d-flex.flex-grow-1.overflow-hidden,.d-flex.flex-grow-1.overflow-hidden>*{min-height:0}.public-template-sidebar{min-width:320px;max-width:320px;display:flex;flex-direction:column;overflow:hidden}.public-template-sidebar>turbo-frame{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}.public-template-sidebar .sidebar-tabs{flex-shrink:0;border-bottom:1px solid #dee2e6}.public-template-sidebar .sidebar-templates{flex:1;overflow-y:auto;overflow-x:hidden}.public-template-sidebar .sidebar-templates::-webkit-scrollbar{width:6px}.public-template-sidebar .sidebar-templates::-webkit-scrollbar-track{background:#f1f1f1}.public-template-sidebar .sidebar-templates::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.public-template-sidebar .sidebar-templates::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.desktop-sidebar-backdrop{display:none}@media (min-width: 992px){.public-template-sidebar{position:absolute;top:0;left:0;height:100%;z-index:1040;transform:translate(-100%);visibility:hidden;pointer-events:none;transition:transform .3s ease,visibility .3s ease;box-shadow:none}.public-template-sidebar.desktop-sidebar--open{transform:translate(0);visibility:visible;pointer-events:auto;box-shadow:4px 0 16px #00000026}.desktop-sidebar-backdrop{display:block;position:absolute;top:0;left:0;right:0;bottom:0;background:#0000004d;z-index:1035;opacity:0;pointer-events:none;transition:opacity .3s ease}.desktop-sidebar-backdrop.desktop-sidebar-backdrop--visible{opacity:1;pointer-events:auto}}@media (max-width: 991.98px){.public-template-sidebar{display:none!important}}@media (min-width: 992px){.mobile-template-bar{display:none!important}}div.mobile-template-bar[data-controller=mobile-template-bar].d-lg-none,div.mobile-template-bar[data-controller=mobile-template-bar],.mobile-template-bar.d-lg-none,.mobile-template-bar{position:fixed!important;bottom:0!important;top:auto!important;left:0!important;right:0!important;width:100vw!important;height:auto!important;z-index:9999!important;padding-bottom:env(safe-area-inset-bottom,0);transform:translateZ(0)!important;will-change:transform;contain:layout style paint;margin:0!important;padding-top:0!important;isolation:isolate;overflow:visible!important}.mobile-bar-collapsed{cursor:pointer;background:#fff!important;border-top:1px solid #dee2e6!important;box-shadow:0 -2px 10px #0000001a!important;min-height:60px}.mobile-bar-collapsed .expand-arrow{transition:transform .3s ease;font-size:1.2rem}.mobile-bar-expanded{z-index:1055}.mobile-bar-backdrop{z-index:1050}.bg-gradient-purple{background:linear-gradient(135deg,#a78bfa,#8b5cf6)}.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.hide-scrollbar::-webkit-scrollbar{display:none}.rounded-top-4{border-top-left-radius:1.5rem!important;border-top-right-radius:1.5rem!important}.public-template-main-content{flex:1;overflow-y:auto!important;overflow-x:hidden;min-height:0!important}@media (max-width: 991.98px){.mobile-template-bar,.mobile-template-bar.d-lg-none{display:block!important;visibility:visible!important;opacity:1!important;position:fixed!important;bottom:0!important;top:auto!important;left:0!important;right:0!important;width:100%!important;min-height:60px!important}.mobile-bar-collapsed{position:relative!important;bottom:auto!important;top:auto!important}.public-template-main-content{padding-bottom:80px}.d-flex.flex-column.vh-100{position:relative}}.template-stack .position-absolute{transition:transform .2s ease}.template-stack:hover .position-absolute{transform:scale(1.05)}.template-browse-item:hover{background-color:#f8f9fa}
