/* «Мій контроль» — щільний екран у дусі листа DASHBOARD таблиці */
.dhc { display: flex; flex-direction: column; gap: 1rem; }

.dhc-toolbar {
    display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem;
    background: #fff; border: 1px solid rgba(3,7,18,.08); border-radius: .9rem;
    padding: .6rem .75rem; position: sticky; top: 4.2rem; z-index: 5;
    box-shadow: 0 1px 2px rgba(3,7,18,.04);
}
.dark .dhc-toolbar { background: #18181b; border-color: rgba(255,255,255,.08); }
.dhc-chips { display: inline-flex; background: #f4f4f5; border-radius: .6rem; padding: 3px; }
.dark .dhc-chips { background: #27272a; }
.dhc-chip {
    border: 0; background: transparent; color: #3f3f46; font-size: .82rem; font-weight: 600;
    padding: .38rem .7rem; border-radius: .45rem; cursor: pointer; white-space: nowrap;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.dhc-chip:hover { color: #c2410c; }
.dhc-chip.is-on { background: #fff; color: #c2410c; box-shadow: 0 1px 3px rgba(3,7,18,.12); }
.dark .dhc-chip { color: #d4d4d8; }
.dark .dhc-chip.is-on { background: #3f3f46; color: #fdba74; }
.dhc-field { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; color: #71717a; }
.dhc-field input, .dhc-field select {
    font-size: .85rem; border: 1px solid rgba(3,7,18,.14); border-radius: .5rem;
    padding: .32rem .5rem; background: #fff; color: #18181b;
}
.dark .dhc-field input, .dark .dhc-field select { background: #27272a; color: #f4f4f5; border-color: rgba(255,255,255,.14); }
.dhc-field input:focus, .dhc-field select:focus { outline: 2px solid #f59e0b; outline-offset: 1px; }
.dhc-loading { font-size: .8rem; color: #a1a1aa; }

.dhc-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .6rem; }
.dhc-kpi {
    display: flex; flex-direction: column; gap: .15rem; text-decoration: none;
    background: #fff; border: 1px solid rgba(3,7,18,.08); border-radius: .85rem; padding: .7rem .85rem;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.dhc-kpi:hover { border-color: #f59e0b; box-shadow: 0 4px 14px rgba(245,158,11,.15); transform: translateY(-1px); }
.dark .dhc-kpi { background: #18181b; border-color: rgba(255,255,255,.08); }
.dhc-kpi--accent { background: linear-gradient(135deg, #fff7ed, #fff); border-color: #fed7aa; }
.dark .dhc-kpi--accent { background: #2a1c10; border-color: #7c2d12; }
.dhc-kpi__label { font-size: .74rem; font-weight: 600; color: #71717a; }
.dhc-kpi__value { font-size: 1.35rem; font-weight: 800; color: #18181b; font-variant-numeric: tabular-nums; white-space: nowrap; letter-spacing: -.01em; }
.dark .dhc-kpi__value { color: #fafafa; }
.dhc-kpi__hint { font-size: .74rem; color: #a1a1aa; }

.dhc-sec {
    background: #fff; border: 1px solid rgba(3,7,18,.08); border-radius: .9rem; overflow: hidden;
    scroll-margin-top: 12rem; transition: box-shadow .3s ease;
}
.dhc-sec:target { box-shadow: 0 0 0 3px rgba(245,158,11,.45); }
.dark .dhc-sec { background: #18181b; border-color: rgba(255,255,255,.08); }
.dhc-sec__head { padding: .75rem 1rem .5rem; border-bottom: 1px solid rgba(3,7,18,.06); }
.dhc-sec__head h2 { font-size: 1rem; font-weight: 700; color: #18181b; }
.dark .dhc-sec__head h2 { color: #fafafa; }
.dhc-formula { font-size: .78rem; color: #71717a; margin-top: .15rem; line-height: 1.4; }
.dhc-empty { padding: 1.25rem 1rem; color: #a1a1aa; font-size: .9rem; }
.dhc-two { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
@media (max-width: 1750px) { .dhc-two { grid-template-columns: 1fr; } }

.dhc-scroll { overflow-x: auto; }
.dhc-table { width: 100%; border-collapse: collapse; font-size: .84rem; }
.dhc-table th {
    text-align: left; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em;
    color: #71717a; background: #fafafa; padding: .45rem .55rem; border-bottom: 1px solid rgba(3,7,18,.08);
    white-space: nowrap; position: sticky; top: 0;
}
.dark .dhc-table th { background: #1f1f23; color: #a1a1aa; border-color: rgba(255,255,255,.08); }
.dhc-table td { padding: .42rem .55rem; border-bottom: 1px solid rgba(3,7,18,.05); color: #27272a; vertical-align: top; }
.dark .dhc-table td { color: #e4e4e7; border-color: rgba(255,255,255,.05); }
.dhc-table tbody tr:nth-child(even) td { background: rgba(3,7,18,.015); }
.dhc-table tbody tr.dh-row-link { cursor: pointer; }
.dhc-table tbody tr.dh-row-link:hover td { background: rgba(245,158,11,.07); }
.dhc-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dhc-table .strong { font-weight: 700; }
.dhc-table tfoot td {
    font-weight: 800; background: #fff7ed; border-top: 2px solid #fdba74; border-bottom: 0; color: #18181b;
}
.dark .dhc-table tfoot td { background: #2a1c10; color: #fafafa; border-color: #9a3412; }
.dhc-table tr.dhc-group td { background: #f4f4f5 !important; font-weight: 700; font-size: .8rem; color: #3f3f46; }
.dark .dhc-table tr.dhc-group td { background: #27272a !important; color: #d4d4d8; }
.dhc-item { min-width: 220px; }
.dhc-item b { display: block; font-weight: 600; }
.dhc-item small, .dhc-table td small { display: block; font-size: .74rem; color: #71717a; line-height: 1.3; }
.dhc-sub { color: #a1a1aa !important; }
.dhc-nowrap { white-space: nowrap; }
.dhc-pos { color: #047857 !important; }
.dhc-neg { color: #be123c !important; }
.dhc-warn { color: #b45309 !important; }
.dark .dhc-pos { color: #34d399 !important; }
.dark .dhc-neg { color: #fb7185 !important; }
.dark .dhc-warn { color: #fbbf24 !important; }

/* Телефон: рядок таблиці стає карткою «підпис — значення» */
@media (max-width: 640px) {
    .dhc-toolbar { position: static; }
    .dhc-kpis { grid-template-columns: 1fr 1fr; }
    .dhc-kpi__value { font-size: 1.1rem; }
    .dhc-table thead { display: none; }
    .dhc-table, .dhc-table tbody, .dhc-table tfoot, .dhc-table tr, .dhc-table td { display: block; width: 100%; }
    .dhc-table tr { border-bottom: 1px solid rgba(3,7,18,.08); padding: .45rem .75rem; }
    .dhc-table td { border: 0; padding: .12rem 0; background: transparent !important; }
    .dhc-table td.num { display: flex; justify-content: space-between; gap: 1rem; text-align: right; }
    .dhc-table td.num::before { content: attr(data-label); color: #71717a; font-weight: 500; text-align: left; }
    .dhc-table td[data-label="№"], .dhc-table td.dhc-nowrap { display: inline-block; width: auto; margin-right: .5rem; color: #71717a; font-size: .78rem; }
    .dhc-table tfoot tr { background: #fff7ed; }
    .dhc-table tr.dhc-group { padding: .35rem .75rem; background: #f4f4f5; }
    .dhc-table tr.dhc-group td.num::before { content: ''; }
}

/* Раунд 2: несверене, «станом на», пошук, згортання */
.dhc-kpi--todo { border-style: dashed; border-color: #fdba74; }
.dhc-kpi__value--todo { font-size: 1.05rem; color: #b45309; }
.dark .dhc-kpi__value--todo { color: #fbbf24; }
.dhc-asof { font-size: .74rem; font-weight: 500; color: #a1a1aa; margin-left: .35rem; }
.dhc-muted { color: #a1a1aa !important; }
.dhc-sec__head--search { display: grid; grid-template-columns: 1fr auto; column-gap: 1rem; }
.dhc-sec__head--search .dhc-search { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.dhc-search {
    width: 280px; font-size: .85rem; border: 1px solid rgba(3,7,18,.14); border-radius: .55rem;
    padding: .4rem .65rem; background: #fff; color: #18181b;
}
.dark .dhc-search { background: #27272a; color: #f4f4f5; border-color: rgba(255,255,255,.14); }
.dhc-search:focus { outline: 2px solid #f59e0b; outline-offset: 1px; }
.dhc-more td { text-align: center; padding: .5rem !important; background: #fafafa !important; }
.dhc-more button { font-size: .82rem; font-weight: 600; color: #c2410c; background: none; border: 0; cursor: pointer; }
.dhc-more button:hover { text-decoration: underline; }
[x-cloak] { display: none !important; }
.dhc-kpi { padding: .6rem .8rem; }
.dhc-kpis { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
@media (max-width: 640px) {
    .dhc-sec__head--search { grid-template-columns: 1fr; }
    .dhc-sec__head--search .dhc-search { grid-column: 1; grid-row: auto; width: 100%; margin-top: .5rem; }
}

/* Історія замовлення (картка замовлення) */
.dho-steps { list-style: none; margin: 0; padding: 0; position: relative; }
.dho-steps::before { content: ''; position: absolute; left: 15px; top: 10px; bottom: 10px; width: 2px; background: #e4e4e7; }
.dark .dho-steps::before { background: #3f3f46; }
.dho-step { position: relative; display: flex; gap: .75rem; padding: .4rem 0; }
.dho-step__icon {
    position: relative; z-index: 1; flex: none; width: 32px; height: 32px; border-radius: 50%;
    display: grid; place-items: center; background: #f4f4f5; color: #52525b; border: 2px solid #fff;
}
.dark .dho-step__icon { border-color: #18181b; }
.dho-step__icon svg { width: 16px; height: 16px; }
.dho-step--emerald .dho-step__icon { background: #d1fae5; color: #047857; }
.dho-step--amber .dho-step__icon { background: #fef3c7; color: #b45309; }
.dho-step--rose .dho-step__icon { background: #ffe4e6; color: #be123c; }
.dho-step--sky .dho-step__icon { background: #e0f2fe; color: #0369a1; }
.dho-step--todo .dho-step__icon { background: #fff; color: #a1a1aa; border: 2px dashed #d4d4d8; }
.dho-step__body { display: flex; flex-direction: column; line-height: 1.3; padding-top: .1rem; }
.dho-step__date { font-size: .72rem; color: #a1a1aa; font-variant-numeric: tabular-nums; }
.dho-step__title { font-size: .88rem; font-weight: 600; color: #27272a; }
.dark .dho-step__title { color: #f4f4f5; }
.dho-step--todo .dho-step__title { font-weight: 500; color: #71717a; }
.dho-step__text { font-size: .8rem; color: #71717a; }

/* Розшифровка залишку рахунку */
.dha { display: flex; flex-direction: column; gap: .15rem; font-size: .86rem; }
.dha-line { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px solid rgba(3,7,18,.06); }
.dha-line span small, .dha-line b small { display: block; font-size: .74rem; font-weight: 400; color: #71717a; }
.dha-line b { white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; }
.dha-line--start { font-weight: 600; background: #f4f4f5; padding: .5rem .6rem; border-radius: .5rem; border: 0; }
.dha-line--total { font-weight: 800; background: #fff7ed; padding: .55rem .6rem; border-radius: .5rem; border: 0; margin-top: .3rem; }
.dark .dha-line--start { background: #27272a; } .dark .dha-line--total { background: #2a1c10; }
.dha-pos { color: #047857; } .dha-neg { color: #be123c; }
.dha-empty { color: #a1a1aa; padding: .5rem 0; }
.dha-sub { margin-top: .8rem; font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #71717a; }
.dha-note { margin-top: .6rem; padding: .6rem .7rem; border-radius: .5rem; background: #f4f4f5; color: #3f3f46; line-height: 1.45; }
.dha-note--warn { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; margin: 0 0 .4rem; }
/* Платежі в картці замовлення: на компʼютері категорія окремою колонкою, під датою — лише на телефоні */
@media (min-width: 768px) { .dh-pay-date .fi-ta-text-description, .dh-pay-date p + p { display: none; } }
/* Телефон: рядок підсумків платежів не влазить — ті самі суми є у «Фінансовий підсумок» вище */
@media (max-width: 767px) { .fi-resource-relation-manager .fi-ta-summary-row, .fi-resource-relation-manager .fi-ta-summary-header-row { display: none; } }
/* Серія замовлень підряд */
.dhc-series { display: flex; align-items: center; gap: .5rem; padding: .7rem .9rem; border-radius: .7rem;
    background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; font-size: .9rem; }
.dhc-series svg { width: 20px; height: 20px; flex: none; }
.dark .dhc-series { background: #052e22; border-color: #065f46; color: #a7f3d0; }
.dha-history { margin-top: .8rem; }
.dha-history summary { cursor: pointer; font-size: .8rem; font-weight: 600; color: #71717a; }
.dha-history summary:hover { color: #c2410c; }
.dha-history summary:focus:not(:focus-visible) { outline: none; }
