/* ============================================================
   Carlos Veedla fotograafia — stiililehe (tume, kinolik)
   Tume taust, soe merevaigukollane aktsent, kuldsed tärnid.
   ============================================================ */
:root{
  --bg:      #0c0d10;   /* lehe taust */
  --bg-2:    #101218;
  --card:    #15171d;   /* pinnad / kaardid */
  --card-2:  #1c1f27;   /* sisendid / hover */
  --ink:     #ecebe8;   /* põhitekst (soe valge) */
  --ink-soft:#9b9da6;   /* teisene tekst */
  --line:    #292c34;   /* õhukesed jooned */
  --accent:  #e0b15a;   /* merevaigukollane aktsent */
  --accent-dk:#c9974a;
  --gold:    #f3bd45;   /* hinnangu tärnid */
  --danger:  #d96a60;
  --shadow:  0 1px 2px rgba(0,0,0,.5), 0 16px 40px rgba(0,0,0,.45);
  --radius:  14px;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  background-image:radial-gradient(1200px 620px at 50% -8%, #181b22 0%, var(--bg) 62%);
  background-attachment:fixed;
  color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
img{max-width:100%;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}

.wrap{width:min(1100px,92vw);margin-inline:auto}
.main{padding:32px 0 64px}

/* ---------------- Päis / navigatsioon ---------------- */
.site-header{
  border-bottom:1px solid var(--line);
  background:rgba(12,13,16,.72);
  position:sticky;top:0;z-index:20;
  backdrop-filter:saturate(140%) blur(10px);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;flex-wrap:wrap}
.brand-name{
  font-family:"Fraunces",Georgia,serif;
  font-weight:500;font-size:clamp(1.1rem,3.4vw,1.4rem);letter-spacing:.3px;color:var(--ink)
}
.brand:hover{text-decoration:none}
.nav{display:flex;gap:22px}
.nav a{color:var(--ink-soft);font-weight:500;font-size:.95rem;padding:4px 0;position:relative}
.nav a:hover{color:var(--ink);text-decoration:none}
.nav a.is-active{color:var(--ink)}
.nav a.is-active::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--accent);border-radius:2px
}

/* ---------------- Sissejuhatus ---------------- */
.intro{text-align:center;padding:40px 0 12px}
.intro-title{
  font-family:"Fraunces",Georgia,serif;
  font-weight:500;font-size:clamp(2rem,5.5vw,3.2rem);
  margin:0 0 10px;letter-spacing:.4px;line-height:1.1
}
.intro-tagline{color:var(--ink-soft);margin:0;font-size:1.05rem}

/* ---------------- Filtri nupud ---------------- */
.filters{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:28px 0 30px}
.chip{
  border:1px solid var(--line);background:var(--card);color:var(--ink-soft);
  padding:6px 15px;border-radius:999px;font-size:.9rem;font-weight:500;transition:.15s
}
.chip:hover{text-decoration:none;border-color:var(--accent);color:var(--ink)}
.chip.is-active{background:var(--accent);border-color:var(--accent);color:#15161a}

/* ---------------- Galerii ruudustik ---------------- */
.grid{
  display:grid;gap:18px;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr))
}
.card{
  appearance:none;border:1px solid var(--line);background:var(--card);
  border-radius:var(--radius);overflow:hidden;cursor:pointer;
  text-align:left;padding:0;font:inherit;color:inherit;
  box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
  display:flex;flex-direction:column
}
.card:hover{transform:translateY(-4px);border-color:#3a3d46;
  box-shadow:0 10px 22px rgba(0,0,0,.55),0 26px 60px rgba(0,0,0,.5)}
.card:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.card-media{display:block;aspect-ratio:4/3;background:#000;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease,opacity .3s ease;opacity:.96}
.card:hover .card-media img{transform:scale(1.05);opacity:1}
.card-body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:3px}
.card-title{font-family:"Fraunces",Georgia,serif;font-weight:500;font-size:1.05rem;color:var(--ink)}
.card-meta{font-size:.85rem;color:var(--ink-soft)}
.star{color:var(--gold)}
.muted{color:var(--ink-soft)}

.empty{text-align:center;padding:70px 0;color:var(--ink-soft)}

/* ---------------- Nupud ---------------- */
.btn{
  display:inline-block;border:1px solid var(--line);background:var(--card-2);
  color:var(--ink);padding:9px 16px;border-radius:10px;font:inherit;font-weight:500;
  cursor:pointer;transition:.15s;text-align:center
}
.btn:hover{text-decoration:none;border-color:var(--accent);color:var(--ink)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#15161a;font-weight:600}
.btn-primary:hover{background:var(--accent-dk);border-color:var(--accent-dk);color:#15161a}
.btn-danger{background:transparent;border-color:var(--danger);color:var(--danger)}
.btn-danger:hover{background:var(--danger);color:#15161a}
.btn-sm{padding:6px 11px;font-size:.85rem;border-radius:8px}

/* ---------------- Suurendusvaade (lightbox) ---------------- */
.lightbox{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}
.lightbox[hidden]{display:none}
.lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.82)}
.lightbox-panel{
  position:relative;z-index:1;background:var(--card);border:1px solid var(--line);
  border-radius:16px;overflow:hidden;width:min(960px,100%);max-height:92vh;
  display:flex;flex-direction:column;box-shadow:0 40px 100px rgba(0,0,0,.7)
}
@media(min-width:760px){.lightbox-panel{flex-direction:row}}
.lightbox-img-wrap{background:#000;display:flex;align-items:center;justify-content:center;flex:1 1 auto;min-height:0}
.lightbox-img-wrap img{max-width:100%;max-height:60vh;object-fit:contain}
@media(min-width:760px){.lightbox-img-wrap img{max-height:92vh}}
.lightbox-info{padding:24px;flex:0 0 300px;overflow-y:auto;background:var(--card)}
.lightbox-close{
  position:absolute;top:10px;right:12px;z-index:2;border:none;background:rgba(0,0,0,.55);
  color:#fff;width:38px;height:38px;border-radius:50%;font-size:1.5rem;line-height:1;cursor:pointer
}
.lightbox-close:hover{background:rgba(0,0,0,.8)}
.lb-title{font-family:"Fraunces",Georgia,serif;font-weight:500;font-size:1.5rem;margin:0 0 4px;color:var(--ink)}
.lb-category{color:var(--ink-soft);margin:0 0 18px;font-size:.9rem}

/* ---------------- Hinnangu tärnid ---------------- */
.rate{border-top:1px solid var(--line);padding-top:16px}
.rate-label{font-weight:600;margin:0 0 10px;font-size:.95rem;color:var(--ink)}
.stars{display:flex;flex-wrap:wrap;gap:4px}
.stars button{
  border:none;background:none;cursor:pointer;padding:2px;font-size:1.7rem;line-height:1;
  color:#41454f;transition:color .1s,transform .1s
}
.stars button:hover{transform:scale(1.14)}
.stars button.on{color:var(--gold);text-shadow:0 0 10px rgba(243,189,69,.45)}
.stars button:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.rate-status{margin:12px 0 0;font-size:.9rem;color:var(--ink-soft);min-height:1.2em}

/* ---------------- Teated ---------------- */
.flash{padding:12px 16px;border-radius:10px;margin-bottom:20px;font-weight:500}
.flash-ok{background:#15241a;color:#bfe3c4;border:1px solid #2c4d33}
.flash-err{background:#2a1614;color:#f0b8b0;border:1px solid #5a2f2a}

/* ---------------- Vormid / paneelid ---------------- */
.panel{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;margin-bottom:26px;box-shadow:var(--shadow)
}
.panel h2{font-family:"Fraunces",Georgia,serif;font-weight:500;margin:0 0 18px;font-size:1.35rem;color:var(--ink)}
.stack-form{display:flex;flex-direction:column;gap:16px;max-width:540px}
.stack-form label,.inline-form label{display:flex;flex-direction:column;gap:6px;font-weight:500;font-size:.92rem;color:var(--ink)}
input[type=text],input[type=password],input[type=file],select,textarea{
  font:inherit;color:var(--ink);background:var(--card-2);
  border:1px solid var(--line);border-radius:10px;padding:10px 12px;width:100%
}
input::placeholder,textarea::placeholder{color:#6a6d76}
input[type=file]{padding:8px}
input[type=file]::file-selector-button{
  background:var(--card);color:var(--ink);border:1px solid var(--line);
  border-radius:8px;padding:6px 12px;margin-right:10px;cursor:pointer;font:inherit
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(224,177,90,.22)}
textarea{resize:vertical}
select{appearance:none}
.two-col{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:560px){.two-col{grid-template-columns:1fr 1fr}}
.inline-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:18px}
.inline-form input[type=text]{width:auto;min-width:200px;flex:1}
.row-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.checkbox{flex-direction:row;align-items:center;gap:8px;font-weight:400}
.checkbox input{width:auto}

/* ---------------- Sisselogimine ---------------- */
.login-card{
  max-width:380px;margin:56px auto;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)
}
.login-card h1{font-family:"Fraunces",Georgia,serif;font-weight:500;margin:0 0 6px;color:var(--ink)}
.login-card form{display:flex;flex-direction:column;gap:16px;margin-top:20px}

/* ---------------- Haldus ---------------- */
.admin-tabs{display:flex;gap:6px;margin-bottom:24px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.admin-tabs a{padding:10px 16px;color:var(--ink-soft);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px}
.admin-tabs a:hover{color:var(--ink);text-decoration:none}
.admin-tabs a.is-active{color:var(--ink);border-bottom-color:var(--accent)}
.admin-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.admin-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg-2);display:flex;flex-direction:column}
.admin-card img{aspect-ratio:4/3;object-fit:cover;width:100%;background:#000}
.admin-card-body{padding:12px;display:flex;flex-direction:column;gap:4px;font-size:.9rem}
.admin-card-body strong{font-size:1rem;color:var(--ink)}
.cat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;max-width:480px}
.cat-list li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg-2)}
.cat-list form{margin:0}
.edit-layout{display:grid;gap:24px;grid-template-columns:1fr}
@media(min-width:680px){.edit-layout{grid-template-columns:260px 1fr}}
.edit-preview img,.author-current img{border-radius:10px;border:1px solid var(--line)}
.author-current{display:flex;align-items:center;gap:14px}
.author-current img{width:90px;height:90px;object-fit:cover}

/* ---------------- Minust / autori leht ---------------- */
.author{display:grid;gap:32px;grid-template-columns:1fr;align-items:start;max-width:820px;margin-inline:auto;padding-top:16px}
@media(min-width:680px){.author{grid-template-columns:220px 1fr}}
.author-photo img{border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow);width:100%;object-fit:cover}
.author-name{font-family:"Fraunces",Georgia,serif;font-weight:500;font-size:2rem;margin:0 0 14px;color:var(--ink)}
.author-bio p{margin:0 0 14px}

/* ---------------- Jalus ---------------- */
.site-footer{border-top:1px solid var(--line);margin-top:40px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;padding:20px 0;color:var(--ink-soft);font-size:.9rem}
.site-footer a{color:var(--ink-soft)}
.site-footer a:hover{color:var(--ink)}

/* ---------------- Vähendatud liikumine ---------------- */
@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}
