:root {
    --ms-teal: #8fcfca;
    --ms-teal-deep: #4faea9;
    --ms-teal-dark: #216e6a;
    --ms-bg: #f3f6f7;
    --ms-panel: #ffffff;
    --ms-text: #1f2933;
    --ms-muted: #66788a;
    --ms-line: #d6dee1;
    --ms-soft: #eef8f7;
    --ms-danger: #9f2d20;
    --ms-danger-bg: #fff2ef;
    --ms-future: #fffdf0;
    --ms-future-alt: #fffaf0;
    --ms-past: #e8e9ea;
    --ms-past-alt: #e2e4e5;
    --ms-today: #dff4f2;
    --ms-nonworking: #e1e3e4;
    --ms-topbar-h: 44px;
    --ms-sheetbar-h: 34px;
    --ms-hscroll-h: 17px;
    --ms-col-time: 34px;
    --ms-col-arrived: 18px;
    --ms-col-name: 78px;
    --ms-col-reason: 62px;
    --ms-col-icons: 44px;
    --ms-col-taken: 18px;
    --ms-day-min: calc(var(--ms-col-time) + var(--ms-col-arrived) + var(--ms-col-name) + var(--ms-col-reason) + var(--ms-col-icons) + var(--ms-col-taken));
    --ms-shadow: 0 8px 22px rgba(31, 41, 51, 0.08);
}

* { box-sizing: border-box; }
html, body.mediana-staff-body {
    margin: 0;
    width: 100%;
    min-width: 0;
    min-height: 100%;
    font-family: Arial, Helvetica, sans-serif;
    color: var(--ms-text);
    background: var(--ms-bg);
}
body.mediana-staff-body { min-height: 100vh; }
a { color: var(--ms-teal-dark); }
button, input, textarea { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }

/* Login */
.ms-login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 28px 16px;
    background: linear-gradient(180deg, rgba(143, 207, 202, 0.26), rgba(243, 246, 247, 0.88) 38%), var(--ms-bg);
}
.ms-login-card {
    width: min(430px, 100%);
    padding: 32px;
    border: 1px solid var(--ms-line);
    border-radius: 18px;
    background: var(--ms-panel);
    box-shadow: var(--ms-shadow);
}
.ms-login-brand, .ms-workspace-brand { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ms-login-brand { margin-bottom: 26px; }
.ms-login-logo { width: 48px; height: 44px; object-fit: contain; display: block; }
.ms-brand-name { font-size: 20px; font-weight: 800; letter-spacing: 0.02em; }
.ms-brand-subtitle { margin-top: 2px; color: var(--ms-muted); font-size: 13px; }
.ms-login-card h1 { margin: 0 0 8px; font-size: 28px; line-height: 1.18; }
.ms-login-help { margin: 0 0 22px; color: var(--ms-muted); line-height: 1.5; }
.ms-alert { margin: 0 0 18px; padding: 12px 14px; border-radius: 10px; line-height: 1.45; }
.ms-alert-error { border: 1px solid #efb9af; background: var(--ms-danger-bg); color: var(--ms-danger); }
.ms-login-form { display: grid; gap: 16px; }
.ms-field { display: grid; gap: 7px; font-weight: 700; font-size: 14px; }
.ms-field input {
    width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #b8c7ce;
    border-radius: 9px; background: #fff; color: var(--ms-text); outline: none;
}
.ms-field input:focus { border-color: var(--ms-teal-deep); box-shadow: 0 0 0 3px rgba(79, 174, 169, 0.14); }
.ms-remember { display: flex; align-items: center; gap: 9px; color: var(--ms-muted); font-size: 14px; cursor: pointer; }
.ms-remember input { width: 17px; height: 17px; }
.ms-primary-button {
    min-height: 44px; padding: 9px 15px; border: 0; border-radius: 8px;
    background: var(--ms-teal-deep); color: #fff; font-weight: 800; cursor: pointer;
}
.ms-primary-button:hover { background: var(--ms-teal-dark); }
.ms-button-link { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.ms-login-footer {
    margin-top: 13px; padding-top: 18px; border-top: 1px solid var(--ms-line);
    display: flex; justify-content: space-between; gap: 12px; color: var(--ms-muted); font-size: 13px;
}

/* Workspace */
.ms-app-shell { min-height: 100vh; padding-bottom: var(--ms-sheetbar-h); }
body.has-ms-hscroll .ms-app-shell { padding-bottom: calc(var(--ms-sheetbar-h) + var(--ms-hscroll-h)); }
.ms-topbar {
    position: sticky; top: 0; z-index: 80; height: var(--ms-topbar-h); min-height: var(--ms-topbar-h);
    padding: 3px 8px; display: grid;
    grid-template-columns: minmax(150px, 0.65fr) minmax(320px, 2.5fr) auto;
    align-items: center; gap: 8px; border-bottom: 1px solid rgba(33, 110, 106, 0.26);
    background: linear-gradient(90deg, #9bd6d1, #83c9c4);
    box-shadow: 0 1px 8px rgba(31, 41, 51, 0.08);
}
.ms-workspace-brand { color: inherit; text-decoration: none; cursor: pointer; }
.ms-workspace-brand:hover, .ms-workspace-brand:focus { color: inherit; text-decoration: none; }
.ms-brand-logo { width: 35px; height: 32px; object-fit: contain; display: block; flex: 0 0 auto; }
.ms-workspace-brand-text { display: grid; gap: 0; color: #fff; line-height: 1.05; }
.ms-workspace-brand-text strong { font-size: 14px; letter-spacing: 0.02em; }
.ms-workspace-brand-text span { font-size: 9px; opacity: 0.92; }
.ms-tabs {
    display: flex; align-items: center; gap: 4px; min-width: 0; overflow-x: auto;
    scrollbar-width: thin; white-space: nowrap;
}
.ms-tab {
    flex: 0 0 auto; min-height: 30px; padding: 4px 13px; border: 0; border-radius: 7px;
    background: transparent; color: rgba(255,255,255,.94); font-weight: 800; font-size: 12px; cursor: pointer;
}
.ms-tab:hover { background: rgba(255,255,255,.16); }
.ms-tab.is-active { background: #fff; color: var(--ms-teal-dark); box-shadow: 0 2px 8px rgba(31,41,51,.08); }
.ms-tab-add { min-width: 30px; padding: 4px 8px; font-size: 17px; line-height: 1; }
.ms-user-area { display: flex; justify-content: flex-end; align-items: center; gap: 6px; color: #fff; white-space: nowrap; }
.ms-user-text { min-width: 0; display: grid; justify-items: end; gap: 0; line-height: 1.05; }
.ms-user-text strong { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.ms-user-text span { font-size: 8px; opacity: .9; }
.ms-top-action, .ms-logout {
    flex: 0 0 auto; min-height: 28px; padding: 4px 8px; border: 1px solid rgba(255,255,255,.72);
    border-radius: 7px; background: transparent; color: #fff; text-decoration: none; font-size: 10px; font-weight: 800; cursor: pointer;
}
.ms-top-action:hover, .ms-logout:hover { background: rgba(255,255,255,.16); }
.ms-settings-button { width: 30px; padding: 3px; font-size: 15px; }
.ms-sync-status { min-width: 44px; text-align: right; font-size: 9px; opacity: .92; }
.ms-sync-status.is-error { color: #7a1e18; font-weight: 800; }
.ms-sync-status.is-busy { opacity: .8; }

.ms-workspace { width: 100%; padding: 0; }
.ms-schedule-root { width: 100%; min-width: 0; background: #fff; }
.ms-loading, .ms-empty-state, .ms-error-state {
    margin: 16px; padding: 18px; border: 1px dashed #c4d0d4; border-radius: 8px; background: #fff; color: var(--ms-muted); text-align: center;
}
.ms-error-state { color: var(--ms-danger); background: var(--ms-danger-bg); }

/* Schedule */
.ms-schedule { width: 100%; }
.ms-week { border-bottom: 3px solid #c7d4d7; scroll-margin-top: calc(var(--ms-topbar-h) + 2px); }
.ms-week-title {
    position: sticky; top: var(--ms-topbar-h); z-index: 45; min-height: 25px; padding: 3px 8px;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    border-bottom: 1px solid #cfdadd; background: #f6f8f9; color: #30404c; font-size: 10px;
}
.ms-week-title strong { font-size: 11px; }
.ms-week-title span { color: var(--ms-muted); }
.ms-week-scroll { width: 100%; overflow-x: auto; overflow-y: visible; scrollbar-width: none; }
.ms-week-scroll::-webkit-scrollbar { height: 0; }
.ms-week-grid {
    display: grid; grid-template-columns: repeat(5, minmax(var(--ms-day-min), 1fr)); min-width: 0;
    background: #d4dde0; gap: 1px;
}
.ms-day { min-width: 0; background: #fff; }
.ms-day.is-outside-horizon { opacity: .45; }
.ms-day-head {
    min-height: 31px; padding: 3px 4px; display: flex; align-items: center; justify-content: center; gap: 5px;
    border-bottom: 1px solid #9aa8ae; background: #f1f3f4; font-size: 9px; white-space: nowrap;
}
.ms-day-head strong { font-size: 10px; }
.ms-day-head span { color: #3d4d57; font-weight: 700; }
.ms-day-head em {
    padding: 1px 4px; border-radius: 4px; background: #d4d7d8; color: #5d6367; font-style: normal; font-size: 8px; font-weight: 800;
}
.ms-day.is-today .ms-day-head { background: var(--ms-today); box-shadow: inset 0 -2px 0 var(--ms-teal-deep); }
.ms-day.is-nonworking .ms-day-head { background: #dfe2e3; color: #62676a; }

.ms-column-labels, .ms-slot-row {
    display: grid;
    grid-template-columns: var(--ms-col-time) var(--ms-col-arrived) minmax(var(--ms-col-name), 1.24fr) minmax(var(--ms-col-reason), .92fr) var(--ms-col-icons) var(--ms-col-taken);
    align-items: stretch;
}
.ms-column-labels {
    min-height: 20px; border-bottom: 1px solid #aeb8bc; background: #fff;
    color: #40515c; font-size: 8px; font-weight: 700; text-align: center;
}
.ms-column-labels > span { display: flex; align-items: center; justify-content: center; border-right: 1px solid #d5dcde; overflow: hidden; }
.ms-column-labels > span:last-child { border-right: 0; }
.ms-icons-label { letter-spacing: 1px; }

.ms-slot-row {
    --ms-row-bg: var(--ms-future);
    position: relative; min-height: 20px; background: var(--ms-row-bg); border-bottom: 1px solid #d6dcde; font-size: 10px;
}
.ms-slot-row:nth-child(even) { --ms-row-bg: var(--ms-future-alt); }
.ms-slot-row.is-locked { --ms-row-bg: var(--ms-past); color: #6e7478; }
.ms-slot-row.is-locked:nth-child(even) { --ms-row-bg: var(--ms-past-alt); }
.ms-day.is-nonworking .ms-slot-row { --ms-row-bg: var(--ms-nonworking); color: #72777a; }
.ms-slot-row.is-saving { box-shadow: inset 2px 0 0 #e5b43b; }
.ms-slot-row.is-saved-flash { box-shadow: inset 2px 0 0 var(--ms-teal-deep); }

.ms-time, .ms-check-cell, .ms-edit-cell, .ms-icons {
    min-width: 0; border-right: 1px solid #d6dcde;
}
.ms-time {
    position: relative; z-index: 5; display: flex; align-items: center; justify-content: center;
    padding: 0 1px; background: var(--ms-row-bg); font-weight: 700; white-space: nowrap;
}
.ms-check-cell {
    position: relative; z-index: 5; display: grid; place-items: center; margin: 0;
    background: var(--ms-row-bg); cursor: pointer;
}
.ms-check-cell input { width: 12px; height: 12px; margin: 0; accent-color: var(--ms-teal-dark); cursor: pointer; }
.ms-check-cell input:disabled { cursor: default; opacity: .62; }
.ms-taken-cell { border-right: 0; }

.ms-edit-cell {
    min-height: 19px; padding: 2px 3px; white-space: nowrap; line-height: 15px; outline: none; cursor: text;
}
.ms-edit-cell:empty::before { content: attr(data-placeholder); color: transparent; pointer-events: none; }
.ms-edit-cell[contenteditable="true"]:hover { box-shadow: inset 0 0 0 1px rgba(79,174,169,.25); }
.ms-edit-cell[contenteditable="true"]:focus {
    z-index: 12 !important; overflow: visible; background: #fff !important; box-shadow: inset 0 0 0 2px var(--ms-teal-deep);
}
.ms-slot-row.is-locked .ms-edit-cell { cursor: default; }
.ms-name {
    position: relative; z-index: 2; overflow: visible; text-overflow: clip; font-weight: 600; background: transparent;
}
.ms-reason {
    position: relative; z-index: 3; overflow: hidden; text-overflow: clip; background: transparent; color: #313a40;
}
.ms-slot-row.has-reason-text .ms-reason,
.ms-reason:focus { background: var(--ms-row-bg); }

/* The following cells deliberately mask name overflow. If Reason is empty, the name may visually continue into it, Google-Sheets style. */
.ms-icons {
    position: relative; z-index: 5; display: grid; grid-template-columns: repeat(3, 1fr);
    align-items: stretch; overflow: hidden; background: var(--ms-row-bg);
}
.ms-icon {
    min-width: 0; padding: 0; border: 0; background: transparent; display: grid; place-items: center;
    font-size: 10px; line-height: 1; cursor: pointer; opacity: .18;
}
button.ms-icon:hover { background: rgba(79,174,169,.11); opacity: .85; }
button.ms-icon:disabled { cursor: default; opacity: .06; }
/* Active accessory icons must be unmistakable at a glance. */
.ms-icon.is-active {
    opacity: 1;
    border-radius: 3px;
    background: rgba(79,174,169,.18);
    box-shadow: inset 0 0 0 1px rgba(43,126,122,.28);
}
.ms-icon-note.is-active {
    background: #fff0a8;
    box-shadow: inset 0 0 0 1px #d8b43b;
}
.ms-icon-phone.is-active {
    background: rgba(79,174,169,.22);
}
button.ms-icon.is-active:disabled { opacity: .72; }
.ms-icon-online { font-size: 9px; }
.ms-icon-online.is-placeholder { visibility: hidden; }
.ms-load-sentinel { height: 1px; }

/* Persistent horizontal scrollbar for wide schedules */
.ms-horizontal-bar {
    position: fixed; left: 0; right: 0; bottom: var(--ms-sheetbar-h); z-index: 88; height: var(--ms-hscroll-h);
    overflow-x: auto; overflow-y: hidden; background: #edf1f2; border-top: 1px solid #c7d1d4;
    scrollbar-width: auto;
}
.ms-horizontal-inner { height: 1px; min-width: 100%; }
.ms-horizontal-bar::-webkit-scrollbar { height: 15px; }
.ms-horizontal-bar::-webkit-scrollbar-track { background: #edf1f2; }
.ms-horizontal-bar::-webkit-scrollbar-thumb { background: #aebcc1; border: 3px solid #edf1f2; border-radius: 10px; }
.ms-horizontal-bar::-webkit-scrollbar-thumb:hover { background: #81959c; }

/* Bottom sheet tabs */
.ms-sheetbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; height: var(--ms-sheetbar-h);
    display: flex; align-items: center; gap: 2px; padding: 2px 8px; overflow-x: auto;
    border-top: 1px solid #bdc9cd; background: #f5f7f8; box-shadow: 0 -2px 9px rgba(31,41,51,.07);
}
.ms-sheet, .ms-sheet-add {
    flex: 0 0 auto; min-height: 28px; padding: 4px 12px; border: 0; border-radius: 6px;
    background: transparent; color: #37464f; font-size: 11px; font-weight: 700; cursor: pointer;
}
.ms-sheet:hover, .ms-sheet-add:hover { background: #e7ecee; }
.ms-sheet.is-active { background: #fff; color: var(--ms-teal-dark); box-shadow: inset 0 -2px 0 var(--ms-teal-deep), 0 1px 4px rgba(31,41,51,.08); }
.ms-sheet-add { width: 29px; padding: 2px; font-size: 18px; }

/* Phone / note editor */
.ms-popover {
    position: fixed; z-index: 140; padding: 9px; border: 1px solid #b8c7cc; border-radius: 8px;
    background: #fff; box-shadow: 0 10px 28px rgba(31,41,51,.18);
}
.ms-popover-title { margin-bottom: 6px; font-size: 11px; font-weight: 800; }
.ms-popover-field {
    width: 100%; min-height: 32px; padding: 6px 7px; border: 1px solid #bdc9cd; border-radius: 6px;
    color: var(--ms-text); background: #fff; outline: none; font-size: 12px;
}
textarea.ms-popover-field { min-height: 82px; resize: vertical; }
.ms-popover-field:focus { border-color: var(--ms-teal-deep); box-shadow: 0 0 0 2px rgba(79,174,169,.12); }
.ms-popover-actions { margin-top: 7px; display: flex; justify-content: flex-end; gap: 6px; }
.ms-popover-actions button {
    min-height: 27px; padding: 3px 8px; border: 1px solid #bdc9cd; border-radius: 6px; background: #fff; color: #45535b; font-size: 10px; font-weight: 700; cursor: pointer;
}
.ms-popover-actions button.is-primary { border-color: var(--ms-teal-deep); background: var(--ms-teal-deep); color: #fff; }

/* Admin drawer */
.ms-admin-overlay {
    position: fixed; inset: 0; z-index: 110; background: rgba(20,31,36,.24); opacity: 0; transition: opacity .18s ease;
}
.ms-admin-overlay.is-open { opacity: 1; }
.ms-admin-drawer {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: 120; width: min(410px, 94vw);
    padding-bottom: var(--ms-sheetbar-h); background: #fff; border-left: 1px solid #c9d4d7;
    box-shadow: -10px 0 26px rgba(31,41,51,.14); transform: translateX(102%); transition: transform .18s ease; overflow-y: auto;
}
.ms-admin-drawer.is-open { transform: translateX(0); }
.ms-admin-drawer-head {
    position: sticky; top: 0; z-index: 2; min-height: 52px; padding: 9px 11px;
    display: flex; align-items: center; justify-content: space-between; background: #edf8f7; border-bottom: 1px solid #cbd9da;
}
.ms-admin-drawer-head > div { display: grid; gap: 1px; }
.ms-admin-drawer-head strong { font-size: 15px; }
.ms-admin-drawer-head span { font-size: 10px; color: var(--ms-muted); }
.ms-admin-close { width: 30px; height: 30px; border: 0; border-radius: 6px; background: transparent; font-size: 22px; color: #445159; cursor: pointer; }
.ms-admin-close:hover { background: rgba(0,0,0,.06); }
.ms-admin-section { padding: 14px 13px; border-bottom: 1px solid #e0e6e8; }
.ms-admin-section h2 { margin: 0 0 10px; font-size: 14px; }
.ms-admin-note { margin: 0 0 10px; color: var(--ms-muted); font-size: 11px; line-height: 1.45; }
.ms-admin-form { display: grid; grid-template-columns: 135px 1fr; gap: 8px; align-items: end; }
.ms-admin-form label { display: grid; gap: 4px; font-size: 10px; font-weight: 700; }
.ms-admin-form input[type="date"], .ms-admin-form input[type="text"] {
    width: 100%; min-height: 34px; padding: 6px 7px; border: 1px solid #bdc9cd; border-radius: 6px; background: #fff; font-size: 11px; outline: none;
}
.ms-admin-form input:focus { border-color: var(--ms-teal-deep); }
.ms-admin-check { grid-column: 1; display: flex !important; align-items: center; gap: 6px !important; }
.ms-admin-check input { width: 15px; height: 15px; }
.ms-admin-save { grid-column: 2; min-height: 33px; font-size: 11px; }
.ms-nonworking-list { margin-top: 12px; display: grid; gap: 4px; }
.ms-nonworking-row {
    min-height: 37px; padding: 5px 6px; display: grid; grid-template-columns: 1fr 24px 25px; align-items: center; gap: 5px;
    border: 1px solid #d6dee1; border-radius: 6px; background: #fff;
}
.ms-nonworking-row.is-inactive { opacity: .55; }
.ms-nonworking-main { min-width: 0; display: grid; gap: 1px; }
.ms-nonworking-main strong { font-size: 11px; }
.ms-nonworking-main span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ms-muted); font-size: 10px; }
.ms-nonworking-row input { width: 14px; height: 14px; }
.ms-row-delete { width: 24px; height: 24px; border: 0; border-radius: 5px; background: transparent; color: #9b3328; font-size: 17px; cursor: pointer; }
.ms-row-delete:hover { background: #fff0ed; }
.ms-admin-empty { padding: 9px; border: 1px dashed #d1dade; border-radius: 6px; color: var(--ms-muted); font-size: 10px; text-align: center; }
.ms-secondary-button {
    min-height: 31px; padding: 5px 10px; border: 1px solid #b8cfd0; border-radius: 7px;
    background: #fff; color: var(--ms-teal-dark); font-size: 11px; font-weight: 800; cursor: pointer;
}
.ms-secondary-button:hover { background: var(--ms-soft); }
.ms-column-width-controls { display: grid; gap: 7px; }
.ms-column-width-controls label {
    display: grid; grid-template-columns: 82px minmax(0,1fr) 74px; align-items: center; gap: 7px;
    font-size: 10px; font-weight: 700; color: #44545d;
}
.ms-column-width-controls input[type="range"] { width: 100%; accent-color: var(--ms-teal-deep); cursor: pointer; }
.ms-width-number-wrap { display: grid; grid-template-columns: minmax(0,1fr) 17px; align-items: center; gap: 2px; }
.ms-width-number-wrap input[type="number"] { width: 100%; min-width: 0; height: 25px; padding: 2px 3px; border: 1px solid #c9d5d9; border-radius: 5px; background: #fff; color: #33434b; font-size: 10px; font-variant-numeric: tabular-nums; text-align: right; }
.ms-width-number-wrap em { font-style: normal; color: var(--ms-muted); font-size: 9px; }
.ms-column-width-actions { margin-top: 10px; display: flex; justify-content: flex-end; }

/* Toast */
.ms-toast {
    position: fixed; right: 12px; bottom: calc(var(--ms-sheetbar-h) + 10px); z-index: 160;
    max-width: 360px; padding: 9px 12px; border-radius: 7px; background: #35434a; color: #fff;
    font-size: 11px; box-shadow: 0 8px 22px rgba(31,41,51,.18); opacity: 0; transform: translateY(6px); pointer-events: none; transition: .16s ease;
}
.ms-toast.is-show { opacity: 1; transform: translateY(0); }
.ms-toast.is-error { background: #8b2c22; }
.ms-toast.is-ok { background: #2e7563; }

@media (max-width: 1100px) {
    :root { --ms-topbar-h: 76px; }
    .ms-topbar { height: auto; min-height: 76px; grid-template-columns: 1fr auto; grid-template-rows: 38px 32px; }
    .ms-tabs { grid-column: 1 / -1; grid-row: 2; }
    .ms-user-area { grid-column: 2; grid-row: 1; }
}

@media (max-width: 620px) {
    .ms-login-card { padding: 24px 18px; }
    .ms-login-footer { flex-direction: column; }
    .ms-workspace-brand-text span, .ms-user-text, .ms-sync-status { display: none; }
    .ms-topbar { padding: 3px 6px; }
    .ms-admin-form { grid-template-columns: 1fr; }
    .ms-admin-check, .ms-admin-save { grid-column: 1; }
}

/* v0.4 – управление на TAB-ове и листове */
.ms-structure-manager { display: grid; gap: 7px; margin: 0 0 10px; }
.ms-structure-tab {
    border: 1px solid #cfdadd; border-radius: 7px; background: #f8fafb; overflow: hidden;
    transition: border-color .12s ease, box-shadow .12s ease, opacity .12s ease;
}
.ms-structure-tab.is-dragging, .ms-structure-sheet.is-dragging { opacity: .48; }
.ms-structure-tab.is-drag-over { border-color: var(--ms-teal-deep); box-shadow: inset 0 2px 0 var(--ms-teal-deep); }
.ms-structure-tab-head {
    min-height: 36px; display: grid; grid-template-columns: 23px minmax(0,1fr) auto 27px 27px; gap: 4px; align-items: center;
    padding: 4px 5px; background: #eef6f6; border-bottom: 1px solid #d8e1e3;
}
.ms-drag-handle {
    display: grid; place-items: center; width: 23px; height: 27px; border-radius: 5px; color: #718086;
    font-size: 15px; font-weight: 900; cursor: grab; user-select: none;
}
.ms-drag-handle:active { cursor: grabbing; }
.ms-drag-handle:hover { background: #e1e9eb; color: #384950; }
.ms-drag-handle-sheet { font-size: 13px; }
.ms-structure-name {
    width: 100%; min-width: 0; height: 28px; padding: 4px 6px; border: 1px solid transparent; border-radius: 5px;
    background: transparent; color: #26363e; font-size: 11px; font-weight: 800; outline: none;
}
.ms-structure-name:hover { border-color: #c5d2d5; background: #fff; }
.ms-structure-name:focus { border-color: var(--ms-teal-deep); background: #fff; box-shadow: 0 0 0 2px rgba(79,174,169,.10); }
.ms-structure-dropdown-toggle {
    min-height: 27px; display: inline-flex; align-items: center; gap: 4px; padding: 2px 5px;
    border-radius: 5px; color: #4e6167; font-size: 9px; font-weight: 800; white-space: nowrap; cursor: pointer;
}
.ms-structure-dropdown-toggle:hover { background: #e1eeee; }
.ms-structure-dropdown-toggle input { width: 14px; height: 14px; margin: 0; accent-color: var(--ms-teal-dark); }
.ms-structure-small-button, .ms-structure-delete {
    width: 27px; height: 27px; padding: 0; border: 0; border-radius: 5px; background: transparent;
    display: grid; place-items: center; font-size: 17px; line-height: 1; cursor: pointer;
}
.ms-structure-small-button { color: var(--ms-teal-dark); }
.ms-structure-small-button:hover { background: #dff2f0; }
.ms-structure-delete { color: #9b3328; }
.ms-structure-delete:hover { background: #fff0ed; }
.ms-structure-sheets { display: grid; gap: 1px; padding: 3px 5px 5px 28px; background: #fff; }
.ms-structure-sheet {
    min-height: 31px; display: grid; grid-template-columns: 23px minmax(0,1fr) 27px; gap: 4px; align-items: center;
    padding: 2px 0; border-bottom: 1px solid #eef1f2;
}
.ms-structure-sheet:last-child { border-bottom: 0; }
.ms-structure-sheet.is-drag-over { box-shadow: inset 0 2px 0 var(--ms-teal-deep); }
.ms-structure-sheet-name { font-weight: 700; color: #44535a; }
body.has-ms-hscroll .ms-toast { bottom: calc(var(--ms-sheetbar-h) + var(--ms-hscroll-h) + 10px); }

/* v0.5 – конфигурируем график, обща времева ос и до 7 дни */
:root {
    --ms-day-compact: calc(var(--ms-col-arrived) + var(--ms-col-name) + var(--ms-col-icons) + var(--ms-col-taken));
    --ms-day-active: calc(var(--ms-col-arrived) + var(--ms-col-name) + var(--ms-col-reason) + var(--ms-col-icons) + var(--ms-col-taken));
    --ms-day-head-h: 48px;
    --ms-label-h: 20px;
    --ms-row-h: 20px;
}

.ms-type-placeholder { display: grid; gap: 8px; }
.ms-type-placeholder strong { color: var(--ms-teal-dark); font-size: 18px; }
.ms-type-placeholder span { font-size: 12px; }

.ms-schedule-note-bar {
    min-height: 31px; padding: 3px 8px; display: grid; grid-template-columns: auto minmax(160px, 1fr); gap: 8px; align-items: center;
    border-bottom: 1px solid #cfdadd; background: #fff; color: #30404c;
}
.ms-schedule-note-bar strong { font-size: 11px; white-space: nowrap; }
.ms-schedule-note-input {
    width: 100%; min-width: 0; height: 24px; padding: 2px 6px; border: 1px solid transparent; border-radius: 5px;
    background: #fffdf4; color: #394850; font-size: 10px; outline: none;
}
.ms-schedule-note-input:hover { border-color: #ccd6d8; }
.ms-schedule-note-input:focus { border-color: var(--ms-teal-deep); box-shadow: 0 0 0 2px rgba(79,174,169,.10); }

.ms-week-grid.ms-week-grid-v05 {
    display: grid; min-width: max-content; width: 100%; gap: 1px; background: #d4dde0;
}
.ms-time-rail, .ms-day { min-width: 0; background: #fff; }
.ms-time-rail { position: relative; z-index: 8; }
.ms-time-rail-head { height: var(--ms-day-head-h); border-bottom: 1px solid #9aa8ae; background: #f1f3f4; }
.ms-time-rail-label {
    height: var(--ms-label-h); display: grid; place-items: center; border-bottom: 1px solid #aeb8bc; border-right: 1px solid #d5dcde;
    background: #fff; color: #40515c; font-size: 8px; font-weight: 700;
}
.ms-time-rail-row {
    height: var(--ms-row-h); display: flex; align-items: center; justify-content: center; padding: 0 1px;
    border-right: 1px solid #d6dcde; border-bottom: 1px solid #d6dcde; background: var(--ms-future);
    font-size: 10px; font-weight: 700; white-space: nowrap;
}
.ms-time-rail-row:nth-child(even) { background: var(--ms-future-alt); }

.ms-day-head {
    height: var(--ms-day-head-h); min-height: var(--ms-day-head-h); padding: 2px 3px; display: grid; grid-template-rows: 21px 21px;
    gap: 1px; align-items: stretch; border-bottom: 1px solid #9aa8ae; background: #f1f3f4; white-space: nowrap; cursor: pointer;
}
.ms-day-head-top { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 4px; overflow: hidden; }
.ms-day-head-top strong { font-size: 9px; overflow: hidden; text-overflow: ellipsis; }
.ms-day-head-top span { color: #3d4d57; font-size: 9px; font-weight: 700; }
.ms-day-head-top em { padding: 1px 3px; border-radius: 4px; background: #d4d7d8; color: #5d6367; font-style: normal; font-size: 7px; font-weight: 800; }
.ms-weekday-block { width: 12px; height: 12px; margin: 0; accent-color: #8d5549; cursor: pointer; }
.ms-weekday-block:disabled { opacity: .4; cursor: default; }
.ms-date-note {
    width: 100%; min-width: 0; height: 20px; padding: 1px 4px; border: 1px solid transparent; border-radius: 4px;
    background: rgba(255,255,255,.68); color: #5f4a27; font-size: 8px; outline: none; text-align: center;
}
.ms-date-note:hover:not(:disabled), .ms-date-note:focus { border-color: #c9b575; background: #fffdf3; }
.ms-date-note:disabled { color: #7d8386; background: transparent; }
.ms-day.is-expanded .ms-day-head { box-shadow: inset 0 -2px 0 var(--ms-teal-deep); }
.ms-day.is-today .ms-day-head { background: var(--ms-today); }
.ms-day.is-nonworking .ms-day-head,
.ms-day.is-date-blocked .ms-day-head,
.ms-day.is-weekday-blocked .ms-day-head { background: #dfe2e3; color: #62676a; }

.ms-column-labels { height: var(--ms-label-h); min-height: var(--ms-label-h); }
.ms-column-labels.is-active-day {
    display: grid; grid-template-columns: var(--ms-col-arrived) minmax(var(--ms-col-name), 1fr) var(--ms-col-reason) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-column-labels.is-compact-day {
    display: grid; grid-template-columns: var(--ms-col-arrived) minmax(var(--ms-col-name), 1fr) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-day-block-label {
    display: grid; place-items: center; margin: 0; border-left: 1px solid #d5dcde; background: #fff; cursor: pointer;
}
.ms-day-block-label input { width: 12px; height: 12px; margin: 0; accent-color: #8d5549; cursor: pointer; }
.ms-day-block-label input:disabled { opacity: .4; cursor: default; }

.ms-slot-row { height: var(--ms-row-h); min-height: var(--ms-row-h); }
.ms-slot-row.is-active-day {
    display: grid; grid-template-columns: var(--ms-col-arrived) minmax(var(--ms-col-name), 1fr) var(--ms-col-reason) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-slot-row.is-compact-day {
    display: grid; grid-template-columns: var(--ms-col-arrived) minmax(var(--ms-col-name), 1fr) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-slot-row.is-outside-hours { --ms-row-bg: #eef0f1; color: #9aa1a5; }
.ms-slot-row.is-outside-hours:nth-child(even) { --ms-row-bg: #e9ecee; }
.ms-slot-row.is-taken-locked { --ms-row-bg: #cfd4d6; color: #555f64; }
.ms-slot-row.is-taken-locked:nth-child(even) { --ms-row-bg: #c9cfd1; }
.ms-day.is-date-blocked .ms-slot-row,
.ms-day.is-weekday-blocked .ms-slot-row { --ms-row-bg: #dde0e1; color: #6f7679; }
.ms-day.is-nonworking .ms-slot-row { --ms-row-bg: var(--ms-nonworking); }

.ms-icons.is-active-icons { grid-template-columns: repeat(3, 1fr); }
.ms-icons.is-compact-icons { grid-template-columns: repeat(4, 1fr); }
.ms-icon-reason.is-active { background: #e7eef9; box-shadow: inset 0 0 0 1px #aebed8; }

/* v0.5 admin: тип TAB и настройка на седмичен график */
.ms-tab-settings-form { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 10px; }
.ms-tab-settings-form label, .ms-schedule-main-settings label { display: grid; gap: 4px; font-size: 10px; font-weight: 700; }
.ms-tab-settings-form select,
.ms-schedule-main-settings input[type="number"],
.ms-schedule-main-settings input[type="text"],
.ms-schedule-main-settings select,
.ms-schedule-day-row input[type="time"] {
    width: 100%; min-width: 0; height: 30px; padding: 3px 5px; border: 1px solid #bdc9cd; border-radius: 6px; background: #fff; color: #34444c; font-size: 10px; outline: none;
}
.ms-tab-settings-form select:focus,
.ms-schedule-main-settings input:focus,
.ms-schedule-day-row input:focus { border-color: var(--ms-teal-deep); }
.ms-schedule-settings-panel[hidden] { display: none !important; }
.ms-schedule-main-settings { display: grid; gap: 8px; margin: 3px 0 10px; }
.ms-inline-number { display: grid; grid-template-columns: 90px auto; gap: 4px; align-items: center; }
.ms-inline-number em { color: var(--ms-muted); font-size: 9px; font-style: normal; }
.ms-online-setting > span:last-child { display: grid; grid-template-columns: 16px auto minmax(85px,1fr); gap: 4px; align-items: center; }
.ms-online-setting input[type="checkbox"] { width: 14px; height: 14px; margin: 0; }
.ms-online-setting strong { font-size: 9px; color: #52636b; }
.ms-schedule-days { display: grid; gap: 2px; margin: 8px 0 10px; }
.ms-schedule-day-head, .ms-schedule-day-row {
    min-height: 29px; display: grid; grid-template-columns: 43px 64px minmax(0,1fr); gap: 5px; align-items: center;
}
.ms-config-periods { display: grid; gap: 3px; min-width: 0; }
.ms-config-period { display: grid; grid-template-columns: 14px minmax(0,1fr) 10px minmax(0,1fr); gap: 3px; align-items: center; }
.ms-config-period small { font-size: 8px; font-weight: 800; color: var(--ms-muted); text-align: center; }
.ms-config-period > span { text-align: center; color: var(--ms-muted); }
.ms-schedule-day-head { color: var(--ms-muted); font-size: 8px; font-weight: 800; text-align: center; }
.ms-schedule-day-row { padding: 2px 0; border-top: 1px solid #edf0f1; }
.ms-schedule-day-row strong { font-size: 10px; }
.ms-schedule-day-row input[type="checkbox"] { justify-self: center; width: 14px; height: 14px; margin: 0; accent-color: var(--ms-teal-dark); }
.ms-schedule-save { width: 100%; min-height: 34px; font-size: 11px; }

@media (max-width: 620px) {
    .ms-tab-settings-form { grid-template-columns: 1fr; }
    .ms-schedule-day-head, .ms-schedule-day-row { grid-template-columns: 38px 50px minmax(0,1fr); gap: 3px; }
}

.ms-day.is-config-hidden .ms-day-head { background: #e7e9ea; color: #777d80; }
.ms-day.is-config-hidden .ms-slot-row { --ms-row-bg: #e5e7e8; color: #808689; }


/* v0.5.1 – по-компактен седмичен изглед за 5–7 дни и по-четлив интерфейс */
:root {
    --ms-day-head-h: 52px;
    --ms-label-h: 22px;
    --ms-row-h: 22px;
}

/* По-голям шрифт, без да увеличаваме отново горната лента. */
.ms-workspace-brand-text strong { font-size: 15px; }
.ms-workspace-brand-text span { font-size: 10px; }
.ms-tab { font-size: 13px; }
.ms-user-text strong { font-size: 11px; }
.ms-user-text span { font-size: 9px; }
.ms-top-action, .ms-logout { font-size: 11px; }
.ms-sync-status { font-size: 10px; }
.ms-week-title { font-size: 11px; }
.ms-week-title strong { font-size: 12px; }
.ms-schedule-note-bar strong { font-size: 12px; }
.ms-schedule-note-input { font-size: 11px; }
.ms-time-rail-label { font-size: 9px; }
.ms-time-rail-row { font-size: 11px; }
.ms-day-head-top strong { font-size: 10px; }
.ms-day-head-top span { font-size: 10px; }
.ms-day-head-top em { font-size: 8px; }
.ms-date-note { font-size: 9px; }
.ms-column-labels { font-size: 9px; }
.ms-slot-row { font-size: 11px; }
.ms-edit-cell { min-height: 21px; line-height: 17px; padding: 2px 3px; }
.ms-icon { font-size: 11px; }
.ms-icon-online { font-size: 10px; }

/* Всеки ден има ясна плътна вертикална рамка. */
.ms-week-grid.ms-week-grid-v05 { gap: 0; background: #fff; }
.ms-week-grid.ms-week-grid-v05 > .ms-time-rail {
    border-right: 2px solid #83949a;
    border-top: 1px solid #83949a;
    border-bottom: 1px solid #83949a;
}
.ms-week-grid.ms-week-grid-v05 > .ms-day {
    border-right: 2px solid #83949a;
    border-top: 1px solid #83949a;
    border-bottom: 1px solid #83949a;
}

/* Отметката за блокиране на всички еднакви дни стои вдясно,
   симетрично на колоната ВЗЕЛ. Текстът на деня остава центриран. */
.ms-day-head-top { position: relative; padding: 0 18px 0 3px; }
.ms-weekday-block {
    position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
    width: 13px; height: 13px; margin: 0;
}

/* Име вече е реална фиксирана ширина. В активния ден Причина поема
   свободното място; така плъзгачът за Име действително променя колоната. */
.ms-column-labels.is-active-day,
.ms-slot-row.is-active-day {
    grid-template-columns: var(--ms-col-arrived) var(--ms-col-name) minmax(var(--ms-col-reason), 1fr) var(--ms-col-icons) var(--ms-col-taken);
}

/* В компактните дни оставяме свободно пространство между Име и иконите.
   То позволява на дългото име да се вижда като в Sheets, без самата колона
   да заема половината ден, а четирите икони винаги остават на един ред. */
.ms-column-labels.is-compact-day,
.ms-slot-row.is-compact-day {
    grid-template-columns: var(--ms-col-arrived) var(--ms-col-name) minmax(0, 1fr) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-column-labels.is-compact-day > span:nth-child(1) { grid-column: 1; }
.ms-column-labels.is-compact-day > span:nth-child(2) { grid-column: 2; }
.ms-column-labels.is-compact-day > span:nth-child(3) { grid-column: 4; }
.ms-column-labels.is-compact-day > .ms-day-block-label { grid-column: 5; }
.ms-slot-row.is-compact-day > .ms-check-cell:not(.ms-taken-cell) { grid-column: 1; }
.ms-slot-row.is-compact-day > .ms-name { grid-column: 2; }
.ms-slot-row.is-compact-day > .ms-icons { grid-column: 4; }
.ms-slot-row.is-compact-day > .ms-taken-cell { grid-column: 5; }

/* Заглавката над помощните икони нарочно остава празна – няма пренасяне. */
.ms-icons-label { white-space: nowrap; overflow: hidden; }
.ms-icons.is-compact-icons { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ms-icons.is-active-icons { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* v0.5.4 – точни колони без скрити/разтегливи spacer колони.
 * Ширината на Име и Причина е точно зададената от администратора стойност.
 * Неактивният ден изобщо няма track за Причина. */
.ms-column-labels.is-active-day,
.ms-slot-row.is-active-day {
    grid-template-columns: var(--ms-col-arrived) var(--ms-col-name) var(--ms-col-reason) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-column-labels.is-active-day > span:nth-child(1) { grid-column: 1; }
.ms-column-labels.is-active-day > span:nth-child(2) { grid-column: 2; }
.ms-column-labels.is-active-day > span:nth-child(3) { grid-column: 3; }
.ms-column-labels.is-active-day > span:nth-child(4) { grid-column: 4; }
.ms-column-labels.is-active-day > .ms-day-block-label { grid-column: 5; }
.ms-slot-row.is-active-day > .ms-check-cell:not(.ms-taken-cell) { grid-column: 1; }
.ms-slot-row.is-active-day > .ms-name { grid-column: 2; }
.ms-slot-row.is-active-day > .ms-reason { grid-column: 3; }
.ms-slot-row.is-active-day > .ms-icons { grid-column: 4; }
.ms-slot-row.is-active-day > .ms-taken-cell { grid-column: 5; }

/* Компактен ден: ✓ | Име | 📋☎🌐📝 | ✓ .
 * Няма Причина и няма невидима свободна колона, която да изглежда като Причина. */
.ms-column-labels.is-compact-day,
.ms-slot-row.is-compact-day {
    grid-template-columns: var(--ms-col-arrived) var(--ms-col-name) var(--ms-col-icons) var(--ms-col-taken);
}
.ms-column-labels.is-compact-day > span:nth-child(1) { grid-column: 1; }
.ms-column-labels.is-compact-day > span:nth-child(2) { grid-column: 2; }
.ms-column-labels.is-compact-day > span:nth-child(3) { grid-column: 3; }
.ms-column-labels.is-compact-day > .ms-day-block-label { grid-column: 4; }
.ms-slot-row.is-compact-day > .ms-check-cell:not(.ms-taken-cell) { grid-column: 1; }
.ms-slot-row.is-compact-day > .ms-name { grid-column: 2; }
.ms-slot-row.is-compact-day > .ms-icons { grid-column: 3; }
.ms-slot-row.is-compact-day > .ms-taken-cell { grid-column: 4; }

/* Точният размер на деня вече е сборът от видимите колони. Това е важно,
 * за да има реален ефект от плъзгачите за ширина и да няма CSS разтягане. */
.ms-week-grid.ms-week-grid-v05 { justify-content: start; }

/* Ясни разделители – еднакви при активен и компактен ден. */
.ms-week-grid.ms-week-grid-v05 > .ms-day {
    border-left: 1px solid #73878e;
    border-right: 1px solid #73878e;
    border-top: 1px solid #73878e;
    border-bottom: 1px solid #73878e;
}
.ms-week-grid.ms-week-grid-v05 > .ms-time-rail {
    border-left: 1px solid #73878e;
    border-right: 1px solid #73878e;
    border-top: 1px solid #73878e;
    border-bottom: 1px solid #73878e;
}
.ms-slot-row.is-compact-day > .ms-name,
.ms-column-labels.is-compact-day > span:nth-child(2),
.ms-slot-row.is-active-day > .ms-name,
.ms-column-labels.is-active-day > span:nth-child(2),
.ms-slot-row.is-active-day > .ms-reason,
.ms-column-labels.is-active-day > span:nth-child(3) {
    border-right: 1px solid #c7d1d4;
}
.ms-icons { border-left: 0; border-right: 1px solid #d6dcde; }
.ms-taken-cell { border-left: 1px solid #d6dcde; border-right: 0; }
.ms-day-block-label { border-left: 1px solid #c9d2d5; }

/* Визуалното име е част от общите настройки на графика. */
#msScheduleDisplayName { font-weight: 700; }


/* v0.5.6 – оперативните бележки трябва да изпъкват ясно. */
.ms-schedule-note-input,
.ms-schedule-note-input:hover,
.ms-schedule-note-input:focus {
    color: #c40000;
    font-weight: 800;
}
.ms-schedule-note-input::placeholder {
    color: #8b969c;
    font-weight: 400;
    opacity: 1;
}
.ms-date-note,
.ms-date-note:hover:not(:disabled),
.ms-date-note:focus,
.ms-date-note:disabled {
    color: #c40000;
    font-weight: 800;
}
.ms-date-note::placeholder {
    color: #8b969c;
    font-weight: 400;
    opacity: 1;
}


/* v0.5.8 – поправка на v0.5.7.
 * В предишната версия блокът за sticky/контурите е бил записан с буквални
 * символи за нов ред като текст и браузърът не е прилагал правилата. Тук правилата са валиден CSS. */
:root {
    --ms-schedule-note-h: 32px;
}

/* Името на лекаря/графика и общата бележка винаги остават видими
 * непосредствено под горната тюркоазена лента при вертикално превъртане. */
.ms-schedule-note-bar {
    position: sticky;
    top: var(--ms-topbar-h);
    z-index: 70;
    height: var(--ms-schedule-note-h);
    min-height: var(--ms-schedule-note-h);
    background: #ffffff;
    border-bottom: 2px solid #93a4aa;
    box-shadow: 0 2px 4px rgba(31, 41, 51, 0.10);
}

/* Седмичният надпис остава под фиксираното име/бележка, а не върху тях. */
.ms-week-title {
    top: calc(var(--ms-topbar-h) + var(--ms-schedule-note-h));
    z-index: 55;
}
.ms-week {
    scroll-margin-top: calc(var(--ms-topbar-h) + var(--ms-schedule-note-h) + 3px);
}

/* Ясен дебел контур около ВСЕКИ отделен ден. Border е вътрешен за зададената
 * ширина (box-sizing:border-box), затова не променя настройките на колоните. */
.ms-week-grid.ms-week-grid-v05 > .ms-day {
    border: 2px solid #596f78 !important;
    background: #ffffff;
}

/* Общата времева колона също получава ясна рамка, но дневните колони
 * остават визуално отделени една от друга с техния собствен 2px контур. */
.ms-week-grid.ms-week-grid-v05 > .ms-time-rail {
    border: 2px solid #7b8d94 !important;
}


/* v0.5.9 – непрекъснат видим контур около ЦЕЛИЯ ден.
 * Вместо да разчитаме само на border на външния article, рисуваме рамката
 * върху реалните три вертикални секции на деня. Така тя остава видима
 * през заглавката, реда с имената на колоните и всички часови редове. */
.ms-week-grid.ms-week-grid-v05 > .ms-day {
    border: 0 !important;
    background: #ffffff;
}
.ms-week-grid.ms-week-grid-v05 > .ms-day > .ms-day-head {
    border-top: 2px solid #596f78 !important;
    border-left: 2px solid #596f78 !important;
    border-right: 2px solid #596f78 !important;
}
.ms-week-grid.ms-week-grid-v05 > .ms-day > .ms-column-labels {
    border-left: 2px solid #596f78 !important;
    border-right: 2px solid #596f78 !important;
}
.ms-week-grid.ms-week-grid-v05 > .ms-day > .ms-day-rows {
    border-left: 2px solid #596f78 !important;
    border-right: 2px solid #596f78 !important;
    border-bottom: 2px solid #596f78 !important;
}


/* v0.5.10 – истински единен контур около целия дневен блок.
 * v0.5.9 рисуваше отделни странични линии върху head/labels/rows. Те се
 * сливаха с вътрешната решетка и визуално изглеждаха като контур само на
 * заглавката. Сега рамката е един overlay върху целия <article class="ms-day">,
 * от горния край на заглавката до последния часови ред. */
.ms-week-grid.ms-week-grid-v05 > .ms-day {
    position: relative;
    isolation: isolate;
    border: 0 !important;
}

/* Премахваме старите сегментни външни линии, за да няма двойни рамки. */
.ms-week-grid.ms-week-grid-v05 > .ms-day > .ms-day-head {
    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
}
.ms-week-grid.ms-week-grid-v05 > .ms-day > .ms-column-labels {
    border-left: 0 !important;
    border-right: 0 !important;
}
.ms-week-grid.ms-week-grid-v05 > .ms-day > .ms-day-rows {
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
}

/* Един непрекъснат правоъгълник върху целия ден. pointer-events:none пази
 * всички полета и отметки напълно кликаеми. */
.ms-week-grid.ms-week-grid-v05 > .ms-day::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 60;
    pointer-events: none;
    border: 2px solid #4f6670;
    box-sizing: border-box;
}

/* v0.7.1 — лист тип „Справочник“ */
.ms-reference-settings-panel[hidden] { display: none !important; }
.ms-reference-settings-panel { display: grid; gap: 10px; margin-top: 10px; }
.ms-reference-template-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 9px; border: 1px dashed #b9c8cb; border-radius: 7px; background: #f8fbfb; }
.ms-reference-template-row span { flex: 1 1 220px; color: #53666a; font-size: 11px; line-height: 1.35; }
.ms-reference-template-download { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; white-space: nowrap; }
.ms-reference-import-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.ms-reference-import-row input[type="file"] { min-width: 0; padding: 7px; border: 1px solid #cbd5d8; border-radius: 6px; background: #fff; font-size: 12px; }
.ms-reference-current { padding: 8px 9px; border-radius: 6px; background: #f4f7f7; color: #47585d; font-size: 12px; line-height: 1.4; }
.ms-reference-preview { display: grid; gap: 9px; padding: 9px; border: 1px solid #cbd5d8; border-radius: 7px; background: #fff; }
.ms-reference-preview[hidden] { display: none !important; }
.ms-reference-preview-summary { font-size: 12px; font-weight: 700; color: #33474c; }
.ms-reference-preview-table { max-height: 280px; overflow: auto; border: 1px solid #d6dfe1; }
.ms-reference-preview-grid { width: max-content; min-width: 100%; border-collapse: collapse; font-size: 11px; }
.ms-reference-preview-grid th, .ms-reference-preview-grid td { border: 1px solid #dfe5e7; padding: 5px 7px; text-align: left; vertical-align: top; white-space: nowrap; }
.ms-reference-preview-grid th { position: sticky; top: 0; z-index: 1; background: #eaf4f3; color: #244a48; }

.ms-reference-view { width: 100%; min-width: 0; padding: 8px 10px 46px; }
.ms-reference-head { position: sticky; top: 56px; z-index: 18; display: flex; align-items: baseline; gap: 12px; min-height: 36px; padding: 7px 10px; border: 1px solid #b9c8cb; border-bottom: 0; background: rgba(255,255,255,.97); box-shadow: 0 2px 5px rgba(0,0,0,.04); }
.ms-reference-title { font-size: 18px; color: #173f3d; }
.ms-reference-meta { font-size: 12px; color: #66777b; }
.ms-reference-toolbar { position: sticky; top: 91px; z-index: 17; display: flex; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid #b9c8cb; border-bottom: 0; background: rgba(247,250,250,.98); }
.ms-reference-search { flex: 1 1 420px; max-width: 720px; min-width: 220px; padding: 8px 10px; border: 1px solid #9eb2b5; border-radius: 6px; background: #fff; font-size: 15px; outline: none; }
.ms-reference-search:focus { border-color: #147a74; box-shadow: 0 0 0 2px rgba(20,122,116,.12); }
.ms-reference-count { flex: 0 0 auto; font-size: 12px; font-weight: 700; color: #53666a; }
.ms-reference-table-wrap { width: 100%; overflow: auto; border: 2px solid #60777b; background: #fff; }
.ms-reference-table { width: 100%; min-width: 900px; border-collapse: collapse; table-layout: auto; font-size: 14px; }
.ms-reference-table th, .ms-reference-table td { border: 1px solid #c9d3d5; padding: 7px 9px; text-align: left; vertical-align: top; line-height: 1.25; }
.ms-reference-table thead { display: table-header-group; }
.ms-reference-table th { position: static; background: #d9ece9; color: #183f3d; font-weight: 800; white-space: nowrap; }
.ms-reference-table tbody tr:nth-child(even) { background: #f8faf9; }
.ms-reference-table tbody tr:hover { background: #fff6cf; }
.ms-reference-table td.is-compact { white-space: nowrap; text-align: center; }
.ms-reference-table th:first-child, .ms-reference-table td:first-child { white-space: nowrap; }
.ms-reference-table th:nth-child(2), .ms-reference-table td:nth-child(2) { white-space: nowrap; }

@media (max-width: 900px) {
    .ms-reference-import-row { grid-template-columns: 1fr; }
    .ms-reference-toolbar { flex-wrap: wrap; }
    .ms-reference-search { max-width: none; width: 100%; }
}


/* v0.7.2 — справочникът прилепва непосредствено под главната лента.
 * v0.7.1 използваше фиксирани top:56px/91px, а реалната височина на
 * desktop topbar е CSS променлива. Това оставяше просвет, през който
 * при скрол се виждаха редове от таблицата над търсенето. */
:root {
    --ms-reference-head-h: 39px;
}
.ms-reference-head {
    top: var(--ms-topbar-h) !important;
    height: var(--ms-reference-head-h);
    min-height: var(--ms-reference-head-h);
    box-sizing: border-box;
    background: #ffffff !important;
}
.ms-reference-toolbar {
    top: calc(var(--ms-topbar-h) + var(--ms-reference-head-h)) !important;
    background: #f7fafa !important;
    box-shadow: 0 2px 5px rgba(31, 41, 51, 0.08);
}
/* Непрозрачен фон в цялата sticky зона — нито един ред от таблицата
 * не трябва да прозира над или през полето за търсене. */
.ms-reference-head::before,
.ms-reference-toolbar::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: inherit;
}

/* v0.7.3 — заглавният ред на справочника остава видим при вертикално скролиране.
 * Височините на заглавието и търсачката се измерват и подават от JS, така че
 * колонните заглавия винаги застават непосредствено под тях. */
:root {
    --ms-reference-toolbar-h: 51px;
}
.ms-reference-table-wrap {
    /* Sticky заглавията трябва да се отнасят към страницата, а не към
       вътрешен overflow контейнер без собствен вертикален скрол. */
    overflow: visible !important;
}
.ms-reference-table th {
    position: sticky !important;
    top: calc(var(--ms-topbar-h) + var(--ms-reference-head-h) + var(--ms-reference-toolbar-h)) !important;
    z-index: 16;
    background: #d9ece9 !important;
    box-shadow: 0 1px 0 #60777b, 0 2px 4px rgba(31, 41, 51, 0.08);
}

/* v0.7.5 — четириколонните справочници (напр. МПС) трябва да се виждат
 * изцяло на стандартен desktop екран. Първата колона запазва удобната си
 * ширина, втората вече пренася текста, а 3-та и 4-та получават гарантирано
 * място. Заглавията са двуредови и не разширяват колоните. */
.ms-reference-table.ms-reference-cols-4 {
    width: 100%;
    min-width: 0 !important;
    table-layout: fixed !important;
}
.ms-reference-table.ms-reference-cols-4 th,
.ms-reference-table.ms-reference-cols-4 td {
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
}
.ms-reference-table.ms-reference-cols-4 th {
    text-align: center;
    vertical-align: middle;
    line-height: 1.15;
    padding-top: 7px;
    padding-bottom: 7px;
}
.ms-reference-table.ms-reference-cols-4 th:nth-child(1),
.ms-reference-table.ms-reference-cols-4 td:nth-child(1) {
    width: 17%;
}
.ms-reference-table.ms-reference-cols-4 th:nth-child(2),
.ms-reference-table.ms-reference-cols-4 td:nth-child(2) {
    width: 41%;
}
.ms-reference-table.ms-reference-cols-4 th:nth-child(3),
.ms-reference-table.ms-reference-cols-4 td:nth-child(3) {
    width: 20%;
}
.ms-reference-table.ms-reference-cols-4 th:nth-child(4),
.ms-reference-table.ms-reference-cols-4 td:nth-child(4) {
    width: 22%;
}
.ms-reference-table.ms-reference-cols-4 td:nth-child(2),
.ms-reference-table.ms-reference-cols-4 td:nth-child(3),
.ms-reference-table.ms-reference-cols-4 td:nth-child(4) {
    line-height: 1.28;
}

/* v0.7.6 — лист тип „Системи / връзки“ */
.ms-links-settings-panel[hidden] { display: none !important; }
.ms-links-settings-panel { display: grid; gap: 10px; margin-top: 10px; }
.ms-links-settings-grid { display: grid; grid-template-columns: minmax(0, 1fr) 86px; gap: 9px 10px; }
.ms-links-settings-grid label { display: grid; gap: 5px; min-width: 0; }
.ms-links-settings-grid label > span:first-child { color: #52646a; font-size: 11px; font-weight: 700; }
.ms-links-settings-grid input[type="text"],
.ms-links-settings-grid input[type="url"],
.ms-links-settings-grid textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 9px;
    border: 1px solid #b8c6c9;
    border-radius: 6px;
    background: #fff;
    color: #26383d;
    font: inherit;
}
.ms-links-settings-grid textarea { resize: vertical; line-height: 1.35; }
.ms-links-url-field,
.ms-links-description-field,
.ms-links-new-tab { grid-column: 1 / -1; }
.ms-links-new-tab { display: flex !important; align-items: center; gap: 7px; }
.ms-links-save { justify-self: start; }

.ms-links-view {
    width: 100%;
    min-height: calc(100vh - var(--ms-topbar-h) - 64px);
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 54px 18px 80px;
}
.ms-links-card {
    width: min(680px, 100%);
    box-sizing: border-box;
    padding: 30px 34px 28px;
    border: 1px solid #c3d1d3;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(31, 59, 61, .09);
    text-align: center;
}
.ms-links-card-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #e8f3f2;
    font-size: 34px;
    line-height: 1;
}
.ms-links-card-title {
    margin: 0;
    color: #173f3d;
    font-size: 25px;
    line-height: 1.2;
}
.ms-links-card-description {
    max-width: 580px;
    margin: 13px auto 0;
    color: #52646a;
    font-size: 15px;
    line-height: 1.5;
}
.ms-links-card-host {
    margin-top: 14px;
    color: #718287;
    font-size: 12px;
}
.ms-links-open-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 210px;
    margin-top: 22px;
    padding: 11px 20px;
    border-radius: 8px;
    background: #126f69;
    color: #fff !important;
    font-weight: 800;
    text-decoration: none !important;
    box-shadow: 0 2px 5px rgba(18,111,105,.18);
}
.ms-links-open-button:hover,
.ms-links-open-button:focus { background: #0d5e59; }
.ms-links-privacy-note {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid #e0e7e8;
    color: #7a888c;
    font-size: 11px;
    line-height: 1.4;
}
.ms-links-empty {
    margin-top: 20px;
    padding: 13px 15px;
    border: 1px dashed #bdcacc;
    border-radius: 8px;
    background: #f7fafa;
    color: #5d6d72;
    font-size: 13px;
}

@media (max-width: 700px) {
    .ms-links-settings-grid { grid-template-columns: 1fr; }
    .ms-links-url-field, .ms-links-description-field, .ms-links-new-tab { grid-column: 1; }
    .ms-links-view { padding: 28px 10px 70px; }
    .ms-links-card { padding: 24px 18px; }
}

/* v0.7.10 — външните системи използват същия визуален бутон като листовете. */
/* v0.7.11 — dedicated external-link TAB: plain browser link, no Staff state change. */
.ms-tab-external-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}


/* v0.8.8 — избираеми падащи менюта в горната TAB лента. Менюто се рисува
 * директно в body с position:fixed, за да не се изрязва от хоризонталния
 * scroll на лентата с TAB-ове. */
.ms-tab-dropdown-trigger { display: inline-flex; align-items: center; gap: 5px; }
.ms-tab-dropdown-trigger.is-open { background: rgba(255,255,255,.24); }
.ms-tab-dropdown-trigger.is-active.is-open { background: #fff; }
.ms-tab-dropdown-arrow { font-size: 10px; line-height: 1; opacity: .9; transition: transform .12s ease; }
.ms-tab-dropdown-trigger.is-open .ms-tab-dropdown-arrow { transform: rotate(180deg); }
.ms-tab-dropdown-menu {
    position: fixed; z-index: 5000; min-width: 180px; max-width: min(360px, calc(100vw - 12px));
    overflow-y: auto; padding: 5px; border: 1px solid #b8c9cc; border-radius: 8px;
    background: #fff; box-shadow: 0 10px 28px rgba(31,41,51,.22);
}
.ms-tab-dropdown-item {
    width: 100%; min-height: 34px; display: flex; align-items: center; padding: 7px 10px;
    border: 0; border-radius: 6px; background: transparent; color: #294349; text-align: left;
    text-decoration: none; font: inherit; font-size: 12px; font-weight: 750; line-height: 1.25; cursor: pointer;
}
.ms-tab-dropdown-item:hover, .ms-tab-dropdown-item:focus { background: #e8f5f4; outline: none; }
.ms-tab-dropdown-item.is-current { background: #d9efed; color: var(--ms-teal-dark); }
.ms-tab-dropdown-link::after { content: '↗'; margin-left: auto; padding-left: 10px; font-size: 10px; opacity: .65; }
.ms-tab-dropdown-empty { padding: 9px 10px; color: #718086; font-size: 11px; }



/* v0.8.1 — управляеми права за роля Mediana Staff. */
.ms-user-permissions {
    display: grid;
    gap: 7px;
    margin: 10px 0 12px;
}
.ms-user-permissions label {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 7px 8px;
    border: 1px solid #dce5e7;
    border-radius: 6px;
    background: #fbfcfc;
    color: #34464c;
    font-size: 12px;
    line-height: 1.35;
}
.ms-user-permissions input { margin-top: 2px; accent-color: var(--ms-teal-dark); }


/* v0.9.4 — вертикално уплътнен калкулатор (~30% по-нисък), без намаляване на шрифта. */
/* v0.8.5 — вътрешен калкулатор за брой календарни дни */
.ms-datecalc-view {
    min-height: calc(100vh - 150px);
    padding: 18px 24px 48px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    background: #f4f7f7;
}
.ms-datecalc-card {
    width: min(900px, 100%);
    background: #fff;
    border: 1px solid #d4e0e0;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(30, 70, 70, .08);
    padding: 18px 22px;
}
.ms-datecalc-card h1 {
    margin: 0 0 5px;
    font-size: 28px;
    line-height: 1.2;
    color: #183f3d;
}
.ms-datecalc-help {
    margin: 0 0 12px;
    color: #607474;
    font-size: 15px;
}
.ms-datecalc-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.ms-datecalc-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 9px 14px;
    background: #f0f5f5;
    border-radius: 12px;
}
.ms-datecalc-field > span {
    font-size: 16px;
    font-weight: 800;
    color: #244b49;
}
.ms-datecalc-field input[type="date"],
.ms-datecalc-field input[type="number"] {
    width: 100%;
    box-sizing: border-box;
    min-height: 40px;
    padding: 6px 12px;
    border: 1px solid #b9cdcc;
    border-radius: 10px;
    background: #fff;
    color: #153b39;
    font: inherit;
    font-size: 18px;
    font-weight: 700;
}
.ms-datecalc-field input[type="date"]:focus,
.ms-datecalc-field input[type="number"]:focus {
    outline: 3px solid rgba(60, 159, 154, .18);
    border-color: #3c9f9a;
}

.ms-datecalc-options {
    margin: 9px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    align-items: center;
}
.ms-datecalc-option {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #244b49;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}
.ms-datecalc-option input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: #3c9f9a;
}

.ms-datecalc-result {
    margin-top: 12px;
    min-height: 72px;
    border-radius: 12px;
    padding: 12px 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    border: 1px solid #c8dddc;
    background: #eaf5f4;
    color: #1d5552;
}
.ms-datecalc-result > span { font-size: 14px; font-weight: 700; }
.ms-datecalc-result > strong { margin: 2px 0; font-size: 38px; line-height: 1.05; }
.ms-datecalc-result > em { font-style: normal; font-size: 13px; color: #607a78; }
.ms-datecalc-result.is-error { background: #fff1ef; border-color: #efc0ba; color: #8e3026; }
.ms-datecalc-result.is-error > strong { font-size: 20px; }
.ms-datecalc-result.is-error > span { margin-top: 5px; font-weight: 500; }
.ms-datecalc-result.is-empty { background: #f6f8f8; color: #687777; }
.ms-datecalc-result.is-empty > strong { font-size: 18px; }
.ms-datecalc-actions { margin-top: 8px; display: flex; justify-content: center; }
.ms-datecalc-settings-panel { margin-top: 8px; }
@media (max-width: 720px) {
    .ms-datecalc-view { padding: 14px 12px 58px; }
    .ms-datecalc-card { padding: 14px 14px; border-radius: 12px; }
    .ms-datecalc-card h1 { font-size: 23px; }
    .ms-datecalc-fields { grid-template-columns: 1fr; gap: 8px; }
    .ms-datecalc-field { padding: 10px 12px; }
    .ms-datecalc-result > strong { font-size: 32px; }
}

/* v0.8.9 — безопасно преместване на съществуващ лист между TAB-ове. */
.ms-structure-sheet { grid-template-columns: 23px minmax(0,1fr) minmax(108px,145px) 27px; }
.ms-structure-move-select {
    min-width: 108px;
    max-width: 145px;
    height: 30px;
    padding: 3px 24px 3px 8px;
    border: 1px solid #cbd5d1;
    border-radius: 6px;
    background: #fff;
    color: #25433f;
    font-size: 12px;
}
.ms-structure-move-select:disabled {
    opacity: .55;
    cursor: not-allowed;
}

/* v0.9.0 – шаблонни часове „ВЗЕТ по подразбиране“ в настройките на графика. */
.ms-config-default-taken {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 2px 4px;
    align-items: center;
    margin-top: 3px;
    padding-top: 3px;
    border-top: 1px dashed #c7d0d3;
}
.ms-config-default-taken > b {
    grid-row: 1 / span 2;
    align-self: center;
    font-size: 8px;
    color: #59666b;
    text-align: center;
}
.ms-config-default-taken > .ms-config-period { grid-column: 2; }


/* v0.9.1 – по-лесно хоризонтално проследяване на часа и по-ясни редове. */
.ms-slot-row,
.ms-time-rail-row {
    border-bottom-color: #aebbc0 !important;
}

/* При посочване или фокус върху клетка осветяваме целия съответен часови
 * ред за текущата седмица, без да променяме заключено/ВЗЕТ състоянието. */
.ms-slot-row.is-time-guide::after {
    content: \"\";
    position: absolute;
    inset: 0;
    z-index: 10;
    pointer-events: none;
    background: rgba(55, 159, 153, .08);
    box-shadow: inset 0 1px 0 rgba(36, 117, 113, .50), inset 0 -1px 0 rgba(36, 117, 113, .50);
}

/* Фокусираното editable поле остава над водача. */
.ms-slot-row.is-time-guide .ms-edit-cell:focus { z-index: 12 !important; }

/* Часът в общата лява колона се маркира по-силно – това е визуалната
 * котва, по която регистраторът веднага вижда към кой час е клетката. */
.ms-time-rail-row.is-time-guide {
    position: relative;
    z-index: 20;
    background: #fff0b8 !important;
    color: #20383c;
    font-weight: 900;
    box-shadow: inset 0 0 0 2px rgba(58, 118, 115, .72);
}

/* v0.9.5 — универсален вграден HTML инструмент */
.ms-htmltool-settings-panel[hidden] { display: none !important; }
.ms-htmltool-settings-panel { display: grid; gap: 10px; margin-top: 10px; }
.ms-htmltool-current {
    display: flex; flex-direction: column; gap: 3px; padding: 9px 10px;
    border: 1px solid #cbd8da; border-radius: 7px; background: #f8fbfb;
    color: #34484d; font-size: 12px; line-height: 1.35;
}
.ms-htmltool-current strong { color: #244347; }
.ms-htmltool-current span { color: #6a7b80; font-size: 11px; }
.ms-htmltool-current.is-empty { border-style: dashed; background: #fbfcfc; }
.ms-htmltool-import-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ms-htmltool-import-row input[type="file"] {
    min-width: 0; max-width: 100%; padding: 6px 7px; border: 1px solid #c2d0d2;
    border-radius: 6px; background: #fff; color: #30464b; font-size: 11px;
}
.ms-htmltool-view {
    width: 100%; height: calc(100vh - var(--ms-topbar-h) - var(--ms-sheetbar-h));
    min-height: 520px; overflow: hidden; background: #f3f6f7;
}
.ms-htmltool-frame {
    display: block; width: 100%; height: 100%; border: 0; margin: 0; padding: 0;
    background: #fff;
}
@media (max-width: 700px) {
    .ms-htmltool-view { min-height: 440px; }
    .ms-htmltool-import-row { align-items: stretch; }
    .ms-htmltool-import-row input[type="file"],
    .ms-htmltool-import-row .ms-primary-button { width: 100%; }
}