/* Presentation for the organizations admin pages (list + form). This file is intentionally minimal:
   after the platform-wide CSS consolidation, all of masterdata's presentation is shared — page chrome
   comes from layout.css (`.platform-page__*`), form primitives from forms.css (`.platform-form__*`),
   buttons from buttons.css (`.platform-btn`) and the list grid from the shared tabulator. What remains
   below is the ONE bit genuinely unique to masterdata, with no equivalent anywhere else. Design-token-
   driven, mobile-first (coding-standards §4, §12). Published via `vendor:publish --tag=masterdata-assets`
   and <link>ed by the shared shell assets partial. */

/* The muted "(required)" caption shown beside the Name label's asterisk — masterdata's own affordance,
   not part of the shared form vocabulary. */
.organizations-form__required-note {
    margin-left: var(--platform-space-xs, 0.25rem);
    font-weight: 400;
    font-size: var(--platform-font-size-sm, 0.875rem);
    color: var(--platform-color-text-muted, #57606a);
}

/* The "Read from ARES" button (M-065): a self-sizing action under the IČO input, not a full-width field
   control — so it hugs its label and sits just below the input with a little breathing room. */
.organizations-form__ares {
    align-self: flex-start;
    margin-top: var(--platform-space-xs, 0.25rem);
}

/* ---- Duplicate-IČO affordance on the create form (M-256) ---------------- */
/* Shown under the form header when a create was rejected because the IČO already belongs to an existing
   entry. A token-driven notice: the existing entry is a link, and the "Update it with these values" button
   sits beside/below it. Mobile-first: stacks on a phone, spreads on wider viewports (§4/§12). */
.organizations-form__duplicate {
    display: flex;
    flex-wrap: wrap;
    gap: var(--platform-space-sm, 0.5rem);
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--platform-space-md, 1rem);
    padding: var(--platform-space-md, 1rem);
    border: 1px solid var(--platform-color-warning-border, #e0b34a);
    border-radius: var(--platform-radius-md, 0.5rem);
    background: var(--platform-color-warning-surface, #fdf6e3);
    color: var(--platform-color-text, #24292f);
}

.organizations-form__duplicate-lead {
    margin: 0;
}

.organizations-form__duplicate-link {
    font-weight: 600;
}

/* ---- "Update the existing entry" diff-confirm screen (M-256) ------------- */
/* The field-by-field diff (old → new) the user reviews before confirming an overwrite. A plain token-styled
   table that scrolls horizontally on a phone rather than breaking the layout. */
.organizations-merge__intro {
    margin: 0 0 var(--platform-space-md, 1rem);
    color: var(--platform-color-text-muted, #57606a);
}

.organizations-merge__diff {
    width: 100%;
    border-collapse: collapse;
}

.organizations-merge__diff th,
.organizations-merge__diff td {
    padding: var(--platform-space-sm, 0.5rem);
    border-bottom: 1px solid var(--platform-color-border, #e1e4e8);
    text-align: left;
    vertical-align: top;
}

.organizations-merge__diff thead th {
    font-size: var(--platform-font-size-sm, 0.875rem);
    color: var(--platform-color-text-muted, #57606a);
}

.organizations-merge__old {
    color: var(--platform-color-text-muted, #57606a);
}

/* A changed row draws the eye to what the update would overwrite. */
.organizations-merge__row--changed .organizations-merge__new {
    font-weight: 600;
}

.organizations-merge__badge {
    display: inline-block;
    margin-left: var(--platform-space-xs, 0.25rem);
    padding: 0 var(--platform-space-xs, 0.25rem);
    border-radius: var(--platform-radius-sm, 0.25rem);
    background: var(--platform-color-warning-surface, #fdf6e3);
    border: 1px solid var(--platform-color-warning-border, #e0b34a);
    font-size: var(--platform-font-size-sm, 0.875rem);
    font-weight: 400;
}

.organizations-merge__actions-form {
    margin-top: var(--platform-space-md, 1rem);
}

/* ---- Sync admin panel (M-263b; generalized M-267c) ---------------------- */
/* One token-driven card + item-list block, worn by the **jobs panel on the connector edit page** (job link,
   entity type, state, last run). It once also dressed the recent-runs panel on the import-jobs list, but M-276
   turned that into a real Tabulator grid, so the `.masterdata-panel__counts` row it alone used is gone with it;
   what remains is only what the jobs panel needs. The class names say `panel` rather than `jobs` because the
   block stays deliberately generic — a second list-card reuses it rather than growing a near-copy (§3).

   Design-token-driven and mobile-first: each item's head wraps on a phone and spreads on wider viewports; the
   status badge reuses the shared grid pill (`.platform-grid__badge`), so no badge styling is duplicated here
   (coding-standards §3/§4/§12). */
.masterdata-panel {
    margin-bottom: var(--platform-space-lg, 1.5rem);
    padding: var(--platform-space-md, 1rem);
    border: 1px solid var(--platform-color-border, #e1e4e8);
    border-radius: var(--platform-radius-md, 0.5rem);
    background: var(--platform-color-surface, #ffffff);
}

.masterdata-panel__title {
    margin: 0 0 var(--platform-space-sm, 0.5rem);
    font-size: var(--platform-font-size-md, 1rem);
    font-weight: 600;
}

.masterdata-panel__list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.masterdata-panel__item {
    padding: var(--platform-space-sm, 0.5rem) 0;
    border-top: 1px solid var(--platform-color-border, #e1e4e8);
}

.masterdata-panel__item:first-child {
    border-top: 0;
}

.masterdata-panel__head {
    display: flex;
    flex-wrap: wrap;
    gap: var(--platform-space-sm, 0.5rem);
    align-items: baseline;
}

.masterdata-panel__name {
    font-weight: 600;
}

/* The secondary facts beside an item's name (entity type, state, a timestamp). */
.masterdata-panel__meta {
    color: var(--platform-color-text-muted, #57606a);
    font-size: var(--platform-font-size-sm, 0.875rem);
}

/* Push the last fact (a run time) to the end of the row on wider viewports; it just flows after the others on
   a phone, where the head wraps. */
.masterdata-panel__meta--end {
    margin-left: auto;
}

/* The sync-runs grid's own heading (M-276) — the label above the second Tabulator grid on the import-jobs page,
   separating it from the jobs grid above. A plain section title; the grid paints its own card. */
.masterdata-runs__title {
    margin: var(--platform-space-lg, 1.5rem) 0 var(--platform-space-sm, 0.5rem);
    font-size: var(--platform-font-size-md, 1rem);
    font-weight: 600;
}

/* ---- Driver-config admin forms: connectors + import jobs (M-263a/M-267b) --- */
/* Shared by BOTH driver-config forms — the connectors form (connection schemas) and the import-jobs form (job
   schemas) render the same partial and reuse these rules rather than growing a second copy (§3). They are named
   `masterdata-driver-*` since M-267c: they belong to whichever form is rendering a DRIVER's schema, and the old
   `masterdata-connector-*` names claimed one axis while both forms wore them (D-050).

   Each driver's settings render as one `.platform-form__fields` group (shared flex-column layout + gap); the
   owning form controller shows only the live driver's group by flipping `.is-hidden` (no inline style, no
   markup in JS — §4). Two-class selector so `display: none` wins over `.platform-form__fields`'s
   `display: flex`. The surrounding fieldset uses the platform's `.platform-form__group` (border/padding +
   the Bootstrap-Reboot-safe legend), so no fieldset styling is duplicated here (§3). */
.masterdata-driver-group.is-hidden {
    display: none;
}

/* JSON config fields (a column map, a field mapping) are edited as monospace so structure reads clearly. */
.masterdata-driver-json {
    font-family: var(--platform-font-mono, ui-monospace, "SFMono-Regular", "Menlo", monospace);
    white-space: pre;
    resize: vertical;
}

/* The inline "Test connection" verdict beside the form's test button — tone-coded from design tokens, and
   only coloured once a verdict is in (the empty resting state carries neither class). */
.masterdata-driver-probe-result {
    align-self: center;
    font-size: var(--platform-font-size-sm, 0.875rem);
}

.masterdata-driver-probe-result.is-ok {
    color: var(--platform-color-ok, #1a7f37);
}

.masterdata-driver-probe-result.is-error {
    color: var(--platform-color-error, #cf222e);
}

/* Space the edit page's audit history from the form above it. */
.masterdata-audit-history {
    margin-top: var(--platform-space-lg, 1.5rem);
}

/* The "Sync now" row-action glyph (M-263b) — a refresh cycle. Kept in the module, like `--test` above,
   rather than growing the platform's shared button vocabulary for one screen. Same masked-glyph mechanism
   every `.platform-btn--*` action uses (buttons.css). Its consumer is the **import jobs** list (M-267b): a job
   is what runs, so M-267a moved the action off the connectors list with the rest of the job axis and M-267b's
   list picked it up. The `--feed`/`--unfeed` glyphs are gone with `is_feed` itself (M-267 decision 2). */
.platform-btn--sync {
    --platform-btn-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='23 4 23 10 17 10'/%3E%3Cpolyline points='1 20 1 14 7 14'/%3E%3Cpath d='M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15'/%3E%3C/svg%3E");
}
