/* TraWi guest auth — full-screen landing (entry) + modal popup (deep links) */
body:has(#trawiLanding),body:has(#trawiGate){overflow:hidden}

#trawiLanding,#trawiGate{
    --teal:#1F7A6B;--teal-dark:#14655A;--creme:#FBF1D9;--sand:#F2E6C7;--ink:#2C2722;--line:#ECE4D5;
    font-family:"DM Sans",system-ui,sans-serif;
    position:fixed;inset:0;z-index:99999;
}

/* ---------- Landing (split screen) ---------- */
#trawiLanding{display:flex;background:var(--creme)}
.trawi-landing-brand{
    flex:1;display:flex;flex-direction:column;justify-content:center;gap:18px;
    padding:8vh 6vw;color:#fff;
    background:radial-gradient(120% 120% at 0% 0%,#2a9684 0%,var(--teal) 45%,var(--teal-dark) 100%);
}
.trawi-landing-logo{height:60px;width:auto;align-self:flex-start;
    filter:brightness(0) invert(1)}
.trawi-landing-brand h1{font-family:"Fraunces",Georgia,serif;font-size:clamp(30px,3.4vw,52px);
    line-height:1.08;margin:0;font-weight:600}
.trawi-landing-brand p{font-size:clamp(15px,1.3vw,19px);line-height:1.5;max-width:30ch;opacity:.92;margin:0}
.trawi-landing-auth{flex:0 0 46%;max-width:560px;display:flex;align-items:center;justify-content:center;padding:6vh 5vw}

/* ---------- Modal (deep link) ---------- */
#trawiGate{display:flex;align-items:center;justify-content:center;padding:20px;
    background:rgba(28,24,20,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.trawi-gate-card{width:100%;max-width:430px;background:#fff;border-radius:22px;
    padding:30px 30px 26px;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.35);
    max-height:92vh;overflow:auto}
.trawi-gate-logo{height:54px;width:auto;margin-bottom:6px}
.trawi-gate-card>h2{font-family:"Fraunces",Georgia,serif;font-size:22px;margin:0 0 16px;color:var(--ink);font-weight:600}

/* ---------- Auth card (shared, holds the login module) ---------- */
.trawi-auth-card{width:100%;max-width:380px;margin:0 auto;text-align:left}
.trawi-landing-auth .trawi-auth-card{background:#fff;border-radius:22px;padding:32px 30px;
    box-shadow:0 12px 44px rgba(44,39,34,.12)}

/* Style the embedded Contao login module */
.trawi-auth-card form,.trawi-auth-card .mod_login{margin:0}
.trawi-auth-card h1,.trawi-auth-card h2,.trawi-auth-card h3{font-family:"Fraunces",Georgia,serif;
    font-size:22px;margin:0 0 14px;color:var(--ink);font-weight:600}
.trawi-auth-card .widget{margin-bottom:14px}
.trawi-auth-card label{display:block;margin-bottom:5px;font-size:13px;color:#6b6258}
.trawi-auth-card input:not([type=checkbox]):not([type=radio]):not([type=submit]){
    width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid var(--line);
    border-radius:12px;font:inherit;font-size:15px;background:var(--creme);color:var(--ink);outline:0}
.trawi-auth-card input:focus{border-color:var(--teal)}
#trawiGate .trawi-auth-card select,#trawiLanding .trawi-auth-card select{
    width:100%;box-sizing:border-box;padding:12px 38px 12px 14px;border:1px solid var(--line);
    border-radius:12px;font:inherit;font-size:15px;height:48px;line-height:normal;
    background-color:var(--creme);color:var(--ink);outline:0;
    -webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%236b6258' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 14px center}
#trawiGate .trawi-auth-card select:focus,#trawiLanding .trawi-auth-card select:focus{border-color:var(--teal)}
.trawi-auth-card button,.trawi-auth-card input[type=submit],.trawi-auth-card .submit{
    width:100%;box-sizing:border-box;padding:13px;border:0;border-radius:30px;
    background:var(--teal);color:#fff;font:inherit;font-size:15px;font-weight:600;cursor:pointer;margin-top:4px}
.trawi-auth-card button:hover,.trawi-auth-card input[type=submit]:hover{background:var(--teal-dark)}
.trawi-auth-card a{color:var(--teal);font-size:14px;text-decoration:none}
.trawi-auth-card a:hover{text-decoration:underline}

.trawi-auth-divider{display:flex;align-items:center;gap:12px;color:#9a9087;font-size:13px;margin:16px 0}
.trawi-auth-divider::before,.trawi-auth-divider::after{content:"";flex:1;height:1px;background:var(--line)}
.trawi-gate-btn{display:block;width:100%;box-sizing:border-box;padding:13px 18px;border-radius:30px;
    text-decoration:none;text-align:center;font-size:15px;font-weight:600}
.trawi-gate-register{background:#fff;color:var(--teal);border:1px solid var(--teal)}
.trawi-gate-register:hover{background:var(--creme)}

@media(max-width:820px){
    #trawiLanding{flex-direction:column;overflow:auto}
    .trawi-landing-brand{padding:48px 28px 36px}
    .trawi-landing-auth{flex:none;max-width:none;width:100%;padding:28px 20px 48px}
}

/* ---------- Popup views (login / register / password) ---------- */
.trawi-gate-view{display:none}
#trawiGate[data-view="login"] .trawi-gate-view[data-gate-view="login"],
#trawiGate[data-view="register"] .trawi-gate-view[data-gate-view="register"],
#trawiGate[data-view="password"] .trawi-gate-view[data-gate-view="password"]{display:block}
.trawi-gate-view>h2{font-family:"Fraunces",Georgia,serif;font-size:22px;margin:0 0 16px;color:var(--ink);font-weight:600;text-align:center}
/* register/password buttons rendered as <button> now — keep outline style */
.trawi-auth-card button.trawi-gate-register{background:#fff;color:var(--teal);border:1px solid var(--teal);margin-top:0}
.trawi-auth-card button.trawi-gate-register:hover{background:var(--creme)}
.trawi-gate-link{display:block;margin:16px auto 0;background:none;border:0;cursor:pointer;
    font:inherit;font-size:14px;color:#6b6258;padding:4px}
.trawi-gate-link strong{color:var(--teal)}
.trawi-gate-link:hover strong{text-decoration:underline}
/* De-duplicate: popup has its own headlines + switch buttons, so hide the
   module-internal ones ("Login"/"Registration" h2, "Noch kein Konto?",
   "Schon ein Konto?"). Keep "Passwort vergessen?" (only switcher to that view). */
#trawiGate .trawi-auth-card h1,
#trawiGate .trawi-auth-card h2,
#trawiGate .trawi-auth-card h3{display:none}
#trawiGate [data-gate-view="login"] .trawi-auth-card a[href*="regist"],
#trawiGate [data-gate-view="register"] .trawi-auth-card a[href*="login"]{display:none}

/* embedded registration module can be long — card scrolls (max-height set above) */
.trawi-gate-view .mod_registration table,.trawi-gate-view .mod_registration tbody{display:block;width:100%}

/* Compact registration: two fields per row; e-mail, captcha + submit full width */
#trawiGate[data-view="register"] .trawi-gate-card{max-width:640px}
#trawiGate [data-gate-view="register"] .trawi-auth-card{max-width:564px}
#trawiGate [data-gate-view="register"] .mod_registration{max-width:none;padding:0}
#trawiGate [data-gate-view="register"] .formbody{
    display:grid;grid-template-columns:1fr 1fr;column-gap:12px;padding:20px}
#trawiGate [data-gate-view="register"] .widget{margin-bottom:12px;min-width:0}
#trawiGate [data-gate-view="register"] .widget:has(input[type=email]),
#trawiGate [data-gate-view="register"] .widget-captcha,
#trawiGate [data-gate-view="register"] .widget-checkbox,
#trawiGate [data-gate-view="register"] .widget-explanation,
#trawiGate [data-gate-view="register"] .widget-submit{grid-column:1/-1}
#trawiGate [data-gate-view="register"] .widget-submit{margin-bottom:0}

/* iOS Safari: prevent focus auto-zoom */
@media(max-width:820px){
    #trawiGate input,#trawiGate select,#trawiGate textarea,
    #trawiLanding input,#trawiLanding select{font-size:16px!important}
}
