/* Ad-hoc "quick-add" — a "+" beside a picker that opens a native <dialog> create form (M-104 → promoted to
 * platform in M-107). Shared by the organization quick-add on contracts and the "+ create user" on
 * user-pickers, so the modal chrome + trigger live once here. Token-styled so everything re-skins with the
 * theme (incl. dark mode); the native top-layer + ::backdrop give the overlay for free. Presentation only —
 * behaviour is in the `quick-add` Stimulus controller (coding-standards §4). */

/* ── The picker's label row + "+" trigger ─────────────────────────────────────────────────────────────
 * The label row lays the label text and the "+" on one line; the trigger is a token-styled icon button. */
.platform-quick-add__label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--platform-space-sm, 0.5rem);
}

.platform-quick-add__trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    padding: 0;
    color: var(--platform-color-primary, #16a085);
    background: none;
    border: 1px solid var(--platform-color-border, #d0d7de);
    border-radius: var(--platform-radius-md, 0.375rem);
    cursor: pointer;
}

.platform-quick-add__trigger:hover,
.platform-quick-add__trigger:focus-visible {
    color: var(--platform-color-surface, #fff);
    background: var(--platform-color-primary, #16a085);
    border-color: var(--platform-color-primary, #16a085);
}

.platform-quick-add__trigger-icon {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ── The modal ────────────────────────────────────────────────────────────────────────────────────────
 * A native <dialog> hosting the create field set, opened by the "+". */
.platform-quick-add-modal {
    width: min(38rem, calc(100vw - 2 * var(--platform-space-lg)));
    max-height: calc(100vh - 2 * var(--platform-space-lg));
    padding: 0;
    color: var(--platform-color-text);
    background: var(--platform-color-surface);
    border: 1px solid var(--platform-color-border);
    border-radius: var(--platform-radius-lg);
    box-shadow: var(--platform-shadow-lg, var(--platform-shadow-md));
    overflow: hidden;
}

.platform-quick-add-modal::backdrop {
    background: rgba(0, 0, 0, 0.45);
}

.platform-quick-add-modal__panel {
    display: flex;
    flex-direction: column;
    max-height: inherit;
}

.platform-quick-add-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--platform-space-md);
    padding: var(--platform-space-md) var(--platform-space-lg);
    border-bottom: 1px solid var(--platform-color-border);
}

.platform-quick-add-modal__title {
    margin: 0;
    font-size: var(--platform-font-size-lg);
    font-weight: 600;
}

.platform-quick-add-modal__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    color: var(--platform-color-text-muted, var(--platform-color-text));
    background: none;
    border: 0;
    border-radius: var(--platform-radius-md);
    cursor: pointer;
}

.platform-quick-add-modal__close:hover,
.platform-quick-add-modal__close:focus-visible {
    background: var(--platform-color-surface-muted);
}

.platform-quick-add-modal__close-icon {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* The form scrolls inside the fixed-height dialog so a long field set never pushes the actions off-screen. */
.platform-quick-add-modal__form {
    padding: var(--platform-space-lg);
    overflow-y: auto;
}

/* Server validation summary (a flat message list); hidden until the controller fills it on a 422. */
.platform-quick-add-modal__errors {
    margin: 0 0 var(--platform-space-md);
    padding-left: var(--platform-space-lg);
}

.platform-quick-add-modal__errors[hidden] {
    display: none;
}

/* A link to an existing entry an enriched error may reference (e.g. the duplicate-IČO 422, M-256) — it reads
   as an action within the error summary, so it keeps the accent colour rather than the error tone. */
.platform-quick-add-modal__existing-link {
    color: var(--platform-color-primary, #16a085);
    font-weight: 600;
}

.platform-quick-add-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--platform-space-sm);
    margin-top: var(--platform-space-lg);
}