/* admin & login — alanus.ch */
:root{
  --paper:#F2EDE3; --paper-2:#EAE3D5; --ink:#18150F; --ink-2:#4A453B;
  --accent:#FF3B14; --accent-d:#D62A06; --line:rgba(24,21,15,.14); --line-2:rgba(24,21,15,.07);
  --serif:"Fraunces",Georgia,serif; --sans:"Bricolage Grotesque",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{ background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; -webkit-font-smoothing:antialiased; }
a{color:inherit;}

/* ---- Buttons ---- */
.btn{ font-family:var(--sans); font-size:15px; font-weight:600; cursor:pointer; border:1px solid var(--line);
  background:transparent; color:var(--ink); padding:11px 20px; border-radius:100px; transition:all .25s; display:inline-flex; align-items:center; gap:6px; }
.btn:hover{ border-color:var(--ink); }
.btn--primary{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.btn--primary:hover{ background:var(--accent); border-color:var(--accent); }
.btn--ghost{ background:transparent; }
.btn--ghost:hover{ background:var(--paper-2); }
.btn--block{ width:100%; justify-content:center; margin-top:8px; }
.btn--del{ width:38px; height:38px; padding:0; justify-content:center; border-radius:10px; font-size:20px; line-height:1; color:var(--accent-d); flex:0 0 auto; }
.btn--del:hover{ background:#fbe2db; border-color:var(--accent); }
.btn--del-lg{ color:var(--accent-d); border-color:#e7c4ba; }
.btn--del-lg:hover{ background:#fbe2db; border-color:var(--accent); }

/* ---- Login ---- */
.login-body{ min-height:100vh; display:grid; place-items:center; padding:24px;
  background:radial-gradient(1200px 600px at 70% -10%, #efe6d4, var(--paper)); }
.login-card{ width:100%; max-width:400px; background:var(--paper-2); border:1px solid var(--line); border-radius:20px; padding:42px 38px;
  box-shadow:0 30px 60px -40px rgba(24,21,15,.5); }
.login-mark{ width:52px; height:52px; display:grid; place-items:center; background:var(--ink); color:var(--paper);
  font-family:var(--serif); font-size:28px; border-radius:50%; margin-bottom:22px; }
.login-card h1{ font-family:var(--serif); font-weight:480; font-size:2rem; letter-spacing:-.02em; }
.login-sub{ color:var(--ink-2); margin:6px 0 26px; font-size:15px; }
.login-back{ display:inline-block; margin-top:22px; font-size:14px; color:var(--ink-2); }
.login-back:hover{ color:var(--accent); }
.alert{ padding:12px 16px; border-radius:10px; font-size:14px; margin-bottom:18px; }
.alert--err{ background:#fbe2db; color:var(--accent-d); border:1px solid #f0c4b9; }

/* ---- Form fields ---- */
label{ display:block; font-size:14px; font-weight:600; margin-bottom:16px; }
input[type=text],input[type=password],input[type=email],input:not([type]),textarea,select{
  width:100%; font-family:var(--sans); font-size:15px; font-weight:400; color:var(--ink);
  background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:11px 14px; margin-top:7px; transition:border-color .2s, box-shadow .2s;
}
textarea{ resize:vertical; line-height:1.5; }
input:focus,textarea:focus,select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(255,59,20,.13); }
small{ display:block; font-weight:400; color:var(--ink-2); font-size:12.5px; margin-top:5px; }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:600px){ .grid2{ grid-template-columns:1fr; } }
.check{ display:flex; align-items:center; gap:10px; font-weight:500; }
.check input{ width:auto; margin:0; }

/* ---- Admin bar ---- */
.abar{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding:16px clamp(16px,4vw,40px); background:var(--ink); color:var(--paper); position:sticky; top:0; z-index:30; }
.abar__left{ display:flex; align-items:center; gap:14px; }
.abar__mark{ width:40px; height:40px; display:grid; place-items:center; background:var(--accent); border-radius:50%; font-family:var(--serif); font-size:22px; }
.abar__left strong{ display:block; font-family:var(--serif); font-weight:500; font-size:1.1rem; }
.abar__hint{ font-size:13px; opacity:.6; }
.abar__right{ display:flex; gap:10px; }
.abar .btn--ghost{ color:var(--paper); border-color:rgba(242,237,227,.3); }
.abar .btn--ghost:hover{ background:rgba(242,237,227,.12); border-color:var(--paper); }

/* ---- Layout ---- */
.alayout{ display:grid; grid-template-columns:230px 1fr; max-width:1180px; margin:0 auto; gap:0; min-height:calc(100vh - 73px); }
.atabs{ display:flex; flex-direction:column; gap:4px; padding:28px 16px; border-right:1px solid var(--line); position:sticky; top:73px; align-self:start; }
.atab{ text-align:left; font-family:var(--sans); font-size:15px; font-weight:600; cursor:pointer; background:transparent; border:none;
  color:var(--ink-2); padding:11px 16px; border-radius:10px; transition:all .2s; }
.atab:hover{ background:var(--paper-2); color:var(--ink); }
.atab.is-active{ background:var(--ink); color:var(--paper); }
.apanel{ padding:clamp(24px,4vw,48px); }
.apane{ display:none; max-width:720px; animation:fade .4s; }
.apane.is-active{ display:block; }
@keyframes fade{ from{opacity:0; transform:translateY(8px);} to{opacity:1;transform:none;} }
.apane h2{ font-family:var(--serif); font-weight:480; font-size:1.9rem; letter-spacing:-.02em; }
.apane__lead{ color:var(--ink-2); margin:6px 0 28px; font-size:15px; }
.apane form > .btn--primary{ margin-top:8px; }
@media (max-width:780px){
  .alayout{ grid-template-columns:1fr; }
  .atabs{ position:static; flex-direction:row; flex-wrap:wrap; border-right:none; border-bottom:1px solid var(--line); padding:14px 16px; }
}

/* ---- Repeater ---- */
.repeat{ display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
.repeat__row{ display:flex; gap:10px; align-items:flex-start; }
.repeat__row input,.repeat__row textarea,.repeat__row select{ margin-top:0; }
.repeat__row--col{ flex-direction:column; background:var(--paper-2); padding:16px; border-radius:12px; border:1px solid var(--line); }
.r-xs{ max-width:90px; }
.r-sm{ max-width:130px; }
.r-sel{ max-width:150px; }

/* ---- Project list ---- */
.plist{ display:flex; flex-direction:column; gap:10px; margin-bottom:20px; }
.pitem{ display:flex; align-items:center; gap:16px; background:var(--paper-2); border:1px solid var(--line); border-radius:14px; padding:12px 16px; }
.pitem__thumb{ width:54px; height:54px; border-radius:10px; background:var(--ink); color:var(--accent); background-size:cover; background-position:center;
  display:grid; place-items:center; font-family:var(--serif); font-size:24px; flex:0 0 auto; }
.pitem__info{ flex:1; min-width:0; }
.pitem__info strong{ display:block; font-family:var(--serif); font-weight:500; font-size:1.1rem; }
.pitem__info span{ font-size:13px; color:var(--ink-2); }
.pitem__badge{ font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); background:#fbe2db; padding:4px 10px; border-radius:100px; }

/* ---- Modal ---- */
.modal{ position:fixed; inset:0; background:rgba(24,21,15,.5); backdrop-filter:blur(4px); display:none; place-items:center; z-index:60; padding:24px; }
.modal.open{ display:grid; }
.modal__box{ background:var(--paper); border-radius:20px; width:100%; max-width:620px; max-height:90vh; overflow:auto; padding:36px; position:relative; box-shadow:0 40px 80px -30px rgba(24,21,15,.6); }
.modal__box h3{ font-family:var(--serif); font-weight:480; font-size:1.6rem; margin-bottom:24px; }
.modal__close{ position:absolute; top:20px; right:20px; width:38px; height:38px; border-radius:50%; border:1px solid var(--line); background:transparent; font-size:22px; cursor:pointer; line-height:1; }
.modal__close:hover{ background:var(--paper-2); }
.modal__actions{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:18px; }

/* ---- Image field ---- */
.imgfield{ margin-bottom:16px; }
.imgfield__label{ margin-bottom:8px; }
.imgfield__row{ display:flex; gap:16px; align-items:center; }
.imgfield__preview{ width:110px; height:84px; border-radius:10px; background:var(--paper-2); border:1px dashed var(--line); background-size:cover; background-position:center;
  display:grid; place-items:center; font-size:12px; color:var(--ink-2); flex:0 0 auto; }

/* ---- Toast ---- */
.toast{ position:fixed; bottom:28px; left:50%; translate:-50% 20px; opacity:0; pointer-events:none;
  background:var(--ink); color:var(--paper); padding:14px 26px; border-radius:100px; font-weight:600; font-size:15px; z-index:80; transition:all .35s; }
.toast.show{ opacity:1; translate:-50% 0; }
.toast.err{ background:var(--accent-d); }

/* ---- additions: ok-alert, reset link, account separator ---- */
.alert--ok{ background:#e3f6ec; color:#0f7a4d; border:1px solid #bfe8d2; }
.login-forgot{ display:block; margin-top:14px; font-size:14px; font-weight:600; color:var(--accent-d); text-align:center; }
.login-forgot:hover{ text-decoration:underline; }
.apane__sep{ border:0; border-top:1px solid var(--line, #e5e0d8); margin:28px 0; }
