export declare const viewModeSwitcherStyles = "\n.comimi-view-switcher {\n position: absolute;\n top: 20px;\n right: 20px;\n display: grid;\n grid-template-columns: repeat(3, 60px);\n width: 180px;\n border-radius: 16px;\n background: var(--comimi-glass);\n box-shadow: var(--comimi-shadow);\n backdrop-filter: blur(5px);\n pointer-events: auto;\n transition:\n transform 0.6s var(--comimi-spring),\n opacity 0.3s linear;\n}\n\n.comimi-view-switcher[data-overlay=\"false\"] {\n transform: translateY(-35px);\n opacity: 0;\n pointer-events: none;\n transition:\n transform 0.3s var(--comimi-spring),\n opacity 0.15s linear;\n}\n\n@media (hover: hover) {\n .comimi-view-switcher:hover {\n transform: scaleX(1.03);\n }\n}\n\n.comimi-view-switcher-indicator {\n position: absolute;\n top: 0;\n left: 0;\n width: 60px;\n height: 100%;\n border-radius: 16px;\n background: var(--comimi-muted);\n transition: transform 0.36s var(--comimi-spring);\n}\n\n.comimi-view-switcher-button {\n position: relative;\n display: grid;\n row-gap: 5px;\n justify-items: center;\n align-content: center;\n height: 58px;\n padding: 0;\n border: 0;\n background: transparent;\n color: var(--comimi-muted);\n cursor: pointer;\n transition: color 0.2s linear;\n}\n\n.comimi-view-switcher-button[data-selected=\"true\"] {\n color: var(--comimi-white);\n}\n\n.comimi-view-switcher-icon-wrap {\n width: 20px;\n height: 20px;\n transform-origin: center bottom;\n}\n\n.comimi-view-switcher-icon {\n display: block;\n width: 100%;\n height: 100%;\n color: currentColor;\n}\n\n.comimi-view-switcher-icon-wrap.comimi-pop-animate {\n animation: comimi-pop 0.5s ease-in-out 0.1s both;\n}\n\n.comimi-view-switcher-label {\n color: currentColor;\n font-size: 10px;\n font-weight: 500;\n text-align: center;\n transition: color 0.2s linear;\n}\n\n@media (max-width: 767px) {\n .comimi-view-switcher {\n top: 70px;\n right: auto;\n left: calc(50% - 90px);\n }\n}\n"; //# sourceMappingURL=view-mode-switcher.styles.d.ts.map