/* ao.legacy-bridge.css
   Bridge old AgencyOffice selectors to tokens.
   Start SMALL. In safe mode load BEFORE AgencyOffice.css (no breaking).
   When you want to start applying the new look, move this AFTER AgencyOffice.css. */

:root {
    --radius-sm: 4px;
    --btn-radius: 10px;
    --btn-padding-y: 6px;
    --btn-padding-x: 12px;
}

/* Only bridge when a token theme is active */
html[data-theme="dark"],
html[data-theme="light"] {
    /* Generic form controls (low specificity) */
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="search"],
    input[type="tel"],
    input[type="url"],
    select,
    textarea {
        background: var(--input-bg, #fff);
        color: var(--input-text, inherit);
        border: 1px solid var(--input-border, #ccc);
        border-radius: var(--radius-sm);
    }

        input::placeholder,
        textarea::placeholder {
            color: var(--input-placeholder, rgba(0,0,0,0.45));
        }

        input:hover,
        select:hover,
        textarea:hover {
            border-color: var(--input-border-hover, var(--input-border, #999));
        }
    /* Common legacy button classes seen in AgencyOffice.css */
    .Button,
    .ActionButton,
    .InformationButton,
    .CriticalButton,
    .PagingButton,
    .ai-button,
    button.button {
        background: var(--color-primary, #1A4179);
        color: var(--color-on-primary, #fff);
        border: 1px solid transparent;
        border-radius: var(--btn-radius);
        padding: var(--btn-padding-y) var(--btn-padding-x);
        cursor: pointer;
        box-shadow: var(--shadow-sm, none);
    }

        .Button:hover,
        .ActionButton:hover,
        .InformationButton:hover,
        .CriticalButton:hover,
        .PagingButton:hover,
        .ai-button:hover,
        button.button:hover {
            background: var(--color-primary-hover, var(--color-primary, #1A4179));
        }

    .PagingSelectedButton {
        background: var(--color-accent, #E42289);
        color: var(--color-on-accent, #fff);
        border-radius: var(--btn-radius);
        padding: var(--btn-padding-y) var(--btn-padding-x);
    }
    /* A commonly used legacy header class */
    .BlueDisplayHeader {
        background: var(--shell-bg, transparent);
        color: var(--shell-text, inherit);
        border-bottom: 1px solid var(--shell-border, transparent);
    }
    /* Optional: ensure tables/lines look OK without changing layout */
    hr {
        border: 0;
        border-top: 1px solid var(--border-1, rgba(0,0,0,0.12));
    }
}