{"version":3,"file":"admin.css","mappings":"AAAA,WAeA,+BACI,4DACA,gBACA,kBACA,kBACA,YAGJ,+BACI,4DACA,gBACA,kBACA,kBACA,YAGJ,+BACI,4DACA,gBACA,kBACA,kBACA,wBCEJ,KACI,2BACI,UACA,IAEJ,uBACI,UACA,0BAIR,KACI,0BACI,UACA,IAEJ,uBACI,UACA,0BAIR,KACI,uBACI,UACA,IAEJ,2BACI,UACA,2BAIR,KACI,uBACI,UACA,IAEJ,0BACI,UACA,8CCnER,KACI,SACI,4BACA,IAEJ,SACI,wBACA,+CAIR,KACI,SACI,2BACA,IAEJ,SACI,wBACA,6CAIR,KACI,SACI,4BACA,IAEJ,SACI,wBACA,gDAIR,KACI,SACI,2BACA,IAEJ,SACI,wBACA,wCAQR,KACI,SACI,IAEJ,SACI,yCAIR,KACI,SACI,IAEJ,SACI,yCAQR,KACI,SACI,qBACA,IAEJ,SACI,mBACA,0CAIR,KACI,SACI,mBACA,IAEJ,SACI,qBACA,0CAQR,KACI,SACI,qCACA,IAEJ,SACI,gCACA,2CAIR,KACI,SACI,gCACA,IAEJ,SACI,oCACA,0CAQR,KACI,SACI,4BACA,KAEJ,0BACI,KAEJ,0BACI,IAEJ,SACI,wBACA,2CAIR,KACI,SACI,wBACA,KAEJ,yBACI,KAEJ,2BACI,IAEJ,SACI,2BACA,8CAQR,KACI,SACI,4BACA,IAEJ,SACI,wBACA,+CAIR,KACI,SACI,2BACA,IAEJ,SACI,wBACA,6CAIR,KACI,SACI,4BACA,IAEJ,SACI,wBACA,gDAIR,KACI,SACI,2BACA,IAEJ,SACI,wBACA,wCAQR,KACI,SACI,IAEJ,SACI,yCAIR,KACI,SACI,IAEJ,SACI,yCAQR,KACI,SACI,qBACA,IAEJ,SACI,mBACA,0CAIR,KACI,SACI,mBACA,IAEJ,SACI,qBACA,0CAQR,KACI,SACI,qCACA,IAEJ,SACI,gCACA,2CAIR,KACI,SACI,gCACA,IAEJ,SACI,oCACA,0CAQR,KACI,SACI,4BACA,KAEJ,0BACI,KAEJ,0BACI,IAEJ,SACI,wBACA,2CAIR,KACI,SACI,wBACA,KAEJ,yBACI,KAEJ,2BACI,IAEJ,SACI,2BACA,8CAQR,KACI,SACI,4BACA,IAEJ,SACI,wBACA,+CAIR,KACI,SACI,2BACA,IAEJ,SACI,wBACA,6CAIR,KACI,SACI,4BACA,IAEJ,SACI,wBACA,gDAIR,KACI,SACI,2BACA,IAEJ,SACI,wBACA,+CCrWR,6BAII,odCqBA,6BDlBI,2DAIR,kBEU6B,2BFD7B,YACI,8BACA,mBEToB,cAyDE,8GAhEA,gBFoBtB,mCACA,kCACA,kKCHA,kBCJyB,cAsDE,+KFxC3B,eAMI,0BCaA,0BDlCR,qBAyBQ,gBACA,kBACA,gBACA,iCAIR,MACI,aACA,gBACA,0BCDI,+BDFR,UAMQ,UACA,iBACA,kBACA,eACA,sBACA,8BAQR,WACI,8BEtD0B,0BFwD1B,kCACA,oCACA,aACA,sBACA,cACA,wKCtDA,6BCI+B,gCA2DF,0BDlCzB,4BDiBR,cAgBQ,MACA,OACA,SACA,YACA,YACA,4BACA,wDACA,eACA,oCACA,mBACA,wKCxEJ,+BC+D6B,sCFgB7B,iBACI,gCACA,gMCjFJ,2BC+D6B,0BDlCzB,oCDkDJ,aASQ,qCAIR,cACI,gBACA,SACA,cEnFqB,6LDZzB,aCsB8B,sCFiF9B,cACI,cEzDwB,mMD/C5B,aCoDiC,kCF4DjC,gBACI,aACA,sBACA,QACA,0BCvFA,iCDmFJ,qBAOQ,iBACA,QACA,mBACA,oCAIR,YACI,mBACA,SACA,kBACA,mBEqDoB,cAxII,qBFsFxB,kDACA,0LCtIJ,aCoDiC,yCFwF7B,kBEtJuB,cAuDL,4MD7CtB,kBCAgC,cAkDL,2CFoGvB,+BExIyB,cAFJ,sCF6IjB,4BACA,0BACA,yBACA,kNC5JR,+BCwBkC,cAFJ,4DDO1B,kCDiGJ,iBAwCQ,kBACA,yBACA,mBACA,eACA,yCAEA,kBEtLmB,4MDU3B,kBCAgC,2CFoLxB,kBExKiB,WAIQ,kNDhBjC,kBCsB8B,WAKQ,6EFkK1B,UE7KqB,wTDhBjC,UC2BsC,oCF6KtC,cACI,8DAMJ,uBACI,0BCnLA,qEDsLJ,aAEQ,2BCxLJ,iFD6LA,2CAEQ,2BC/LR,iFDmMA,SAEQ,2BCrMR,iFDyMA,6CAEQ,gCAUhB,YACI,eACA,SACA,SACA,eACA,gBElQyB,yBFoQzB,kBACA,aACA,eACA,sBACA,QACA,qCACA,8KC/PA,kBCD8B,qBAgED,0BDlCzB,8BDqNR,YAqBQ,qCAGJ,UACI,WACA,mBE/NkB,mGFiOlB,6LC9QJ,kBCkD2B,qCFqO/B,YACI,eACA,QACA,MACA,0BACA,cACA,0BChQI,oCD0PR,YASQ,8BAQR,YACI,sBACA,mBACA,uBACA,iBACA,SACA,6BAGJ,UACI,YACA,yBACA,yBExSyB,kBF0SzB,sDACA,wKCvTA,oBC+D6B,yBAzCC,oCFySlC,GACI,wBACI,0BAQR,mBACI,mBACA,uBACA,QACA,kBACA,YACA,mBExJwB,eF0JxB,gBACA,eACA,kDACA,kCAEA,UACI,mBACA,kCAGJ,oDACI,WE5U6B,uLDhBjC,oDDgWQ,WErU8B,uDFyUlC,kBEvV2B,sPDb/B,kBCuBoC,oCFsVpC,kBEvX2B,cAuDL,6LD7CtB,kBCAgC,cAkDL,yDFoUvB,kBE3ToB,4PD3DxB,kBC+D6B,uCFgU7B,YACI,wGACA,sMCjYJ,mEDoYQ,kCASZ,iBACI,gBACA,iBACA,eACA,cEnWgC,uLD9ChC,aCmDqC,oCFqWrC,aE5YyB,qBF8YrB,gBACA,6LC3ZJ,aCsB8B,0CF2Y1B,yBACI,yBG7bZ,mBACE,mBACA,uBACA,QACA,kBACA,YACA,mBD4M0B,eC1M1B,gBACA,eACA,kDACA,kCAEA,UACE,mBACA,uCAGF,YACE,wGACA,sMFOA,mEEJE,kCAQJ,oDACE,WDWiC,uDCRjC,kBDK+B,uLDb/B,oDEaE,WDcoC,sPCXpC,kBDOkC,oCCDtC,kBDhC6B,cAuDL,yDCnBtB,kBDiCwB,6LD3DxB,kBCAgC,cAkDL,4PChBzB,kBD6B2B,gCCvB/B,wBACE,cDM4B,+BCJ5B,qDAEA,kBDvD2B,cAuDL,iLD7CtB,aCoDiC,gPCC/B,kBDrD8B,cAkDL,kCCU7B,kBDW2B,WAvDQ,uDCgDjC,kBDQ+B,uLDxE/B,kBCgF8B,sPCT5B,kBDUkC,iCCJtC,kBDoCyB,WAjGU,sDCiEjC,kBDiC6B,oLDlH7B,kBC4H4B,mPCpC1B,kBDqCgC,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","sources":["webpack://presszone-comments-admin/./src-vanilla/css/main.scss","webpack://presszone-comments-admin/./src-vanilla/css/_tab-animations.scss","webpack://presszone-comments-admin/./src-vanilla/css/_animations.scss","webpack://presszone-comments-admin/./src-vanilla/css/_base.scss","webpack://presszone-comments-admin/./src-vanilla/css/_mixins.scss","webpack://presszone-comments-admin/./src-vanilla/css/_variables.scss","webpack://presszone-comments-admin/./src-vanilla/css/_components.scss","webpack://presszone-comments-admin/./src-vanilla/css/_forms.scss","webpack://presszone-comments-admin/./src-vanilla/css/_dashboard.scss","webpack://presszone-comments-admin/./src-vanilla/css/_modals.scss","webpack://presszone-comments-admin/./src-vanilla/css/_settings.scss","webpack://presszone-comments-admin/./src-vanilla/css/_design.scss","webpack://presszone-comments-admin/./src-vanilla/css/_utilities.scss"],"sourcesContent":["// ==========================================================================\n// Comments Press Zone - Admin Styles Entry Point\n// ==========================================================================\n// Main SCSS entry file that imports all partials.\n// Order matters: variables/mixins first, then base, then components.\n// ==========================================================================\n\n// Core dependencies (must be first)\n@import 'variables';\n@import 'mixins';\n\n// ==========================================================================\n// FONT FACES\n// ==========================================================================\n\n@font-face {\n font-family: 'Plus Jakarta Sans';\n src: url('../../assets/fonts/plus-jakarta-sans-regular.woff2') format('woff2');\n font-weight: 400;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'Plus Jakarta Sans';\n src: url('../../assets/fonts/plus-jakarta-sans-600.woff2') format('woff2');\n font-weight: 600;\n font-style: normal;\n font-display: swap;\n}\n\n@font-face {\n font-family: 'Plus Jakarta Sans';\n src: url('../../assets/fonts/plus-jakarta-sans-700.woff2') format('woff2');\n font-weight: 700;\n font-style: normal;\n font-display: swap;\n}\n\n// ==========================================================================\n// PARTIALS\n// ==========================================================================\n\n// Animations (keyframes and animation utilities)\n@import 'tab-animations';\n@import 'animations';\n\n// Base layout and structure\n@import 'base';\n\n// UI Components\n@import 'components';\n\n// Forms and inputs\n@import 'forms';\n\n// Dashboard widgets\n@import 'dashboard';\n\n// Modals and overlays\n@import 'modals';\n\n// Settings pages\n@import 'settings';\n\n// Design page\n@import 'design';\n\n// Utilities and remaining styles\n@import 'utilities';","// =============================================================================\n// Tab Slide Animations (SCSS Version)\n// =============================================================================\n// Directional slide transitions for tab content panels.\n// Used by Tabs component and modal tabs throughout the admin app.\n// =============================================================================\n\n// =============================================================================\n// Animation Timing Variables\n// =============================================================================\n\n$presszone-comments-tab-slide-duration: 0.35s;\n$presszone-comments-tab-slide-easing: cubic-bezier(0.34, 1.56, 0.64, 1);\n\n// =============================================================================\n// Slide Animations\n// =============================================================================\n\n@mixin slide-left-in {\n animation: slideLeftIn $presszone-comments-tab-slide-duration $presszone-comments-tab-slide-easing;\n}\n\n@mixin slide-right-in {\n animation: slideRightIn $presszone-comments-tab-slide-duration $presszone-comments-tab-slide-easing;\n}\n\n@mixin slide-left-out {\n animation: slideLeftOut $presszone-comments-tab-slide-duration $presszone-comments-tab-slide-easing;\n}\n\n@mixin slide-right-out {\n animation: slideRightOut $presszone-comments-tab-slide-duration $presszone-comments-tab-slide-easing;\n}\n\n// =============================================================================\n// Keyframes\n// =============================================================================\n\n@keyframes slideLeftIn {\n from {\n transform: translateX(-100%);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n@keyframes slideRightIn {\n from {\n transform: translateX(100%);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n@keyframes slideLeftOut {\n from {\n transform: translateX(0);\n opacity: 1;\n }\n to {\n transform: translateX(-100%);\n opacity: 0;\n }\n}\n\n@keyframes slideRightOut {\n from {\n transform: translateX(0);\n opacity: 1;\n }\n to {\n transform: translateX(100%);\n opacity: 0;\n }\n}","// =============================================================================\n// Shared Animation System (SCSS)\n// =============================================================================\n// Consolidated keyframes, timing variables, and animation utilities.\n// Used by components throughout the admin app.\n// =============================================================================\n\n// =============================================================================\n// Shared Slide-In Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-slide-in-left {\n from {\n opacity: 0;\n transform: translateX(-20px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-right {\n from {\n opacity: 0;\n transform: translateX(20px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-top {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-bottom {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n// =============================================================================\n// Shared Fade Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes presszone-comments-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n// =============================================================================\n// Shared Scale Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-scale-in {\n from {\n opacity: 0;\n transform: scale(0.8);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes presszone-comments-scale-out {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.8);\n }\n}\n\n// =============================================================================\n// Shared Rotate Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-rotate-in {\n from {\n opacity: 0;\n transform: rotate(-180deg) scale(0.8);\n }\n to {\n opacity: 1;\n transform: rotate(0deg) scale(1);\n }\n}\n\n@keyframes presszone-comments-rotate-out {\n from {\n opacity: 1;\n transform: rotate(0deg) scale(1);\n }\n to {\n opacity: 0;\n transform: rotate(180deg) scale(0.8);\n }\n}\n\n// =============================================================================\n// Shared Bounce Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-bounce-in {\n from {\n opacity: 0;\n transform: translateY(-30px);\n }\n 50% {\n transform: translateY(10px);\n }\n 75% {\n transform: translateY(-5px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes presszone-comments-bounce-out {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n 25% {\n transform: translateY(5px);\n }\n 50% {\n transform: translateY(-10px);\n }\n to {\n opacity: 0;\n transform: translateY(30px);\n }\n}\n\n// =============================================================================\n// Shared Slide-In Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-slide-in-left {\n from {\n opacity: 0;\n transform: translateX(-20px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-right {\n from {\n opacity: 0;\n transform: translateX(20px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-top {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-bottom {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n// =============================================================================\n// Shared Fade Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-fade-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes presszone-comments-fade-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n// =============================================================================\n// Shared Scale Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-scale-in {\n from {\n opacity: 0;\n transform: scale(0.8);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes presszone-comments-scale-out {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.8);\n }\n}\n\n// =============================================================================\n// Shared Rotate Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-rotate-in {\n from {\n opacity: 0;\n transform: rotate(-180deg) scale(0.8);\n }\n to {\n opacity: 1;\n transform: rotate(0deg) scale(1);\n }\n}\n\n@keyframes presszone-comments-rotate-out {\n from {\n opacity: 1;\n transform: rotate(0deg) scale(1);\n }\n to {\n opacity: 0;\n transform: rotate(180deg) scale(0.8);\n }\n}\n\n// =============================================================================\n// Shared Bounce Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-bounce-in {\n from {\n opacity: 0;\n transform: translateY(-30px);\n }\n 50% {\n transform: translateY(10px);\n }\n 75% {\n transform: translateY(-5px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes presszone-comments-bounce-out {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n 25% {\n transform: translateY(5px);\n }\n 50% {\n transform: translateY(-10px);\n }\n to {\n opacity: 0;\n transform: translateY(30px);\n }\n}\n\n// =============================================================================\n// Shared Slide-In Keyframes\n// =============================================================================\n\n@keyframes presszone-comments-slide-in-left {\n from {\n opacity: 0;\n transform: translateX(-20px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-right {\n from {\n opacity: 0;\n transform: translateX(20px);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-top {\n from {\n opacity: 0;\n transform: translateY(-20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes presszone-comments-slide-in-bottom {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}","// ==========================================================================\n// Comments Press Zone - Base Styles\n// ==========================================================================\n// Core layout, sidebar, loading states, and buttons.\n// Converted from main.css lines 286-600.\n// ==========================================================================\n// Note: variables and mixins are already imported globally in main.scss\n// ==========================================================================\n\n\n// ==========================================================================\n// WP Admin Overrides - Canvas Mode Isolation\n// ==========================================================================\n\n#wpcontent,\n#wpbody-content,\n#wpfooter,\n#wpwrap {\n background: $presszone-comments-bg !important;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark !important;\n }\n}\n\nhtml.presszone-comments-dark,\nbody.presszone-comments-dark {\n background: $presszone-comments-bg-dark;\n}\n\n// ==========================================================================\n// Layout\n// ==========================================================================\n\n.presszone-comments-admin {\n display: flex;\n min-height: calc(100vh - 46px);\n background: $presszone-comments-bg;\n color: $presszone-comments-text;\n font-family: $presszone-comments-font;\n font-weight: 400;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n\n @include dark-mode-class {\n background: $presszone-comments-bg-dark;\n color: $presszone-comments-text-dark;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-weight: 600;\n }\n\n @include respond-to(md) {\n flex-direction: column;\n min-height: auto;\n overflow-x: hidden;\n max-width: 100vw;\n }\n}\n\n.presszone-comments-admin-main {\n flex: 1;\n padding: 24px;\n overflow-y: auto;\n\n @include respond-to(md) {\n margin: 5px;\n padding: 0;\n padding-top: 60px;\n overflow-x: hidden;\n max-width: 100%;\n box-sizing: border-box;\n }\n}\n\n// ==========================================================================\n// Sidebar\n// ==========================================================================\n\n.presszone-comments-sidebar {\n width: 220px;\n background: $presszone-comments-glass-bg;\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-inline-end: 1px solid $presszone-comments-border;\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n\n @include dark-mode-class {\n background: $presszone-comments-glass-bg-dark;\n border-inline-end-color: $presszone-comments-border-dark;\n }\n\n @include respond-to(md) {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n width: 280px;\n height: 100%;\n transform: translateX(-100%);\n transition: transform $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n z-index: 100000;\n border-inline-end: 1px solid $presszone-comments-border;\n border-bottom: none;\n\n @include dark-mode-class {\n border-inline-end-color: $presszone-comments-border-dark;\n }\n }\n\n &__header {\n padding: 20px 16px;\n border-bottom: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n @include respond-to(md) {\n display: block;\n }\n }\n\n &__title {\n font-size: 18px;\n font-weight: 600;\n margin: 0;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n }\n\n &__version {\n font-size: 11px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__nav {\n padding: 12px 8px;\n display: flex;\n flex-direction: column;\n gap: 4px;\n\n @include respond-to(md) {\n flex-direction: column;\n padding: 12px 8px;\n gap: 4px;\n overflow-x: visible;\n }\n }\n\n &__link {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 12px;\n border-radius: $presszone-comments-radius;\n color: $presszone-comments-text-muted;\n text-decoration: none;\n transition: all $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n }\n\n &--active {\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n border-inline-start: 3px solid $presszone-comments-primary;\n border-start-start-radius: 0;\n border-end-start-radius: 0;\n padding-inline-start: 9px;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n border-inline-start-color: $presszone-comments-primary-dark;\n }\n }\n\n @include respond-to(md) {\n padding: 12px 16px;\n border-radius: 8px;\n background: transparent;\n white-space: normal;\n font-size: 14px;\n\n &:hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n\n &--active {\n background: $presszone-comments-primary;\n color: $presszone-comments-text-on-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dark;\n color: $presszone-comments-text-on-primary-dark;\n }\n\n .presszone-comments-sidebar__icon {\n color: $presszone-comments-text-on-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-text-on-primary-dark;\n }\n }\n }\n }\n }\n\n &__icon {\n font-size: 16px;\n }\n}\n\n// Sidebar open state (mobile)\n.presszone-comments-sidebar-open {\n .presszone-comments-sidebar {\n transform: translateX(0);\n }\n\n .presszone-comments-sidebar-overlay {\n @include respond-to(md) {\n display: block;\n }\n }\n\n .presszone-comments-hamburger__bar {\n &:nth-child(1) {\n @include respond-to(md) {\n transform: rotate(45deg) translate(4px, 4px);\n }\n }\n\n &:nth-child(2) {\n @include respond-to(md) {\n opacity: 0;\n }\n }\n\n &:nth-child(3) {\n @include respond-to(md) {\n transform: rotate(-45deg) translate(4px, -4px);\n }\n }\n }\n}\n\n// ==========================================================================\n// Mobile Hamburger Menu\n// ==========================================================================\n\n.presszone-comments-hamburger {\n display: none;\n position: fixed;\n top: 50px;\n left: 5px;\n z-index: 100001;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: 8px;\n padding: 10px;\n cursor: pointer;\n flex-direction: column;\n gap: 4px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n @include respond-to(md) {\n display: flex;\n }\n\n &__bar {\n width: 20px;\n height: 2px;\n background: $presszone-comments-text;\n transition: transform $presszone-comments-duration-normal $presszone-comments-ease-smooth,\n opacity $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-text-dark;\n }\n }\n}\n\n.presszone-comments-sidebar-overlay {\n display: none;\n position: fixed;\n inset: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.5);\n z-index: 99999;\n\n @include respond-to(md) {\n display: none;\n }\n}\n\n// ==========================================================================\n// Loading & Spinner\n// ==========================================================================\n\n.presszone-comments-loading {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 200px;\n gap: 16px;\n}\n\n.presszone-comments-spinner {\n width: 32px;\n height: 32px;\n border: 3px solid $presszone-comments-border;\n border-top-color: $presszone-comments-primary;\n border-radius: 50%;\n animation: presszone-comments-spin $presszone-comments-spinner-duration linear infinite;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark;\n border-top-color: $presszone-comments-primary-dark;\n }\n}\n\n@keyframes presszone-comments-spin {\n to {\n transform: rotate(360deg);\n }\n}\n\n// ==========================================================================\n// Buttons\n// ==========================================================================\n\n.presszone-comments-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 10px 20px;\n border: none;\n border-radius: $presszone-comments-radius;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &--primary {\n background: linear-gradient(135deg, $presszone-comments-primary, $presszone-comments-primary-hover);\n color: $presszone-comments-text-on-primary;\n\n @include dark-mode-class {\n background: linear-gradient(135deg, $presszone-comments-primary-dark, $presszone-comments-primary-hover-dark);\n color: $presszone-comments-text-on-primary-dark;\n }\n\n &:hover:not(:disabled) {\n background: $presszone-comments-primary-hover;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-hover-dark;\n }\n }\n }\n\n &--secondary {\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n\n &:hover:not(:disabled) {\n background: $presszone-comments-border;\n\n @include dark-mode-class {\n background: $presszone-comments-border-dark;\n }\n }\n }\n\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim, $presszone-comments-shadow;\n\n @include dark-mode-class {\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim-dark, $presszone-comments-shadow-dark;\n }\n }\n}\n\n// ==========================================================================\n// Admin Footer\n// ==========================================================================\n\n.presszone-comments-admin-footer {\n text-align: center;\n margin-top: 32px;\n padding-top: 24px;\n font-size: 13px;\n color: $presszone-comments-text-secondary;\n\n @include dark-mode-class {\n color: $presszone-comments-text-secondary-dark;\n }\n\n a {\n color: $presszone-comments-primary;\n text-decoration: none;\n font-weight: 600;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n\n &:hover {\n text-decoration: underline;\n }\n }\n}","// =============================================================================\n// Comments Press Zone - Admin SCSS Mixins\n// =============================================================================\n// Reusable mixins for dark mode, responsive design, accessibility, and RTL.\n// All mixins follow WordPress.org naming requirements (4+ char prefix).\n// =============================================================================\n\n// Variables are imported in main.scss to avoid conflicts\n\n// -----------------------------------------------------------------------------\n// Dark Mode Mixins\n// -----------------------------------------------------------------------------\n\n/// Dark mode detection via system preference (prefers-color-scheme media query)\n/// @content Styles to apply when system dark mode is enabled\n/// @example\n/// .presszone-comments-card {\n/// background: #ffffff;\n/// @include dark-mode {\n/// background: #1e1f20;\n/// }\n/// }\n@mixin dark-mode {\n @media (prefers-color-scheme: dark) {\n @content;\n }\n}\n\n/// Dark mode detection via class (for forced dark mode)\n/// @content Styles to apply when dark mode class is present\n/// @example\n/// .presszone-comments-card {\n/// background: #ffffff;\n/// @include dark-mode-class {\n/// background: #1e1f20;\n/// }\n/// }\n@mixin dark-mode-class {\n\n html.presszone-comments-dark &,\n body.presszone-comments-dark &,\n .presszone-comments-dark & {\n @content;\n }\n}\n\n// -----------------------------------------------------------------------------\n// Responsive Design Mixins\n// -----------------------------------------------------------------------------\n\n/// Mobile-first responsive breakpoint mixin\n/// @param {String} $breakpoint - Breakpoint name (sm, md, lg)\n/// @content Styles to apply at specified breakpoint\n/// @example\n/// .presszone-comments-card {\n/// width: 100%;\n/// @include breakpoint(md) {\n/// width: 50%;\n/// }\n/// }\n@mixin breakpoint($breakpoint) {\n @if $breakpoint =='sm' {\n @media (min-width: $presszone-comments-breakpoint-sm) {\n @content;\n }\n }\n\n @else if $breakpoint =='md' {\n @media (min-width: $presszone-comments-breakpoint-md) {\n @content;\n }\n }\n\n @else if $breakpoint =='lg' {\n @media (min-width: $presszone-comments-breakpoint-lg) {\n @content;\n }\n }\n}\n\n/// Responsive breakpoint mixin (alias for breakpoint)\n/// @param {String} $size - Breakpoint name (sm, md, lg)\n/// @content Styles to apply at specified breakpoint\n/// @example\n/// .presszone-comments-card {\n/// width: 100%;\n/// @include respond-to(md) {\n/// width: 50%;\n/// }\n/// }\n@mixin respond-to($size) {\n @include breakpoint($size) {\n @content;\n }\n}\n\n// -----------------------------------------------------------------------------\n// Accessibility Mixins\n// -----------------------------------------------------------------------------\n\n/// Focus state mixin for keyboard accessibility\n/// @content Styles to apply on focus\n/// @example\n/// .presszone-comments-btn {\n/// @include focus-state {\n/// outline: 2px solid $presszone-comments-primary;\n/// }\n/// }\n@mixin focus-state {\n &:focus-visible {\n @content;\n }\n}\n\n/// Reduced motion mixin for accessibility\n/// @content Styles to apply when user prefers reduced motion\n/// @example\n/// .presszone-comments-modal {\n/// @include reduced-motion {\n/// transition: none;\n/// }\n/// }\n@mixin reduced-motion {\n @media (prefers-reduced-motion: reduce) {\n @content;\n }\n}\n\n// -----------------------------------------------------------------------------\n// RTL Support Mixins\n// -----------------------------------------------------------------------------\n\n/// RTL direction mixin\n/// @content Styles to apply in RTL context\n/// @example\n/// .presszone-comments-dialog {\n/// @include rtl {\n/// margin-inline-start: 0;\n/// margin-inline-end: 20px;\n/// }\n/// }\n@mixin rtl {\n\n [dir=\"rtl\"] &,\n :root[dir=\"rtl\"] & {\n @content;\n }\n}\n\n// -----------------------------------------------------------------------------\n// Utility Mixins\n// -----------------------------------------------------------------------------\n\n/// Box shadow mixin with configurable blur and spread\n/// @param {Number} $blur - Blur radius\n/// @param {Number} $spread - Spread radius\n/// @param {Color} $color - Shadow color\n/// @content Optional additional shadow properties\n/// @example\n/// .presszone-comments-card {\n/// @include box-shadow(4px, 12px, rgba(0, 0, 0, 0.1)) {\n/// inset: 0 1px 0 rgba(255, 255, 255, 0.1);\n/// }\n/// }\n@mixin box-shadow($blur, $spread, $color) {\n box-shadow: 0 $presszone-comments-shadow-offset-y $blur $spread $color;\n @content;\n}\n\n// -----------------------------------------------------------------------------\n// Theme Mixins\n// -----------------------------------------------------------------------------\n\n/// Theme context mixin\n/// @param {String} $theme - Theme name (light, dark, inherit)\n/// @content Styles to apply in specified theme context\n/// @example\n/// .presszone-comments-card {\n/// @include theme(light) {\n/// background: $presszone-comments-bg-primary;\n/// }\n/// @include theme(dark) {\n/// background: $presszone-comments-dark-bg-primary;\n/// }\n/// }\n@mixin theme($theme) {\n @if $theme =='light' {\n\n .light-mode &,\n :root:not(.dark-mode):not(.inherit-mode) & {\n @content;\n }\n }\n\n @else if $theme =='dark' {\n\n .dark-mode &,\n :root.dark-mode:not(.inherit-mode) & {\n @content;\n }\n }\n\n @else if $theme =='inherit' {\n\n .inherit-mode &,\n :root.inherit-mode & {\n @content;\n }\n }\n}\n\n// -----------------------------------------------------------------------------\n// Color Mixins\n// -----------------------------------------------------------------------------\n\n/// Primary color mixin\n/// @content Styles to apply with primary color\n/// @example\n/// .presszone-comments-btn {\n/// @include primary-color {\n/// color: $presszone-comments-primary;\n/// }\n/// }\n@mixin primary-color {\n color: $presszone-comments-primary;\n @content;\n}\n\n/// Accent color mixin\n/// @content Styles to apply with accent color\n/// @example\n/// .presszone-comments-badge {\n/// @include accent-color {\n/// background: $presszone-comments-accent;\n/// }\n/// }\n@mixin accent-color {\n color: $presszone-comments-accent;\n @content;\n}\n\n// -----------------------------------------------------------------------------\n// Spacing Mixins\n// -----------------------------------------------------------------------------\n\n/// Margin spacing mixin\n/// @param {String} $spacing - Spacing variable name\n/// @example\n/// .presszone-comments-card {\n/// @include margin-spacing(sm);\n/// }\n@mixin margin-spacing($spacing) {\n margin: var(--presszone-comments-#{$spacing}-spacing);\n}\n\n/// Padding spacing mixin\n/// @param {String} $spacing - Spacing variable name\n/// @example\n/// .presszone-comments-card {\n/// @include padding-spacing(md);\n/// }\n@mixin padding-spacing($spacing) {\n padding: var(--presszone-comments-#{$spacing}-spacing);\n}\n\n// -----------------------------------------------------------------------------\n// Typography Mixins\n// -----------------------------------------------------------------------------\n\n/// Font size mixin\n/// @param {String} $size - Font size variable name\n/// @example\n/// .presszone-comments-title {\n/// @include font-size(lg);\n/// }\n@mixin font-size($size) {\n font-size: var(--presszone-comments-#{$size}-font-size);\n}\n\n/// Line height mixin\n/// @param {String} $size - Line height variable name\n/// @example\n/// .presszone-comments-text {\n/// @include line-height(base);\n/// }\n@mixin line-height($size) {\n line-height: var(--presszone-comments-#{$size}-line-height);\n}\n\n// -----------------------------------------------------------------------------\n// Border Mixins\n// -----------------------------------------------------------------------------\n\n/// Border width mixin\n/// @param {String} $width - Border width variable name\n/// @example\n/// .presszone-comments-card {\n/// @include border-width(lg);\n/// }\n@mixin border-width($width) {\n border-width: var(--presszone-comments-#{$width}-border-width);\n}\n\n// -----------------------------------------------------------------------------\n// Animation Mixins\n// -----------------------------------------------------------------------------\n\n/// Animation duration mixin\n/// @param {String} $duration - Duration variable name\n/// @example\n/// .presszone-comments-modal {\n/// @include animation-duration(normal);\n/// }\n@mixin animation-duration($duration) {\n transition-duration: var(--presszone-comments-#{$duration}-duration);\n}","// ==========================================================================\n// Comments Press Zone - Admin SCSS Variables\n// ==========================================================================\n// This file contains all design tokens as SCSS variables for the admin panel.\n// Light mode variables are the default, dark mode uses -dark suffix.\n// Usage: Use light vars normally, use -dark vars inside .dark-mode & { } blocks.\n//\n// Example:\n// .card {\n// background: $presszone-comments-surface;\n// .dark-mode & {\n// background: $presszone-comments-surface-dark;\n// }\n// }\n// ==========================================================================\n\n// ==========================================================================\n// TYPOGRAPHY\n// ==========================================================================\n\n$presszone-comments-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n\n// ==========================================================================\n// COLORS - BACKGROUNDS\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-bg: #f8fafc;\n$presszone-comments-surface: #ffffff;\n$presszone-comments-surface-2: #f1f5f9;\n$presszone-comments-surface-3: #e2e8f0;\n$presszone-comments-surface-alt: #f8fafc;\n$presszone-comments-glass-bg: rgba(255, 255, 255, 0.9);\n\n// Dark Mode\n$presszone-comments-bg-dark: #131314;\n$presszone-comments-bg-start-dark: #131314;\n$presszone-comments-bg-end-dark: #1a1b1c;\n$presszone-comments-surface-dark: #1e1f20;\n$presszone-comments-surface-2-dark: #282a2c;\n$presszone-comments-surface-3-dark: #353739;\n$presszone-comments-surface-alt-dark: #1e1f20;\n$presszone-comments-glass-dark: rgba(30, 31, 32, 0.95);\n$presszone-comments-glass-bg-dark: rgba(30, 31, 32, 0.95);\n$presszone-comments-glass-border-dark: rgba(255, 255, 255, 0.08);\n\n// ==========================================================================\n// COLORS - PRIMARY\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-primary: #1f71dd;\n$presszone-comments-primary-hover: #185bb5;\n$presszone-comments-primary-dim: rgba(31, 113, 221, 0.08);\n$presszone-comments-primary-glow: rgba(31, 113, 221, 0.15);\n$presszone-comments-text-on-primary: #ffffff;\n$presszone-comments-primary-shadow-sm: rgba(31, 113, 221, 0.2);\n$presszone-comments-primary-shadow-md: rgba(31, 113, 221, 0.25);\n$presszone-comments-primary-shadow-focus: rgba(31, 113, 221, 0.25);\n\n// Dark Mode\n$presszone-comments-primary-dark: #1f71dd;\n$presszone-comments-primary-hover-dark: #185bb5;\n$presszone-comments-primary-dim-dark: rgba(31, 113, 221, 0.15);\n$presszone-comments-primary-glow-dark: rgba(31, 113, 221, 0.25);\n$presszone-comments-primary-link-dark: #1f71dd;\n$presszone-comments-text-on-primary-dark: #ffffff;\n\n// ==========================================================================\n// COLORS - SECONDARY\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-secondary: #238442;\n$presszone-comments-secondary-hover: #1a6633;\n\n// Dark Mode\n$presszone-comments-secondary-dark: #238442;\n\n// ==========================================================================\n// COLORS - TEXT\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-text: #0f172a;\n$presszone-comments-text-secondary: #334155;\n$presszone-comments-text-muted: #64748b;\n\n// Dark Mode\n$presszone-comments-text-dark: #e3e3e3;\n$presszone-comments-text-secondary-dark: #c4c7c5;\n$presszone-comments-text-muted-dark: #9aa0a6;\n\n// ==========================================================================\n// COLORS - BORDERS\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-border: #e2e8f0;\n$presszone-comments-border-hover: #cbd5e1;\n\n// Dark Mode\n$presszone-comments-border-dark: #3c4043;\n$presszone-comments-border-hover-dark: #5f6368;\n\n// ==========================================================================\n// COLORS - STATUS: SUCCESS\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-success: #10b981;\n$presszone-comments-success-hover: #059669;\n$presszone-comments-success-dim: rgba(16, 185, 129, 0.2);\n$presszone-comments-success-dim-alt: rgba(74, 222, 128, 0.2);\n$presszone-comments-success-dim-lighter: rgba(74, 222, 128, 0.1);\n$presszone-comments-success-shadow: rgba(16, 185, 129, 0.3);\n$presszone-comments-success-shadow-hover: rgba(16, 185, 129, 0.4);\n\n// Dark Mode\n$presszone-comments-success-dark: #34d399;\n$presszone-comments-success-hover-dark: #10b981;\n$presszone-comments-success-dim-dark: rgba(52, 211, 153, 0.2);\n\n// ==========================================================================\n// COLORS - STATUS: WARNING\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-warning: #f59e0b;\n$presszone-comments-warning-hover: #d97706;\n$presszone-comments-warning-dim: rgba(245, 158, 11, 0.2);\n$presszone-comments-warning-dim-alt: rgba(251, 191, 36, 0.15);\n$presszone-comments-warning-dim-alt2: rgba(251, 191, 36, 0.08);\n$presszone-comments-warning-dim-lighter: rgba(245, 158, 11, 0.15);\n$presszone-comments-warning-dim-lightest: rgba(245, 158, 11, 0.08);\n$presszone-comments-warning-dim-lightest2: rgba(245, 158, 11, 0.05);\n$presszone-comments-warning-border: rgba(251, 191, 36, 0.3);\n$presszone-comments-warning-gradient-start: rgba(245, 158, 11, 0.15);\n$presszone-comments-warning-gradient-end: rgba(245, 158, 11, 0.08);\n\n// Dark Mode\n$presszone-comments-warning-dark: #fbbf24;\n$presszone-comments-warning-hover-dark: #fbbf24;\n$presszone-comments-warning-dim-dark: rgba(251, 191, 36, 0.2);\n$presszone-comments-warning-dim-alt-dark: rgba(251, 191, 36, 0.15);\n$presszone-comments-warning-border-dark: rgba(251, 191, 36, 0.3);\n\n// ==========================================================================\n// COLORS - STATUS: ERROR\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-error: #ef4444;\n$presszone-comments-error-hover: #dc2626;\n$presszone-comments-error-dim: rgba(239, 68, 68, 0.2);\n$presszone-comments-error-dim-alt: rgba(239, 68, 68, 0.1);\n$presszone-comments-error-dim-lighter: rgba(248, 113, 113, 0.1);\n$presszone-comments-error-dim-lightest: rgba(239, 68, 68, 0.05);\n$presszone-comments-error-border: rgba(239, 68, 68, 0.2);\n$presszone-comments-error-shadow: rgba(239, 68, 68, 0.3);\n$presszone-comments-error-shadow-hover: rgba(239, 68, 68, 0.4);\n\n// Dark Mode\n$presszone-comments-error-dark: #f87171;\n$presszone-comments-error-hover-dark: #f87171;\n$presszone-comments-error-dim-dark: rgba(248, 113, 113, 0.2);\n\n// ==========================================================================\n// COLORS - INFO\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-info-bg: rgba(168, 199, 250, 0.1);\n$presszone-comments-info-border: rgba(168, 199, 250, 0.3);\n\n// Dark Mode\n$presszone-comments-info-bg-dark: rgba(59, 130, 246, 0.2);\n\n// ==========================================================================\n// COLORS - BADGE\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-badge-category-bg: #dbeafe;\n$presszone-comments-badge-category-text: #1e40af;\n$presszone-comments-badge-section-bg: #dcfce7;\n$presszone-comments-badge-section-text: #166534;\n$presszone-comments-badge-link-bg: #fef3c7;\n$presszone-comments-badge-link-text: #92400e;\n$presszone-comments-badge-page-bg: #f3e8ff;\n$presszone-comments-badge-page-text: #7c3aed;\n\n// Dark Mode\n$presszone-comments-badge-category-bg-dark: rgba(59, 130, 246, 0.2);\n$presszone-comments-badge-category-text-dark: #93c5fd;\n$presszone-comments-badge-section-bg-dark: rgba(34, 197, 94, 0.2);\n$presszone-comments-badge-section-text-dark: #86efac;\n$presszone-comments-badge-link-bg-dark: rgba(251, 191, 36, 0.2);\n$presszone-comments-badge-link-text-dark: #fde68a;\n$presszone-comments-badge-page-bg-dark: rgba(168, 85, 247, 0.2);\n$presszone-comments-badge-page-text-dark: #d8b4fe;\n\n// ==========================================================================\n// COLORS - OVERLAYS & SURFACES\n// ==========================================================================\n\n// Overlays (shared across modes)\n$presszone-comments-overlay: rgba(0, 0, 0, 0.7);\n$presszone-comments-overlay-light: rgba(15, 23, 42, 0.6);\n$presszone-comments-overlay-dark: rgba(0, 0, 0, 0.75);\n\n// Surface hover states (shared)\n$presszone-comments-surface-hover: rgba(255, 255, 255, 0.05);\n$presszone-comments-surface-hover-light: rgba(255, 255, 255, 0.03);\n$presszone-comments-surface-hover-bright: rgba(255, 255, 255, 0.08);\n$presszone-comments-surface-border: rgba(255, 255, 255, 0.1);\n$presszone-comments-surface-dim: rgba(0, 0, 0, 0.2);\n\n// ==========================================================================\n// BORDER RADIUS\n// ==========================================================================\n\n$presszone-comments-radius: 12px;\n$presszone-comments-radius-sm: 8px;\n$presszone-comments-radius-lg: 16px;\n$presszone-comments-radius-xl: 20px;\n$presszone-comments-radius-full: 9999px;\n\n// ==========================================================================\n// BORDER WIDTH\n// ==========================================================================\n\n$presszone-comments-border-width: 1px;\n$presszone-comments-border-width-lg: 2px;\n$presszone-comments-border-width-xl: 3px;\n\n// ==========================================================================\n// BUTTON PADDING\n// ==========================================================================\n\n$presszone-comments-btn-padding-sm: 6px 14px;\n$presszone-comments-btn-padding-md: 10px 20px;\n$presszone-comments-btn-padding-lg: 14px 28px;\n\n// ==========================================================================\n// SHADOWS\n// ==========================================================================\n\n// Light Mode\n$presszone-comments-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);\n$presszone-comments-shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.05);\n$presszone-comments-shadow-hover: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);\n$presszone-comments-shadow-modal: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 12px 24px -8px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.05);\n\n// Dark Mode\n$presszone-comments-shadow-dark: 0 4px 20px rgba(0, 0, 0, 0.4);\n$presszone-comments-shadow-sm-dark: 0 2px 8px rgba(0, 0, 0, 0.3);\n$presszone-comments-shadow-hover-dark: 0 8px 30px rgba(0, 0, 0, 0.5);\n$presszone-comments-shadow-modal-dark: 0 25px 50px -12px rgba(0, 0, 0, 0.5), 0 12px 24px -8px rgba(0, 0, 0, 0.35), 0 4px 8px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(255, 255, 255, 0.05);\n\n// ==========================================================================\n// Z-INDEX SCALE\n// ==========================================================================\n\n$presszone-comments-z-base: 1;\n$presszone-comments-z-dropdown: 100;\n$presszone-comments-z-sticky: 1000;\n$presszone-comments-z-modal: 10000;\n$presszone-comments-z-tooltip: 10001;\n\n// ==========================================================================\n// BREAKPOINTS\n// ==========================================================================\n\n$presszone-comments-breakpoint-sm: 576px;\n$presszone-comments-breakpoint-md: 768px;\n$presszone-comments-breakpoint-lg: 992px;\n$presszone-comments-breakpoint-xl: 1200px;\n\n// ==========================================================================\n// ANIMATION TIMING\n// ==========================================================================\n\n// Durations\n$presszone-comments-duration-instant: 100ms;\n$presszone-comments-duration-fast: 150ms;\n$presszone-comments-duration-normal: 250ms;\n$presszone-comments-duration-slow: 350ms;\n$presszone-comments-duration-emphasis: 500ms;\n$presszone-comments-spinner-duration: 0.8s;\n$presszone-comments-stagger: 60ms;\n\n// Easing Functions\n$presszone-comments-ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);\n$presszone-comments-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);\n$presszone-comments-ease-out: cubic-bezier(0, 0, 0.2, 1);\n$presszone-comments-ease-in: cubic-bezier(0.4, 0, 1, 1);\n\n// Tab Slide Animation\n$presszone-comments-tab-slide-duration: 0.35s;\n$presszone-comments-tab-slide-easing: cubic-bezier(0.34, 1.56, 0.64, 1);\n\n// ==========================================================================\n// SPACING\n// ==========================================================================\n\n$presszone-comments-spacing-xs: 4px;\n$presszone-comments-spacing-sm: 8px;\n$presszone-comments-spacing-md: 16px;\n$presszone-comments-spacing-lg: 24px;\n$presszone-comments-spacing-xl: 32px;\n$presszone-comments-spacing-2xl: 48px;","// =============================================================================\n// Comments Press Zone - Components\n// =============================================================================\n// Buttons, badges, inputs, and form components for the admin panel.\n// Converted from main.css lines 560-900.\n// =============================================================================\n\n\n// =============================================================================\n// BUTTONS\n// =============================================================================\n\n.presszone-comments-btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 10px 20px;\n border: none;\n border-radius: $presszone-comments-radius;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim, $presszone-comments-shadow;\n\n @include dark-mode-class {\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim-dark, $presszone-comments-shadow-dark;\n }\n }\n\n // -----------------------------------------------------------------------------\n // Button Color Variants\n // -----------------------------------------------------------------------------\n\n &--primary {\n background: linear-gradient(135deg, $presszone-comments-primary, $presszone-comments-primary-hover);\n color: $presszone-comments-text-on-primary;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-primary-hover;\n }\n\n @include dark-mode-class {\n background: linear-gradient(135deg, $presszone-comments-primary-dark, $presszone-comments-primary-hover-dark);\n color: $presszone-comments-text-on-primary-dark;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-primary-hover-dark;\n }\n }\n }\n\n &--secondary {\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-border;\n }\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-border-dark;\n }\n }\n }\n\n &--ghost {\n background: transparent;\n color: $presszone-comments-text-muted;\n border: 1px solid transparent;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text;\n }\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n }\n }\n\n &--success {\n background: $presszone-comments-success;\n color: $presszone-comments-text-on-primary;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-success-hover;\n }\n\n @include dark-mode-class {\n background: $presszone-comments-success-dark;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-success-hover-dark;\n }\n }\n }\n\n &--danger {\n background: $presszone-comments-error;\n color: $presszone-comments-text-on-primary;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-error-hover;\n }\n\n @include dark-mode-class {\n background: $presszone-comments-error-dark;\n\n &:hover:not(:disabled) {\n background: $presszone-comments-error-hover-dark;\n }\n }\n }\n\n // -----------------------------------------------------------------------------\n // Button Size Variants\n // -----------------------------------------------------------------------------\n\n &--lg {\n padding: 12px 24px;\n font-size: 15px;\n font-weight: 600;\n }\n\n &--sm {\n padding: 4px 10px;\n font-size: 12px;\n }\n\n // -----------------------------------------------------------------------------\n // Button Padding Variants\n // -----------------------------------------------------------------------------\n\n &--padding-wide {\n padding: $presszone-comments-btn-padding-lg;\n }\n\n &--padding-standard {\n padding: $presszone-comments-btn-padding-md;\n }\n\n &--padding-minimal {\n padding: $presszone-comments-btn-padding-sm;\n }\n\n // -----------------------------------------------------------------------------\n // Button Styling (Border Radius) Variants\n // -----------------------------------------------------------------------------\n\n &--styling-square {\n border-radius: 0;\n }\n\n &--styling-rounded {\n border-radius: $presszone-comments-radius;\n }\n\n &--styling-pill {\n border-radius: 100px;\n }\n\n // -----------------------------------------------------------------------------\n // Button Border Variants\n // -----------------------------------------------------------------------------\n\n &--no-borders {\n border-color: transparent !important;\n box-shadow: none !important;\n\n &:hover {\n border-color: $presszone-comments-border !important;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark !important;\n }\n }\n }\n}\n\n// Icon Button\n.presszone-comments-btn-icon {\n background: none;\n border: none;\n padding: 6px;\n cursor: pointer;\n opacity: 0.7;\n transition: opacity 0.15s;\n\n &:hover {\n opacity: 1;\n }\n\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim;\n\n @include dark-mode-class {\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim-dark;\n }\n }\n\n &--danger {\n &:hover {\n opacity: 1;\n color: $presszone-comments-error;\n\n @include dark-mode-class {\n color: $presszone-comments-error-dark;\n }\n }\n }\n}\n\n// =============================================================================\n// BADGES\n// =============================================================================\n\n.presszone-comments-badge {\n display: inline-flex;\n align-items: center;\n padding: 2px 10px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 500;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n\n // -----------------------------------------------------------------------------\n // Badge Type Variants\n // -----------------------------------------------------------------------------\n\n &--category {\n background: $presszone-comments-badge-category-bg;\n color: $presszone-comments-badge-category-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-category-bg-dark;\n color: $presszone-comments-badge-category-text-dark;\n }\n }\n\n &--comments-section {\n background: $presszone-comments-badge-section-bg;\n color: $presszone-comments-badge-section-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-section-bg-dark;\n color: $presszone-comments-badge-section-text-dark;\n }\n }\n\n &--link {\n background: $presszone-comments-badge-link-bg;\n color: $presszone-comments-badge-link-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-link-bg-dark;\n color: $presszone-comments-badge-link-text-dark;\n }\n }\n\n &--page {\n background: $presszone-comments-badge-page-bg;\n color: $presszone-comments-badge-page-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-page-bg-dark;\n color: $presszone-comments-badge-page-text-dark;\n }\n }\n\n // -----------------------------------------------------------------------------\n // Badge Status Variants (for moderation)\n // -----------------------------------------------------------------------------\n\n &--success {\n background: $presszone-comments-success-dim;\n color: $presszone-comments-success;\n\n @include dark-mode-class {\n background: $presszone-comments-success-dim-dark;\n color: $presszone-comments-success-dark;\n }\n }\n\n &--danger {\n background: $presszone-comments-error-dim;\n color: $presszone-comments-error;\n\n @include dark-mode-class {\n background: $presszone-comments-error-dim-dark;\n color: $presszone-comments-error-dark;\n }\n }\n\n &--warning {\n background: $presszone-comments-warning-dim;\n color: $presszone-comments-warning;\n\n @include dark-mode-class {\n background: $presszone-comments-warning-dim-dark;\n color: $presszone-comments-warning-dark;\n }\n }\n}\n\n// =============================================================================\n// STATUS TAGS\n// =============================================================================\n\n.presszone-comments-status-tag {\n display: inline-flex;\n align-items: center;\n padding: 2px 10px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n\n &--ok {\n background: $presszone-comments-success-dim;\n color: $presszone-comments-success;\n\n @include dark-mode-class {\n background: $presszone-comments-success-dim-dark;\n color: $presszone-comments-success-dark;\n }\n }\n\n &--missing {\n background: $presszone-comments-error-dim;\n color: $presszone-comments-error;\n\n @include dark-mode-class {\n background: $presszone-comments-error-dim-dark;\n color: $presszone-comments-error-dark;\n }\n }\n}\n\n// =============================================================================\n// NODE ITEM ROW LAYOUT\n// =============================================================================\n\n.presszone-comments-node-item {\n &__row {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 12px;\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n\n &__controls {\n display: flex;\n gap: 4px;\n }\n\n &__info {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n }\n}\n\n// =============================================================================\n// INPUTS, SELECTS & TEXTAREAS\n// =============================================================================\n\n// Base styles shared by all form inputs\n.presszone-comments-input,\n.presszone-comments-select,\n.presszone-comments-textarea {\n width: 100%;\n padding: 10px 12px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius-lg;\n color: $presszone-comments-text;\n font-size: 14px;\n transition: border-color 0.15s;\n\n // Ensure consistent height\n min-height: 44px;\n line-height: 1.5;\n box-sizing: border-box;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n color: $presszone-comments-text-dark;\n }\n\n &:focus {\n outline: none;\n border-color: $presszone-comments-primary;\n\n @include dark-mode-class {\n border-color: $presszone-comments-primary-dark;\n }\n }\n\n &:focus-visible {\n outline: none;\n border-color: $presszone-comments-primary;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim;\n\n @include dark-mode-class {\n border-color: $presszone-comments-primary-dark;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim-dark;\n }\n }\n}\n\n// Settings input variant\n.presszone-comments-input--settings {\n @extend .presszone-comments-input;\n}\n\n// Settings textarea variant\n.presszone-comments-textarea--settings {\n @extend .presszone-comments-textarea;\n}\n\n// Settings select with custom dropdown arrow\n.presszone-comments-select--settings {\n @extend .presszone-comments-select;\n appearance: none;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-position: right 12px center;\n padding-inline-end: 32px;\n\n @include dark-mode-class {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239aa0a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");\n }\n}\n\n// Input size variants\n.presszone-comments-input {\n &--small {\n width: 120px;\n }\n}\n\n// Textarea code variant\n.presszone-comments-textarea {\n &--code {\n font-family: \"SF Mono\", \"Consolas\", monospace;\n font-size: 13px;\n }\n}\n\n// -----------------------------------------------------------------------------\n// Input/Select/Textarea Padding Variants\n// -----------------------------------------------------------------------------\n\n.presszone-comments-input,\n.presszone-comments-textarea {\n &--padding-wide {\n padding: 12px 16px !important;\n }\n\n &--padding-standard {\n padding: 6px 10px !important;\n min-height: 36px !important; // Reduced to match select with standard padding\n }\n\n &--padding-minimal {\n padding: 6px 10px !important;\n min-height: 36px !important;\n }\n}\n\n.presszone-comments-select {\n &--padding-wide {\n padding: 12px 16px !important;\n }\n\n &--padding-standard {\n padding: 6px 10px !important;\n min-height: 36px !important; // Ensure consistent height with input\n }\n\n &--padding-minimal {\n padding: 6px 10px !important;\n min-height: 36px !important;\n }\n}\n\n// -----------------------------------------------------------------------------\n// Input/Select/Textarea Styling (Border Radius) Variants\n// -----------------------------------------------------------------------------\n\n.presszone-comments-select,\n.presszone-comments-input,\n.presszone-comments-textarea {\n &--styling-square {\n border-radius: 0 !important;\n }\n\n &--styling-rounded {\n border-radius: $presszone-comments-radius !important;\n }\n}\n\n.presszone-comments-select,\n.presszone-comments-input {\n &--styling-pill {\n border-radius: 100px !important;\n }\n}\n\n.presszone-comments-textarea {\n &--styling-pill {\n border-radius: 45px !important;\n }\n}\n\n// -----------------------------------------------------------------------------\n// Input/Select/Textarea Border Variants\n// -----------------------------------------------------------------------------\n\n.presszone-comments-select,\n.presszone-comments-input,\n.presszone-comments-textarea {\n &--no-borders {\n border-color: transparent !important;\n box-shadow: none !important;\n\n &:hover {\n border-color: $presszone-comments-border !important;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark !important;\n }\n }\n }\n}\n\n// =============================================================================\n// FORMS\n// =============================================================================\n\n.presszone-comments-form-group {\n margin-bottom: 20px;\n\n label {\n display: block;\n }\n}\n\n// =============================================================================\n// AUTOCOMPLETE\n// =============================================================================\n\n.presszone-comments-autocomplete {\n position: relative;\n width: 100%;\n\n &__dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n margin-top: 4px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n box-shadow: $presszone-comments-shadow;\n max-height: 300px;\n overflow-y: auto;\n z-index: 1000;\n opacity: 0;\n visibility: hidden;\n transform: translateY(-8px);\n transition: all 0.2s ease;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n box-shadow: $presszone-comments-shadow-dark;\n }\n\n &.is-visible {\n opacity: 1;\n visibility: visible;\n transform: translateY(0);\n }\n }\n\n &__item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 12px;\n cursor: pointer;\n transition: background 0.15s ease;\n\n &:hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n }\n\n &__avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n flex-shrink: 0;\n }\n\n &__info {\n flex: 1;\n min-width: 0;\n }\n\n &__name {\n font-weight: 500;\n font-size: 14px;\n color: $presszone-comments-text;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &__username {\n font-size: 12px;\n color: $presszone-comments-text-muted;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__message {\n padding: 12px;\n text-align: center;\n font-size: 13px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &--error {\n color: $presszone-comments-error;\n }\n }\n}\n\n// =============================================================================\n// SETTINGS CARD COMPONENT\n// =============================================================================\n// Used throughout Settings, Tools, and Design pages for grouping content.\n\n.presszone-comments-settings-card {\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius-lg;\n margin-bottom: 20px;\n overflow: hidden;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n // Card Header - Icon + Title/Description in a ROW\n &__header {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 16px;\n padding: 20px 24px;\n border-bottom: 1px solid $presszone-comments-border;\n cursor: default;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n }\n\n // Icon container - inline with title\n &__icon {\n flex-shrink: 0;\n font-size: 24px;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n\n // Title\n &__title {\n margin: 0 !important;\n font-size: 16px;\n font-weight: 600;\n color: $presszone-comments-text;\n line-height: 1.3;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n // Description\n &__desc {\n margin: 2px 0 0 0 !important;\n font-size: 13px;\n color: $presszone-comments-text-muted;\n line-height: 1.4;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n // Card Body\n &__body {\n padding: 20px 24px;\n }\n\n // Info blocks inside settings cards\n &__info {\n padding: 12px 16px;\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius;\n font-size: 13px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n // Collapsible state\n &--collapsible {\n .presszone-comments-settings-card__header {\n cursor: pointer;\n transition: background-color 0.15s;\n\n &:hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n }\n }\n\n &--collapsed {\n .presszone-comments-settings-card__body {\n display: none;\n }\n\n .presszone-comments-settings-card__header {\n border-bottom: none;\n }\n }\n\n // Warning state\n &--warning {\n border-color: $presszone-comments-warning;\n\n .presszone-comments-settings-card__header {\n background: rgba($presszone-comments-warning, 0.1);\n border-bottom-color: rgba($presszone-comments-warning, 0.3);\n }\n }\n}\n\n// =============================================================================\n// TOOL ITEM COMPONENT\n// =============================================================================\n// Used in Tools page for individual tool actions.\n\n.presszone-comments-tool-item {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n gap: 16px;\n padding: 16px 0;\n border-bottom: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n &:last-child {\n border-bottom: none;\n padding-bottom: 0;\n }\n\n &:first-child {\n padding-top: 0;\n }\n\n // Icon - inline on the left\n &__icon {\n flex-shrink: 0;\n font-size: 20px;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n }\n\n // Content - takes remaining space\n &__content {\n flex: 1;\n min-width: 0;\n }\n\n // Title\n &__title {\n margin: 0 0 4px 0;\n font-size: 14px;\n font-weight: 600;\n color: $presszone-comments-text;\n line-height: 1.3;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n // Description\n &__desc {\n margin: 0;\n font-size: 13px;\n color: $presszone-comments-text-muted;\n line-height: 1.4;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n // Help text\n &__help {\n display: block;\n margin-top: 4px;\n font-size: 12px;\n color: $presszone-comments-text-muted;\n opacity: 0.8;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n // Action button container\n &__action {\n flex-shrink: 0;\n display: flex;\n align-items: center;\n }\n\n // Running state\n &--running {\n opacity: 0.7;\n }\n\n // Success state\n &--success {\n .presszone-comments-tool-item__icon {\n color: $presszone-comments-success;\n }\n }\n}\n\n// Tool spinner\n.presszone-comments-tool-spinner {\n display: inline-block;\n width: 14px;\n height: 14px;\n border: 2px solid currentColor;\n border-radius: 50%;\n border-top-color: transparent;\n animation: presszone-comments-spin 0.8s linear infinite;\n}\n\n// Tool checkmark\n.presszone-comments-tool-checkmark {\n display: inline-block;\n color: $presszone-comments-success;\n font-weight: bold;\n}\n\n// =============================================================================\n// STAT CARD COMPONENT\n// =============================================================================\n// Used in Dashboard and Moderation Overview for statistics.\n// Single-line horizontal layout: icon | number | label\n\n.presszone-comments-stat-card {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n padding: 20px;\n border-left: 4px solid transparent;\n transition: border-color 0.2s ease;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n\n // Icon on left\n &__icon {\n font-size: 28px;\n line-height: 1;\n flex-shrink: 0;\n }\n\n // Value (number) in middle\n &__value {\n font-size: 24px;\n font-weight: 700;\n line-height: 1;\n transition: color 0.2s ease;\n flex-shrink: 0;\n }\n\n // Label on right - smaller, medium weight\n &__label {\n font-size: 14px;\n font-weight: 600;\n line-height: 1.2;\n white-space: nowrap;\n transition: color 0.2s ease;\n }\n\n // Color modifiers\n &--red {\n border-left-color: #e53935;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #e53935;\n }\n }\n\n &--orange {\n border-left-color: #fb8c00;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #fb8c00;\n }\n }\n\n &--yellow {\n border-left-color: #fdd835;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #fdd835;\n }\n }\n\n &--blue {\n border-left-color: #42a5f5;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #42a5f5;\n }\n }\n\n &--green {\n border-left-color: #43a047;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #43a047;\n }\n }\n\n &--purple {\n border-left-color: #8e24aa;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #8e24aa;\n }\n }\n\n &--cyan {\n border-left-color: #00acc1;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #00acc1;\n }\n }\n\n &--brown {\n border-left-color: #6d4c41;\n\n .presszone-comments-stat-card__value,\n .presszone-comments-stat-card__label {\n color: #6d4c41;\n }\n }\n}\n\n// Stats grid container\n.presszone-comments-stats-row {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));\n gap: 16px;\n margin-top: 24px;\n}\n\n// =============================================================================\n// TOOLS PAGE GRID\n// =============================================================================\n\n.presszone-comments-tools {\n &__grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 24px;\n }\n}","// =============================================================================\n// Comments Press Zone - Forms, Dashboard & Widgets\n// =============================================================================\n// Form elements, dashboard header, stat widgets, activity and health panels.\n// Converted from main.css lines 895-1150.\n// =============================================================================\n\n\n// =============================================================================\n// FORM GROUPS\n// =============================================================================\n\n.presszone-comments-form-group {\n margin-bottom: 20px;\n\n label {\n display: block;\n margin-bottom: 6px;\n font-weight: 500;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n .presszone-comments-label--settings {\n font-size: 13px;\n font-weight: 600;\n color: $presszone-comments-text;\n display: flex !important;\n align-items: center;\n gap: 6px;\n margin-bottom: 2px !important;\n white-space: nowrap;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &--checkbox {\n label {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n }\n }\n\n &--half {\n margin-bottom: 8px;\n }\n\n &--third {\n margin-bottom: 8px;\n }\n}\n\n// Standalone settings label (outside form-group)\n.presszone-comments-label--settings {\n font-size: 13px;\n font-weight: 600;\n color: $presszone-comments-text;\n display: flex !important;\n align-items: center;\n gap: 6px;\n margin-bottom: 2px !important;\n white-space: nowrap;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n}\n\n// =============================================================================\n// FORM ROWS (Grid Layouts)\n// =============================================================================\n\n.presszone-comments-form-row {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n\n &--thirds {\n grid-template-columns: 1fr 1fr 1fr;\n }\n}\n\n// =============================================================================\n// FORM HELP TEXT\n// =============================================================================\n\n.presszone-comments-form-help {\n margin-top: 4px;\n font-size: 12px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &--row {\n margin-top: -8px;\n margin-bottom: 20px;\n }\n}\n\n// =============================================================================\n// TOOLTIP TRIGGER BUTTON\n// =============================================================================\n\n.presszone-comments-tooltip-trigger {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n padding: 0;\n margin: 0;\n margin-inline-start: 4px;\n font-size: 11px;\n color: $presszone-comments-text-muted;\n background: none;\n border: none;\n cursor: help;\n opacity: 0.6;\n transition: opacity $presszone-comments-duration-fast,\n color $presszone-comments-duration-fast;\n \n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n \n &:hover {\n opacity: 1;\n color: $presszone-comments-primary;\n \n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n }\n \n &:focus {\n outline: 2px solid $presszone-comments-primary;\n outline-offset: 2px;\n opacity: 1;\n \n @include dark-mode-class {\n outline-color: $presszone-comments-primary-dark;\n }\n }\n}\n\n// =============================================================================\n// FLOATING TOOLTIP (Positioned absolutely)\n// =============================================================================\n\n.presszone-comments-floating-tooltip {\n position: absolute;\n z-index: 10000;\n display: none;\n max-width: 280px;\n padding: 10px 14px;\n background: $presszone-comments-surface;\n color: $presszone-comments-text;\n font-size: 12px;\n font-weight: 400;\n line-height: 1.5;\n border-radius: $presszone-comments-radius;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15), \n 0 0 0 1px $presszone-comments-border;\n pointer-events: none;\n animation: tooltipFadeIn 0.15s $presszone-comments-ease-smooth;\n \n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n color: $presszone-comments-text-dark;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), \n 0 0 0 1px $presszone-comments-border-dark;\n }\n \n // Arrow pointing to trigger (default: below tooltip)\n &::before {\n content: '';\n position: absolute;\n bottom: -6px;\n left: 50%;\n transform: translateX(-50%);\n border: 6px solid transparent;\n border-top-color: $presszone-comments-surface;\n \n @include dark-mode-class {\n border-top-color: $presszone-comments-surface-dark;\n }\n }\n \n // When tooltip is below trigger\n &.presszone-comments-floating-tooltip--below {\n &::before {\n top: -6px;\n bottom: auto;\n border-top-color: transparent;\n border-bottom-color: $presszone-comments-surface;\n \n @include dark-mode-class {\n border-bottom-color: $presszone-comments-surface-dark;\n }\n }\n }\n}\n\n@keyframes tooltipFadeIn {\n from {\n opacity: 0;\n transform: translateY(-4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n// =============================================================================\n// COLOR INPUT\n// =============================================================================\n\n.presszone-comments-color-input {\n display: flex;\n gap: 8px;\n align-items: center;\n\n input[type=\"color\"] {\n width: 40px;\n height: 40px;\n padding: 0;\n border: none;\n border-radius: $presszone-comments-radius;\n cursor: pointer;\n }\n}\n\n// =============================================================================\n// RADIO GROUP\n// =============================================================================\n\n.presszone-comments-radio-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n\n label {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n }\n}\n\n// =============================================================================\n// DASHBOARD\n// =============================================================================\n\n.presszone-comments-dashboard {\n &__header {\n margin-bottom: 24px;\n\n h1 {\n font-size: 28px;\n margin: 0 0 4px 0;\n }\n }\n\n &__subtitle {\n color: $presszone-comments-text-muted;\n margin: 0;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// =============================================================================\n// WIDGETS GRID\n// =============================================================================\n\n.presszone-comments-widgets {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 16px;\n margin-bottom: 24px;\n}\n\n// =============================================================================\n// WIDGET CARD\n// =============================================================================\n\n.presszone-comments-widget {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n padding: 24px;\n display: flex;\n align-items: center;\n gap: 12px;\n border-inline-start: 4px solid $presszone-comments-primary;\n transition: transform $presszone-comments-duration-normal $presszone-comments-ease-smooth,\n box-shadow $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n\n &:hover {\n transform: translateY(-2px);\n box-shadow: $presszone-comments-shadow-hover;\n\n @include dark-mode-class {\n box-shadow: $presszone-comments-shadow-hover-dark;\n }\n }\n\n // Color variants\n &--primary {\n border-inline-start-color: $presszone-comments-primary;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-primary-dark;\n }\n }\n\n &--success {\n border-inline-start-color: $presszone-comments-success;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-success-dark;\n }\n }\n\n &--warning {\n border-inline-start-color: $presszone-comments-warning;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-warning-dark;\n }\n }\n\n &--error {\n border-inline-start-color: $presszone-comments-error;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-error-dark;\n }\n }\n\n &__icon {\n font-size: 24px;\n }\n\n &__value {\n display: flex;\n align-items: baseline;\n gap: 8px;\n font-size: 20px;\n font-weight: 700;\n color: $presszone-comments-text;\n line-height: 1.2;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &__growth {\n font-size: 12px;\n font-weight: 500;\n color: $presszone-comments-success;\n opacity: 0.8;\n\n @include dark-mode-class {\n color: $presszone-comments-success-dark;\n }\n }\n\n &__label {\n font-size: 12px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__content {\n flex: 1;\n min-width: 0;\n }\n\n &__meta {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 4px;\n font-size: 12px;\n }\n\n &__trend {\n font-weight: 600;\n\n &--up {\n color: $presszone-comments-success;\n\n @include dark-mode-class {\n color: $presszone-comments-success-dark;\n }\n }\n\n &--down {\n color: $presszone-comments-error;\n\n @include dark-mode-class {\n color: $presszone-comments-error-dark;\n }\n }\n\n &--neutral {\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n }\n\n &__comparison {\n color: $presszone-comments-text-muted;\n opacity: 0.8;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// =============================================================================\n// ACTIVITY & HEALTH PANELS\n// =============================================================================\n\n.presszone-comments-activity,\n.presszone-comments-health {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n padding: 24px;\n margin-bottom: 20px;\n transition: transform $presszone-comments-duration-normal $presszone-comments-ease-smooth,\n box-shadow $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n\n &:hover {\n transform: translateY(-2px);\n box-shadow: $presszone-comments-shadow-hover;\n\n @include dark-mode-class {\n box-shadow: $presszone-comments-shadow-hover-dark;\n }\n }\n\n h2 {\n margin: 0 0 16px 0;\n font-size: 16px;\n }\n}\n\n// Activity Panel\n.presszone-comments-activity {\n &__grid {\n display: flex;\n gap: 32px;\n }\n\n &__item {\n display: flex;\n flex-direction: column;\n }\n\n &__value {\n font-size: 24px;\n font-weight: 600;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n }\n\n &__label {\n font-size: 13px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// Health Panel\n.presszone-comments-health {\n &__checks {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n &__item {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 14px;\n\n &--ok {\n color: $presszone-comments-success;\n\n @include dark-mode-class {\n color: $presszone-comments-success-dark;\n }\n }\n }\n}\n\n// =============================================================================\n// NODE TREE HEADER\n// =============================================================================\n\n.presszone-comments-node-tree {\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 24px;\n\n h1 {\n margin: 0 0 4px 0;\n }\n }\n}\n","// =============================================================================\n// Dashboard Styles for Comments Press Zone\n// =============================================================================\n\n\n// =============================================================================\n// Stats Grid (4 cards)\n// =============================================================================\n\n.presszone-comments-dashboard__stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: $presszone-comments-spacing-md;\n margin-bottom: $presszone-comments-spacing-lg;\n}\n\n// =============================================================================\n// Bottom 3-column Grid\n// =============================================================================\n\n.presszone-comments-dashboard__bottom-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: $presszone-comments-spacing-md;\n margin-top: $presszone-comments-spacing-lg;\n\n @include respond-to(xl) {\n grid-template-columns: repeat(2, 1fr);\n }\n\n @include respond-to(lg) {\n grid-template-columns: 1fr;\n }\n}\n\n// =============================================================================\n// Activity Chart (SVG)\n// =============================================================================\n\n.presszone-comments-chart-container {\n position: relative;\n height: 280px;\n width: 100%;\n padding: 20px 0;\n overflow: visible;\n\n @include respond-to(md) {\n height: 200px;\n }\n}\n\n.presszone-comments-chart-svg {\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n\n.presszone-comments-chart-gradient-start {\n stop-color: $presszone-comments-primary;\n stop-opacity: 0.2;\n}\n\n.presszone-comments-chart-gradient-end {\n stop-color: $presszone-comments-primary;\n stop-opacity: 0;\n}\n\n.presszone-comments-chart-line {\n stroke: $presszone-comments-primary;\n stroke-width: 3;\n stroke-linecap: round;\n vector-effect: non-scaling-stroke;\n}\n\n.presszone-comments-chart-point {\n fill: $presszone-comments-surface;\n stroke: $presszone-comments-primary;\n stroke-width: 2;\n}\n\n.presszone-comments-chart-tooltip {\n position: absolute;\n top: 0;\n left: 0;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n box-shadow: $presszone-comments-shadow-hover;\n border-radius: $presszone-comments-radius;\n padding: 12px;\n pointer-events: none;\n z-index: 10;\n transition: opacity 0.2s ease, transform 0.1s linear;\n min-width: 160px;\n\n .tooltip-date {\n font-size: 12px;\n color: $presszone-comments-text-muted;\n margin-bottom: 4px;\n }\n\n .tooltip-value {\n font-size: 16px;\n font-weight: 600;\n color: $presszone-comments-text;\n }\n\n .tooltip-meta {\n font-size: 12px;\n color: $presszone-comments-text-secondary;\n margin-top: 4px;\n display: flex;\n gap: 8px;\n }\n}\n\n// =============================================================================\n// Leaderboard (Top Commenters)\n// =============================================================================\n\n.presszone-comments-leaderboard {\n display: flex;\n flex-direction: column;\n gap: $presszone-comments-spacing-xs;\n}\n\n.presszone-comments-leaderboard__item {\n display: flex;\n align-items: center;\n gap: $presszone-comments-spacing-sm;\n padding: $presszone-comments-spacing-sm;\n border-bottom: 1px solid $presszone-comments-border;\n transition: background $presszone-comments-duration-fast;\n\n &:hover {\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius-sm;\n }\n\n &:last-child {\n border-bottom: none;\n }\n}\n\n.presszone-comments-leaderboard__rank {\n font-size: 24px;\n width: 40px;\n text-align: center;\n flex-shrink: 0;\n}\n\n.presszone-comments-leaderboard__avatar {\n width: 36px;\n height: 36px;\n border-radius: 50%;\n flex-shrink: 0;\n}\n\n.presszone-comments-leaderboard__name {\n flex: 1;\n font-weight: 500;\n color: $presszone-comments-text;\n}\n\n.presszone-comments-leaderboard__count {\n color: $presszone-comments-text-muted;\n font-size: 14px;\n flex-shrink: 0;\n}\n\n// =============================================================================\n// Timeline (Mod Activity)\n// =============================================================================\n\n.presszone-comments-timeline {\n display: flex;\n flex-direction: column;\n gap: 10px; // 2px more than spacing-sm (8px) for better readability\n}\n\n.presszone-comments-timeline__item {\n display: flex;\n gap: $presszone-comments-spacing-sm;\n padding: $presszone-comments-spacing-sm;\n border-inline-start: 2px solid $presszone-comments-border;\n margin-inline-start: 12px;\n transition: border-color $presszone-comments-duration-fast;\n\n &:hover {\n border-inline-start-color: $presszone-comments-primary;\n background: $presszone-comments-surface-2;\n border-radius: 0 $presszone-comments-radius-sm $presszone-comments-radius-sm 0;\n }\n}\n\n.presszone-comments-timeline__icon {\n font-size: 20px;\n flex-shrink: 0;\n width: 24px;\n text-align: center;\n}\n\n.presszone-comments-timeline__content {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: $presszone-comments-spacing-xs;\n\n strong {\n color: $presszone-comments-text;\n }\n\n em {\n color: $presszone-comments-primary;\n font-style: normal;\n }\n}\n\n.presszone-comments-timeline__time {\n color: $presszone-comments-text-muted;\n font-size: 12px;\n}\n\n// =============================================================================\n// Reports List\n// =============================================================================\n\n.presszone-comments-reports-list {\n display: flex;\n flex-direction: column;\n gap: $presszone-comments-spacing-sm;\n}\n\n.presszone-comments-list-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: $presszone-comments-spacing-sm;\n border-bottom: 1px solid $presszone-comments-border;\n gap: $presszone-comments-spacing-md;\n transition: background $presszone-comments-duration-fast;\n\n &:hover {\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius-sm;\n }\n\n &:last-child {\n border-bottom: none;\n }\n}\n\n.presszone-comments-list-item__content {\n flex: 1;\n min-width: 0;\n\n strong {\n color: $presszone-comments-text;\n font-size: 14px;\n display: block;\n margin-bottom: 4px;\n }\n\n p {\n color: $presszone-comments-text-muted;\n font-size: 13px;\n margin: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n\n// =============================================================================\n// Empty States\n// =============================================================================\n\n.presszone-comments-empty {\n text-align: center;\n padding: $presszone-comments-spacing-lg;\n color: $presszone-comments-text-muted;\n}\n\n.presszone-comments-empty-state {\n text-align: center;\n padding: 60px 24px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 20px;\n\n h3 {\n margin: 0;\n color: $presszone-comments-text;\n font-size: 18px;\n }\n\n p {\n margin: 0;\n color: $presszone-comments-text-muted;\n font-size: 14px;\n }\n}\n\n.presszone-comments-empty-state__icon {\n font-size: 80px;\n line-height: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n opacity: 1;\n margin-bottom: 20px;\n pointer-events: none;\n animation: presszone-comments-float 3s ease-in-out infinite;\n}\n\n@keyframes presszone-comments-float {\n 0%, 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(-10px);\n }\n}\n\n// =============================================================================\n// Reduced Motion\n// =============================================================================\n\n@include reduced-motion {\n .presszone-comments-chart__bar {\n transition: none;\n transform: none;\n }\n\n .presszone-comments-leaderboard__item,\n .presszone-comments-timeline__item,\n .presszone-comments-list-item {\n transition: none;\n }\n\n .presszone-comments-empty-state__icon {\n animation: none !important;\n }\n}\n\n// =============================================================================\n// Activity Feed Item (New)\n// =============================================================================\n\n.presszone-comments-activity-item {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n padding: 12px 0;\n border-bottom: 1px solid $presszone-comments-border;\n\n &:last-child {\n border-bottom: none;\n }\n}\n\n.presszone-comments-activity-item__icon {\n font-size: 20px;\n width: 24px;\n text-align: center;\n flex-shrink: 0;\n line-height: 1;\n}\n\n.presszone-comments-activity-item__content {\n flex: 1;\n min-width: 0;\n}\n\n.presszone-comments-activity-item__header {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n font-size: 14px;\n line-height: 1.4;\n margin-bottom: 4px;\n}\n\n.presszone-comments-activity-item__user {\n font-weight: 600;\n color: $presszone-comments-text;\n}\n\n.presszone-comments-activity-item__action {\n color: $presszone-comments-text-secondary;\n}\n\n.presszone-comments-activity-item__time {\n color: $presszone-comments-text-muted;\n font-size: 12px;\n margin-inline-start: auto;\n}\n\n.presszone-comments-activity-item__reason {\n margin-top: 4px;\n font-size: 13px;\n color: $presszone-comments-text-secondary;\n background: $presszone-comments-surface-2;\n padding: 4px 8px;\n border-radius: 4px;\n display: inline-block;\n}\n\n.presszone-comments-activity-item__meta {\n margin-top: 4px;\n font-size: 12px;\n color: $presszone-comments-text-muted;\n}\n","// =============================================================================\n// Comments Press Zone - Modals, Node Tree & Permissions SCSS\n// =============================================================================\n// Contains styles for:\n// - Node Tree (drag-and-drop structure management)\n// - Modal dialogs (admin-only)\n// - Permissions table and grid\n// - Settings page header\n// =============================================================================\n\n\n// =============================================================================\n// NODE TREE COMPONENT\n// =============================================================================\n\n.presszone-comments-node-tree {\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 24px;\n\n h1 {\n margin: 0 0 4px 0;\n }\n\n p {\n color: $presszone-comments-text-muted;\n margin: 0;\n font-size: 14px;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n }\n\n &__header-actions {\n display: flex;\n gap: 8px;\n align-items: center;\n }\n\n &__content {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n padding: 16px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n }\n}\n\n// =============================================================================\n// UNDO BUTTON VARIANT\n// =============================================================================\n\n.presszone-comments-btn--undo {\n background: rgba(245, 158, 11, 0.15);\n color: $presszone-comments-warning;\n border: 1px solid $presszone-comments-warning;\n\n @include dark-mode-class {\n color: $presszone-comments-warning-dark;\n border-color: $presszone-comments-warning-dark;\n }\n\n &:hover:not(:disabled) {\n background: rgba(245, 158, 11, 0.25);\n }\n}\n\n// =============================================================================\n// NODE LIST\n// =============================================================================\n\n.presszone-comments-node-list {\n list-style: none;\n padding: 0;\n margin: 0;\n}\n\n// =============================================================================\n// NODE ITEM\n// =============================================================================\n\n.presszone-comments-node-item {\n margin-bottom: 4px;\n\n &__content {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 12px;\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n\n &--dragging &__content {\n box-shadow: $presszone-comments-shadow;\n\n @include dark-mode-class {\n box-shadow: $presszone-comments-shadow-dark;\n }\n }\n\n &__handle {\n cursor: grab;\n color: $presszone-comments-text-muted;\n user-select: none;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__icon {\n font-size: 16px;\n }\n\n &__title {\n flex: 1;\n font-weight: 500;\n }\n\n &__type {\n font-size: 11px;\n padding: 2px 8px;\n border-radius: 12px;\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n text-transform: uppercase;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n\n // Node type color coding\n &--category {\n background: $presszone-comments-badge-category-bg;\n color: $presszone-comments-badge-category-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-category-bg-dark;\n color: $presszone-comments-badge-category-text-dark;\n }\n }\n\n &--link {\n background: $presszone-comments-badge-link-bg;\n color: $presszone-comments-badge-link-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-link-bg-dark;\n color: $presszone-comments-badge-link-text-dark;\n }\n }\n\n &--comments-section {\n background: $presszone-comments-badge-section-bg;\n color: $presszone-comments-badge-section-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-section-bg-dark;\n color: $presszone-comments-badge-section-text-dark;\n }\n }\n\n &--page {\n background: $presszone-comments-badge-page-bg;\n color: $presszone-comments-badge-page-text;\n\n @include dark-mode-class {\n background: $presszone-comments-badge-page-bg-dark;\n color: $presszone-comments-badge-page-text-dark;\n }\n }\n }\n\n &__inactive {\n font-size: 11px;\n color: $presszone-comments-warning;\n\n @include dark-mode-class {\n color: $presszone-comments-warning-dark;\n }\n }\n\n &__actions {\n display: flex;\n gap: 4px;\n opacity: 1;\n transition: opacity $presszone-comments-duration-fast;\n }\n\n &__arrows {\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin-inline-end: 8px;\n }\n}\n\n// =============================================================================\n// ARROW BUTTONS\n// =============================================================================\n\n.presszone-comments-btn-arrow {\n background: $presszone-comments-surface-2;\n border: 1px solid $presszone-comments-border;\n border-radius: 4px;\n width: 20px;\n height: 16px;\n font-size: 8px;\n line-height: 1;\n cursor: pointer;\n color: $presszone-comments-text-muted;\n transition: all $presszone-comments-duration-fast;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-color: $presszone-comments-border-dark;\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover:not(:disabled) {\n background: $presszone-comments-primary-dim;\n border-color: $presszone-comments-primary;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n border-color: $presszone-comments-primary-dark;\n color: $presszone-comments-primary-dark;\n }\n }\n\n &:disabled {\n opacity: 0.3;\n cursor: not-allowed;\n }\n}\n\n// =============================================================================\n// SAVING INDICATOR\n// =============================================================================\n\n.presszone-comments-saving-indicator {\n position: fixed;\n bottom: 24px;\n inset-inline-end: 24px;\n background: $presszone-comments-surface;\n padding: 12px 20px;\n border-radius: $presszone-comments-radius;\n box-shadow: $presszone-comments-shadow;\n font-size: 14px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n box-shadow: $presszone-comments-shadow-dark;\n }\n}\n\n// =============================================================================\n// MODAL COMPONENT\n// Admin-only modal styles - scoped to prevent frontend conflicts\n// =============================================================================\n\n.presszone-comments-admin {\n .presszone-comments-modal-overlay {\n position: fixed;\n inset: 0;\n background: $presszone-comments-overlay;\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: $presszone-comments-z-modal;\n\n @include dark-mode-class {\n background: $presszone-comments-overlay-dark;\n }\n }\n\n .presszone-comments-modal {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-xl;\n width: 100%;\n max-width: 500px;\n height: 600px; // Fixed height to prevent jitter when switching tabs\n max-height: 90vh;\n display: flex;\n flex-direction: column;\n box-shadow: $presszone-comments-shadow;\n overflow: hidden;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n box-shadow: $presszone-comments-shadow-dark;\n }\n\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n padding: 20px 24px 0; // Reduced bottom padding for tabs\n border-bottom: none;\n flex-shrink: 0;\n }\n\n &__content {\n padding: 16px 24px 24px; // Reduced top padding\n flex: 1;\n overflow-y: auto; // Scroll internally\n }\n\n &__form {\n padding: 16px 24px 24px; // Consistent with content\n }\n\n &__actions {\n display: flex;\n gap: 12px;\n padding: 16px 24px;\n border-top: 1px solid $presszone-comments-border;\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n border-top-color: $presszone-comments-border-dark;\n background: $presszone-comments-surface-2-dark;\n }\n }\n }\n}\n\n// =============================================================================\n// PERMISSIONS COMPONENT\n// =============================================================================\n\n.presszone-comments-permissions {\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 24px;\n\n h1 {\n margin: 0 0 4px 0;\n }\n\n p {\n color: $presszone-comments-text-muted;\n margin: 0;\n font-size: 14px;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n }\n\n &__actions {\n display: flex;\n gap: 8px;\n }\n}\n\n// =============================================================================\n// PERMISSION LEGEND\n// =============================================================================\n\n.presszone-comments-perm-legend {\n display: flex;\n gap: 24px;\n margin-bottom: 16px;\n font-size: 14px;\n\n &__item {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n}\n\n// =============================================================================\n// ROLE HEADER & TOOLTIPS\n// =============================================================================\n\n.presszone-comments-perm-table__role-header {\n white-space: nowrap;\n}\n\n.presszone-comments-role-name {\n margin-inline-end: 4px;\n}\n\n.presszone-comments-role-tooltip,\n.presszone-comments-cap-tooltip,\n.presszone-comments-tooltip {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n font-size: 11px;\n color: $presszone-comments-text-muted;\n cursor: help;\n opacity: 0.6;\n transition: opacity $presszone-comments-duration-fast;\n position: relative;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n opacity: 1;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n }\n}\n\n// Custom Tooltip Popup using title attribute\n.presszone-comments-tooltip {\n &::after {\n content: attr(title);\n position: absolute;\n top: calc(100% + 8px);\n inset-inline-start: 50%;\n transform: translateX(-50%);\n padding: 10px 14px;\n background: $presszone-comments-surface;\n color: $presszone-comments-text;\n font-size: 12px;\n font-weight: 400;\n line-height: 1.5;\n white-space: normal;\n width: max-content;\n max-width: 280px;\n border-radius: 8px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15), 0 0 0 1px $presszone-comments-border;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;\n z-index: $presszone-comments-z-modal;\n pointer-events: none;\n text-align: start;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n color: $presszone-comments-text-dark;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4), 0 0 0 1px $presszone-comments-border-dark;\n }\n }\n\n &::before {\n content: '';\n position: absolute;\n top: calc(100% + 2px);\n inset-inline-start: 50%;\n transform: translateX(-50%);\n border: 6px solid transparent;\n border-bottom-color: $presszone-comments-surface;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.2s ease, visibility 0.2s ease;\n z-index: $presszone-comments-z-tooltip;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-surface-dark;\n }\n }\n\n &:hover {\n &::after,\n &::before {\n opacity: 1;\n visibility: visible;\n }\n\n &::after {\n transform: translateX(-50%) translateY(4px);\n }\n }\n}\n\n.presszone-comments-perm-table__cap {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.presszone-comments-perm-trace__help {\n color: $presszone-comments-text-muted;\n font-size: 13px;\n margin: 0 0 12px 0;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n// =============================================================================\n// PERMISSION TABLE WRAPPER\n// =============================================================================\n\n.presszone-comments-perm-table-wrapper {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n overflow: auto; // Enable scrolling\n max-width: 100%;\n border: 1px solid $presszone-comments-border;\n position: relative;\n max-height: calc(100vh - 200px); // Limit height to viewport\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n}\n\n// =============================================================================\n// PERMISSION GRID (DIV-BASED)\n// =============================================================================\n\n.presszone-comments-perm-grid-wrapper {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n border: 1px solid $presszone-comments-border;\n overflow: auto;\n max-height: calc(100vh - 200px);\n position: relative;\n box-shadow: $presszone-comments-shadow-sm;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n box-shadow: $presszone-comments-shadow-sm-dark;\n }\n}\n\n.presszone-comments-perm-grid {\n display: grid;\n // grid-template-columns set inline in JS\n min-width: 100%;\n\n &__cell {\n padding: 16px 12px;\n display: flex;\n align-items: center;\n border-bottom: 1px solid $presszone-comments-border;\n background: $presszone-comments-surface;\n font-size: 14px;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n background: $presszone-comments-surface-dark;\n color: $presszone-comments-text-dark;\n }\n\n // Header Cells\n &--header {\n background: $presszone-comments-surface-2;\n font-weight: 600;\n position: sticky;\n top: 0;\n z-index: 10;\n border-bottom: 2px solid $presszone-comments-border;\n justify-content: center;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-bottom-color: $presszone-comments-border-dark;\n }\n }\n\n // Capability Column (Sticky Left)\n &--cap {\n position: sticky;\n inset-inline-start: 0;\n z-index: 5;\n background: $presszone-comments-surface;\n border-inline-end: 2px solid $presszone-comments-border;\n font-weight: 500;\n justify-content: flex-start;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-inline-end-color: $presszone-comments-border-dark;\n }\n }\n\n // Top-Left Corner (Sticky Both)\n &--sticky-corner {\n position: sticky;\n top: 0;\n inset-inline-start: 0;\n z-index: 20;\n background: $presszone-comments-surface-2;\n border-inline-end: 2px solid $presszone-comments-border;\n justify-content: flex-start;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-inline-end-color: $presszone-comments-border-dark;\n }\n }\n\n // Action Cells\n &--action {\n justify-content: center;\n\n &:hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n }\n }\n}\n\n// =============================================================================\n// SETTINGS GROUP (HORIZONTAL LAYOUT)\n// =============================================================================\n\n.presszone-comments-settings-group--horizontal {\n display: flex;\n flex-wrap: wrap;\n gap: 24px;\n align-items: flex-end; // Align bottom to match inputs\n\n > .presszone-comments-form-group {\n flex: 1;\n min-width: 250px;\n margin-bottom: 0; // Remove bottom margin inside group\n }\n}\n\n// =============================================================================\n// LEGACY PERMISSION TABLE STYLES\n// DEPRECATED: Use .presszone-comments-perm-grid instead\n// These styles are kept for backwards compatibility but should not be used in new code\n// =============================================================================\n\n.presszone-comments-perm-cell {\n width: 32px;\n height: 32px;\n border: none;\n border-radius: 50%;\n font-weight: 700;\n cursor: pointer;\n transition: all $presszone-comments-duration-fast;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin: 0 auto;\n padding: 0;\n font-size: 14px;\n\n &--allow {\n background: $presszone-comments-success-dim-alt;\n color: $presszone-comments-success;\n\n @include dark-mode-class {\n background: $presszone-comments-success-dim-dark;\n color: $presszone-comments-success-dark;\n }\n }\n\n &--inherit {\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &--never {\n background: $presszone-comments-error-dim;\n color: $presszone-comments-error;\n\n @include dark-mode-class {\n background: $presszone-comments-error-dim-dark;\n color: $presszone-comments-error-dark;\n }\n }\n}\n\n// =============================================================================\n// PERMISSION TRACE COMPONENT\n// =============================================================================\n\n.presszone-comments-perm-trace {\n margin-top: 32px;\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n padding: 20px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n\n h2 {\n margin: 0 0 16px 0;\n font-size: 16px;\n }\n\n &__form {\n display: flex;\n gap: 12px;\n align-items: center;\n flex-wrap: wrap;\n\n .presszone-comments-input,\n .presszone-comments-select {\n width: auto;\n min-width: 150px;\n }\n }\n\n &__result {\n margin-top: 16px;\n padding: 16px;\n border-radius: $presszone-comments-radius;\n\n h3 {\n margin: 0 0 12px 0;\n }\n\n ul {\n margin: 0;\n padding-inline-start: 20px;\n font-size: 13px;\n }\n\n &--allowed {\n background: $presszone-comments-success-dim-lighter;\n border: 1px solid $presszone-comments-success;\n\n @include dark-mode-class {\n background: $presszone-comments-success-dim-dark;\n border-color: $presszone-comments-success-dark;\n }\n }\n\n &--denied {\n background: $presszone-comments-error-dim-lighter;\n border: 1px solid $presszone-comments-error;\n\n @include dark-mode-class {\n background: $presszone-comments-error-dim-dark;\n border-color: $presszone-comments-error-dark;\n }\n }\n }\n}\n\n// =============================================================================\n// SETTINGS PAGE HEADER\n// =============================================================================\n\n.presszone-comments-settings {\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 24px;\n\n h1 {\n margin: 0;\n }\n }\n}\n","// =============================================================================\n// Comments Press Zone - Settings, Tabs & Moderation Styles\n// =============================================================================\n// Converted from main.css lines 1700-2500\n// Contains: Settings panel, tabs component, tag input, moderation queue,\n// dashboard grid, lists, charts, and activity components.\n// =============================================================================\n\n\n// =============================================================================\n// SETTINGS COMPONENT\n// =============================================================================\n\n.presszone-comments-settings {\n // Settings Tabs (pill-style)\n &__tabs {\n display: flex;\n gap: 4px;\n margin-bottom: 24px;\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius;\n padding: 4px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n }\n\n // Individual Tab Button\n &__tab {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 10px 16px;\n background: none;\n border: none;\n border-radius: $presszone-comments-radius;\n color: $presszone-comments-text-muted;\n cursor: pointer;\n transition: all $presszone-comments-duration-fast;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &--active {\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n }\n }\n\n // Settings Panel Card\n &__panel {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n padding: 24px;\n transition: transform 0.2s ease, box-shadow 0.2s ease;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n\n &:hover {\n transform: translateY(-2px);\n box-shadow: $presszone-comments-shadow-hover;\n\n @include dark-mode-class {\n box-shadow: $presszone-comments-shadow-hover-dark;\n }\n }\n }\n\n // Section Title\n &__section-title {\n font-size: 14px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n color: $presszone-comments-primary;\n margin: 0 0 16px 0;\n padding-bottom: 8px;\n border-bottom: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n &:not(:first-child) {\n margin-top: 28px;\n }\n }\n\n // Footer\n &__footer {\n margin-top: 24px;\n padding-top: 24px;\n border-top: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-top-color: $presszone-comments-border-dark;\n }\n }\n}\n\n// Settings Subset (indented nested options)\n.presszone-comments-settings-subset {\n padding-inline-start: 24px;\n margin-top: 16px;\n border-inline-start: 2px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-border-dark;\n }\n}\n\n// Settings Nested Options (for checkboxes under toggle)\n.presszone-comments-settings-nested {\n padding-inline-start: 24px;\n margin-top: 12px;\n padding-top: 12px;\n border-inline-start: 2px solid $presszone-comments-border;\n animation: presszone-comments-slide-in-up $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-border-dark;\n }\n\n .presszone-comments-toggle-row {\n margin-bottom: 8px;\n }\n\n .presszone-comments-form-group {\n margin-bottom: 12px;\n }\n}\n\n// =============================================================================\n// MODERN TABS COMPONENT\n// =============================================================================\n\n.presszone-comments-tabs {\n display: flex;\n gap: 0;\n border-bottom: 1px solid $presszone-comments-border;\n margin-bottom: 24px;\n position: relative;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n // Mobile: horizontal scroll with fade indicators\n @media (max-width: 768px) {\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: thin;\n -webkit-overflow-scrolling: touch;\n\n &::-webkit-scrollbar {\n height: 3px;\n }\n\n &::-webkit-scrollbar-track {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n\n &::-webkit-scrollbar-thumb {\n background: $presszone-comments-border;\n border-radius: 3px;\n\n @include dark-mode-class {\n background: $presszone-comments-border-dark;\n }\n }\n\n // Left fade indicator\n &::before {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n width: 40px;\n background: linear-gradient(to right, $presszone-comments-bg, transparent);\n pointer-events: none;\n z-index: 1;\n\n @include dark-mode-class {\n background: linear-gradient(to right, $presszone-comments-bg-dark, transparent);\n }\n }\n\n // Right fade indicator\n &::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n width: 40px;\n background: linear-gradient(to left, $presszone-comments-bg, transparent);\n pointer-events: none;\n z-index: 1;\n\n @include dark-mode-class {\n background: linear-gradient(to left, $presszone-comments-bg-dark, transparent);\n }\n }\n }\n\n // Tab Item\n &__item {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 12px 20px;\n background: transparent;\n border: none;\n color: $presszone-comments-text-muted;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: color 0.2s ease, background-color 0.2s ease;\n white-space: nowrap;\n flex-shrink: 0;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &::after {\n content: '';\n position: absolute;\n bottom: -1px;\n inset-inline-start: 0;\n inset-inline-end: 0;\n height: 2px;\n background: transparent;\n transition: background-color 0.2s ease;\n }\n\n &:hover {\n color: $presszone-comments-text;\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n background: $presszone-comments-surface-2-dark;\n }\n }\n\n &--active {\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n\n &::after {\n background: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dark;\n }\n }\n\n .presszone-comments-tabs__count {\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n }\n }\n }\n\n // Tab Icon\n &__icon {\n font-size: 16px;\n }\n\n // Tab Count Badge\n &__count {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 20px;\n height: 20px;\n padding: 0 6px;\n font-size: 11px;\n font-weight: 600;\n background: $presszone-comments-surface-2;\n border-radius: 10px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n // Modal Tabs Variant (compact)\n &--modal {\n margin-bottom: 0;\n border-bottom: none;\n padding: 0 24px;\n gap: 0;\n\n .presszone-comments-tabs__item {\n padding: 10px 16px;\n font-size: 13px;\n }\n }\n}\n\n// Legacy Tab Class (backward compatibility)\n.presszone-comments-admin .presszone-comments-tab {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 10px 16px;\n background: transparent;\n border: none;\n color: $presszone-comments-text-muted;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition: color 0.2s ease;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n inset-inline-start: 0;\n inset-inline-end: 0;\n height: 2px;\n background: transparent;\n transition: background-color 0.2s ease;\n }\n\n &:hover {\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &.active {\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n\n &::after {\n background: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dark;\n }\n }\n }\n}\n\n// =============================================================================\n// TAG INPUT COMPONENT\n// =============================================================================\n\n.presszone-comments-tag-input {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n padding: 10px 12px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n min-height: 48px;\n transition: border-color $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n &:focus-within {\n border-color: $presszone-comments-primary;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim;\n\n @include dark-mode-class {\n border-color: $presszone-comments-primary-dark;\n box-shadow: 0 0 0 3px $presszone-comments-primary-dim-dark;\n }\n }\n\n // Tags Container\n &__tags {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n }\n\n // Individual Tag\n &__tag {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 4px 8px 4px 12px;\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n border-radius: $presszone-comments-radius-full;\n font-size: 13px;\n font-weight: 500;\n animation: presszone-comments-pop-in $presszone-comments-duration-normal $presszone-comments-ease-spring;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n }\n\n // Tag Text (truncated)\n &__tag-text {\n max-width: 150px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n // Tag Remove Button\n &__tag-remove {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 18px;\n height: 18px;\n padding: 0;\n background: transparent;\n border: none;\n border-radius: 50%;\n color: $presszone-comments-primary;\n font-size: 14px;\n line-height: 1;\n cursor: pointer;\n transition: all $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n\n &:hover {\n background: $presszone-comments-error;\n color: $presszone-comments-text-on-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-error-dark;\n color: $presszone-comments-text-on-primary-dark;\n }\n }\n }\n\n // Input Field\n &__input {\n flex: 1;\n min-width: 120px;\n padding: 4px 0;\n background: transparent;\n border: none;\n color: $presszone-comments-text;\n font-size: 14px;\n outline: none;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n\n &::placeholder {\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n }\n}\n\n// =============================================================================\n// CHECKBOX GROUP\n// =============================================================================\n\n.presszone-comments-checkbox-group {\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.presszone-comments-checkbox-item {\n display: flex;\n align-items: center;\n gap: 10px;\n cursor: pointer;\n\n input[type=\"checkbox\"] {\n width: 18px;\n height: 18px;\n accent-color: $presszone-comments-primary;\n cursor: pointer;\n\n @include dark-mode-class {\n accent-color: $presszone-comments-primary-dark;\n }\n }\n\n &__label {\n font-size: 14px;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n}\n\n// =============================================================================\n// SAAS STATUS INDICATOR\n// =============================================================================\n\n.presszone-comments-saas-status {\n margin-top: 24px;\n padding: 16px;\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n\n h3 {\n margin: 0 0 12px 0;\n font-size: 14px;\n }\n\n &__indicator {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n &__dot {\n width: 10px;\n height: 10px;\n border-radius: 50%;\n background: $presszone-comments-warning;\n\n @include dark-mode-class {\n background: $presszone-comments-warning-dark;\n }\n }\n}\n\n// =============================================================================\n// PENDING CHANGES BAR\n// =============================================================================\n\n.presszone-comments-pending-changes-bar {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px;\n background: linear-gradient(135deg, $presszone-comments-warning-gradient-start, $presszone-comments-warning-gradient-end);\n border: 1px solid $presszone-comments-warning;\n border-radius: $presszone-comments-radius;\n margin-bottom: 16px;\n animation: presszone-comments-slide-in-down $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n border-color: $presszone-comments-warning-dark;\n }\n\n &__icon {\n font-size: 18px;\n }\n\n &__text {\n flex: 1;\n font-size: 14px;\n font-weight: 500;\n color: $presszone-comments-warning;\n\n @include dark-mode-class {\n color: $presszone-comments-warning-dark;\n }\n }\n\n &__actions {\n display: flex;\n gap: 8px;\n }\n}\n\n// =============================================================================\n// DRAG & DROP COMPONENTS\n// =============================================================================\n\n// Drag Preview\n.presszone-comments-node-drag-preview {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 16px;\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius;\n box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);\n font-weight: 500;\n border: 2px solid $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-primary-dark;\n }\n}\n\n// Node Item States\n.presszone-comments-node-item {\n &--changed .presszone-comments-node-item__content {\n border-inline-start: 3px solid $presszone-comments-warning;\n background: $presszone-comments-warning-dim-lightest2;\n\n @include dark-mode-class {\n border-inline-start-color: $presszone-comments-warning-dark;\n }\n }\n\n &--dragging {\n opacity: 0.4;\n }\n\n &--over {\n background: $presszone-comments-primary-dim;\n border-radius: $presszone-comments-radius;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n }\n }\n}\n\n// =============================================================================\n// MODERATION QUEUE\n// =============================================================================\n\n.presszone-comments-moderation {\n max-width: 1000px;\n\n // Header\n &__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 24px;\n gap: 16px;\n flex-wrap: wrap;\n\n h1 {\n margin: 0;\n font-size: 24px;\n font-weight: 600;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n }\n\n // Filters\n &__filters {\n display: flex;\n gap: 8px;\n }\n\n // Empty State\n &__empty {\n text-align: center;\n padding: 60px 20px;\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n border: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n h2 {\n margin: 0 0 8px;\n font-size: 20px;\n font-weight: 600;\n }\n\n p {\n margin: 0;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n }\n\n &__empty-icon {\n font-size: 48px;\n display: block;\n margin-bottom: 16px;\n }\n\n // List\n &__list {\n display: flex;\n flex-direction: column;\n gap: 16px;\n }\n\n // Card\n &__card {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n border: 1px solid $presszone-comments-border;\n padding: 16px 20px;\n transition: transform 0.2s ease, box-shadow 0.2s ease;\n display: flex;\n align-items: center;\n gap: 16px;\n flex-wrap: nowrap;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n &:hover {\n transform: translateY(-2px);\n box-shadow: $presszone-comments-shadow-hover;\n\n @include dark-mode-class {\n box-shadow: $presszone-comments-shadow-hover-dark;\n }\n }\n\n // Mobile: stack vertically\n @media (max-width: 1024px) {\n flex-wrap: wrap;\n gap: 12px;\n }\n }\n\n &__card-header {\n display: flex;\n flex-direction: column;\n gap: 4px;\n min-width: 140px;\n flex-shrink: 0;\n }\n\n &__type {\n font-weight: 600;\n font-size: 13px;\n color: $presszone-comments-text;\n white-space: nowrap;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &__date {\n font-size: 11px;\n color: $presszone-comments-text-muted;\n white-space: nowrap;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__content {\n flex: 2;\n min-width: 0;\n\n @media (max-width: 1024px) {\n flex-basis: 100%;\n }\n }\n\n &__preview {\n margin: 0;\n color: $presszone-comments-text;\n font-size: 13px;\n line-height: 1.4;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &__reason {\n flex: 2;\n min-width: 0;\n padding: 8px 12px;\n background: $presszone-comments-error-dim-lightest;\n border-radius: $presszone-comments-radius;\n border-inline-start: 3px solid $presszone-comments-error;\n\n @include dark-mode-class {\n background: $presszone-comments-error-dim-dark;\n border-inline-start-color: $presszone-comments-error-dark;\n }\n\n @media (max-width: 1024px) {\n flex-basis: 100%;\n }\n\n strong {\n display: inline;\n margin-inline-end: 6px;\n font-size: 11px;\n color: $presszone-comments-error;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n\n @include dark-mode-class {\n color: $presszone-comments-error-dark;\n }\n }\n\n p {\n display: inline;\n margin: 0;\n font-size: 13px;\n color: $presszone-comments-text;\n overflow: hidden;\n text-overflow: ellipsis;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n }\n\n &__meta {\n font-size: 11px;\n color: $presszone-comments-text-muted;\n min-width: 140px;\n flex-shrink: 0;\n line-height: 1.4;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__actions {\n display: flex;\n gap: 6px;\n flex-wrap: nowrap;\n flex-shrink: 0;\n }\n}\n\n// =============================================================================\n// DASHBOARD GRID\n// =============================================================================\n\n.presszone-comments-dashboard__grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 24px;\n margin-top: 24px;\n\n // 3 Column Variant\n &--3 {\n grid-template-columns: repeat(3, 1fr);\n\n @include respond-to(xl) {\n grid-template-columns: repeat(2, 1fr);\n }\n }\n\n @include respond-to(md) {\n grid-template-columns: 1fr;\n }\n}\n\n// =============================================================================\n// LIST COMPONENT\n// =============================================================================\n\n.presszone-comments-list {\n list-style: none;\n margin: 0;\n padding: 0;\n height: auto;\n overflow: visible;\n\n &__item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 10px 0;\n border-bottom: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n &:last-child {\n border-bottom: none;\n }\n\n &--contributor {\n gap: 12px;\n }\n }\n\n &__name {\n flex: 1;\n font-weight: 500;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &__meta {\n font-size: 13px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// Badge - Rank Variant\n.presszone-comments-badge--rank {\n min-width: 28px;\n height: 28px;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n border-radius: 50%;\n font-size: 12px;\n font-weight: 700;\n padding: 0;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n}\n\n// =============================================================================\n// ACTIVITY LIST\n// =============================================================================\n\n.presszone-comments-activity-list {\n list-style: none;\n margin: 0;\n padding: 0;\n max-height: 250px;\n overflow-y: auto;\n scrollbar-width: thin;\n\n &__item {\n display: flex;\n align-items: flex-start;\n gap: 10px;\n padding: 10px 0;\n border-bottom: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n &:last-child {\n border-bottom: none;\n }\n }\n\n &__icon {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 8px;\n flex-shrink: 0;\n font-size: 16px;\n }\n\n &__content {\n flex: 1;\n font-size: 13px;\n line-height: 1.4;\n }\n\n &__time {\n font-size: 11px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &__reason {\n font-size: 0.9em;\n margin: 4px 0;\n }\n\n &__resolved {\n font-size: 0.9em;\n margin-top: 2px;\n color: $presszone-comments-success;\n\n @include dark-mode-class {\n color: $presszone-comments-success-dark;\n }\n }\n}\n\n// =============================================================================\n// ALERT COMPONENT\n// =============================================================================\n\n.presszone-comments-alert {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px 20px;\n border-radius: 8px;\n margin-bottom: 24px;\n\n &--warning {\n background: $presszone-comments-warning-dim-alt;\n border: 1px solid $presszone-comments-warning-border;\n color: $presszone-comments-warning;\n\n @include dark-mode-class {\n background: $presszone-comments-warning-dim-alt-dark;\n border-color: $presszone-comments-warning-border-dark;\n color: $presszone-comments-warning-dark;\n }\n }\n\n &__icon {\n font-size: 20px;\n }\n}\n\n// =============================================================================\n// CHART COMPONENT\n// =============================================================================\n\n.presszone-comments-activity-chart,\n.presszone-comments-recent-activity,\n.presszone-comments-top-contributors,\n.presszone-comments-quick-stats {\n h2 {\n font-size: 16px;\n margin: 0 0 16px;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n}\n\n.presszone-comments-chart {\n display: flex;\n align-items: flex-end;\n gap: 6px;\n height: 120px;\n padding-top: 10px;\n\n &__bar-wrap {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-end;\n height: 100%;\n }\n\n &__bar {\n width: 100%;\n background: linear-gradient(to top, #A8C7FA, #60a5fa);\n border-radius: 4px 4px 0 0;\n min-height: 4px;\n transition: height 0.3s ease;\n }\n\n &__label {\n font-size: 10px;\n color: $presszone-comments-text-muted;\n margin-top: 6px;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// =============================================================================\n// CONTRIBUTORS LIST\n// =============================================================================\n\n.presszone-comments-contributors-list {\n list-style: none;\n margin: 0;\n padding: 0;\n counter-reset: contributor;\n\n &__item {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 8px 0;\n border-bottom: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n &:last-child {\n border-bottom: none;\n }\n }\n\n &__rank {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: $presszone-comments-primary;\n color: #131314;\n border-radius: 50%;\n font-size: 12px;\n font-weight: 600;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dark;\n }\n }\n\n &__name {\n flex: 1;\n font-weight: 500;\n }\n\n &__count {\n font-size: 13px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// =============================================================================\n// QUICK STATS\n// =============================================================================\n\n.presszone-comments-quick-stats {\n &__grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 16px;\n }\n\n &__item {\n text-align: center;\n padding: 16px;\n background: $presszone-comments-info-bg;\n border-radius: 8px;\n\n @include dark-mode-class {\n background: $presszone-comments-info-bg-dark;\n }\n }\n\n &__value {\n display: block;\n font-size: 28px;\n font-weight: 700;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n }\n}\n","/**\n * Design Page Styles\n */\n\n@import 'variables';\n\n.presszone-comments-tile-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));\n gap: 12px;\n margin-top: 8px;\n}\n\n.presszone-comments-tile {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n padding: 16px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n cursor: pointer;\n transition: all 0.2s ease;\n text-align: center;\n\n &:hover {\n border-color: $presszone-comments-border-hover;\n background: $presszone-comments-surface-2;\n }\n\n &--active {\n border-color: $presszone-comments-primary;\n background: $presszone-comments-primary-dim;\n box-shadow: 0 0 0 2px $presszone-comments-primary-dim;\n\n .presszone-comments-tile__preview {\n border-color: $presszone-comments-primary;\n background: $presszone-comments-surface;\n }\n\n .presszone-comments-tile__label {\n color: $presszone-comments-primary;\n font-weight: 600;\n }\n }\n\n &--square .presszone-comments-tile__preview {\n border-radius: 0;\n }\n\n &--rounded .presszone-comments-tile__preview {\n border-radius: 8px;\n }\n\n &--pill .presszone-comments-tile__preview {\n border-radius: 999px;\n }\n}\n\n.presszone-comments-tile__preview {\n width: 60px;\n height: 40px;\n border: 2px solid $presszone-comments-text-secondary;\n background: $presszone-comments-surface-3;\n margin-bottom: 4px;\n transition: all 0.2s;\n}\n\n.presszone-comments-tile__label {\n font-size: 13px;\n font-weight: 500;\n color: $presszone-comments-text;\n}\n\n.presszone-comments-tile-grid--compact {\n display: flex;\n flex-direction: column;\n gap: 4px;\n margin-top: 6px;\n margin-bottom: -4px;\n\n .presszone-comments-tile {\n flex-direction: row;\n justify-content: flex-start;\n padding: 8px 12px;\n gap: 12px;\n }\n\n .presszone-comments-tile__preview {\n flex-shrink: 0;\n margin-bottom: 0;\n }\n\n .presszone-comments-tile__label {\n text-align: left;\n font-size: 12px;\n }\n}\n\n.presszone-comments-design-setting:has(.presszone-comments-tile-grid--compact) {\n padding-bottom: 4px;\n}\n\n#border-thickness-wrapper {\n transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);\n flex: 0 0 auto;\n overflow: hidden;\n transform-origin: left center;\n\n &.presszone-comments--hidden {\n opacity: 0;\n max-width: 0 !important;\n min-width: 0 !important;\n max-height: 0 !important;\n padding: 0 !important;\n border-width: 0 !important;\n margin: -4px !important;\n transform: scale(0.95);\n pointer-events: none;\n }\n}\n\n// Design Page Layout\n.presszone-comments-design-settings-row {\n display: flex;\n gap: 8px;\n margin-bottom: 2px;\n flex-wrap: wrap;\n}\n\n.presszone-comments-design-setting {\n flex: 1;\n min-width: 150px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n padding: 10px;\n box-sizing: border-box;\n\n .presszone-comments-form-group {\n margin-bottom: 12px;\n }\n\n >*:last-child {\n margin-bottom: 0 !important;\n }\n\n &--small {\n flex: 0 0 auto;\n min-width: 140px;\n max-width: 180px;\n padding-inline-start: 12px;\n }\n\n &--large {\n flex: 1.5;\n min-width: 280px;\n }\n}\n\n.presszone-comments-design-preview {\n overflow: hidden;\n min-width: 0;\n display: flex;\n flex-direction: column;\n margin-top: 24px; // Add space above the entire section\n\n h3 {\n margin: 0;\n font-size: 14px;\n font-weight: 600;\n color: $presszone-comments-text;\n }\n\n &--fullwidth {\n width: 100%;\n }\n\n &__header {\n display: grid;\n grid-template-columns: 1fr auto 1fr;\n align-items: center;\n margin-bottom: 0; // minimal space below header\n\n h3 {\n margin: 0;\n justify-self: start;\n grid-column: 1;\n }\n\n .presszone-comments-device-controls {\n margin: 0;\n justify-self: center;\n grid-column: 2;\n }\n }\n}\n\n.presszone-comments-preview-frame-wrapper {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n background: $presszone-comments-surface-alt;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n padding: 8px;\n min-height: 600px;\n overflow: auto;\n}\n\n#presszone-comments-theme-preview {\n max-width: 100% !important;\n box-sizing: border-box !important;\n border-radius: $presszone-comments-radius;\n background: white;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n transition: width 0.3s ease;\n height: 560px;\n}\n\n.presszone-comments-device-controls {\n display: flex;\n justify-content: center;\n gap: 8px;\n margin-bottom: 16px;\n\n .device-btn {\n padding: 8px 12px;\n border-radius: $presszone-comments-radius;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n cursor: pointer;\n transition: all 0.2s;\n\n &:hover {\n background: $presszone-comments-surface-2;\n }\n\n &.active {\n background: $presszone-comments-primary;\n color: white;\n border-color: $presszone-comments-primary;\n }\n }\n}\n\n.presszone-comments-color-preview {\n width: 60px;\n height: 40px;\n border-radius: 6px;\n display: flex;\n overflow: hidden;\n border: 1px solid rgba(0, 0, 0, 0.1);\n\n >div {\n flex: 1;\n }\n}\n\n.presszone-comments-color-preview--light {\n background: #fff;\n\n .p-1 {\n background: #fff;\n }\n\n .p-2 {\n background: #f1f5f9;\n }\n\n .p-3 {\n background: #1f71dd;\n }\n}\n\n.presszone-comments-color-preview--dark {\n background: #1a1a1a;\n\n .p-1 {\n background: #1a1a1a;\n }\n\n .p-2 {\n background: #2d2d2d;\n }\n\n .p-3 {\n background: #1f71dd;\n }\n}\n\n.presszone-comments-color-preview--inherit {\n background: repeating-linear-gradient(45deg, #eee, #eee 5px, #fff 5px, #fff 10px);\n}\n\n.presszone-comments-border-preview {\n width: 60px;\n height: 16px;\n display: flex;\n align-items: center;\n background: transparent;\n border: none;\n\n &::after {\n content: '';\n display: block;\n width: 100%;\n background: $presszone-comments-text-secondary;\n transition: background 0.2s ease;\n }\n}\n\n.presszone-comments-tile--active .presszone-comments-border-preview::after {\n background: $presszone-comments-primary;\n}\n\n.presszone-comments-border-preview--standard::after {\n height: $presszone-comments-border-width;\n}\n\n.presszone-comments-border-preview--thick::after {\n height: $presszone-comments-border-width-lg;\n}\n\n.presszone-comments-border-preview--extra-thick::after {\n height: $presszone-comments-border-width-xl;\n}\n\n.presszone-comments-toggle {\n position: relative;\n width: 48px;\n height: 26px;\n background: $presszone-comments-surface-3;\n border-radius: 13px;\n cursor: pointer;\n transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n flex-shrink: 0;\n overflow: visible;\n\n &::after {\n content: '';\n position: absolute;\n top: 3px;\n inset-inline-start: 3px;\n width: 20px;\n height: 20px;\n background: white;\n border-radius: 50%;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);\n }\n\n &--active {\n background: $presszone-comments-primary;\n\n &::after {\n transform: translateX(22px);\n }\n }\n}\n\n[dir=\"rtl\"] .presszone-comments-toggle--active::after {\n transform: translateX(-22px);\n}\n\n.presszone-comments-toggle-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n padding: 12px 0;\n border-bottom: 1px solid $presszone-comments-border;\n max-width: 100%;\n box-sizing: border-box;\n\n &:last-child {\n border-bottom: none;\n padding-bottom: 0;\n }\n}\n\n.presszone-comments-toggle__label {\n display: flex;\n flex-direction: column;\n gap: 2px;\n\n label,\n .presszone-comments-label--settings {\n margin-bottom: 0 !important;\n font-size: 13px;\n font-weight: 600;\n }\n}\n\n.presszone-comments-toggle-row__title {\n font-size: 13px;\n font-weight: 600;\n color: $presszone-comments-text;\n}\n\n.presszone-comments-toggle-row__desc {\n font-size: 12px;\n color: $presszone-comments-text-secondary;\n}\n\n@media (max-width: 768px) {\n .presszone-comments-design-settings-row {\n flex-direction: column;\n }\n\n .presszone-comments-design-setting {\n min-width: 100%;\n }\n\n .presszone-comments-device-controls {\n display: none;\n }\n\n .presszone-comments-preview-frame-wrapper {\n min-height: 400px;\n }\n\n #presszone-comments-theme-preview {\n width: 100% !important;\n max-width: 100% !important;\n }\n\n .presszone-comments-tile-grid {\n grid-template-columns: repeat(3, 1fr);\n gap: 8px;\n }\n\n .presszone-comments-tile {\n padding: 12px 8px;\n }\n\n .presszone-comments-tile__label {\n font-size: 11px;\n }\n\n .presszone-comments-tile-grid--compact {\n flex-direction: row;\n gap: 4px;\n }\n\n .presszone-comments-tile-grid--compact .presszone-comments-tile {\n flex-direction: column;\n flex: 1;\n padding: 6px 4px;\n gap: 6px;\n }\n\n .presszone-comments-tile-grid--compact .presszone-comments-tile__label {\n text-align: center;\n font-size: 10px;\n }\n\n .presszone-comments-border-preview {\n width: 40px;\n height: 12px;\n }\n\n .presszone-comments-color-preview {\n width: 48px;\n height: 32px;\n }\n}\n\n\n[data-theme=\"dark\"] {\n .presszone-comments-design-setting {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n .presszone-comments-design-preview {\n h3 {\n color: $presszone-comments-text-dark;\n }\n }\n\n .presszone-comments-preview-frame-wrapper {\n background: $presszone-comments-surface-alt-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n .presszone-comments-device-controls .device-btn {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n\n &:hover {\n background: $presszone-comments-surface-2-dark;\n }\n\n &.active {\n background: $presszone-comments-primary-dark;\n border-color: $presszone-comments-primary-dark;\n }\n }\n\n .presszone-comments-toggle {\n background: $presszone-comments-surface-3-dark;\n\n &--active {\n background: $presszone-comments-primary-dark;\n }\n }\n\n .presszone-comments-toggle-row {\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n .presszone-comments-toggle-row__title {\n color: $presszone-comments-text-dark;\n }\n\n .presszone-comments-toggle-row__desc {\n color: $presszone-comments-text-secondary-dark;\n }\n\n .presszone-comments-border-preview::after {\n background: $presszone-comments-text-secondary-dark;\n }\n\n .presszone-comments-tile--active .presszone-comments-border-preview::after {\n background: $presszone-comments-primary-dark;\n }\n\n .presszone-comments-tile {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n\n &:hover {\n border-color: $presszone-comments-border-hover-dark;\n background: $presszone-comments-surface-2-dark;\n }\n\n &--active {\n border-color: $presszone-comments-primary-dark;\n background: $presszone-comments-primary-dim-dark;\n box-shadow: 0 0 0 2px $presszone-comments-primary-dim-dark;\n\n .presszone-comments-tile__preview {\n border-color: $presszone-comments-primary-dark;\n background: $presszone-comments-surface-dark;\n }\n\n .presszone-comments-tile__label {\n color: $presszone-comments-primary-dark;\n }\n }\n }\n\n .presszone-comments-tile__preview {\n border-color: $presszone-comments-text-secondary-dark;\n background: $presszone-comments-surface-3-dark;\n }\n\n .presszone-comments-tile__label {\n color: $presszone-comments-text-dark;\n }\n}","// ==========================================================================\n// Comments Press Zone - Admin Utilities & Remaining Components\n// ==========================================================================\n// Contains: Tables, Tools, Toggle, Settings Cards, Design Page, Modals,\n// Skeleton Loading, Empty States, Responsive Styles\n// ==========================================================================\n\n\n// ==========================================================================\n// QUICK STATS\n// ==========================================================================\n\n.presszone-comments-quick-stats__label {\n font-size: 12px;\n color: $presszone-comments-text-muted;\n text-transform: uppercase;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n// ==========================================================================\n// SETTINGS CACHING TAB - UNAVAILABLE STATES\n// ==========================================================================\n\n.presszone-comments-settings__info-box {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px;\n background: $presszone-comments-primary-dim;\n border-radius: $presszone-comments-radius;\n margin-bottom: 24px;\n\n strong {\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n }\n}\n\n.presszone-comments-settings__unavailable-card {\n display: flex;\n gap: 16px;\n padding: 20px;\n background: $presszone-comments-warning-dim-lightest2;\n border: 1px solid rgba(251, 191, 36, 0.3);\n border-radius: $presszone-comments-radius-lg;\n margin-top: 12px;\n\n @include dark-mode-class {\n background: $presszone-comments-warning-dim-alt-dark;\n border-color: $presszone-comments-warning-border-dark;\n }\n}\n\n.presszone-comments-settings__unavailable-icon {\n font-size: 24px;\n flex-shrink: 0;\n}\n\n.presszone-comments-settings__unavailable-content {\n flex: 1;\n\n > strong {\n display: block;\n font-size: 15px;\n margin-bottom: 8px;\n color: #d97706;\n }\n\n > p {\n margin: 0 0 12px;\n font-size: 14px;\n color: $presszone-comments-text-muted;\n line-height: 1.5;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n.presszone-comments-settings__unavailable-steps {\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius;\n padding: 12px 16px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n\n > strong {\n display: block;\n font-size: 13px;\n margin-bottom: 8px;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n ol {\n margin: 0;\n padding-inline-start: 20px;\n font-size: 13px;\n color: $presszone-comments-text-muted;\n line-height: 1.8;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n li {\n margin: 0;\n }\n}\n\n.presszone-comments-settings__info-card {\n padding: 16px 20px;\n background: $presszone-comments-info-bg;\n border: 1px solid $presszone-comments-info-border;\n border-radius: $presszone-comments-radius-lg;\n\n @include dark-mode-class {\n background: $presszone-comments-info-bg-dark;\n border-color: $presszone-comments-glass-border-dark;\n }\n\n > strong {\n display: block;\n font-size: 14px;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n }\n\n > p {\n margin: 0;\n font-size: 13px;\n color: $presszone-comments-text-muted;\n line-height: 1.6;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// ==========================================================================\n// GENERIC TABLE STYLES\n// ==========================================================================\n\n.presszone-comments-table-wrapper {\n background: $presszone-comments-surface;\n border-radius: $presszone-comments-radius-lg;\n overflow-x: auto;\n border: 1px solid $presszone-comments-border;\n position: relative;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n // Mobile responsive behavior\n @media (max-width: 768px) {\n border-radius: $presszone-comments-radius;\n margin: 0 -8px; // Extend to screen edges on mobile\n border-left: none;\n border-right: none;\n position: relative;\n \n // Add scroll indicator\n &::after {\n content: '← Scroll →';\n position: absolute;\n bottom: 8px;\n right: 16px;\n font-size: 11px;\n color: $presszone-comments-text-muted;\n background: rgba(255, 255, 255, 0.9);\n padding: 2px 6px;\n border-radius: 4px;\n pointer-events: none;\n opacity: 0.7;\n \n @include dark-mode-class {\n background: rgba(0, 0, 0, 0.8);\n color: $presszone-comments-text-muted-dark;\n }\n }\n \n // Hide scroll indicator when not needed\n &:not([data-scrollable=\"true\"])::after {\n display: none;\n }\n }\n}\n\n.presszone-comments-table {\n display: flex;\n flex-direction: column;\n width: 100%;\n font-size: 14px;\n\n &__header {\n display: flex;\n background: $presszone-comments-surface-2;\n border-bottom: 1px solid $presszone-comments-border;\n font-weight: 600;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-color: $presszone-comments-border-dark;\n }\n }\n\n &__body {\n display: flex;\n flex-direction: column;\n }\n\n &__row {\n display: flex;\n border-bottom: 1px solid $presszone-comments-border;\n transition: background $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark;\n }\n\n &:last-child {\n border-bottom: none;\n }\n\n &:hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n }\n\n &__cell {\n padding: 12px 16px;\n display: flex;\n align-items: center;\n font-size: 14px;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n\n &--header {\n font-weight: 600;\n color: $presszone-comments-text;\n padding: 12px 16px;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n }\n\n // Legacy table element support\n &.presszone-comments-table--legacy {\n display: table;\n\n thead {\n display: table-header-group;\n }\n\n tbody {\n display: table-row-group;\n }\n\n tr {\n display: table-row;\n }\n\n th,\n td {\n display: table-cell;\n padding: 12px 16px;\n text-align: start;\n border-bottom: 1px solid $presszone-comments-border;\n vertical-align: middle;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark;\n }\n }\n\n th {\n background: $presszone-comments-surface-2;\n font-weight: 600;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n }\n\n tr:last-child td {\n border-bottom: none;\n }\n }\n}\n\n// Grid table - CSS Grid based for perfect column alignment\n// All cells (header + body) are direct children of the grid container.\n// The grid auto-wraps rows based on grid-template-columns (set via JS).\n.presszone-comments-grid-table {\n display: grid;\n width: 100%;\n font-size: 14px;\n min-width: 800px; // Force horizontal scroll on mobile\n // grid-template-columns is set dynamically via JavaScript\n // Reverted gap changes as requested\n\n @media (max-width: 768px) {\n min-width: 900px; // Slightly wider for mobile scroll\n font-size: 13px;\n }\n\n &__cell {\n padding: 12px 16px;\n display: flex;\n align-items: center;\n font-size: 14px;\n color: $presszone-comments-text;\n word-break: break-word;\n overflow-wrap: break-word;\n // border-bottom: 1px solid $presszone-comments-border; // Removed per user instruction \"REMOVE THE LINE\"\n background: $presszone-comments-surface;\n transition: background $presszone-comments-duration-fast $presszone-comments-ease-smooth;\n\n @media (max-width: 768px) {\n padding: 8px 12px;\n font-size: 13px;\n }\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n // border-color: $presszone-comments-border-dark; // Removed\n background: $presszone-comments-surface-dark;\n }\n\n // Header cells - Keep border for header only to separate it from body\n &--header {\n font-weight: 600;\n color: $presszone-comments-text;\n background: $presszone-comments-surface-2;\n padding: 12px 16px;\n border-bottom: 1px solid $presszone-comments-border;\n\n @media (max-width: 768px) {\n padding: 8px 12px;\n font-size: 13px;\n }\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n background: $presszone-comments-surface-2-dark;\n border-color: $presszone-comments-border-dark;\n }\n }\n }\n}\n\n// Row hover effect using CSS - highlight all cells in the same row\n// We use data-row attribute set by JS to group cells by row\n.presszone-comments-grid-table__cell:not(.presszone-comments-grid-table__cell--header):hover,\n.presszone-comments-grid-table:has(.presszone-comments-grid-table__cell[data-row]:hover) .presszone-comments-grid-table__cell[data-row]:hover ~ .presszone-comments-grid-table__cell[data-row] {\n // Note: Full row hover requires JS or subgrid. For now, single cell highlight is acceptable.\n}\n\n// Simple row hover - highlight cells on hover\n.presszone-comments-grid-table__cell:not(.presszone-comments-grid-table__cell--header):hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n}\n\n// Mobile-specific table enhancements\n@media (max-width: 768px) {\n .presszone-comments-user-cell {\n min-width: 180px;\n \n .presszone-comments-avatar {\n width: 32px;\n height: 32px;\n }\n \n .presszone-comments-user-info {\n .presszone-comments-user-name {\n font-size: 13px;\n }\n \n .presszone-comments-user-handle {\n font-size: 11px;\n }\n }\n }\n \n // Make action buttons more compact on mobile\n .presszone-comments-grid-table__cell {\n .presszone-comments-btn--sm {\n padding: 4px 8px;\n font-size: 11px;\n }\n }\n \n // Ensure badges don't break layout\n .presszone-comments-badge {\n font-size: 10px;\n padding: 2px 6px;\n white-space: nowrap;\n }\n}\n\n.presszone-comments-table-container {\n margin-top: 24px;\n}\n\n// ==========================================================================\n// GRID TABLE CELL CONTENT STYLES\n// ==========================================================================\n\n// Reason cell content\n.presszone-comments-reason-cell {\n width: 100%;\n min-width: 0;\n}\n\n.presszone-comments-reason-text {\n word-break: break-word;\n}\n\n.presszone-comments-reason-note {\n margin-top: 6px;\n font-size: 12px;\n color: $presszone-comments-text-muted;\n font-style: italic;\n word-break: break-word;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n.presszone-comments-reason-note-label {\n font-weight: 500;\n font-style: normal;\n opacity: 0.8;\n}\n\n// Date text in cells\n.presszone-comments-date-text {\n font-size: 13px;\n}\n\n// Actions cell\n.presszone-comments-actions-cell {\n display: flex;\n gap: 6px;\n align-items: center;\n}\n\n// ==========================================================================\n// USER AVATAR & INFO\n// ==========================================================================\n\n.presszone-comments-user-cell {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.presszone-comments-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n object-fit: cover;\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n\n &--large {\n width: 48px;\n height: 48px;\n }\n}\n\n.presszone-comments-avatar-small {\n width: 28px;\n height: 28px;\n border-radius: 50%;\n object-fit: cover;\n background: $presszone-comments-surface-2;\n flex-shrink: 0;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n}\n\n.presszone-comments-staff-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n margin-bottom: 8px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n .presszone-comments-user-info {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n flex: 1;\n }\n}\n\n.presszone-comments-staff-search-item {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px;\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n margin-bottom: 8px;\n transition: background $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n\n &:hover {\n background: $presszone-comments-surface-2;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n }\n\n .presszone-comments-user-info {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n flex: 1;\n }\n}\n\n.presszone-comments-user-info {\n display: flex;\n flex-direction: column;\n}\n\n.presszone-comments-user-name {\n font-weight: 500;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n}\n\n.presszone-comments-user-handle {\n font-size: 12px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n// ==========================================================================\n// SEARCH SECTION\n// ==========================================================================\n\n.presszone-comments-search-section {\n background: $presszone-comments-surface;\n padding: 24px;\n border-radius: $presszone-comments-radius-lg;\n margin-bottom: 24px;\n border: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n}\n\n.presszone-comments-search-bar {\n display: flex;\n gap: 12px;\n margin-top: 16px;\n}\n\n// ==========================================================================\n// DARK MODE TOGGLE BUTTON\n// ==========================================================================\n\n.presszone-comments-dark-toggle {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n background: $presszone-comments-surface-2;\n border: 1px solid $presszone-comments-border;\n border-radius: 50%;\n cursor: pointer;\n transition: all $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n color: $presszone-comments-text-muted;\n flex-shrink: 0;\n margin-inline-start: auto;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-color: $presszone-comments-border-dark;\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n background: $presszone-comments-surface-3;\n color: $presszone-comments-text;\n border-color: $presszone-comments-border-hover;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-3-dark;\n color: $presszone-comments-text-dark;\n border-color: $presszone-comments-border-hover-dark;\n }\n\n svg {\n transform: rotate(15deg);\n }\n }\n\n &:focus {\n outline: none;\n box-shadow: 0 0 0 2px $presszone-comments-primary-dim;\n\n @include dark-mode-class {\n box-shadow: 0 0 0 2px $presszone-comments-primary-dim-dark;\n }\n }\n\n svg {\n width: 16px;\n height: 16px;\n transition: transform 0.3s $presszone-comments-ease-spring;\n }\n\n .presszone-comments-icon-sun {\n display: block;\n }\n\n .presszone-comments-icon-moon {\n display: none;\n }\n}\n\nbody.presszone-comments-dark .presszone-comments-dark-toggle {\n .presszone-comments-icon-sun {\n display: none;\n }\n\n .presszone-comments-icon-moon {\n display: block;\n }\n}\n\n// ==========================================================================\n// ADMIN TYPOGRAPHY FIXES\n// ==========================================================================\n\n.presszone-comments-admin {\n h1, h2, h3, h4, h5, h6 {\n color: $presszone-comments-text;\n margin: 0 0 20px 0;\n font-size: 18px;\n font-weight: 600;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n}\n\n.presszone-comments-card__title {\n color: $presszone-comments-text;\n margin: 0 0 20px 0;\n font-size: 18px;\n font-weight: 600;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n}\n\n.presszone-comments-text-muted,\n.presszone-comments-activity__label,\n.presszone-comments-widget__label,\n.presszone-comments-chart__label,\n.presszone-comments-dashboard__subtitle,\n.presszone-comments-node-tree__header p {\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n.presszone-comments-card {\n background: $presszone-comments-surface;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius-lg;\n padding: 24px;\n box-shadow: $presszone-comments-shadow-sm;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n box-shadow: $presszone-comments-shadow-sm-dark;\n }\n}\n\n// ==========================================================================\n// INLINE SETTINGS LAYOUT\n// ==========================================================================\n\n.presszone-comments-form-group--inline {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n margin-bottom: 20px;\n}\n\n.presszone-comments-inline-label {\n display: flex;\n align-items: center;\n gap: 8px;\n flex: 1;\n\n label {\n margin-bottom: 0;\n }\n}\n\n.presszone-comments-input--inline {\n width: 100px !important;\n min-width: 80px;\n flex: 0 0 auto;\n text-align: center;\n}\n\n// ==========================================================================\n// MODAL REDESIGN (ADMIN)\n// ==========================================================================\n\n@keyframes presszone-comments-modal-in {\n from {\n opacity: 0;\n transform: scale(0.95) translateY(10px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal {\n background: $presszone-comments-surface;\n width: 500px;\n max-width: 90%;\n border-radius: $presszone-comments-radius-lg;\n box-shadow: $presszone-comments-shadow-hover;\n display: flex;\n flex-direction: column;\n max-height: 85vh;\n animation: presszone-comments-modal-in 0.4s $presszone-comments-ease-spring;\n border: 1px solid $presszone-comments-glass-border-dark;\n position: relative;\n z-index: $presszone-comments-z-tooltip;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n box-shadow: $presszone-comments-shadow-hover-dark;\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px 32px 16px;\n background: $presszone-comments-surface;\n border-bottom: 1px solid $presszone-comments-border;\n flex-shrink: 0;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-bottom-color: $presszone-comments-border-dark;\n }\n\n h2 {\n margin: 0;\n font-size: 24px;\n font-weight: 700;\n color: $presszone-comments-text;\n letter-spacing: -0.5px;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__close {\n background: $presszone-comments-surface-2;\n border: none;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 18px;\n cursor: pointer;\n color: $presszone-comments-text-muted;\n transition: all $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n background: $presszone-comments-error;\n color: white;\n transform: rotate(90deg);\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__body {\n padding: 16px 32px 32px;\n overflow-y: auto;\n}\n\n// Modal Tabs\n.presszone-comments-admin .presszone-comments-modal__tabs {\n display: flex;\n gap: 8px;\n padding: 0 32px;\n margin-bottom: 24px;\n border-bottom: 2px solid $presszone-comments-surface-2;\n\n @include dark-mode-class {\n border-color: $presszone-comments-surface-2-dark;\n }\n}\n\n.presszone-comments-admin .presszone-comments-tab {\n background: none;\n border: none;\n padding: 12px 4px;\n margin-bottom: -2px;\n font-weight: 600;\n font-size: 15px;\n color: $presszone-comments-text-muted;\n border-bottom: 2px solid transparent;\n cursor: pointer;\n transition: all $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &.active {\n color: $presszone-comments-primary;\n border-bottom-color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n border-bottom-color: $presszone-comments-primary-dark;\n }\n }\n}\n\n// Animated Form Elements (uses stagger classes)\n.presszone-comments-admin .presszone-comments-animated-item {\n animation: presszone-comments-modal-in 0.5s $presszone-comments-ease-spring backwards;\n}\n\n.presszone-comments-admin .presszone-comments-form-group {\n margin-bottom: 24px;\n\n label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n font-size: 14px;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n}\n\n.presszone-comments-admin .presszone-comments-textarea {\n width: 100%;\n box-sizing: border-box;\n border: 1px solid $presszone-comments-border;\n border-radius: $presszone-comments-radius;\n padding: 12px 16px;\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text;\n font-family: inherit;\n resize: vertical;\n min-height: 100px;\n transition: all $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark;\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n\n &:focus {\n outline: none;\n background: $presszone-comments-surface;\n border-color: $presszone-comments-primary;\n box-shadow: 0 0 0 4px $presszone-comments-primary-dim;\n transform: translateY(-1px);\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-primary-dark;\n box-shadow: 0 0 0 4px $presszone-comments-primary-dim-dark;\n }\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__footer {\n padding: 24px 32px;\n background: $presszone-comments-surface;\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n border-top: 1px solid $presszone-comments-border;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__actions {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n margin-top: 32px;\n}\n\n.presszone-comments-admin .presszone-comments-modal__cancel {\n background: transparent;\n border: none;\n color: $presszone-comments-text-muted;\n font-weight: 600;\n padding: 10px 20px;\n cursor: pointer;\n transition: all $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n color: $presszone-comments-text;\n background: $presszone-comments-surface-2;\n border-radius: $presszone-comments-radius;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n background: $presszone-comments-surface-2-dark;\n }\n }\n}\n\n// ==========================================================================\n// PREMIUM MODAL STYLES\n// ==========================================================================\n\n@keyframes presszone-comments-modal-premium-in {\n 0% {\n opacity: 0;\n transform: scale(0.9) translateY(20px);\n }\n 100% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n@keyframes presszone-comments-modal-premium-out {\n 0% {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n 100% {\n opacity: 0;\n transform: scale(0.95) translateY(10px);\n }\n}\n\n@keyframes presszone-comments-success-pulse {\n 0%, 100% {\n transform: scale(1);\n }\n 50% {\n transform: scale(1.02);\n }\n}\n\n@keyframes presszone-comments-error-shake {\n 0%, 100% {\n transform: translateX(0);\n }\n 20%, 60% {\n transform: translateX(-6px);\n }\n 40%, 80% {\n transform: translateX(6px);\n }\n}\n\n// Premium Modal Overlay\n.presszone-comments-admin .presszone-comments-modal-overlay--premium {\n background: $presszone-comments-overlay-light;\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n animation: presszone-comments-fade-in $presszone-comments-duration-normal $presszone-comments-ease-smooth forwards;\n\n @include dark-mode-class {\n background: $presszone-comments-overlay-dark;\n }\n}\n\n// Premium Modal Container\n.presszone-comments-admin .presszone-comments-modal--premium {\n background: $presszone-comments-surface;\n border-radius: 20px;\n border: 1px solid $presszone-comments-border;\n box-shadow:\n 0 0 0 1px rgba(0, 0, 0, 0.03),\n 0 2px 4px rgba(0, 0, 0, 0.04),\n 0 12px 24px rgba(0, 0, 0, 0.08),\n 0 24px 48px rgba(0, 0, 0, 0.08);\n animation: presszone-comments-modal-premium-in 0.4s $presszone-comments-ease-spring forwards;\n width: 600px;\n min-height: 680px;\n max-height: 85vh;\n max-width: 92vw;\n display: flex;\n flex-direction: column;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-glass-border-dark;\n box-shadow:\n 0 0 0 1px rgba(255, 255, 255, 0.05),\n 0 2px 4px rgba(0, 0, 0, 0.2),\n 0 12px 24px rgba(0, 0, 0, 0.4),\n 0 24px 48px rgba(0, 0, 0, 0.4);\n }\n\n &.is-closing {\n animation: presszone-comments-modal-premium-out 0.2s ease forwards;\n }\n}\n\n// Compact Confirmation Modal\n.presszone-comments-admin .presszone-comments-modal--confirm {\n width: 440px !important;\n height: auto !important;\n min-height: auto !important;\n\n .presszone-comments-modal__header--premium {\n padding: 20px 24px 12px;\n }\n\n .presszone-comments-modal__content--premium {\n padding: 0 24px 24px;\n min-height: auto;\n flex: none;\n }\n\n .presszone-comments-modal__footer--premium {\n padding: 16px 24px;\n background: $presszone-comments-surface;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n }\n }\n}\n\n// Premium Modal Header\n.presszone-comments-admin .presszone-comments-modal__header--premium {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px 32px 16px;\n border-bottom: none;\n position: relative;\n\n &::after {\n content: '';\n position: absolute;\n top: 0;\n inset-inline-start: 0;\n inset-inline-end: 0;\n height: 100%;\n background: radial-gradient(ellipse at top right, $presszone-comments-primary-dim, transparent 70%);\n pointer-events: none;\n opacity: 0.5;\n border-radius: 20px 20px 0 0;\n\n @include dark-mode-class {\n opacity: 0.3;\n }\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__title--premium {\n font-size: 22px;\n font-weight: 700;\n letter-spacing: -0.4px;\n color: $presszone-comments-text;\n margin: 0;\n display: flex;\n align-items: center;\n gap: 10px;\n position: relative;\n z-index: 1;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal__title-icon {\n width: 28px;\n height: 28px;\n background: $presszone-comments-primary-dim;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: $presszone-comments-primary;\n font-size: 14px;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n}\n\n// Premium Close Button\n.presszone-comments-admin .presszone-comments-modal__close--premium {\n width: 36px;\n height: 36px;\n border-radius: 10px;\n background: $presszone-comments-surface-2;\n border: 1px solid transparent;\n color: $presszone-comments-text-muted;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 18px;\n position: relative;\n z-index: 1;\n transition:\n background-color $presszone-comments-duration-fast ease,\n color $presszone-comments-duration-fast ease,\n transform $presszone-comments-duration-normal $presszone-comments-ease-spring,\n border-color $presszone-comments-duration-fast ease;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n background: $presszone-comments-error-dim-alt;\n border-color: $presszone-comments-error-border;\n color: $presszone-comments-error;\n transform: rotate(90deg);\n\n @include reduced-motion {\n transform: none !important;\n }\n }\n\n &:active {\n transform: rotate(90deg) scale(0.92);\n }\n}\n\n// Header Controls Container\n.presszone-comments-admin .presszone-comments-modal__header-controls {\n display: flex;\n align-items: center;\n gap: 12px;\n position: relative;\n z-index: 1;\n}\n\n.presszone-comments-admin .presszone-comments-modal__header-action {\n display: flex;\n}\n\n// Header Button Styling\n.presszone-comments-btn--header {\n padding: 10px 20px;\n font-size: 13px;\n}\n\n// Premium Tab Navigation\n.presszone-comments-admin .presszone-comments-modal-tabs {\n display: flex;\n gap: 0;\n padding: 0 32px;\n border-bottom: 2px solid $presszone-comments-surface-2;\n position: relative;\n\n @include dark-mode-class {\n border-color: $presszone-comments-surface-2-dark;\n }\n}\n\n.presszone-comments-admin .presszone-comments-modal-tab {\n position: relative;\n padding: 14px 20px;\n background: transparent;\n border: none;\n font-size: 14px;\n font-weight: 600;\n color: $presszone-comments-text-muted;\n cursor: pointer;\n margin-bottom: -2px;\n transition: color $presszone-comments-duration-normal ease;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n inset-inline-start: 20px;\n inset-inline-end: 20px;\n height: 2px;\n background: transparent;\n border-radius: 2px 2px 0 0;\n transition:\n background-color $presszone-comments-duration-normal ease,\n transform $presszone-comments-duration-normal $presszone-comments-ease-spring;\n transform: scaleX(0);\n transform-origin: center;\n }\n\n &:hover {\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n &--active {\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n color: $presszone-comments-primary-dark;\n }\n\n &::after {\n background: $presszone-comments-primary;\n transform: scaleX(1);\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dark;\n }\n }\n\n .presszone-comments-modal-tab__icon {\n opacity: 1;\n }\n\n .presszone-comments-modal-tab__badge {\n background: $presszone-comments-primary-dim;\n color: $presszone-comments-primary;\n\n @include dark-mode-class {\n background: $presszone-comments-primary-dim-dark;\n color: $presszone-comments-primary-dark;\n }\n }\n }\n\n &__icon {\n margin-inline-end: 8px;\n font-size: 15px;\n opacity: 0.7;\n }\n\n &__badge {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n min-width: 20px;\n height: 20px;\n padding: 0 6px;\n margin-inline-start: 8px;\n font-size: 11px;\n font-weight: 700;\n background: $presszone-comments-surface-2;\n border-radius: 10px;\n color: $presszone-comments-text-muted;\n transition: all $presszone-comments-duration-normal $presszone-comments-ease-smooth;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n// Tab Panel Animation\n.presszone-comments-admin .presszone-comments-tab-panel--active {\n animation: presszone-comments-slide-in-right $presszone-comments-duration-normal $presszone-comments-ease-smooth forwards;\n}\n\n// Premium Modal Content\n.presszone-comments-admin .presszone-comments-modal__content--premium {\n padding: 12px 32px 24px;\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n position: relative;\n}\n\n// Premium Form Styles (uses stagger classes)\n.presszone-comments-form-group--animated {\n animation: presszone-comments-slide-in-up $presszone-comments-duration-slow $presszone-comments-ease-spring forwards;\n opacity: 0;\n}\n\n// Premium Form - Horizontal Layout\n.presszone-comments-admin .presszone-comments-modal__content--premium .presszone-comments-form-group {\n display: grid;\n grid-template-columns: 110px 1fr;\n gap: 12px 16px;\n align-items: center;\n margin-bottom: 16px;\n\n &:has(.presszone-comments-textarea--premium),\n &.has-textarea {\n align-items: start;\n\n .presszone-comments-label--premium {\n padding-top: 14px;\n }\n }\n\n .presszone-comments-form-help,\n .presszone-comments-form-help--premium {\n grid-column: 2;\n margin: -10px 0 0 0;\n font-size: 11px;\n color: $presszone-comments-text-muted;\n white-space: nowrap;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n}\n\n.presszone-comments-admin .presszone-comments-label--premium {\n display: flex;\n align-items: center;\n margin-bottom: 0;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n color: $presszone-comments-text-secondary;\n white-space: nowrap;\n\n @include dark-mode-class {\n color: $presszone-comments-text-secondary-dark;\n }\n\n .required {\n color: $presszone-comments-error;\n margin-inline-start: 4px;\n\n @include dark-mode-class {\n color: $presszone-comments-error-dark;\n }\n }\n}\n\n// Premium Input Styles\n.presszone-comments-input--premium,\n.presszone-comments-select--premium,\n.presszone-comments-textarea--premium {\n width: 100%;\n padding: 14px 16px;\n background: $presszone-comments-surface-2;\n border: 1.5px solid transparent;\n border-radius: 12px;\n font-size: 15px;\n font-family: inherit;\n color: $presszone-comments-text;\n transition:\n background-color $presszone-comments-duration-fast ease,\n border-color $presszone-comments-duration-fast ease,\n box-shadow $presszone-comments-duration-normal ease,\n transform $presszone-comments-duration-fast ease;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n\n &::placeholder {\n color: $presszone-comments-text-muted;\n opacity: 0.7;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n }\n\n &:hover {\n background: $presszone-comments-surface;\n border-color: $presszone-comments-border;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n }\n }\n\n &:focus {\n outline: none;\n background: $presszone-comments-surface;\n border-color: $presszone-comments-primary;\n box-shadow: 0 0 0 4px $presszone-comments-primary-dim;\n transform: translateY(-1px);\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-primary-dark;\n box-shadow: 0 0 0 4px $presszone-comments-primary-shadow-focus;\n }\n\n @include reduced-motion {\n transform: none !important;\n }\n }\n\n &.has-error {\n border-color: $presszone-comments-error;\n background: $presszone-comments-error-dim-lightest;\n animation: presszone-comments-error-shake 0.4s ease;\n\n &:focus {\n box-shadow: 0 0 0 4px $presszone-comments-warning-dim-lighter;\n }\n }\n\n &.has-success {\n border-color: $presszone-comments-success;\n animation: presszone-comments-success-pulse 0.3s ease;\n }\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n background: $presszone-comments-surface-3;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-3-dark;\n }\n }\n}\n\n// Premium Select Arrow\n.presszone-comments-select--premium {\n appearance: none;\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");\n background-repeat: no-repeat;\n background-position: inline-end 14px center;\n padding-inline-end: 44px;\n\n @include dark-mode-class {\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239aa0a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E\");\n }\n}\n\n// Premium Textarea\n.presszone-comments-textarea--premium {\n min-height: 240px;\n resize: vertical;\n line-height: 1.5;\n}\n\n// Form Helper & Error Text\n.presszone-comments-admin .presszone-comments-form-help--premium {\n margin-top: 8px;\n font-size: 12px;\n color: $presszone-comments-text-muted;\n line-height: 1.4;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n.presszone-comments-form-error--premium {\n margin-top: 8px;\n font-size: 12px;\n color: $presszone-comments-error;\n display: flex;\n align-items: center;\n gap: 6px;\n\n @include dark-mode-class {\n color: $presszone-comments-error-dark;\n }\n}\n\n// Premium Buttons\n.presszone-comments-btn--premium-primary {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 12px 24px;\n min-width: 120px;\n border: none;\n border-radius: 12px;\n background: linear-gradient(135deg, $presszone-comments-primary 0%, $presszone-comments-primary-hover 100%);\n color: $presszone-comments-text-on-primary;\n font-size: 14px;\n font-weight: 600;\n letter-spacing: 0.01em;\n cursor: pointer;\n box-shadow:\n 0 2px 4px $presszone-comments-primary-shadow-sm,\n 0 4px 8px $presszone-comments-primary-dim;\n transition:\n transform $presszone-comments-duration-fast $presszone-comments-ease-spring,\n box-shadow $presszone-comments-duration-fast ease,\n background $presszone-comments-duration-fast ease;\n\n &:hover {\n transform: translateY(-2px) scale(1.02);\n box-shadow:\n 0 4px 8px $presszone-comments-primary-shadow-md,\n 0 8px 16px $presszone-comments-primary-shadow-sm;\n\n @include reduced-motion {\n transform: none !important;\n }\n }\n\n &:active {\n transform: translateY(0) scale(0.98);\n box-shadow: 0 1px 2px $presszone-comments-primary-shadow-sm;\n }\n\n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n transform: none;\n box-shadow: none;\n }\n}\n\n.presszone-comments-btn--premium-secondary {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n padding: 12px 24px;\n min-width: 100px;\n background: transparent;\n border: 1.5px solid $presszone-comments-border;\n border-radius: 12px;\n color: $presszone-comments-text-secondary;\n font-size: 14px;\n font-weight: 600;\n cursor: pointer;\n transition:\n background-color $presszone-comments-duration-fast ease,\n border-color $presszone-comments-duration-fast ease,\n color $presszone-comments-duration-fast ease,\n transform $presszone-comments-duration-fast $presszone-comments-ease-spring;\n\n @include dark-mode-class {\n border-color: $presszone-comments-border-dark;\n color: $presszone-comments-text-secondary-dark;\n }\n\n &:hover {\n background: $presszone-comments-surface-2;\n border-color: $presszone-comments-border;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-color: $presszone-comments-border-dark;\n color: $presszone-comments-text-dark;\n }\n\n @include reduced-motion {\n transform: none !important;\n }\n }\n\n &:active {\n transform: scale(0.97);\n }\n}\n\n.presszone-comments-btn--premium-ghost {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n padding: 8px 14px;\n background: transparent;\n border: none;\n border-radius: 8px;\n color: $presszone-comments-text-muted;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition:\n background-color $presszone-comments-duration-fast ease,\n color $presszone-comments-duration-fast ease;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n\n &:hover {\n background: $presszone-comments-surface-2;\n color: $presszone-comments-text;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n color: $presszone-comments-text-dark;\n }\n }\n\n &-danger:hover {\n background: $presszone-comments-error-dim-alt;\n color: $presszone-comments-error;\n\n @include dark-mode-class {\n color: $presszone-comments-error-dark;\n }\n }\n}\n\n// Button Loading State\n.presszone-comments-btn--loading {\n position: relative;\n pointer-events: none;\n color: transparent !important;\n\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 16px;\n border: 2px solid transparent;\n border-top-color: currentColor;\n border-radius: 50%;\n animation: presszone-comments-spin $presszone-comments-spinner-duration linear infinite;\n }\n\n &.presszone-comments-btn--premium-primary::after {\n border-top-color: #ffffff;\n }\n}\n\n// Premium Modal Footer\n.presszone-comments-admin .presszone-comments-modal__footer--premium {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n padding: 20px 32px;\n background: $presszone-comments-surface-2;\n border-top: 1px solid $presszone-comments-border;\n border-radius: 0 0 20px 20px;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n border-color: $presszone-comments-border-dark;\n }\n}\n\n// Conditional Field Transitions\n.presszone-comments-form-group--conditional {\n max-height: 0;\n opacity: 0;\n overflow: hidden;\n margin-bottom: 0;\n transition:\n max-height 0.3s $presszone-comments-ease-spring,\n opacity $presszone-comments-duration-normal ease,\n margin-bottom $presszone-comments-duration-normal ease;\n\n @include reduced-motion {\n transition: none !important;\n }\n\n &.is-visible {\n max-height: 200px;\n opacity: 1;\n margin-bottom: 24px;\n }\n}\n\n// Flex Row Utility\n.presszone-comments-flex-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n\n// Premium Moderator List Styles\n.presszone-comments-moderators-tab--premium {\n padding: 8px 0;\n}\n\n.presszone-comments-moderator-assign--premium {\n margin-bottom: 32px;\n\n h3 {\n font-size: 14px;\n font-weight: 600;\n color: $presszone-comments-text;\n margin: 0 0 16px;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n }\n\n .presszone-comments-flex-row {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n\n select {\n flex: 1;\n min-width: 200px;\n max-width: 400px;\n width: auto;\n }\n\n button {\n flex-shrink: 0;\n white-space: nowrap;\n }\n }\n}\n\n.presszone-comments-moderator-list--premium {\n display: flex;\n flex-direction: column;\n gap: 8px;\n min-height: 280px;\n}\n\n.presszone-comments-moderator-item--premium {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px;\n background: $presszone-comments-surface-2;\n border-radius: 12px;\n border: 1px solid transparent;\n transition:\n background-color $presszone-comments-duration-fast ease,\n border-color $presszone-comments-duration-fast ease,\n transform $presszone-comments-duration-normal $presszone-comments-ease-spring,\n box-shadow $presszone-comments-duration-fast ease;\n\n @include dark-mode-class {\n background: $presszone-comments-surface-2-dark;\n }\n\n &:hover {\n background: $presszone-comments-surface;\n border-color: $presszone-comments-border;\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);\n\n @include dark-mode-class {\n background: $presszone-comments-surface-dark;\n border-color: $presszone-comments-border-dark;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n }\n\n @include reduced-motion {\n transform: none !important;\n }\n\n .presszone-comments-moderator-remove--premium {\n opacity: 1;\n }\n }\n}\n\n.presszone-comments-moderator-avatar--premium {\n width: 36px;\n height: 36px;\n border-radius: 50%;\n object-fit: cover;\n border: 2px solid $presszone-comments-surface;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n\n @include dark-mode-class {\n border-color: $presszone-comments-surface-dark;\n }\n}\n\n.presszone-comments-moderator-info--premium {\n flex: 1;\n min-width: 0;\n}\n\n.presszone-comments-moderator-name--premium {\n font-size: 14px;\n font-weight: 600;\n color: $presszone-comments-text;\n margin: 0;\n\n @include dark-mode-class {\n color: $presszone-comments-text-dark;\n }\n}\n\n.presszone-comments-moderator-role--premium {\n font-size: 12px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n.presszone-comments-moderator-remove--premium {\n opacity: 0;\n transition: opacity $presszone-comments-duration-fast ease;\n}\n\n.presszone-comments-moderator-empty--premium {\n text-align: center;\n padding: 40px 20px;\n color: $presszone-comments-text-muted;\n\n @include dark-mode-class {\n color: $presszone-comments-text-muted-dark;\n }\n}\n\n.presszone-comments-moderator-empty__icon--premium {\n font-size: 32px;\n margin-bottom: 12px;\n opacity: 0.5;\n display: block;\n}\n\n// Reduced Motion Support\n@include reduced-motion {\n .presszone-comments-admin .presszone-comments-modal--premium,\n .presszone-comments-admin .presszone-comments-modal--premium.is-closing,\n .presszone-comments-admin .presszone-comments-form-group--animated,\n .presszone-comments-admin .presszone-comments-tab-panel--active,\n .presszone-comments-spinner,\n .presszone-comments-btn--loading::after,\n .presszone-comments-tool-spinner,\n .presszone-comments-settings-card,\n .presszone-comments-pending-changes-bar,\n .presszone-comments-tool-item,\n .presszone-comments-skeleton,\n .presszone-comments-empty-state__icon,\n .presszone-comments-btn--success-burst,\n .presszone-comments-tool-checkmark {\n animation: none !important;\n opacity: 1 !important;\n transform: none !important;\n }\n\n .presszone-comments-admin .presszone-comments-modal-overlay--premium {\n animation: none !important;\n }\n}\n\n// ==========================================================================\n// ACCESS TAB - PERMISSION MATRIX (Continues in Part 2)\n// ==========================================================================\n"],"names":[],"ignoreList":[],"sourceRoot":""}