/*
 * WWIIONLINE CMS – globaler Formular- und Buttonstandard
 * Gilt für alle Frontend-Formulare, Inhaltsbuttons und eigenständigen Login-Formulare.
 * Navigationsschalter, Kartensteuerungen und technisch notwendige Icon-Buttons bleiben unberührt.
 */
:root {
    --cms-control-bg: #0d1511;
    --cms-control-border: #3f4a42;
    --cms-control-text: #f5f1e7;
    --cms-control-muted: #9eaaa1;
    --cms-accent: #caa34d;
    --cms-accent-hover: #ddb85f;
    --cms-danger: #8c3535;
    --cms-danger-hover: #a94444;
}

body:not(.admin-body) main :is(.community-form, .cms-form, .frontend-form, form) :is(label, .field, .form-field, .admin-field) {
    display: grid;
    gap: 8px;
    min-width: 0;
    font-weight: 700;
    color: #eef0e9;
}

body:not(.admin-body) main :is(.community-form, .cms-form, .frontend-form, form) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea),
.admin-login-body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    box-sizing: border-box;
    padding: 11px 13px;
    border: 1px solid var(--cms-control-border);
    border-radius: 8px;
    background: var(--cms-control-bg);
    color: var(--cms-control-text);
    font: 500 .94rem/1.4 Roboto, sans-serif;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

body:not(.admin-body) main textarea,
.admin-login-body textarea { min-height: 130px; resize: vertical; }

body:not(.admin-body) main :is(input, select, textarea):focus,
.admin-login-body :is(input, select, textarea):focus {
    outline: none;
    border-color: var(--cms-accent);
    box-shadow: 0 0 0 3px rgba(202,163,77,.17);
}

body:not(.admin-body) main :is(input, select, textarea):disabled,
body:not(.admin-body) main :is(input, select, textarea)[readonly],
.admin-login-body :is(input, select, textarea):disabled,
.admin-login-body :is(input, select, textarea)[readonly] {
    opacity: .72;
    cursor: not-allowed;
    background: #171d19;
}

body:not(.admin-body) main :is(input[type="checkbox"], input[type="radio"]),
.admin-login-body :is(input[type="checkbox"], input[type="radio"]) {
    width: 20px;
    height: 20px;
    accent-color: var(--cms-accent);
}

/* Einheitlicher Aktionsbutton im Frontend und in eigenständigen Formularseiten. */
body:not(.admin-body) main :is(
    .button, .btn,
    button:not(.map-control):not(.lightbox-close):not(.lightbox-prev):not(.lightbox-next),
    input[type="submit"], input[type="button"], input[type="reset"]
),
.admin-login-body :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]) {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    box-sizing: border-box;
    padding: 10px 18px;
    border: 1px solid rgba(222,184,95,.7);
    border-radius: 7px;
    background: linear-gradient(180deg, #b28a36 0%, #8f6b27 100%);
    color: #fffaf0;
    font: 700 .88rem/1 Roboto, sans-serif;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 5px 14px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.15);
    transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

body:not(.admin-body) main :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]):hover,
.admin-login-body :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]):hover {
    border-color: #efd07c;
    background: linear-gradient(180deg, #c49a40 0%, #a1792d 100%);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 7px 18px rgba(0,0,0,.29), inset 0 1px 0 rgba(255,255,255,.2);
}

body:not(.admin-body) main :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]):focus-visible,
.admin-login-body :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]):focus-visible {
    outline: 3px solid rgba(222,184,95,.34);
    outline-offset: 2px;
}

body:not(.admin-body) main :is(.button--ghost, .button.secondary, .btn.secondary, .button--secondary, .btn--secondary),
.admin-login-body :is(.button--ghost, .button.secondary, .btn.secondary, .button--secondary, .btn--secondary) {
    border-color: #59655c;
    background: linear-gradient(180deg, #263029 0%, #1a211c 100%);
    color: #f3f0e7;
}

body:not(.admin-body) main :is(.button--danger, .btn.danger, .button-danger, .btn--danger),
.admin-login-body :is(.button--danger, .btn.danger, .button-danger, .btn--danger) {
    border-color: #c36363;
    background: linear-gradient(180deg, var(--cms-danger) 0%, #652424 100%);
    color: #fff;
}

body:not(.admin-body) main :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]):disabled,
body:not(.admin-body) main :is(.button, .btn)[aria-disabled="true"],
.admin-login-body :is(.button, .btn, button, input[type="submit"], input[type="button"], input[type="reset"]):disabled {
    opacity: .5;
    pointer-events: none;
    cursor: not-allowed;
    transform: none;
}

body:not(.admin-body) main :is(.form-actions, .frontend-actions, .community-form-actions, .button-row, .actions) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

@media (max-width: 680px) {
    body:not(.admin-body) main :is(.form-actions, .frontend-actions, .community-form-actions, .button-row, .actions) > :is(.button, .btn, form) {
        flex: 1 1 100%;
    }
}
