/*
    Light mode for the partner area.

    An override layer rather than a rewrite. partner/style.css is the legacy
    stylesheet carried over verbatim and it hardcodes its colours - html is
    #2c2b3a, surfaces are #262531, muted text is #a4b2c5 - with no custom
    properties to swap. Converting 1,200 lines of it to variables would be a
    large change to a file whose exact appearance is the thing being
    preserved, so this flips only the surfaces that actually carry the theme
    and leaves the layout untouched.

    Scoped to [data-theme="light"] on <html>, which the toggle sets and which
    defaults from prefers-color-scheme. Dark remains the default and the
    original: nothing here applies unless a partner asks for it.
*/

:root[data-theme="light"] {
    --surface: #ffffff;
    --page: #f7f8fc;
    --ink: #2c2b3a;
    --ink-muted: #5b6b7f;
    --line: #e3e8ef;
}

:root[data-theme="light"] html,
html:root[data-theme="light"] {
    background: var(--page);
    color: var(--ink);
}

:root[data-theme="light"] body {
    background: var(--page);
    color: var(--ink);
}

/* Headings are #fff in the dark theme, which is invisible on a light page. */
:root[data-theme="light"] h1,
:root[data-theme="light"] h2,
:root[data-theme="light"] h3,
:root[data-theme="light"] h4,
:root[data-theme="light"] h5 {
    color: var(--ink);
}

/* The dark surfaces: panels, the summary boxes and the lead/payment rows. */
:root[data-theme="light"] .dark-module,
:root[data-theme="light"] .lead-item,
:root[data-theme="light"] .shaded-box,
:root[data-theme="light"] .password-strength-text {
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--ink);
}

:root[data-theme="light"] .header-fixed {
    background: var(--surface) !important;
    border-bottom: 1px solid var(--line);
}

:root[data-theme="light"] .box-title,
:root[data-theme="light"] .input-note,
:root[data-theme="light"] #fullpage-copyright,
:root[data-theme="light"] .lead-item-status {
    color: var(--ink-muted);
}

:root[data-theme="light"] .box-value {
    color: var(--ink);
}

/* Inputs, including the types the rebuilt forms use that the legacy never had. */
:root[data-theme="light"] input[type="text"],
:root[data-theme="light"] input[type="password"],
:root[data-theme="light"] input[type="number"],
:root[data-theme="light"] input[type="email"],
:root[data-theme="light"] input[type="tel"],
:root[data-theme="light"] input[type="url"],
:root[data-theme="light"] input[type="search"],
:root[data-theme="light"] textarea,
:root[data-theme="light"] select {
    background: var(--surface);
    border-color: var(--line);
    color: var(--ink);
}

:root[data-theme="light"] input:disabled,
:root[data-theme="light"] input[type="text"]:disabled {
    background: var(--page) !important;
    color: var(--ink-muted);
}

/* The toggle itself. Deliberately plain so it reads the same in both themes. */
#theme-toggle {
    position: fixed;
    top: 14px;
    inset-inline-end: 14px;
    z-index: 100;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    border: 1px solid rgba(164, 178, 197, 0.35);
    background: rgba(255, 255, 255, 0.06);
    color: #a4b2c5;
}

#theme-toggle:hover {
    border-color: rgba(164, 178, 197, 0.7);
}

:root[data-theme="light"] #theme-toggle {
    border-color: var(--line);
    background: var(--surface);
    color: var(--ink-muted);
}