/* Dedicated PESO administration sign-in experience. */
body.auth-page--admin[data-peso-page='admin-login'] {
    --admin-forest: #073f30;
    --admin-forest-deep: #041d17;
    --admin-forest-soft: #0b5a42;
    --admin-gold: #f2c94c;
    --admin-gold-strong: #ffd86a;
    --admin-slate: #14251f;
    --admin-line-dark: rgba(255, 255, 255, .15);
    --role-accent: var(--admin-gold);
    --role-accent-soft: rgba(242, 201, 76, .13);
    --showcase-start: var(--admin-forest-deep);
    --showcase-end: var(--admin-forest);
    background:
        radial-gradient(circle at 12% 12%, rgba(16, 141, 91, .18), transparent 26rem),
        radial-gradient(circle at 92% 86%, rgba(242, 201, 76, .12), transparent 25rem),
        linear-gradient(145deg, #06140f, #0a2119) !important;
}

html[data-theme='light'] body.auth-page--admin[data-peso-page='admin-login'] {
    --role-accent: #8a6200;
    --role-accent-soft: #fff3c9;
    background:
        radial-gradient(circle at 10% 12%, rgba(8, 116, 67, .12), transparent 27rem),
        radial-gradient(circle at 92% 88%, rgba(207, 154, 0, .10), transparent 25rem),
        linear-gradient(145deg, #e5f0e9, #f7faf8) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-background::before {
    opacity: .18;
    background-image:
        linear-gradient(rgba(104, 160, 134, .15) 1px, transparent 1px),
        linear-gradient(90deg, rgba(104, 160, 134, .15) 1px, transparent 1px);
    background-size: 56px 56px;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-toolbar {
    min-height: 82px;
}

body.auth-page--admin[data-peso-page='admin-login'] :is(.auth-back-link, .auth-theme-toggle) {
    border-radius: 13px;
    box-shadow: 0 10px 30px rgba(1, 14, 9, .10);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-toolbar-brand {
    padding: 7px 13px 7px 8px;
    background: color-mix(in srgb, var(--auth-surface) 82%, transparent);
    border: 1px solid var(--auth-line);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(1, 14, 9, .10);
    backdrop-filter: blur(18px);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-toolbar-brand img {
    border-color: var(--admin-gold);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-shell,
html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] main.auth-shell {
    width: min(calc(100% - 40px), 1210px) !important;
    max-width: 1210px !important;
    min-height: min(650px, calc(100dvh - 148px));
    grid-template-columns: minmax(0, 1.1fr) minmax(410px, .9fr);
    margin-top: 12px !important;
    border-color: color-mix(in srgb, var(--auth-line) 82%, var(--admin-gold));
    border-radius: 28px;
    box-shadow: 0 34px 100px rgba(0, 0, 0, .31);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase {
    padding: clamp(38px, 4.8vw, 66px);
    background:
        linear-gradient(115deg, rgba(255, 255, 255, .035), transparent 42%),
        radial-gradient(circle at 92% 9%, rgba(242, 201, 76, .23), transparent 19rem),
        linear-gradient(145deg, var(--admin-forest-deep), var(--admin-forest));
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .2;
    background-image:
        linear-gradient(rgba(255, 255, 255, .13) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .13) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(135deg, transparent 10%, #000 62%, transparent);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase::after {
    right: -126px;
    bottom: -126px;
    width: 330px;
    height: 330px;
    border-color: rgba(242, 201, 76, .26);
    box-shadow: 0 0 0 44px rgba(242, 201, 76, .045), 0 0 0 88px rgba(255, 255, 255, .025);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-logo-frame {
    background: linear-gradient(145deg, var(--admin-gold-strong), #ffffff);
    box-shadow: 0 18px 38px rgba(0, 0, 0, .32);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-role-badge {
    color: #fff !important;
    background: rgba(2, 24, 17, .44);
    border-color: rgba(242, 201, 76, .38);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-role-badge i,
body.auth-page--admin[data-peso-page='admin-login'] .auth-eyebrow,
body.auth-page--admin[data-peso-page='admin-login'] .auth-trust-note i {
    color: var(--admin-gold-strong) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase-copy {
    margin-top: clamp(34px, 5vh, 54px);
}

html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] #showcaseTitle {
    max-width: 12.5ch;
    color: #ffffff !important;
    font-size: clamp(2.45rem, 4.15vw, 4.05rem) !important;
    line-height: 1.01 !important;
    letter-spacing: -.058em !important;
}

html body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase-copy > p:last-child {
    max-width: 50ch;
    color: #d9eee5 !important;
    margin-top: 17px;
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 28px;
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid li {
    min-width: 0;
    min-height: 118px;
    padding: 15px;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 11px;
    color: #fff !important;
    background: rgba(255, 255, 255, .075);
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 16px;
    backdrop-filter: blur(10px);
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid li > i {
    width: 30px;
    height: 30px;
    color: var(--admin-gold-strong) !important;
    background: rgba(242, 201, 76, .11);
    border: 1px solid rgba(242, 201, 76, .18);
    border-radius: 9px;
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid li span {
    display: grid;
    gap: 4px;
    min-width: 0;
}

html body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid strong {
    color: #fff !important;
    font-size: .76rem;
    line-height: 1.3;
}

html body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid small {
    color: #bdd7cc !important;
    font-size: .64rem;
    font-weight: 560;
    line-height: 1.45;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-trust-note {
    padding-top: 28px;
    color: #c7ddd4 !important;
    line-height: 1.45;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-trust-note span {
    display: grid;
    gap: 2px;
}

html body.auth-page--admin[data-peso-page='admin-login'] .auth-trust-note strong {
    color: #fff !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-form-panel {
    position: relative;
    padding: clamp(34px, 4.4vw, 58px);
    background:
        radial-gradient(circle at 100% 0, color-mix(in srgb, var(--role-accent-soft) 62%, transparent), transparent 15rem),
        var(--auth-surface);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-form-panel::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--admin-forest-soft), var(--admin-gold));
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-form-wrap {
    max-width: 420px;
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-form-marker {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-form-icon {
    margin: 0;
    color: var(--role-accent);
    border-radius: 14px;
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-secure-state {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--auth-success);
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

body.auth-page--admin[data-peso-page='admin-login'] .admin-secure-state i {
    color: #1dbd74;
    font-size: .42rem;
    filter: drop-shadow(0 0 5px rgba(29, 189, 116, .7));
}

html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] #loginTitle {
    color: var(--auth-ink) !important;
    font-size: clamp(1.85rem, 3vw, 2.45rem) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-kicker {
    color: var(--auth-accent) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-form {
    margin-top: 27px;
    gap: 18px;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-field label {
    color: var(--auth-ink) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-input-wrap {
    min-height: 55px;
    border-radius: 13px;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-input-wrap input {
    height: 53px;
    color: var(--auth-ink) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-input-wrap input::placeholder {
    color: color-mix(in srgb, var(--auth-muted) 78%, transparent) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-submit {
    min-height: 55px;
    color: #fff !important;
    background: linear-gradient(135deg, #087443, #0b9560);
    border-color: #0a7f4e;
    border-radius: 13px;
    box-shadow: 0 15px 30px rgba(8, 116, 67, .28);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-submit:hover {
    color: #fff !important;
    box-shadow: 0 18px 36px rgba(8, 116, 67, .36);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-security-note {
    color: var(--auth-muted) !important;
    background: color-mix(in srgb, var(--auth-surface-soft) 92%, transparent);
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-security-note strong {
    color: var(--auth-ink) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-security-note i {
    color: var(--role-accent) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-message--error {
    color: var(--auth-error) !important;
}

body.auth-page--admin[data-peso-page='admin-login'] .auth-footer a {
    color: var(--auth-accent) !important;
}

@media (max-width: 1020px) {
    body.auth-page--admin[data-peso-page='admin-login'] .auth-shell,
    html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] main.auth-shell {
        max-width: 760px !important;
        grid-template-columns: minmax(0, 1fr);
    }

    body.auth-page--admin[data-peso-page='admin-login'] .auth-form-panel { order: 1; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase { order: 2; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-form-wrap { max-width: 560px; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase-copy { margin-top: 34px; }
    html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] #showcaseTitle { max-width: 16ch; }
}

@media (max-width: 680px) {
    body.auth-page--admin[data-peso-page='admin-login'] .auth-toolbar { min-height: 74px; }

    body.auth-page--admin[data-peso-page='admin-login'] .auth-shell,
    html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] main.auth-shell {
        width: min(calc(100% - 24px), 760px) !important;
        margin-top: 8px !important;
        border-radius: 22px;
    }

    body.auth-page--admin[data-peso-page='admin-login'] .auth-form-panel { padding: 34px 26px; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase { padding: 34px 26px; }
    body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid { grid-template-columns: minmax(0, 1fr); }
    body.auth-page--admin[data-peso-page='admin-login'] .admin-capability-grid li { min-height: 0; flex-direction: row; }
}

@media (max-width: 430px) {
    body.auth-page--admin[data-peso-page='admin-login'] .auth-back-link span { font-size: 0; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-back-link span::after { content: 'Portal'; font-size: .78rem; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-form-panel { padding: 30px 20px; }
    body.auth-page--admin[data-peso-page='admin-login'] .auth-showcase { padding: 30px 20px; }
    body.auth-page--admin[data-peso-page='admin-login'] .admin-secure-state { font-size: .6rem; }
    html body.peso-product-ui.auth-page--admin[data-peso-page='admin-login'] #showcaseTitle { font-size: 2.2rem !important; }
}

@media (prefers-reduced-motion: reduce) {
    body.auth-page--admin[data-peso-page='admin-login'] * {
        scroll-behavior: auto !important;
    }
}
