frontend/admin/css/components.css

@@ -728,33 +728,60 @@
 .schedule-visual-handle {
     position: fixed;
     top: 50%;
-    right: 0;
+    right: 0 !important;
     z-index: 905;
-    width: 40px;
-    height: 40px;
-    border: 1px solid var(--button-secondary-border);
-    border-right: 0;
-    border-radius: var(--button-radius) 0 0 var(--button-radius);
-    background: var(--button-secondary-bg);
-    color: var(--button-secondary-text);
-    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.2);
-    transform: translateY(-50%);
-    transition: right var(--transition), background var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition);
+    width: 46px !important;
+    height: 100px !important;
+    border: 1px solid var(--bg-card-border) !important;
+    border-left: 3px solid var(--accent) !important;
+    border-right: 0 !important;
+    border-radius: 8px 0 0 8px !important;
+    background: color-mix(in srgb, var(--accent) 8%, var(--bg-card)) !important;
+    color: var(--text-primary) !important;
+    box-shadow: -4px 4px 16px rgba(0, 0, 0, 0.25) !important;
+    transform: translateY(-50%) !important;
+    transition: right 0.28s cubic-bezier(0.22, 1, 0.36, 1),
+                width 0.3s cubic-bezier(0.16, 1, 0.3, 1),
+                background 0.25s ease,
+                color 0.25s ease,
+                box-shadow 0.3s ease,
+                border-color 0.25s ease !important;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0 !important;
 }
 
-.schedule-visual-handle:hover,
-.schedule-visual-handle.open {
-    border-color: var(--button-secondary-border);
-    background: var(--button-secondary-bg-hover);
-    color: var(--button-secondary-text);
+.schedule-visual-handle:hover {
+    background: color-mix(in srgb, var(--accent) 18%, var(--bg-card)) !important;
+    color: var(--text-primary) !important;
+    width: 62px !important;
+    box-shadow: -8px 8px 24px rgba(0, 0, 0, 0.35) !important;
+    transform: translateY(-50%) !important;
 }
 
 .schedule-visual-handle.open {
-    right: min(92vw, 1180px);
+    right: min(92vw, 1180px) !important;
+    border-color: var(--bg-card-border) !important;
+    border-left: 3px solid var(--accent) !important;
+    background: color-mix(in srgb, var(--accent) 12%, var(--bg-card)) !important;
+    color: var(--text-primary) !important;
+}
+
+.schedule-visual-handle.open:hover {
+    transform: translateY(-50%) !important;
+    width: 62px !important;
 }
 
 .schedule-visual-handle.open .schedule-visual-handle-icon {
-    transform: rotate(180deg);
+    transform: rotate(180deg) !important;
+}
+
+.schedule-visual-handle-icon {
+    width: 38px !important;
+    height: 38px !important;
+    stroke-width: 3px !important;
+    transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1) !important;
 }
 
 .schedule-visual-backdrop {
@@ -1135,7 +1162,7 @@
     }
 
     .schedule-visual-handle.open {
-        right: calc(100vw - 42px);
+        right: calc(100vw - 46px) !important;
     }
 
     .schedule-visual-header {
@@ -1660,8 +1687,7 @@
     color: var(--text-secondary);
 }
 
-@media (max-width: 1180px) {
-
+@media (max-width: 1350px) {
     .schedule-view-filter-grid,
     .schedule-view-metrics,
     .department-workspace-grid {
@@ -1674,9 +1700,17 @@
 
     .schedule-slot-row,
     .schedule-slot-row.has-subgroup {
-        grid-template-columns: repeat(2, minmax(180px, 1fr));
+        grid-template-columns: repeat(4, 1fr);
     }
 
+    .schedule-slot-remove {
+        grid-column: 4;
+        justify-self: end;
+        width: auto;
+    }
+}
+
+@media (max-width: 1024px) {
     .calendar-fill-panel {
         grid-template-columns: repeat(2, minmax(180px, 1fr));
     }
@@ -1698,6 +1732,17 @@
         flex-direction: column;
         gap: 0.2rem;
     }
+
+    .schedule-slot-row,
+    .schedule-slot-row.has-subgroup {
+        grid-template-columns: repeat(2, minmax(150px, 1fr));
+    }
+
+    .schedule-slot-remove {
+        grid-column: 2;
+        justify-self: end;
+        width: auto;
+    }
 }
 
 @media (max-width: 640px) {
@@ -1710,6 +1755,12 @@
         grid-template-columns: 1fr;
     }
 
+    .schedule-slot-remove {
+        grid-column: 1;
+        justify-self: stretch;
+        width: 100%;
+    }
+
     .subject-import-row {
         grid-template-columns: 1fr;
     }

frontend/admin/js/views/schedule.js

@@ -271,7 +271,6 @@ export async function initSchedule() {
         visualToggleButton?.classList.add('open');
         visualToggleButton?.setAttribute('aria-expanded', 'true');
         visualToggleButton?.setAttribute('aria-label', 'Скрыть визуальное расписание');
-        if (visualToggleButton) visualToggleButton.textContent = '›';
         if (visualBackdrop) visualBackdrop.hidden = false;
     }
 
@@ -282,7 +281,6 @@ export async function initSchedule() {
         visualToggleButton?.classList.remove('open');
         visualToggleButton?.setAttribute('aria-expanded', 'false');
         visualToggleButton?.setAttribute('aria-label', 'Показать визуальное расписание');
-        if (visualToggleButton) visualToggleButton.textContent = '‹';
         if (visualBackdrop) visualBackdrop.hidden = true;
     }