/* ==========================================================================
   Amanti.ro - stil modern, responsive (peste Bootstrap 5)
   Paleta "catifea": fundal vin inchis, accente trandafir (femei) / cer (barbati)
   ========================================================================== */

:root {
  --vin:        #2b0611;   /* fundal pagina: rosu vin, profund     */
  --catifea:    #3d0b1a;   /* suprafete / carduri                  */
  --catifea-2:  #521225;   /* hover, inputuri                       */
  --linie:      rgba(255, 200, 190, .16);
  --fildes:     #fbf1ec;   /* text principal                        */
  --fildes-2:   #d9b3b9;   /* text secundar                         */
  --trandafir:  #ff3d6e;   /* accent femei (roz intens, iese pe vin) */
  --trandafir-2:#ff7a9a;
  --cer:        #4c9bff;   /* accent barbati                        */
  --cer-2:      #82b8ff;
  --verde:      #2fb37a;
  --auriu:      #f2c14e;   /* accent brand / titluri                */
  --raza:       14px;
  --raza-mic:   8px;
  --umbra:      0 18px 40px -22px rgba(0,0,0,.85);
  --font-titlu: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-text:  'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--vin);
  background-image:
    radial-gradient(1200px 600px at 10% -10%, rgba(255,61,110,.22), transparent 60%),
    radial-gradient(900px 500px at 100% 0%, rgba(242,193,78,.12), transparent 60%),
    linear-gradient(180deg, #33081a 0%, var(--vin) 40%, #1e040c 100%);
  background-attachment: fixed;
  color: var(--fildes);
  font-family: var(--font-text);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-titlu);
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--fildes);
  line-height: 1.2;
}
h4, h5 { font-family: var(--font-text); font-weight: 700; }

a { color: var(--auriu); text-decoration: none; }
a:hover, a:focus { color: #fff; text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--cer-2);
  outline-offset: 2px;
}

img { max-width: 100%; height: auto; }
.blur { filter: blur(6px); }
figure { margin: 0; }

/* Honeypot: invizibil pentru oameni, vizibil pentru boti */
.hp-field { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 0; overflow: hidden; }

/* --------------------------------------------------------------------------
   Navigatie
   -------------------------------------------------------------------------- */
.site-nav {
  position: sticky;
  top: 0;
  z-index: 1030;
  background: rgba(43, 6, 17, .86);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--linie);
}
.site-nav .navbar { padding: .55rem 0; }
.site-nav .navbar-brand img { height: 34px; width: auto; }
.site-nav .nav-link {
  color: var(--fildes-2);
  font-weight: 600;
  padding: .55rem .9rem;
  border-radius: var(--raza-mic);
}
.site-nav .nav-link:hover, .site-nav .nav-link:focus, .site-nav .nav-link.active { color: #fff; background: var(--catifea-2); text-decoration: none; }
.site-nav .dropdown-menu {
  background: var(--catifea);
  border: 1px solid var(--linie);
  border-radius: var(--raza-mic);
  box-shadow: var(--umbra);
}
.site-nav .dropdown-item { color: var(--fildes-2); font-weight: 600; }
.site-nav .dropdown-item:hover, .site-nav .dropdown-item:focus { color: #fff; background: var(--catifea-2); }
.site-nav .navbar-toggler { border-color: var(--linie); }
.site-nav .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(246,236,240,.9)' stroke-width='2.5' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); }
.nav-exit { color: var(--trandafir-2) !important; }
@media (max-width: 991.98px) {
  .site-nav .navbar-collapse { padding: .5rem 0 1rem; }
  .site-nav .dropdown-menu { border: 0; box-shadow: none; padding-left: 1rem; background: transparent; }
}

/* --------------------------------------------------------------------------
   Layout de pagina
   -------------------------------------------------------------------------- */
.content { flex: 1 0 auto; }
.content-body { padding: 2rem 0 3rem; }
.section { padding: 1rem 0; }
.box { margin-bottom: 1.5rem; }
.container { max-width: 1180px; }

.section-title {
  font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.25rem);
  margin: 0 0 .5rem;
}
.divider {
  height: 1px;
  background: linear-gradient(90deg, var(--auriu), transparent 70%);
  margin: .75rem 0 1.5rem;
  border: 0;
}
.divider span { display: none; }
.text-light { color: var(--fildes) !important; }
.text-muted { color: var(--fildes-2) !important; }

.prose { max-width: 72ch; }
.prose u { text-decoration: none; color: var(--auriu); font-weight: 700; }

/* --------------------------------------------------------------------------
   Hero (prima pagina)
   -------------------------------------------------------------------------- */
.hero-banner {
  position: relative;
  padding: clamp(3rem, 8vw, 7rem) 0 clamp(2.5rem, 6vw, 5rem);
  text-align: center;
  overflow: hidden;
  border-bottom: 1px solid var(--linie);
}
.hero-banner::before {
  content: "";
  position: absolute; inset: 0;
  background: url('../imagini/header1.jpg') center/cover no-repeat;
  opacity: .28;
  filter: saturate(.8);
}
.hero-banner-inside { position: relative; max-width: 780px; margin: 0 auto; padding: 0 1rem; }
.banner-subtitle {
  font-family: var(--font-titlu);
  font-style: italic;
  font-size: clamp(1.1rem, 1rem + 1vw, 1.5rem);
  color: var(--auriu);
  margin-bottom: .5rem;
}
.banner-title {
  font-family: var(--font-titlu);
  font-size: clamp(2rem, 1.2rem + 4vw, 4rem);
  font-weight: 600;
  line-height: 1.08;
  margin-bottom: 1.75rem;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; }
.hero-actions .btn { padding: .8rem 1.5rem; font-size: 1.05rem; }

/* --------------------------------------------------------------------------
   Butoane
   -------------------------------------------------------------------------- */
.btn { border-radius: var(--raza-mic); font-weight: 700; padding: .55rem 1.1rem; border-width: 0; }
.btn-danger { background: var(--trandafir); }
.btn-danger:hover, .btn-danger:focus { background: var(--trandafir-2); }
.btn-primary { background: var(--cer); }
.btn-primary:hover, .btn-primary:focus { background: var(--cer-2); }
.btn-success { background: var(--verde); }
.btn-info { background: var(--cer); color: #fff; }
.btn-info:hover { background: var(--cer-2); color: #fff; }
.btn-warning { background: var(--auriu); color: #1a1208; }
.btn-dark { background: #3a2a33; }
.btn-dark:hover { background: #4d3844; }
.btn-color-3 { background: var(--trandafir); color: #fff; }
.btn-color-4 { background: var(--cer); color: #fff; }
.btn-group .btn { border-radius: var(--raza-mic); }
.btn-group { flex-wrap: wrap; gap: .35rem; }
.btn-group > .btn { flex: 1 1 auto; }
.btn-outline-secondary { border: 1px solid var(--linie); color: var(--fildes-2); }

/* --------------------------------------------------------------------------
   Grila de carduri (profile, meniu home)
   -------------------------------------------------------------------------- */
.grid-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 1.25rem;
}
@media (max-width: 480px) {
  .grid-cards { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
}

.card {
  background: var(--catifea);
  border: 1px solid var(--linie);
  border-radius: var(--raza);
  color: var(--fildes);
  box-shadow: var(--umbra);
  overflow: hidden;
}
.card .card-title { color: var(--fildes); font-size: 1.05rem; margin-bottom: .25rem; }
.card .card-text { color: var(--fildes-2); margin: 0; }
.card .varsta { color: var(--fildes-2); font-weight: 500; }
.card-actions { padding: 0 1rem 1rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.card-actions .btn { flex: 1 1 auto; position: relative; }
.bg-secondary.card, .card.bg-secondary { background: var(--catifea) !important; }

.profil-card-img { display: block; aspect-ratio: 5 / 7; overflow: hidden; background: var(--catifea-2); }
.profil-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-img-top { aspect-ratio: 5 / 7; object-fit: cover; width: 100%; }
.card.home-card .card-img-top { aspect-ratio: 16 / 10; }

.profil-logo {
  width: 100%; max-width: 300px;
  aspect-ratio: 5 / 7; object-fit: cover;
  border-radius: var(--raza);
  border: 1px solid var(--linie);
}

/* Info profil */
.info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .75rem;
  margin: 1rem 0;
}
.info-grid .info {
  background: var(--catifea);
  border: 1px solid var(--linie);
  border-radius: var(--raza-mic);
  padding: .75rem;
  text-align: center;
}
.info-grid .info b { display: block; color: var(--fildes-2); font-weight: 600; font-size: .85rem; margin-bottom: .2rem; }
.despre { background: var(--catifea); border: 1px solid var(--linie); border-radius: var(--raza); padding: 1.25rem 1.5rem; }
.despre b { color: var(--fildes-2); font-weight: 600; }

/* --------------------------------------------------------------------------
   Formulare
   -------------------------------------------------------------------------- */
.form-control, .form-select {
  background-color: var(--catifea-2);
  border: 1px solid var(--linie);
  color: var(--fildes);
  border-radius: var(--raza-mic);
  padding: .6rem .8rem;
}
.form-control:focus, .form-select:focus {
  background-color: var(--catifea-2);
  color: #fff;
  border-color: var(--cer-2);
  box-shadow: 0 0 0 .2rem rgba(61,139,255,.25);
}
.form-control::placeholder { color: var(--fildes-2); opacity: .7; }
.form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23b99ea9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px 12px;
  padding-right: 2.25rem;
}
select.form-control { appearance: auto; }
select.form-control option { background: var(--catifea); }
.form-label, .form-block h4, .form-block h5 { font-size: .95rem; font-weight: 700; margin-bottom: .35rem; color: var(--fildes); }
.form-check-input { background-color: var(--catifea-2); border-color: var(--fildes-2); }
.form-check-input:checked { background-color: var(--trandafir); border-color: var(--trandafir); }
.form-switch .form-check-input { width: 2.6em; height: 1.4em; }
.form-check-label h5 { font-size: 1rem; font-weight: 600; margin: 0; }
.form-card {
  background: var(--catifea);
  border: 1px solid var(--linie);
  border-radius: var(--raza);
  padding: 1.5rem;
  box-shadow: var(--umbra);
}
.form-card .row + .row { margin-top: .25rem; }
.captcha-box { background: rgba(233,185,73,.08); border: 1px dashed rgba(233,185,73,.4); border-radius: var(--raza-mic); padding: .75rem 1rem; }
label.error { display: block; }
label.error p { margin: .25rem 0 0; font-size: .9rem; }

.alert { border-radius: var(--raza-mic); border: 1px solid transparent; }
.alert-danger { background: rgba(224,64,94,.15); border-color: rgba(224,64,94,.4); color: #ffb3c0; }
.alert-warning { background: rgba(233,185,73,.12); border-color: rgba(233,185,73,.4); color: #f5d98a; }
.alert-success { background: rgba(47,179,122,.15); border-color: rgba(47,179,122,.4); color: #a5ecc9; }
.alert a { color: inherit; text-decoration: underline; }
.link-danger { color: #ffb3c0 !important; }
.link-warning { color: var(--auriu) !important; }
.link-success { color: #a5ecc9 !important; }
.text-danger { color: #ff8aa0 !important; }
.text-primary { color: var(--cer-2) !important; }

.table { color: var(--fildes); }
.table-dark { --bs-table-bg: var(--catifea); --bs-table-striped-bg: var(--catifea-2); --bs-table-color: var(--fildes); border-color: var(--linie); }

.badge { font-weight: 700; }

/* --------------------------------------------------------------------------
   Lista "Ce va oferim"
   -------------------------------------------------------------------------- */
.icon-list-wrapper { display: flex; gap: 1rem; align-items: flex-start; }
.icon-list-icon span {
  display: grid; place-items: center;
  width: 56px; height: 56px; flex: 0 0 56px;
  background: var(--catifea);
  border: 1px solid var(--linie);
  border-radius: 50%;
}
.icon-list-icon img { width: 28px; height: 28px; filter: invert(1) sepia(1) saturate(3) hue-rotate(310deg); }
.icon-list-details h4 { margin-bottom: .25rem; }
.icon-list-details p { color: var(--fildes-2); margin: 0; }

/* --------------------------------------------------------------------------
   Reclame / iframe-uri partenere
   -------------------------------------------------------------------------- */
.reclame { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
.reclame .card { padding: .5rem; }
.reclame iframe { display: block; max-width: 100%; }
.linkuri-partenere { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .6rem; }
.linkuri-partenere .btn { width: 100%; }

/* --------------------------------------------------------------------------
   Reguli
   -------------------------------------------------------------------------- */
.reguli ol { padding-left: 1.25rem; max-width: 80ch; }
.reguli li { margin-bottom: 1rem; color: var(--fildes-2); }
.reguli li i { color: var(--auriu); margin-right: .35rem; }

/* --------------------------------------------------------------------------
   Poze / dropzone / player
   -------------------------------------------------------------------------- */
.dropzone {
  background: var(--catifea) !important;
  border: 2px dashed var(--linie) !important;
  border-radius: var(--raza) !important;
  color: var(--fildes-2) !important;
  min-height: 140px;
}
.dropzone .dz-message { margin: 2rem 0; }
#player video { border-radius: var(--raza); background: #000; }
.album-card img { aspect-ratio: 5/7; object-fit: cover; width: 100%; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.footer {
  margin-top: auto;
  border-top: 1px solid var(--linie);
  padding: 2rem 0 1.5rem;
  color: var(--fildes-2);
  font-size: .9rem;
}
.footer-info-wrapper { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.footer-logo { height: 30px; }
.footer-links a { color: var(--fildes-2); margin-right: 1rem; }
.footer .statcounter { opacity: .5; }

/* --------------------------------------------------------------------------
   Utilitare
   -------------------------------------------------------------------------- */
.mw-form { max-width: 820px; margin: 0 auto; }
.mw-chat { max-width: 760px; margin: 0 auto; }
.paginare { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-top: 2rem; }
.paginare .btn { flex: 0 1 auto; }
.puncte-mari { font-size: 2rem; }

@media (max-width: 575.98px) {
  body { font-size: 15px; }
  .content-body { padding: 1.25rem 0 2rem; }
  .form-card { padding: 1rem; }
  .btn-group > .btn { width: 100%; }
}
