/*
 * Final accessibility and theme contrast authority.
 * This file intentionally loads after every other stylesheet.
 */

body.plant-body {
    --ui-button-bg: var(--shop-button-bg, #111111);
    --ui-button-text: var(--theme-safe-button-text, var(--shop-button-text, #ffffff));
    --ui-card-bg: var(--plant-card, #ffffff);
    --ui-card-text: var(--theme-safe-card-text, #111111);
    --ui-card-muted: var(--theme-safe-card-muted, #5f6670);
    --ui-secondary-bg: var(--plant-card-2, #f5f7fb);
    --ui-secondary-text: var(--theme-safe-card-secondary-text, #111111);
    --ui-border: rgba(var(--theme-border-rgb, 199, 210, 223), .86);
    --ui-focus-outer: var(--theme-safe-card-text, #111111);
}

/* Buttons, button-like links and custom action controls share one contract. */
body.plant-body :is(
    button:not(.image-preview-trigger):not(.photo-thumb-link):not(.theme-card),
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    a.btn,
    [role="button"].btn,
    .shop-cart-link,
    .mode-switch-btn,
    .category-toggle-btn,
    .pager-link,
    .admin-tool-link,
    .admin-command-link,
    .admin-tools-summary,
    .auth-link-button,
    .available-toggle-btn,
    .plant-floating-link,
    .btn-inline-clear,
    .copy-value-btn
) {
    background-color: var(--ui-button-bg) !important;
    background-image: none !important;
    border-color: var(--ui-button-bg) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
    text-shadow: none !important;
    opacity: 1;
}

/* Nested utility classes must not override their button's foreground. */
body.plant-body :is(
    button:not(.image-preview-trigger):not(.photo-thumb-link):not(.theme-card),
    a.btn,
    [role="button"].btn,
    .shop-cart-link,
    .mode-switch-btn,
    .category-toggle-btn,
    .pager-link,
    .admin-tool-link,
    .admin-command-link,
    .admin-tools-summary,
    .auth-link-button,
    .available-toggle-btn,
    .plant-floating-link
) :is(span, strong, small, b, i, em, label, .text-muted, .shop-muted, .text-dark, .text-light) {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
    text-shadow: none !important;
}

body.plant-body :is(
    button:not(.image-preview-trigger):not(.photo-thumb-link):not(.theme-card),
    a.btn,
    [role="button"].btn,
    .shop-cart-link,
    .mode-switch-btn,
    .category-toggle-btn,
    .pager-link,
    .admin-tool-link,
    .admin-command-link
) :is(svg, path, circle, rect, line, polyline, polygon) {
    color: inherit !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}

body.plant-body :is(
    button:not(.image-preview-trigger):not(.photo-thumb-link):not(.theme-card),
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    a.btn,
    [role="button"].btn,
    .shop-cart-link,
    .mode-switch-btn,
    .category-toggle-btn,
    .pager-link,
    .admin-tool-link,
    .admin-command-link
):is(:hover, :focus-visible) {
    background-color: var(--ui-button-bg) !important;
    border-color: var(--ui-button-text) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
    filter: brightness(1.08);
}

body.plant-body :is(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    a.btn,
    [role="button"].btn,
    .pager-link,
    .mode-switch-btn,
    .admin-tool-link
):is(:disabled, .disabled, [aria-disabled="true"]) {
    background-color: var(--ui-button-bg) !important;
    border-color: var(--ui-button-bg) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
    opacity: .62 !important;
    filter: grayscale(.35) saturate(.55) !important;
    cursor: not-allowed !important;
}

body.plant-body :is(
    .btn.active,
    .mode-switch-btn.active,
    .category-toggle-btn.active,
    .pager-link.active,
    .plant-menu a.active,
    [role="button"][aria-pressed="true"],
    button[aria-expanded="true"]
) {
    background-color: var(--ui-button-bg) !important;
    border-color: var(--ui-button-text) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
    box-shadow: inset 0 0 0 2px var(--ui-button-text) !important;
}

/* Form controls stay legible in normal, readonly, disabled and autofill states. */
body.plant-body :is(
    input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    select,
    textarea,
    .form-control,
    .form-select,
    .inline-search-box
) {
    background-color: rgba(var(--theme-card-rgb, 255, 255, 255), .96) !important;
    background-image: none !important;
    border-color: var(--ui-border) !important;
    color: var(--ui-card-text) !important;
    -webkit-text-fill-color: var(--ui-card-text) !important;
    caret-color: var(--ui-card-text) !important;
    text-shadow: none !important;
}

body.plant-body :is(input, textarea)::placeholder {
    color: var(--ui-card-muted) !important;
    -webkit-text-fill-color: var(--ui-card-muted) !important;
    opacity: .9 !important;
}

body.plant-body :is(
    input:not([type="button"]):not([type="submit"]):not([type="reset"]),
    select,
    textarea,
    .form-control,
    .form-select
):is(:disabled, [readonly]) {
    background-color: rgba(var(--theme-card-secondary-rgb, 245, 247, 251), .96) !important;
    color: var(--ui-secondary-text) !important;
    -webkit-text-fill-color: var(--ui-secondary-text) !important;
    opacity: .76 !important;
}

body.plant-body select option,
body.plant-body select optgroup {
    background: var(--ui-card-bg) !important;
    color: var(--ui-card-text) !important;
}

body.plant-body input[type="file"]::file-selector-button,
body.plant-body input[type="file"]::-webkit-file-upload-button {
    background: var(--ui-button-bg) !important;
    border-color: var(--ui-button-bg) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
}

body.plant-body input:-webkit-autofill,
body.plant-body input:-webkit-autofill:hover,
body.plant-body input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--ui-card-text) !important;
    box-shadow: 0 0 0 1000px rgba(var(--theme-card-rgb, 255, 255, 255), .98) inset !important;
    caret-color: var(--ui-card-text) !important;
}

/* Checkable controls remain visible against light and dark cards. */
body.plant-body :is(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--ui-button-bg) !important;
    outline-color: var(--ui-card-text);
}

body.plant-body :is(label, legend, .form-label, .form-check-label, .input-group-text) {
    color: var(--ui-card-text);
    text-shadow: none;
}

body.plant-body .input-group-text {
    background: var(--ui-secondary-bg) !important;
    border-color: var(--ui-border) !important;
    color: var(--ui-secondary-text) !important;
}

/* Bootstrap table variants may set their own variables, so reset them here. */
body.plant-body :is(.table, table) {
    --bs-table-color: var(--ui-card-text);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--ui-border);
    --bs-table-striped-color: var(--ui-card-text);
    --bs-table-striped-bg: rgba(var(--theme-card-secondary-rgb, 245, 247, 251), .56);
    --bs-table-hover-color: var(--ui-card-text);
    --bs-table-hover-bg: rgba(var(--theme-card-secondary-rgb, 245, 247, 251), .78);
    color: var(--ui-card-text) !important;
}

body.plant-body :is(.table, table) :is(tbody, tfoot, tr, td) {
    border-color: var(--ui-border) !important;
    color: var(--ui-card-text) !important;
    -webkit-text-fill-color: var(--ui-card-text) !important;
    text-shadow: none !important;
}

body.plant-body :is(.table, table) thead,
body.plant-body :is(.table, table) thead tr,
body.plant-body :is(.table, table) thead th {
    background: var(--ui-button-bg) !important;
    border-color: var(--ui-button-text) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
    text-shadow: none !important;
}

body.plant-body :is(.table, table) a:not(.btn) {
    color: var(--theme-safe-card-link, var(--ui-card-text)) !important;
    -webkit-text-fill-color: currentColor !important;
    text-decoration-thickness: .12em;
    text-underline-offset: .16em;
}

/* Menus and options use card colours until they become active. */
body.plant-body :is(.dropdown-menu, .list-group, .autocomplete-results) {
    background: var(--ui-card-bg) !important;
    border-color: var(--ui-border) !important;
    color: var(--ui-card-text) !important;
}

body.plant-body :is(.dropdown-item, .list-group-item, .category-item) {
    background: transparent !important;
    color: var(--ui-card-text) !important;
    -webkit-text-fill-color: var(--ui-card-text) !important;
}

body.plant-body :is(
    .dropdown-item:hover,
    .dropdown-item:focus,
    .dropdown-item.active,
    .list-group-item:hover,
    .list-group-item:focus,
    .list-group-item.active,
    .category-item:hover,
    .category-item:focus,
    .category-item.active
) {
    background: var(--ui-button-bg) !important;
    color: var(--ui-button-text) !important;
    -webkit-text-fill-color: var(--ui-button-text) !important;
}

/* Status and validation text must remain meaningful without losing contrast. */
body.plant-body :is(.text-danger, .required-mark, .field-validation-error, .validation-summary-errors) {
    color: var(--theme-safe-danger-text, #b42318) !important;
    -webkit-text-fill-color: currentColor !important;
}

body.plant-body :is(.text-success, .is-ok, .completed, .paid) {
    color: var(--theme-safe-success-text, var(--ui-card-text)) !important;
    -webkit-text-fill-color: currentColor !important;
}

body.plant-body :is(.text-warning, .is-warning, .warning, .warn) {
    color: var(--theme-safe-warning-text, var(--ui-card-text)) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* A two-colour focus ring stays visible when either theme colour is similar. */
body.plant-body :is(a, button, input, select, textarea, summary, [role="button"]):focus-visible {
    outline: 2px solid var(--ui-button-text) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px var(--ui-button-bg) !important;
}

/* Admin Shop has its own Excel-style filter row. I keep the panel, labels,
   controls and native option menu on matched contrast-safe theme surfaces. */
body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-column-filter-bar {
    background: var(--ui-card-bg) !important;
    border-color: var(--ui-border) !important;
    color: var(--ui-card-text) !important;
}

body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-column-filter-bar label,
body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-column-filter-bar label > span {
    color: var(--ui-card-text) !important;
    -webkit-text-fill-color: var(--ui-card-text) !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-column-filter-bar :is(input, select, .form-control) {
    background-color: var(--ui-secondary-bg) !important;
    border-color: var(--ui-border) !important;
    color: var(--ui-secondary-text) !important;
    -webkit-text-fill-color: var(--ui-secondary-text) !important;
    opacity: 1 !important;
}

body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-column-filter-bar input::placeholder {
    color: var(--ui-secondary-text) !important;
    -webkit-text-fill-color: var(--ui-secondary-text) !important;
    opacity: .72 !important;
}

body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-column-filter-bar select option,
body.plant-body.route-shop.route-index.shop-admin-mode #main-content .admin-category-select option {
    background-color: #f3f6fa !important;
    color: #172033 !important;
    -webkit-text-fill-color: #172033 !important;
}

/* Instructions and field captions inside the Admin product list must not
   inherit a low-contrast decorative colour from the storefront theme. */
body.plant-body.route-shop.route-index.shop-admin-mode #main-content :is(
    .admin-online-list-head,
    .admin-online-row,
    .admin-list-group,
    .category-picker-hint,
    .admin-list-main,
    .admin-list-stock,
    .admin-list-price
) {
    color: var(--ui-card-text) !important;
}

body.plant-body.route-shop.route-index.shop-admin-mode #main-content :is(
    .admin-online-list-head,
    .admin-online-row,
    .admin-list-group,
    .category-picker-hint,
    .admin-list-main,
    .admin-list-stock,
    .admin-list-price
) :is(span, strong, small, label) {
    color: inherit !important;
    -webkit-text-fill-color: inherit !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

@media (forced-colors: active) {
    body.plant-body :is(button, a.btn, input, select, textarea, summary, [role="button"]) {
        forced-color-adjust: auto;
    }
}
