/* ============================================================================
   Panel administracyjny kabinetu — фирменный стиль D3 «Graphite Signature» (08.11.2026).
   Подключается ПОСЛЕДНИМ после admin.css (login.html, index.html). Только внешний вид:
   разметка, id, тексты и admin.js не меняются. Откат — убрать <link> на этот файл.
   Палитра и шрифты — те же, что _shared/d3-crm.css (синего в D3 нет).
   ============================================================================ */
@import url('/_shared/d3-fonts.css');

@media screen {
:root:root {
  --d3-gr: #24262b; --d3-deep: #1d1f23; --d3-plate: #31343b; --d3-plate-2: #383b43; --d3-hi: #3d4048;
  --d3-or: #ff6200; --d3-or-2: #ff8a3d; --d3-or-soft: #ffb37a; --d3-on-hot: #1d1f23;
  --d3-hot: linear-gradient(160deg, #ff8a00 0%, #ff6200 55%, #ff5200 100%);
  --d3-ink: #fff; --d3-ink-2: #e6e7ea; --d3-ink-3: #b9bbc1;
  --d3-ok: #34d27b; --d3-err: #ff8a7a; --d3-warn: #ffb37a;
  --d3-para: polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
  --d3-font: 'Space Grotesk', 'Onest', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* токены панели (admin.css берёт всё отсюда) */
  --tp-bg-1: var(--d3-gr); --tp-bg-2: var(--d3-gr);
  --tp-panel: var(--d3-plate); --tp-panel-2: var(--d3-plate-2);
  --tp-border: rgba(255,255,255,.07); --tp-border-mid: rgba(255,255,255,.12);
  --tp-text: var(--d3-ink); --tp-text-dim: var(--d3-ink-2); --tp-text-faint: var(--d3-ink-3);
  --tp-accent: var(--d3-or); --tp-accent-2: var(--d3-or-soft); --tp-accent-strong: #e65100;
  --tp-danger: var(--d3-err); --tp-success: var(--d3-ok); --tp-warning: var(--d3-warn);
  --ti-accent: var(--d3-or); --ti-accent-hover: var(--d3-or-soft); --ti-accent-strong: #e65100;
  --ti-success-bright: var(--d3-ok); --ti-danger-bright: var(--d3-err); --ti-warning: var(--d3-warn);
  --ti-font-body: var(--d3-font); --ti-font-display: var(--d3-font);
}

/* ---------- база ---------- */
html, html body { background: var(--d3-gr) !important; }
html body { font-family: var(--d3-font) !important; color: var(--d3-ink); }
html body :where(h1, h2, h3, h4, button, input, select, textarea, table) { font-family: var(--d3-font) !important; }
html body::before, html body::after { display: none !important; }
.tp-bg-glow { display: none !important; }                       /* без синего/оранжевого свечения */
html ::selection { background: rgba(255,98,0,.45); color: #fff; }
html :where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid var(--d3-or-soft) !important; outline-offset: 2px; }
html * { scrollbar-color: var(--d3-hi) transparent; }
html input[type=checkbox], html input[type=radio] { accent-color: var(--d3-or); }
.tp-admin-shell { background: var(--d3-gr) !important; }

/* ---------- знак и надпись: логотип TRUST ---------- */
.tp-admin-brand-mark { width: 40px !important; height: 40px !important; flex: 0 0 40px; font-size: 0 !important; color: transparent !important;
  background: url('/_shared/d3/app-icon.png') center / contain no-repeat !important; border-radius: 0 !important; box-shadow: none !important; filter: none !important; }
.tp-admin-brand-main, .tp-login-brand-main { font-size: 0 !important; width: 92px; height: 28px; background: url('/_shared/d3/logo-trust.png') left center / contain no-repeat; }
.tp-admin-brand-main span, .tp-login-brand-main span { display: none; }
.tp-admin-brand-sub { color: var(--d3-ink-3) !important; font: 700 9px var(--d3-font) !important; letter-spacing: .1em !important; margin-top: 4px; white-space: nowrap; }

/* ---------- боковое меню ---------- */
.tp-admin-sidebar { background: var(--d3-deep) !important; border-right: 0 !important; backdrop-filter: none !important; }
.tp-admin-brand { border-bottom: 1px solid var(--d3-plate) !important; position: relative; }
.tp-admin-brand::after { content: ''; position: absolute; left: 0; bottom: -2px; width: 48px; height: 3px; background: var(--d3-hot); }
.tp-admin-nav a { color: var(--d3-ink-2) !important; border: 0 !important; border-radius: 10px !important; font-weight: 600; }
.tp-admin-nav a:hover { background: var(--d3-plate) !important; color: #fff !important; }
.tp-admin-nav a.active { background: var(--d3-plate) !important; color: #fff !important; box-shadow: inset 3px 0 0 var(--d3-or) !important; border-color: transparent !important; }
.tp-admin-nav a i { background: var(--d3-ink-3) !important; color: var(--d3-ink-3) !important; border-radius: 0 !important; transform: skewX(-20deg); box-shadow: none !important; opacity: .55; }
.tp-admin-nav a.active i, .tp-admin-nav a:hover i { background: var(--d3-or) !important; opacity: 1; }
.tp-admin-sidebar-foot { color: var(--d3-ink-3) !important; border-top: 1px solid var(--d3-plate) !important; }

/* ---------- шапка ---------- */
.tp-admin-topbar { background: var(--d3-gr) !important; border-bottom: 1px solid var(--d3-plate) !important; backdrop-filter: none !important; }
.tp-admin-eyebrow { display: flex; align-items: center; gap: 10px; color: var(--d3-or-2) !important; font: 700 11px var(--d3-font) !important; letter-spacing: .14em !important; text-transform: uppercase; }
.tp-admin-eyebrow::before { content: ''; width: 22px; height: 3px; background: var(--d3-or); transform: skewX(-20deg); }
.tp-admin-topbar h1 { font: 700 26px/1.1 var(--d3-font) !important; letter-spacing: -.02em !important; color: #fff !important; }
.tp-admin-user { color: var(--d3-ink-3) !important; }
.tp-admin-avatar { background: var(--d3-hot) !important; color: var(--d3-on-hot) !important; box-shadow: none !important; font-weight: 700; }
.tp-admin-logout { background: var(--d3-plate) !important; color: #fff !important; border: 0 !important; border-radius: 10px !important; }
.tp-admin-logout:hover { background: var(--d3-hi) !important; color: var(--d3-err) !important; }

/* ---------- поля и поиск ---------- */
.tp-quick-search input, .tp-client-search, .tp-field input, .tp-field select, .tp-field textarea, .tp-status-filter, .tp-compose-box textarea,
.tp-login-field input, .tp-admin-content :where(input[type=text], input[type=email], input[type=number], input[type=date], input[type=tel], input[type=password], input:not([type]), select, textarea) {
  background: var(--d3-deep) !important; border: 1px solid var(--d3-hi) !important; border-radius: 10px !important; color: #fff !important; box-shadow: none !important; }
.tp-quick-search input:focus, .tp-client-search:focus, .tp-field :is(input, select, textarea):focus, .tp-login-field input:focus,
.tp-admin-content :where(input, select, textarea):focus { border-color: var(--d3-or) !important; box-shadow: 0 0 0 3px rgba(255,98,0,.18) !important; outline: none; }
html body :is(input, textarea)::placeholder { color: #8d9097 !important; }
.tp-field label, .tp-login-field label { color: var(--d3-ink-3) !important; font: 600 12px var(--d3-font) !important; letter-spacing: 0 !important; text-transform: none !important; }
html body select:not([multiple]) { appearance: none; -webkit-appearance: none; padding-right: 34px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff8a3d' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 11px center !important; background-size: 14px !important; }
.tp-quick-search-results { background: var(--d3-deep) !important; border: 1px solid var(--d3-plate) !important; border-radius: 14px !important; box-shadow: 0 20px 40px rgba(0,0,0,.55) !important; }
.tp-quick-search-result { border-color: var(--d3-plate) !important; }
.tp-quick-search-result:hover { background: var(--d3-plate) !important; }
.tp-quick-search-result span, .tp-quick-search-empty { color: var(--d3-ink-3) !important; }

/* ---------- кнопки: главная — горячий параллелограмм, графитовый текст ---------- */
.tp-btn { background: var(--d3-plate) !important; border: 0 !important; border-radius: 10px !important; color: #fff !important; font-weight: 600; box-shadow: none !important; }
.tp-btn:hover { background: var(--d3-hi) !important; }
.tp-btn-primary, .tp-login-btn { background: var(--d3-hot) !important; color: var(--d3-on-hot) !important; border: 0 !important; border-radius: 0 !important;
  clip-path: var(--d3-para); box-shadow: none !important; font-weight: 700 !important; padding-left: 20px; padding-right: 20px; }
.tp-btn-primary:hover, .tp-login-btn:hover { filter: brightness(1.07); background: var(--d3-hot) !important; }
.tp-btn-primary:disabled, .tp-login-btn:disabled { opacity: .45; filter: none; }
.tp-btn-danger { background: rgba(255,138,122,.1) !important; color: var(--d3-err) !important; }
.tp-btn-danger:hover { background: rgba(255,138,122,.18) !important; }
.tp-back-link { color: var(--d3-or-2) !important; }
.tp-back-link:hover { color: var(--d3-or-soft) !important; }

/* ---------- чипы/фильтры ---------- */
.tp-chip { background: var(--d3-plate) !important; border: 0 !important; color: var(--d3-ink-2) !important; border-radius: 0 !important; clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%); padding-left: 14px !important; padding-right: 14px !important; }
.tp-chip:hover { background: var(--d3-hi) !important; color: #fff !important; }
.tp-chip.active { background: var(--d3-hot) !important; color: var(--d3-on-hot) !important; font-weight: 700; }

/* ---------- плиты: статистика, сводки, карточки клиентов ---------- */
.tp-stat-pill, .tp-summary-card, .tp-client-card, .tp-profile-section, .tp-compose-box, .tp-finance-totals > div, .tp-table-wrap, .tp-empty-state, .tp-readonly-note,
.tp-client-status-chip, .tp-accessory-toggle, .tp-bike-image-preview {
  background: var(--d3-plate) !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; }
.tp-summary-card, .tp-client-card, .tp-profile-section, .tp-table-wrap { border-radius: 16px !important; }
.tp-summary-card { position: relative; overflow: hidden; }
.tp-summary-card::before { content: '' !important; position: absolute; left: 18px; top: 0; width: 40px !important; height: 3px !important; background: var(--d3-hot) !important; border-radius: 0 !important; opacity: 1 !important; inset: 0 auto auto 18px; }
.tp-summary-card:hover, .tp-client-card:hover { background: var(--d3-plate-2) !important; transform: none !important; }
.tp-summary-card .tp-summary-icon { background: rgba(255,98,0,.14) !important; color: var(--d3-or-2) !important; box-shadow: none !important; }
.tp-summary-card .tp-summary-value, .tp-stat-pill b, .tp-finance-totals div b { font-family: var(--d3-font) !important; font-variant-numeric: tabular-nums; color: #fff !important; }
.tp-summary-card .tp-summary-label, .tp-stat-pill span, .tp-finance-totals div span { color: var(--d3-ink-3) !important; }
.tp-stat-pill--warning b { color: var(--d3-warn) !important; }
.tp-stat-pill--danger b { color: var(--d3-err) !important; }
.tp-client-card.is-inactive { opacity: .6; }
.tp-client-avatar { background: var(--d3-hi) !important; color: #fff !important; border: 0 !important; box-shadow: none !important; }
.tp-client-card-name { color: #fff !important; }
.tp-client-contact-item, .tp-client-contact-item span { color: var(--d3-ink-2) !important; }
.tp-client-contact-icon { background: var(--d3-deep) !important; color: var(--d3-or-2) !important; }
.tp-client-status-chip--danger { background: rgba(255,138,122,.08) !important; box-shadow: inset 3px 0 0 var(--d3-err) !important; }
.tp-client-status-chip--warning { background: rgba(255,179,122,.08) !important; box-shadow: inset 3px 0 0 var(--d3-warn) !important; }
.tp-client-status-icon { background: var(--d3-hi) !important; color: #fff !important; }
.tp-client-status-chip--danger .tp-client-status-icon { background: var(--d3-err) !important; color: var(--d3-on-hot) !important; }
.tp-client-status-chip--warning .tp-client-status-icon { background: var(--d3-warn) !important; color: var(--d3-on-hot) !important; }
.tp-client-status-sub { color: var(--d3-ink-3) !important; }
.tp-accessory-toggle:has(input:checked) { background: rgba(255,98,0,.14) !important; box-shadow: inset 0 0 0 1px var(--d3-or) !important; }

/* ---------- таблицы ---------- */
.tp-table th { background: var(--d3-deep) !important; color: var(--d3-ink-3) !important; font: 700 11px var(--d3-font) !important; letter-spacing: .1em !important; text-transform: uppercase; border-color: var(--d3-plate) !important; }
.tp-table td { border-color: rgba(255,255,255,.06) !important; color: var(--d3-ink-2); }
.tp-table tbody tr:hover { background: var(--d3-plate-2) !important; }
.tp-kv-table td { border-color: rgba(255,255,255,.06) !important; }
.tp-kv-table td:first-child { color: var(--d3-ink-3) !important; }

/* ---------- бейджи статусов: ленты D3 ---------- */
.tp-badge { border: 0 !important; border-radius: 0 !important; clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); padding: 2px 10px !important;
  font: 700 10.5px/1.6 var(--d3-font) !important; letter-spacing: .06em; text-transform: uppercase; background: var(--d3-hi) !important; color: var(--d3-ink-2) !important; }
.tp-badge::before { display: none !important; }
.tp-badge-success { background: rgba(52,210,123,.16) !important; color: var(--d3-ok) !important; }
.tp-badge-warning { background: rgba(255,179,122,.16) !important; color: var(--d3-warn) !important; }
.tp-badge-danger  { background: rgba(255,138,122,.16) !important; color: var(--d3-err) !important; }

/* ---------- профиль клиента ---------- */
.tp-profile-header h2 { font: 700 24px var(--d3-font) !important; letter-spacing: -.015em; color: #fff !important; }
.tp-profile-nav button { background: var(--d3-plate) !important; border: 0 !important; color: var(--d3-ink-2) !important; border-radius: 10px !important; }
.tp-profile-nav button:hover { background: var(--d3-hi) !important; color: #fff !important; }
.tp-profile-section h3 { font: 700 15px var(--d3-font) !important; color: #fff !important; display: flex; align-items: center; gap: 10px; }
.tp-profile-section h3::before { content: ''; width: 18px; height: 3px; flex: 0 0 18px; background: var(--d3-or); transform: skewX(-20deg); }
.tp-profile-section h3 small { color: var(--d3-ink-3) !important; }
.tp-profile-header-badges .tp-trust-days { background: rgba(255,98,0,.14) !important; color: var(--d3-or-soft) !important; border: 0 !important; }

/* ---------- окно ---------- */
.tp-modal-overlay { background: rgba(10,11,13,.72) !important; backdrop-filter: none !important; }
.tp-modal-card { background: var(--d3-plate) !important; border: 0 !important; border-radius: 18px !important; box-shadow: 0 40px 80px -30px rgba(0,0,0,.8) !important; position: relative; }
.tp-modal-card::before { content: ''; position: absolute; left: 28px; top: 0; width: 56px; height: 4px; background: var(--d3-hot); }
.tp-modal-card h3 { font: 700 20px var(--d3-font) !important; color: #fff !important; }
.tp-modal-close { background: var(--d3-hi) !important; color: #fff !important; border: 0 !important; border-radius: 10px !important; }
.tp-modal-close:hover { background: var(--d3-deep) !important; }
.tp-form-message { color: var(--d3-ink-3); }

/* ---------- страница входа ---------- */
.tp-login-shell { background: var(--d3-gr) !important; overflow: hidden; }
.tp-login-card { background: var(--d3-plate) !important; border: 0 !important; border-radius: 20px !important; backdrop-filter: none !important;
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.75) !important; padding: 34px 30px !important; max-width: 400px !important; }
.tp-login-card::before { left: 30px !important; right: auto !important; top: 0 !important; width: 64px; height: 4px !important; background: var(--d3-hot) !important; }
.tp-login-shell .tp-admin-brand-mark { filter: none !important; background-image: url('/_shared/d3/app-icon.png') !important; }
.tp-login-brand { padding-bottom: 18px; border-bottom: 1px solid var(--d3-hi); }
.tp-login-field input { height: 46px; }
.tp-login-btn { height: 50px; font-size: 15px !important; letter-spacing: .04em; text-transform: uppercase; margin-top: 10px !important; }
.tp-login-error { color: var(--d3-err) !important; }
.d3-admin-tapes { position: absolute; left: 0; right: 0; bottom: 40px; height: 116px; overflow: hidden; pointer-events: none; z-index: 0; }
.d3-admin-tapes .d3-tape { position: absolute; left: -20%; width: 140%; display: flex; align-items: center; gap: 36px; padding: 0 60px; white-space: nowrap; overflow: hidden;
  font: 700 13px/1 var(--d3-font); letter-spacing: .22em; text-transform: uppercase; transform: rotate(calc(-1 * atan2(14px, 50vw))); }
.d3-admin-tapes .d3-tape--o { top: 20px; height: 38px; background: linear-gradient(90deg, #ff8a00, #ff6200 55%, #ff5200); color: var(--d3-on-hot); z-index: 2; box-shadow: 0 12px 20px -12px rgba(0,0,0,.8); }
.d3-admin-tapes .d3-tape--w { top: 60px; height: 32px; font-size: 12px; background: #eceef1; color: #24262b; z-index: 1; padding-left: 220px; }
.d3-admin-tapes .d3-tape em { font-style: normal; opacity: .5; }
@media (max-width: 640px) {
  .d3-admin-tapes { bottom: 10px; height: 84px; }
  .d3-admin-tapes .d3-tape { font-size: 11px; gap: 26px; transform: rotate(calc(-1 * atan2(6px, 50vw))); }
  .d3-admin-tapes .d3-tape--o { top: 14px; height: 30px; }
  .d3-admin-tapes .d3-tape--w { top: 46px; height: 25px; font-size: 10px; padding-left: 90px; }
  .tp-login-card { margin: 0 16px; }
}
}