.admin-sidebar nav { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: none; }
.admin-sidebar nav::-webkit-scrollbar { display: none; }
.module-tabs { display: flex; gap: 22px; height: 40px; margin: -4px 0 14px; border-bottom: 1px solid var(--line); }
.module-tabs button { height: 40px; padding: 0 2px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; font-size: 11px; }
.module-tabs button.active { color: var(--brand); border-bottom-color: var(--brand); font-weight: 700; }
.overview-date { display: flex; height: 34px; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid var(--line); border-radius: 6px; background: white; color: var(--muted); font-size: 10px; }
.overview-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.overview-metrics article { display: flex; min-height: 110px; justify-content: center; flex-direction: column; padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.overview-metrics span { color: var(--muted); font-size: 10px; }.overview-metrics b { margin: 9px 0 7px; color: var(--ink); font: 600 24px var(--font-mono); }.overview-metrics small { color: var(--brand); font-size: 9px; }.overview-metrics small.attention { color: var(--warning); }
.overview-grid { display: grid; grid-template-columns: minmax(320px, .85fr) minmax(420px, 1.4fr); gap: 12px; margin-top: 12px; }
.overview-tasks, .trend-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: white; }
.overview-tasks > button { display: grid; width: 100%; min-height: 62px; grid-template-columns: 1fr 42px 20px; align-items: center; gap: 8px; padding: 0 14px; text-align: left; border: 0; border-bottom: 1px solid #edf1ee; background: white; }
.overview-tasks > button:last-child { border: 0; }.overview-tasks > button:hover { background: #fafcfa; }.overview-tasks > button > span { display: flex; flex-direction: column; gap: 4px; }.overview-tasks b { font-size: 10px; }.overview-tasks small { color: var(--muted); font-size: 8px; }.overview-tasks strong { color: var(--warning); font: 600 14px var(--font-mono); text-align: right; }
.mini-legend { color: var(--muted); font-size: 9px; }.mini-legend i { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 2px; background: var(--brand); }
.fake-chart { display: flex; height: 255px; align-items: end; justify-content: space-around; gap: 15px; padding: 32px 24px 28px; background-image: linear-gradient(to bottom, transparent 24%, #edf1ee 25%, transparent 26%, transparent 49%, #edf1ee 50%, transparent 51%, transparent 74%, #edf1ee 75%, transparent 76%); }
.fake-chart > span { position: relative; width: 42px; min-height: 12px; border-radius: 5px 5px 1px 1px; background: linear-gradient(to top, var(--brand), #68a38a); transition: height .2s ease; }.fake-chart > span:hover { background: var(--price); }.fake-chart i { position: absolute; right: 0; bottom: -20px; left: 0; color: var(--muted); font: 8px var(--font-mono); font-style: normal; text-align: center; }
.service-admin-page { overflow: hidden; }.service-console { display: grid; height: calc(100% - 72px); grid-template-columns: 285px 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: white; }.service-console > aside { overflow-y: auto; border-right: 1px solid var(--line); }.service-console > aside > label { display: flex; height: 50px; align-items: center; gap: 7px; padding: 0 12px; border-bottom: 1px solid var(--line); color: var(--muted); }.service-console > aside input { width: 100%; border: 0; outline: 0; font-size: 10px; }.service-console > aside > button { display: grid; width: 100%; height: 67px; grid-template-columns: 38px 1fr auto; align-items: center; gap: 9px; padding: 0 12px; text-align: left; border: 0; border-bottom: 1px solid #edf1ee; background: white; }.service-console > aside > button.active { background: var(--brand-soft); }.service-console > aside > button > span { display: flex; min-width: 0; flex-direction: column; gap: 5px; }.service-console > aside b { font-size: 10px; }.service-console > aside small { overflow: hidden; color: var(--muted); font-size: 8px; white-space: nowrap; text-overflow: ellipsis; }.service-console time { color: var(--muted-2); font: 8px var(--font-mono); }
.service-console > main { display: grid; min-width: 0; grid-template-rows: 60px 1fr 58px; background: #f2f5f2; }.service-console > main > header { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 9px; padding: 0 15px; border-bottom: 1px solid var(--line); background: white; }.service-console > main > header > div { display: flex; flex-direction: column; gap: 4px; }.service-console > main > header b { font-size: 11px; }.service-console > main > header span { color: var(--muted); font-size: 8px; }.service-console > main > header button { height: 29px; padding: 0 10px; border: 1px solid var(--line); border-radius: 5px; background: white; font-size: 9px; }.service-chat { display: flex; overflow-y: auto; flex-direction: column; gap: 11px; padding: 20px; }.service-chat div { max-width: 66%; padding: 10px 12px; border-radius: 8px; font-size: 10px; line-height: 1.5; }.service-chat .them { align-self: flex-start; border-radius: 2px 8px 8px 8px; background: white; }.service-chat .me { align-self: flex-end; color: white; border-radius: 8px 2px 8px 8px; background: var(--brand); }.service-console > main > footer { display: grid; grid-template-columns: 1fr 66px; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--line); background: white; }.service-console > main > footer input { padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; font-size: 10px; }.service-console > main > footer button { border: 0; border-radius: 6px; color: white; background: var(--brand); font-size: 10px; }
.topbar-avatar { padding: 0 !important; border: 0 !important; background: transparent !important; }
.merchant-settings-page { width: 100%; }.settings-form-card { width: 100%; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: white; }.settings-section-title { display: flex; align-items: center; gap: 9px; padding: 17px 20px; border-bottom: 1px solid var(--line); }.settings-section-title > div { display: flex; flex-direction: column; gap: 4px; }.settings-section-title > .status-ticket { margin-left: auto; }.settings-section-title b { font-size: 14px; }.settings-section-title small { color: var(--muted); font-size: 11px; }.settings-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 24px; padding: 24px; }.settings-form-grid label { display: flex; flex-direction: column; gap: 8px; color: var(--ink-2); font-size: 12px; }.settings-form-grid label.wide { grid-column: 1 / -1; }.settings-form-grid input, .settings-form-grid select, .settings-form-grid textarea { min-height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 6px; background: white; }.settings-form-grid textarea { min-height: 92px; padding-top: 11px; resize: vertical; }.business-switch { display: grid !important; grid-template-columns: 1fr 40px; align-items: center; padding: 12px 14px; border: 1px solid var(--line); border-radius: 6px; background: var(--paper); }.business-switch > span { display: flex; flex-direction: column; gap: 4px; }.business-switch small { color: var(--muted); }.business-switch input { width: 38px; min-height: 20px; }.settings-save-bar { display: flex; align-items: center; justify-content: flex-end; gap: 18px; padding: 14px 20px; border-top: 1px solid var(--line); background: #fafbfa; }.settings-save-bar span { color: var(--muted); font-size: 11px; }.settings-save-bar button { height: 38px; padding: 0 20px; border: 0; border-radius: 6px; color: white; background: var(--brand); font-weight: 700; }
@media (max-width: 1050px) { .overview-metrics { grid-template-columns: repeat(2,1fr); }.overview-grid { grid-template-columns: 1fr; }.service-console { grid-template-columns: 220px 1fr; } }