/*
 * HRConnect public Foundation: the standalone canonical primitive subset.
 * Keep this deliberately smaller than design-components.css. Only authored
 * public component classes opt in; recruitment/support extensions still own
 * their layouts. Semantic colors resolve through the existing theme tokens.
 */
@layer components {
    body.hrc-design-system-v1.hrc-family-public :where(.hrc-layout-page) {
        display: grid;
        gap: var(--hrc-responsive-layout-page-gap, var(--hrc-space-5));
        min-width: 0;
    }

    body.hrc-design-system-v1.hrc-family-public :where(.hrc-surface, .hrc-card, .hrc-section, .hrc-hero, .hrc-form-section) {
        min-width: 0;
        border: var(--hrc-border-width) solid var(--hrc-color-border);
        border-radius: var(--hrc-radius-md);
        background: var(--hrc-color-surface);
        color: var(--hrc-color-text);
        box-shadow: var(--hrc-shadow-sm);
    }

    body.hrc-design-system-v1.hrc-family-public :where(.hrc-hero, .hrc-form-section) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--hrc-space-4);
        padding: var(--hrc-responsive-panel-padding, var(--hrc-space-5));
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-hero > :where(h1, h2) {
        min-width: 0;
        margin: 0;
        color: var(--hrc-color-text);
        font-size: var(--hrc-responsive-hero-title-size, var(--hrc-text-2xl));
        font-weight: var(--hrc-weight-bold);
        line-height: var(--hrc-leading-tight);
        overflow-wrap: anywhere;
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-hero > p {
        margin: 0;
        color: var(--hrc-color-text-muted);
        line-height: var(--hrc-leading-relaxed);
    }

    /* Checkbox/radio rows keep their existing inline control contracts. */
    body.hrc-design-system-v1.hrc-family-public .hrc-field:not(:where(.hrc-check, .hrc-switch, .form-check)):not(:has(> input[type="checkbox"], > input[type="radio"])) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: var(--hrc-space-2);
        min-width: 0;
        margin: 0;
        text-align: start;
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-field__label {
        display: block;
        min-width: 0;
        margin: 0;
        color: var(--hrc-color-text-soft);
        font-size: var(--hrc-text-sm);
        font-weight: var(--hrc-weight-semibold);
        line-height: var(--hrc-leading-normal);
        overflow-wrap: anywhere;
    }

    body.hrc-design-system-v1.hrc-family-public :is(.hrc-input, .hrc-select, .hrc-textarea):not([type="checkbox"], [type="radio"], [type="hidden"], [type="file"], [type="range"], [type="color"], [type="button"], [type="submit"], [type="reset"]) {
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: max(var(--hrc-control-height), var(--hrc-touch-target));
        padding: var(--hrc-space-2) var(--hrc-space-3);
        border: var(--hrc-border-width) solid var(--hrc-color-border-strong);
        border-radius: var(--hrc-radius-control);
        background: var(--hrc-color-surface);
        color: var(--hrc-color-text);
        font-family: var(--hrc-font-sans);
        font-size: var(--hrc-public-control-font-size, var(--hrc-text-md));
        font-weight: var(--hrc-weight-regular);
        line-height: var(--hrc-leading-normal);
        transition: border-color var(--hrc-motion-fast) var(--hrc-ease-standard), box-shadow var(--hrc-motion-fast) var(--hrc-ease-standard);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-textarea {
        min-height: calc(var(--hrc-control-height) * 2);
        resize: vertical;
    }

    body.hrc-design-system-v1.hrc-family-public :where(.hrc-input, .hrc-select, .hrc-textarea):focus-visible {
        outline: var(--hrc-focus-width) solid var(--hrc-color-focus);
        outline-offset: var(--hrc-focus-offset);
    }

    body.hrc-design-system-v1.hrc-family-public :where(.hrc-input, .hrc-textarea)::placeholder {
        color: var(--hrc-color-text-muted);
        opacity: 1;
    }

    body.hrc-design-system-v1.hrc-family-public :where(.hrc-btn) {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: var(--hrc-space-2);
        min-width: 0;
        max-width: 100%;
        min-height: max(var(--hrc-control-height), var(--hrc-touch-target));
        padding: var(--hrc-space-2) var(--hrc-space-4);
        border: var(--hrc-border-width) solid var(--hrc-color-border);
        border-radius: var(--hrc-radius-control);
        background: var(--hrc-color-surface);
        color: var(--hrc-color-text);
        font-family: var(--hrc-font-sans);
        font-size: var(--hrc-text-md);
        font-weight: var(--hrc-weight-semibold);
        line-height: var(--hrc-leading-normal);
        text-align: center;
        text-decoration: none;
        white-space: normal;
        overflow-wrap: anywhere;
        cursor: pointer;
        transition: background-color var(--hrc-motion-fast) var(--hrc-ease-standard), border-color var(--hrc-motion-fast) var(--hrc-ease-standard);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-btn:hover {
        background: var(--hrc-color-surface-soft);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-btn--primary {
        border-color: var(--hrc-action-primary);
        background: var(--hrc-action-primary);
        color: var(--hrc-action-on-primary);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-btn--primary:hover {
        border-color: var(--hrc-action-primary-hover);
        background: var(--hrc-action-primary-hover);
        color: var(--hrc-action-on-primary);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-btn:focus-visible {
        outline: var(--hrc-focus-width) solid var(--hrc-color-focus);
        outline-offset: var(--hrc-focus-offset);
    }

    body.hrc-design-system-v1.hrc-family-public :where(.hrc-btn, .hrc-input, .hrc-select, .hrc-textarea):disabled {
        opacity: var(--hrc-opacity-disabled);
        cursor: not-allowed;
    }

    /* Multiple server-side error children remain one readable vertical list. */
    body.hrc-design-system-v1.hrc-family-public .hrc-alert {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--hrc-space-2);
        min-width: 0;
        padding: var(--hrc-space-4) var(--hrc-space-5);
        border: var(--hrc-border-width) solid var(--hrc-color-info);
        border-radius: var(--hrc-radius-md);
        background: var(--hrc-color-info-soft);
        color: var(--hrc-color-text);
        font-size: var(--hrc-text-md);
        line-height: var(--hrc-leading-normal);
        overflow-wrap: anywhere;
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-alert[data-state="success"] {
        border-color: var(--hrc-color-success);
        background: var(--hrc-color-success-soft);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-alert[data-state="warning"] {
        border-color: var(--hrc-color-warning);
        background: var(--hrc-color-warning-soft);
    }

    body.hrc-design-system-v1.hrc-family-public .hrc-alert[data-state="error"] {
        border-color: var(--hrc-color-danger);
        background: var(--hrc-color-danger-soft);
    }
}

/* Date controls enhanced by the shared runtime also need the standalone public
 * primitive. Keep the native source available to showPicker without displaying
 * a second input. Unlayered rules own layout against legacy form selectors. */
body.hrc-design-system-v1.hrc-family-public .hrc-date-input {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--hrc-touch-target);
    min-width: 0;
    width: 100%;
}

body.hrc-design-system-v1.hrc-family-public .hrc-date-input .hrc-date-display {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    width: 100%;
    padding-inline-end: calc(var(--hrc-touch-target) + var(--hrc-space-2));
}

body.hrc-design-system-v1.hrc-family-public .hrc-date-input__trigger {
    z-index: 1;
    grid-column: 2;
    grid-row: 1;
    display: grid;
    place-items: center;
    min-height: var(--hrc-touch-target);
    min-width: var(--hrc-touch-target);
    padding: 0;
    border: 0;
    border-inline-start: var(--hrc-border-width) solid var(--hrc-color-border);
    border-radius: 0 var(--hrc-radius-sm) var(--hrc-radius-sm) 0;
    background: transparent;
    color: var(--hrc-color-text-muted);
    cursor: pointer;
}

/* A CSS calendar avoids a dependency on the ERP-only icon font. */
body.hrc-design-system-v1.hrc-family-public .hrc-date-input__trigger > i {
    display: none;
}
body.hrc-design-system-v1.hrc-family-public .hrc-date-input__trigger::before {
    content: "";
    width: var(--hrc-space-4);
    height: var(--hrc-space-4);
    border: 2px solid currentColor;
    border-radius: var(--hrc-space-1);
    background: linear-gradient(currentColor, currentColor) 0 var(--hrc-space-1) / 100% 2px no-repeat;
}
body.hrc-design-system-v1.hrc-family-public .hrc-date-input__trigger:hover {
    background: var(--hrc-color-surface-soft);
    color: var(--hrc-color-text);
}
body.hrc-design-system-v1.hrc-family-public .hrc-date-input__trigger:focus-visible {
    outline: var(--hrc-focus-width) solid var(--hrc-color-focus);
    outline-offset: var(--hrc-focus-offset);
}

body.hrc-design-system-v1.hrc-family-public .hrc-date-input > .hrc-date-native-source {
    position: absolute;
    inset: auto 0 0 auto;
    width: 1px;
    height: 1px;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

/* Canonical states must outrank the unlayered native-control adapter defaults. */
body.hrc-design-system-v1.hrc-family-public :is(.hrc-input, .hrc-select, .hrc-textarea)[aria-invalid="true"],
body.hrc-design-system-v1.hrc-family-public .hrc-field[data-state="error"] :is(.hrc-input, .hrc-select, .hrc-textarea) {
    border-color: var(--hrc-color-danger);
}

body.hrc-design-system-v1.hrc-family-public :is(.hrc-input, .hrc-select, .hrc-textarea):disabled {
    background: var(--hrc-color-surface-soft);
}

@layer utilities {
    /* Hide only explicitly authored utilities, never all aria-hidden content.
     * Clipping preserves screen-reader-only text and the existing honeypot
     * contract; focusable skip links become visible when reached by keyboard. */
    body.hrc-design-system-v1.hrc-family-public .visually-hidden,
    body.hrc-design-system-v1.hrc-family-public .visually-hidden-focusable:not(:focus):not(:focus-within) {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        padding: 0 !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        clip-path: inset(50%) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }
}