/**
 * Tab Component Styles
 *
 * Styles for the ty-tab individual panel component including:
 * - Dynamic sizing based on parent dimensions
 * - Independent scrolling with themed scrollbars
 * - Smooth opacity transitions
 * - Flex shrink prevention for carousel layout
 */
export declare const tabStyles = "\n:host {\n  /* Panel takes dimensions from parent ty-tabs via CSS variables */\n  width: var(--tabs-width, 100%);\n  height: calc(var(--tabs-height, 400px) - var(--buttons-height, 48px));\n  display: block;\n  box-sizing: border-box;\n  flex-shrink: 0;\n  /* Prevent panel compression in flex layout */\n\n  /* Smooth opacity transition - synced with carousel animation */\n  transition: opacity var(--transition-duration, 400ms) var(--transition-easing, ease-in-out);\n}\n\n/* Respect user's motion preferences */\n@media (prefers-reduced-motion: reduce) {\n  :host {\n    transition-duration: 0ms !important;\n  }\n}\n\n.tab-panel {\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  /* Each panel scrolls independently */\n  box-sizing: border-box;\n\n  /* Scrollbar styling - consistent with Ty design system */\n  scrollbar-width: thin;\n  scrollbar-color: var(--ty-border) var(--ty-surface-elevated);\n}\n\n/* Webkit scrollbar styling */\n.tab-panel::-webkit-scrollbar {\n  width: 8px;\n  height: 8px;\n}\n\n.tab-panel::-webkit-scrollbar-track {\n  background: var(--ty-surface-elevated);\n}\n\n.tab-panel::-webkit-scrollbar-thumb {\n  background: var(--ty-border);\n  border-radius: 4px;\n}\n\n.tab-panel::-webkit-scrollbar-thumb:hover {\n  background: var(--ty-border-strong);\n}\n\n/* Inactive tabs are still rendered (for carousel) but not interactable */\n/* Visibility is controlled by parent transform, interaction by pointer-events and opacity */\n";
//# sourceMappingURL=tab.d.ts.map