/* LabDesk — earth tone palette
   Space Cadet #25344F | Slate Gray #617891 | Tan #D5B893
   Coffee #6F4D38 | Caput Mortuum #632024
*/

/* ===== CSS Variables ===== */
:root {
    --ld-space-cadet: #25344F;
    --ld-slate: #617891;
    --ld-tan: #D5B893;
    --ld-coffee: #6F4D38;
    --ld-caput: #632024;
    --ld-cream: #FAF7F2;
    --ld-green: #2d6a4f;
    --ld-amber: #c77f3f;
    /* светлая тема — база, тёмная переопределяет ниже.
       Наоборот делать нельзя: тёмная карточка с тёмным текстом на светлой теме
       не читается, а «светлых» переопределений никто не пишет */
    --ld-text: #25344F;
    --ld-text-muted: #617891;
    --ld-border: #e8e2d9;
    --ld-bg: #FAF7F2;
    --ld-bg-card: #ffffff;
    --ld-radius: 8px;
    --ld-cell-pad: 8px 12px;
    --ld-stripe-bg: rgba(213, 184, 147, 0.06);
    --ld-sidebar-w: 256px;
    --ld-font-size: 14px;
    --ld-font-family: system-ui, sans-serif;
}

/* ===== Status indicators (replaces emoji) ===== */
.ld-dot {
    width: 10px; height: 10px; border-radius: 50%;
    display: inline-block; vertical-align: middle; margin-right: 6px;
    flex-shrink: 0;
}
.ld-dot--ok      { background: var(--ld-green); }
.ld-dot--warning  { background: var(--ld-amber); }
.ld-dot--danger   { background: var(--ld-caput); }
.ld-dot--muted    { background: var(--ld-slate); }

/* Text colors */
.ld-text--danger  { color: var(--ld-caput); font-weight: 600; }
.ld-text--warning { color: var(--ld-amber); font-weight: 600; }
.ld-text--ok      { color: var(--ld-green); }
.ld-muted         { color: var(--ld-slate); font-size: 13px; }

/* Badges */
.ld-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 22px; height: 22px; border-radius: 11px;
    font-size: 12px; font-weight: 700; padding: 0 8px;
    line-height: 1;
}
.ld-badge--danger  { background: var(--ld-caput); color: #fff; }
.ld-badge--warning { background: var(--ld-amber); color: #fff; }
.ld-badge--ok      { background: var(--ld-green); color: #fff; }
.ld-badge--muted   { background: var(--ld-border); color: var(--ld-slate); }

/* ===== Dashboard grid ===== */
.ld-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
    padding: 20px 0;
}

.ld-widget {
    border-radius: var(--ld-radius);
    border: 1px solid var(--ld-border);
    overflow: hidden;
    cursor: grab;
    transition: box-shadow 0.15s, transform 0.15s, opacity 0.15s;
    background: var(--ld-bg-card, #fff);
}
.ld-widget:active { cursor: grabbing; }
.ld-widget.dragging { opacity: 0.4; transform: scale(0.97); }
.ld-widget.drag-over { box-shadow: 0 0 0 2px var(--ld-coffee); }

/* Widget headers — colored left border per type */
.ld-widget-header {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 16px;
    font-weight: 600; font-size: 14px;
    border-bottom: 1px solid var(--ld-border);
    user-select: none;
    color: var(--ld-text);
}
.ld-widget-icon {
    font-size: 20px;
    width: 32px; height: 32px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

/* Colored accents per widget type */
.ld-header--docs  { border-left: 4px solid var(--ld-amber); }
.ld-header--docs .ld-widget-icon  { background: #fef3e2; color: var(--ld-amber); }

.ld-header--alerts { border-left: 4px solid var(--ld-caput); }
.ld-header--alerts .ld-widget-icon { background: #fce4e4; color: var(--ld-caput); }

.ld-header--recent { border-left: 4px solid var(--ld-green); }
.ld-header--recent .ld-widget-icon { background: #e6f4ea; color: var(--ld-green); }

.ld-header--stock  { border-left: 4px solid var(--ld-coffee); }
.ld-header--stock .ld-widget-icon  { background: #f2e8e5; color: var(--ld-coffee); }

.ld-header--equip  { border-left: 4px solid var(--ld-space-cadet); }
.ld-header--equip .ld-widget-icon  { background: #e8ecf2; color: var(--ld-space-cadet); }

.ld-header--worksheets { border-left: 4px solid var(--ld-slate); }
.ld-header--worksheets .ld-widget-icon { background: #e8ecf2; color: var(--ld-slate); }

.ld-header--climate { border-left: 4px solid var(--ld-tan); }
.ld-header--climate .ld-widget-icon { background: #f7efe3; color: var(--ld-coffee); }

/* Widget body */
.ld-widget-body { padding: 10px 16px 14px; }

/* Прогресс рабочего листа в карточке дашборда */
.ld-row--ws { border-bottom: none; padding-bottom: 2px; }
.ld-ws-progress { display: flex; align-items: center; gap: 8px; padding: 0 0 9px; }
.ld-ws-bar {
    flex: 1; height: 5px; border-radius: 3px; overflow: hidden;
    background: var(--ld-border);
}
.ld-ws-bar span { display: block; height: 100%; background: var(--ld-green); }

.ld-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 7px 0; border-bottom: 1px solid #f5f2ee;
    font-size: 13px; color: var(--ld-text);
}
.ld-row:last-child { border-bottom: none; }
.ld-row a {
    color: var(--ld-coffee); text-decoration: none; font-weight: 500;
}
.ld-row a:hover { text-decoration: underline; }

.ld-row--actions {
    padding-top: 10px; margin-top: 4px;
    border-top: 1px solid var(--ld-border); border-bottom: none;
}

.ld-empty {
    color: var(--ld-slate); font-size: 13px; padding: 8px 0;
    font-style: italic;
}

/* ===== Table improvements ===== */
#result_list table { font-size: var(--ld-font-size, 14px); }
#result_list table th { font-weight: 600; color: var(--ld-text); padding: var(--ld-cell-pad); }
#result_list table td { color: var(--ld-text); padding: var(--ld-cell-pad); }
#result_list table tbody tr:nth-child(even) {
    background: var(--ld-stripe-bg);
}

/* ponytail: removed custom checkbox styles — Unfold uses appearance:none with its own rendering */

/* ponytail: empty — bg override done via JS setProperty('important') in theme-loader */

/* Столбец порядка: ячейку оставляем — в ней живёт ручка перетаскивания,
   прячем только числовое поле и подпись столбца. Штатный hide_ordering_field
   убирает ячейку целиком и уносит ручку вместе с ней. */
.inline-related thead th.column-order { font-size: 0; }
.inline-related input[name$="-order"] { display: none; }

/* ===== Кнопка перехода к исполнению листа в списке ===== */
.ld-run-link {
    display: inline-block; padding: 5px 12px; border-radius: 8px;
    background: var(--ld-coffee); color: #fff !important;
    font-size: 12px; font-weight: 500; text-decoration: none; white-space: nowrap;
}
.ld-run-link:hover { background: var(--ld-space-cadet); text-decoration: none; }

/* ===== Sidebar width ===== */
/* ponytail: Unfold's sidebar is #nav-sidebar. Never match by utility class —
   `[class*="lg:w-"]` also hits every button (they carry `lg:w-auto`), forcing
   them to sidebar width so long labels overflow and collide. */
/* the wrapper is a flow spacer for the fixed sidebar — resize both or content shifts */
#nav-sidebar, #nav-sidebar-inner, div:has(> #nav-sidebar) {
    width: var(--ld-sidebar-w) !important;
}

/* ===== Dropdown / select fix ===== */
select, .actions select {
    appearance: none;
    -webkit-appearance: none;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23617891' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") right 12px center no-repeat;
    border: 1px solid var(--ld-border);
    border-radius: var(--ld-radius);
    padding: 8px 36px 8px 12px;
    font-size: 13px;
    color: var(--ld-text);
    cursor: pointer;
    min-width: 160px;
}
select:focus, .actions select:focus {
    outline: none;
    border-color: var(--ld-coffee);
    box-shadow: 0 0 0 2px rgba(111, 77, 56, 0.15);
}

/* Actions bar */
.actions {
    padding: 10px 0;
    display: flex;
    align-items: center;
    gap: 10px;
}
.actions button, .actions .button {
    background: var(--ld-coffee);
    color: #fff;
    border: none;
    border-radius: var(--ld-radius);
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}
.actions button:hover { background: var(--ld-space-cadet); }

/* ===== Active nav highlight ===== */
nav a[aria-current="page"],
nav a.active {
    border-left: 3px solid var(--ld-coffee) !important;
    font-weight: 600;
}

/* ===== Dark mode overrides ===== */
.dark, [data-theme="dark"] {
    --ld-text: #e2e8f0;
    --ld-text-muted: #94a3b8;
    --ld-border: #2d3f56;
    --ld-bg: #0f172a;
    --ld-bg-card: #1e293b;
}
.dark .ld-widget,
[data-theme="dark"] .ld-widget {
    background: var(--ld-bg-card); border-color: var(--ld-border);
}
.dark .ld-widget-header,
[data-theme="dark"] .ld-widget-header {
    border-color: var(--ld-border); color: var(--ld-text);
}
.dark .ld-row,
[data-theme="dark"] .ld-row {
    border-color: #243b53; color: var(--ld-text);
}
.dark .ld-row a,
[data-theme="dark"] .ld-row a {
    color: var(--ld-tan);
}
.dark .ld-empty,
[data-theme="dark"] .ld-empty {
    color: #64748b;
}
.dark .ld-widget.drag-over,
[data-theme="dark"] .ld-widget.drag-over {
    box-shadow: 0 0 0 2px var(--ld-tan);
}
.dark select, .dark .actions select,
[data-theme="dark"] select, [data-theme="dark"] .actions select {
    background-color: #1a2638; color: #cbd5e1;
    border-color: #2d3f56;
}
.dark .ld-row--actions,
[data-theme="dark"] .ld-row--actions {
    border-color: #2d3f56;
}

/* Тёмная тема: фирменные тёмные тона как цвет текста не читаются на тёмной
   карточке (контраст 1,2–2,8) — для текста берутся светлые оттенки. Фоны
   значков с белым текстом остаются прежними */
.dark .ld-text--danger, [data-theme="dark"] .ld-text--danger { color: #f19a9a; }
.dark .ld-text--warning, [data-theme="dark"] .ld-text--warning { color: #f0b67a; }
.dark .ld-text--ok, .dark .cust-msg,
[data-theme="dark"] .ld-text--ok, [data-theme="dark"] .cust-msg { color: #7fd1a8; }
.dark .ld-muted, .dark .ld-badge--muted,
[data-theme="dark"] .ld-muted, [data-theme="dark"] .ld-badge--muted { color: #a9b8c9; }
/* Unfold ставит кофейный акцент без тёмного варианта (номер текущей страницы) */
.dark .text-primary-600:not([class*="dark:text-"]),
[data-theme="dark"] .text-primary-600:not([class*="dark:text-"]) { color: #b8a08a; }