/* Client portal + admin — reuses the brand tokens from styles.css */
:root{
  --cream:#f6f1ea; --sand:#e9dfd2; --clay:#c9a88b; --taupe:#8a7565;
  --ink:#3a322c; --soft-ink:#6b6058; --white:#fffdfa; --shadow:rgba(58,50,44,.10);
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:'Jost',sans-serif;background:var(--cream);color:var(--ink);
  font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased;min-height:100vh;
}
h1,h2,h3{font-family:'Fraunces',serif;font-weight:300;line-height:1.15}
a{color:inherit}
img{display:block;max-width:100%}

.portal-nav{
  display:flex;justify-content:space-between;align-items:center;
  padding:1.3rem 2.4rem;border-bottom:1px solid var(--sand);background:var(--white);
}
.portal-nav .logo{font-family:'Fraunces',serif;font-size:1.3rem}
.portal-nav .logo em{font-style:italic;color:var(--taupe)}
.portal-nav-actions{display:flex;gap:1.4rem;align-items:center;font-size:.78rem;
  text-transform:uppercase;letter-spacing:.12em}
.linkbtn{background:none;border:none;cursor:pointer;font:inherit;color:var(--soft-ink);
  text-transform:uppercase;letter-spacing:.12em;font-size:.78rem}
.linkbtn:hover{color:var(--ink)}

.wrap{max-width:1100px;margin:0 auto;padding:3rem 2.4rem 5rem}
.eyebrow{text-transform:uppercase;letter-spacing:.32em;font-size:.7rem;color:var(--taupe);font-weight:400}
.page-title{font-size:clamp(2rem,5vw,3rem);margin:.4rem 0 2rem}

/* Auth card */
.auth-shell{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:2rem}
.auth-card{background:var(--white);border:1px solid var(--sand);border-radius:18px;
  padding:3rem 2.6rem;max-width:420px;width:100%;box-shadow:0 24px 60px var(--shadow);text-align:center}
.auth-card h1{font-size:1.9rem;margin-bottom:.3rem}
.auth-card p.sub{color:var(--soft-ink);font-size:.95rem;margin-bottom:2rem}
label{display:block;text-align:left;font-size:.72rem;text-transform:uppercase;
  letter-spacing:.14em;color:var(--taupe);margin:0 0 .4rem}
input,select{width:100%;padding:.85rem 1rem;border:1px solid var(--sand);border-radius:10px;
  background:var(--cream);font:inherit;color:var(--ink);margin-bottom:1.2rem}
input:focus,select:focus{outline:none;border-color:var(--clay)}
.btn{display:inline-block;width:100%;padding:.9rem 1.4rem;border:none;border-radius:40px;
  background:var(--clay);color:var(--white);font:inherit;font-size:.82rem;letter-spacing:.12em;
  text-transform:uppercase;cursor:pointer;transition:background .3s}
.btn:hover{background:var(--taupe)}
.btn[disabled]{opacity:.5;cursor:default}
.btn-ghost{background:none;border:1px solid var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--white)}
.msg{font-size:.88rem;margin-top:1rem;min-height:1.2em}
.msg.err{color:#a8443a}
.msg.ok{color:#4f7a4a}

/* Galleries */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.6rem}
.gallery-card{background:var(--white);border:1px solid var(--sand);border-radius:14px;
  overflow:hidden;cursor:pointer;transition:transform .3s,box-shadow .3s}
.gallery-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px var(--shadow)}
.gallery-card .cover{aspect-ratio:3/4;background:var(--sand);overflow:hidden}
.gallery-card .cover img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.gallery-card .meta{padding:1.1rem 1.2rem}
.gallery-card .meta h3{font-size:1.25rem}
.gallery-card .meta .date{font-size:.78rem;color:var(--taupe);letter-spacing:.08em}

/* Photo grid */
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.8rem;margin-top:1.6rem}
.photo{position:relative;aspect-ratio:1;background:var(--sand);border-radius:8px;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover;cursor:zoom-in}

/* Lightbox — click a photo to view it full size */
.lightbox{position:fixed;inset:0;background:rgba(26,22,18,.93);display:none;
  align-items:center;justify-content:center;z-index:1000;cursor:zoom-out;padding:2rem}
.lightbox.open{display:flex}
.lightbox img{max-width:96vw;max-height:92vh;object-fit:contain;border-radius:4px;
  box-shadow:0 30px 90px rgba(0,0,0,.6)}
.lb-close{position:absolute;top:.8rem;right:1.6rem;color:#fff;font-size:2.6rem;line-height:1;
  cursor:pointer;font-family:Arial,Helvetica,sans-serif;opacity:.85}
.lb-close:hover{opacity:1}
.photo a.dl{position:absolute;right:.5rem;bottom:.5rem;background:rgba(40,33,27,.78);color:#fff;
  font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;padding:.35rem .6rem;border-radius:30px;opacity:0;transition:opacity .25s}
.photo:hover a.dl{opacity:1}
/* Touch devices have no hover — always show the Download button so it's tappable */
@media(hover:none){.photo a.dl{opacity:1}}

.toolbar{display:flex;gap:1rem;flex-wrap:wrap;align-items:flex-end;margin-bottom:2rem}
.toolbar .field{flex:1;min-width:160px}
.toolbar input,.toolbar select{margin-bottom:0}
.toolbar .btn{width:auto}
.back{background:none;border:none;cursor:pointer;font:inherit;color:var(--taupe);
  letter-spacing:.1em;font-size:.8rem;margin-bottom:1rem}

.card{background:var(--white);border:1px solid var(--sand);border-radius:14px;padding:1.8rem;margin-bottom:1.8rem}
.card h2{font-size:1.4rem;margin-bottom:1.2rem}
.empty{color:var(--soft-ink);font-style:italic;padding:2rem 0}
.member-row{display:flex;justify-content:space-between;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--sand);font-size:.92rem}
.member-row:last-child{border-bottom:none}
.tag{display:inline-block;background:var(--sand);color:var(--soft-ink);font-size:.68rem;
  letter-spacing:.08em;text-transform:uppercase;padding:.2rem .55rem;border-radius:20px;margin-left:.5rem}

@media(max-width:640px){
  .wrap{padding:2rem 1.3rem 4rem}
  .portal-nav{padding:1.1rem 1.3rem}
}