/* =========================================================================
   ROOTED, functional layer: buttons variants, modals, toasts, auth pages,
   loading & empty states. Reuses the tokens from style.css.
   ========================================================================= */

/* Button variants */
.btn--ghost{background:var(--paper);color:var(--moss);box-shadow:var(--sh);border:1px solid var(--line)}
.btn--ghost:hover{background:var(--sand)}
.btn--danger{background:var(--terra-d)}
.btn--danger:hover{background:#8f4f34}
.btn--block{width:100%;justify-content:center}
.btn:disabled{opacity:.6;cursor:default}

/* ---- Toasts ---- */
.toast-wrap{position:fixed;right:18px;bottom:18px;z-index:1000;display:flex;flex-direction:column;gap:.5rem}
.toast{background:var(--moss);color:var(--cream);padding:.7rem 1rem;border-radius:var(--r-sm);box-shadow:var(--sh-h);
  font-size:.88rem;font-weight:600;opacity:0;transform:translateY(10px);transition:.25s;max-width:320px}
.toast.is-in{opacity:1;transform:none}
.toast--ok{background:var(--olive-d)}
.toast--err{background:var(--terra-d)}

/* ---- Modal ---- */
.modal-overlay{position:fixed;inset:0;z-index:900;background:rgba(45,40,25,.45);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  display:grid;place-items:center;padding:1.2rem;animation:fade .18s ease}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-h);
  width:min(480px,100%);max-height:90vh;overflow:auto;animation:pop .2s ease}
.modal--sm{width:min(380px,100%)}
@keyframes pop{from{transform:translateY(12px) scale(.98);opacity:.6}to{transform:none;opacity:1}}
.modal__head{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 1.3rem;border-bottom:1px solid var(--line)}
.modal__head h2{font-family:var(--display);font-weight:700;font-size:1.2rem;color:var(--ink)}
.modal__x{border:0;background:none;font-size:1.6rem;line-height:1;color:var(--muted);cursor:pointer;padding:0 .2rem}
.modal__x:hover{color:var(--ink)}
.modal__body{padding:1.3rem}
.modal__body.form{max-width:none}
.modal__body textarea{width:100%;font:inherit;font-size:.95rem;color:var(--ink);background:var(--cream);border:1px solid var(--line);border-radius:var(--r-sm);padding:.6rem .8rem;min-height:80px;resize:vertical}
.modal__foot{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.2rem}
.confirm__msg{font-size:.96rem;color:var(--ink);line-height:1.45}

/* ---- Auth pages ---- */
.auth{min-height:100vh;display:grid;place-items:center;padding:1.5rem;
  background:#c9d6bd url("../img/theme/bg_greenhouse.png") center/cover fixed}
.auth__card{width:min(420px,100%);background:rgba(251,247,237,.96);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--sh-h);padding:2rem 2rem 2.2rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.auth__brand{display:flex;align-items:center;gap:.6rem;justify-content:center;margin-bottom:.4rem}
.auth__brand img{width:36px;height:36px}
.auth__brand span{font-family:var(--display);font-weight:800;font-size:1.6rem;color:var(--moss)}
.auth__title{font-family:var(--display);font-weight:700;font-size:1.5rem;color:var(--ink);text-align:center;margin-bottom:.2rem}
.auth__sub{text-align:center;color:var(--muted);font-size:.9rem;margin-bottom:1.5rem}
.auth__err{background:var(--terra-soft);color:var(--terra-d);border-radius:var(--r-sm);padding:.6rem .8rem;
  font-size:.85rem;font-weight:600;margin-bottom:1rem;display:none}
.auth__err.is-on{display:block}
.auth__alt{text-align:center;font-size:.88rem;color:var(--muted);margin-top:1.2rem}
.auth__alt a{color:var(--terra);font-weight:600}
.auth__demo{text-align:center;font-size:.78rem;color:var(--muted);margin-top:.8rem;line-height:1.5}

/* ---- Loading & empty states ---- */
.is-loading{opacity:.5;pointer-events:none}
.skeleton{background:linear-gradient(90deg,var(--sand),var(--sand-d),var(--sand));background-size:200% 100%;
  animation:shimmer 1.2s infinite;border-radius:var(--r-sm)}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
.empty{grid-column:1/-1;text-align:center;padding:2.5rem 1rem;color:var(--muted)}
.empty img{width:120px;height:120px;object-fit:contain;opacity:.9;margin-bottom:.8rem}
.empty h3{font-family:var(--display);font-weight:700;font-size:1.2rem;color:var(--ink);margin-bottom:.3rem}
.empty p{font-size:.9rem;margin-bottom:1.1rem}

/* clickable card actions */
.plant{position:relative}
.plant__del{position:absolute;top:8px;right:8px;z-index:5;width:30px;height:30px;border-radius:50%;border:0;
  background:rgba(251,247,237,.92);color:var(--terra-d);cursor:pointer;font-size:1rem;line-height:1;
  box-shadow:var(--sh);opacity:0;transition:.18s}
.plant:hover .plant__del{opacity:1}
.plant__del:hover{background:var(--terra-d);color:#fff}
.check.is-done{background:var(--olive);border-color:var(--olive)}
.check.is-done::after{content:"✓";color:#fff;font-size:.8rem;display:grid;place-items:center;height:100%}
.wtask{cursor:default}
.species .plant{cursor:default}
.week-nav{display:flex;align-items:center;gap:.6rem}
.week-nav button{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--paper);
  color:var(--moss);cursor:pointer;font-size:1rem;box-shadow:var(--sh)}
.week-nav button:hover{background:var(--sand)}

/* Today's digest preview (Settings) */
.digest__hint{color:var(--muted);font-size:.82rem;margin:-.2rem 0 .6rem}
.digest__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.digest__row{display:flex;align-items:flex-start;gap:.7rem;padding:.6rem .7rem;background:var(--cream);
  border:1px solid var(--line);border-radius:var(--r-sm)}
.digest__row .ico{width:22px;height:22px;object-fit:contain;flex:0 0 auto;margin-top:.1rem}
.digest__row strong{display:block;font-weight:600;font-size:.9rem;color:var(--ink)}
.digest__row small{display:block;color:var(--muted);font-size:.8rem;margin-top:.1rem;line-height:1.4}
.digest__loading{color:var(--muted);font-size:.85rem;list-style:none}