Дизайн Артёма

shine-UI/styles/components/tabs.css

@@ -1,16 +1,19 @@
 /* Shared tab geometry and tab primitives. */
 
 .tabs {
+  min-height: 44px;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
-  border: 1px solid rgba(255, 255, 255, 0.08);
+  gap: 4px;
+  border: 1px solid var(--border-subtle);
   border-radius: 12px;
   padding: 4px;
-  background: rgba(255, 255, 255, 0.02);
+  background: var(--surface);
 }
-
+.tabs--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
 
 .tab-btn {
+  min-height: 44px;
   border: 0;
   background: transparent;
   border-radius: 9px;
@@ -21,9 +24,12 @@
 
 
 .tab-btn.active {
-  background: rgba(83, 216, 251, 0.16);
+  background: var(--surface-selected);
   color: var(--text);
 }
+.tab-btn:hover { color: var(--text-primary); }
+.tab-btn:active { transform: scale(.98); }
+.tab-btn:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }