/* ═══ Skin »Klasičen« (classic) — 2026-10-16 ═════════════════════════════════════════════════════════════
   Blizu PRIVZETEMU videzu (ista lila podlaga #eef0f7, Quicksand za besedilo), le žlahtneje.
   Sorazmerno z Igrivim (isti »komplet«): kartica = obroba + tile + pisava imena + okvir slike + okrasek na vrhu + 1 ikona;
   profil = tile + pisava + sij kartic + okvir slik + lučke + zvok. Spolne žarnice kartice (box-shadow) NE spreminjamo.
   Grafika: skini/classic/ (vzorec.svg damast, okras.svg zlata vitica, ikona.svg zvezdica ✦). */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;1,500&display=swap');
@import url('luci.css');

.skin-classic {
  --cl-ozadje: #eef0f7;
  --cl-vijola: #7a4a8c;
  --cl-zlata: #c8a96a;
  --cl-besedilo: #18181b;
  --cl-besedilo-2: #6b7280;
}

/* ─── KARTICA ──────────────────────────────────────────────────────────────────────────────────────── */
.profil-kartica.skin-classic {
  position: relative;
  border: 2px solid var(--cl-zlata) !important;
  border-radius: 18px;
  background: var(--cl-ozadje) url('classic/vzorec.svg') repeat;
  background-size: 48px;
}
/* Paspartu: bel rob + tanka zlata črta okrog slike (3:4 na vrhu kartice). */
.profil-kartica.skin-classic::after {
  content: ""; position: absolute; top: 0; left: 0; right: 0; aspect-ratio: 3 / 4;
  border: 5px solid #fff; box-shadow: inset 0 0 0 1.5px var(--cl-zlata);
  pointer-events: none; z-index: 2;
}
/* Zlat okrasek na vrhu slike — mirno, brez gibanja (klasika). */
.profil-kartica.skin-classic::before {
  content: ""; position: absolute; top: 3px; left: 50%; width: 60px; height: 20px; margin-left: -30px;
  background: url('classic/okras.svg') center / contain no-repeat; pointer-events: none; z-index: 4;
}
.profil-kartica.skin-classic .profil-kartica-info {
  position: relative; padding-right: 1.7rem;
  background: rgba(255,255,255,.6); color: var(--cl-besedilo);
  border-top: 1px solid var(--cl-zlata);
}
.profil-kartica.skin-classic .profil-kartica-ime { font-family: 'Playfair Display', Georgia, serif; font-weight: 600; color: var(--cl-vijola); letter-spacing: .01em; }
.profil-kartica.skin-classic .profil-kartica-meta { color: var(--cl-besedilo-2); }
/* Animirana ikona: zlata zvezdica, ki se nežno zasveti. */
.profil-kartica.skin-classic .profil-kartica-info::after {
  content: ""; position: absolute; right: 8px; bottom: 9px; width: 15px; height: 15px;
  background: url('classic/ikona.svg') center / contain no-repeat;
  animation: cl-svetlika 3.6s ease-in-out infinite; pointer-events: none;
}

/* ─── STRAN PROFILA ────────────────────────────────────────────────────────────────────────────────── */
body.skin-classic {
  --accent: #7a4a8c; --accent-dark: #5e3570;
  background: var(--cl-ozadje) url('classic/vzorec.svg') repeat;
  background-size: 64px;
}
body.skin-classic .card {
  border: 1px solid #e3d6b6;
  border-radius: 16px;
  /* sij: stalen, topel zlat — umirjen */
  box-shadow: 0 0 0 1px rgba(200,169,106,.25), 0 0 20px -6px rgba(200,169,106,.55), 6px 6px 16px var(--shadow-dark), -6px -6px 16px var(--shadow-light);
}
body.skin-classic h2, body.skin-classic h3 { font-family: 'Playfair Display', Georgia, serif; font-weight: 600; }
body.skin-classic h2 { color: var(--cl-vijola); }
body.skin-classic .skin-foto-okvir { position: relative; display: inline-block; line-height: 0; border-radius: 10px; overflow: hidden; }
body.skin-classic .skin-foto-okvir::after {
  content: ""; position: absolute; inset: 0; border: 6px solid #fff; box-shadow: inset 0 0 0 1.5px var(--cl-zlata);
  border-radius: 10px; pointer-events: none; z-index: 2;
}
body.skin-classic .skin-foto-okvir::before {
  content: ""; position: absolute; top: 3px; left: 50%; width: 66px; height: 22px; margin-left: -33px;
  background: url('classic/okras.svg') center / contain no-repeat; pointer-events: none; z-index: 3;
}
/* Lučke: tople bele, brez žice v barvi — klasičen »fairy lights« videz. */
body.skin-classic .luc-trak::before { border-bottom-color: rgba(156,123,62,.4); }

@keyframes cl-svetlika { 0%, 100% { opacity: .55; transform: scale(.85) rotate(0deg); } 50% { opacity: 1; transform: scale(1.1) rotate(45deg); } }

@media (prefers-reduced-motion: reduce) { .skin-classic *, .skin-classic .profil-kartica-info::after { animation: none !important; } }