/* ===========================================================================
   AdventureNET — micro-interacțiuni globale
   ---------------------------------------------------------------------------
   Fișier: platforma/assets/core/micro.css
   Developer: Negoiță Andreea Iuliana
   Context: Proiect de licență

   Rolul fișierului:
   Un singur strat de reacții mărunte, aplicat peste toate paginile: cardurile
   se ridică la treceri cu mouse-ul, butoanele au o dâră de lumină, imaginile
   din anunțuri se apropie ușor, câmpurile de formular primesc un inel de
   lumină la focus. Toate folosesc variabilele temei active, deci se
   recolorează singure odată cu tema.

   Reguli respectate:
     - doar `transform`, `opacity`, `box-shadow` și `filter` — proprietăți pe
       care browserul le animează pe placa video, fără să re-așeze pagina;
     - nimic nu se mișcă singur, totul e reacție la utilizator;
     - `prefers-reduced-motion` oprește tot.
   =========================================================================== */

/* ---------------------------------------------------------------------------
   1. Tranziții de bază
   --------------------------------------------------------------------------- */

a,
button,
.btn,
.card,
input,
select,
textarea {
  transition:
    transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 260ms ease,
    border-color 180ms ease,
    background-color 180ms ease,
    color 180ms ease,
    filter 220ms ease;
}

/* ---------------------------------------------------------------------------
   2. Carduri — se ridică spre lumină
   --------------------------------------------------------------------------- */

.property-card:hover,
.destination-card:hover,
.feature-card:hover,
.blog-card:hover,
.stat-card:hover,
.pricing-card:hover,
[class*="card"]:not(.card-header):not(.card-body):not(.card-foot):not(td):hover {
  /* Selector larg, intenționat prudent: doar ridicare și umbră, nimic care să
     schimbe dimensiunea sau așezarea. */
  transform: translateY(-3px);
}

.property-card:hover,
.destination-card:hover,
.blog-card:hover {
  box-shadow:
    0 14px 34px rgba(var(--shadow-color, 0, 0, 0), 0.35),
    0 0 22px rgba(var(--color-primary-rgb, 79, 124, 255), 0.14);
}

/* Fotografia din card se apropie ușor, cadru rămânând fix. */
.property-card img,
.destination-card img,
.blog-card img {
  transition: transform 600ms cubic-bezier(0.22, 1, 0.36, 1);
}
.property-card:hover img,
.destination-card:hover img,
.blog-card:hover img {
  transform: scale(1.045);
}

/* ---------------------------------------------------------------------------
   3. Butoane
   --------------------------------------------------------------------------- */

.btn:not(:disabled):hover {
  transform: translateY(-1px);
}
.btn:not(:disabled):active {
  transform: translateY(0);
  transition-duration: 80ms;
}

.btn-primary:not(:disabled):hover {
  box-shadow:
    0 6px 18px rgba(var(--color-primary-rgb, 79, 124, 255), 0.35),
    var(--glow-primary, 0 0 22px rgba(79, 124, 255, 0.32));
}

/* ---------------------------------------------------------------------------
   4. Legături — subliniere care crește din stânga
   --------------------------------------------------------------------------- */

.footer-links a,
.nav-link {
  position: relative;
}
.footer-links a::after,
.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1.5px;
  background: currentColor;
  opacity: 0.75;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}
.footer-links a:hover::after,
.nav-link:hover::after {
  transform: scaleX(1);
}

/* ---------------------------------------------------------------------------
   5. Formulare — inel de lumină la focus
   --------------------------------------------------------------------------- */

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
  border-color: var(--color-primary, #4f7cff);
  box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb, 79, 124, 255), 0.22);
}

/* Butoanele și legăturile păstrează inelul de focus vizibil la tastatură. */
a:focus-visible,
button:focus-visible,
.btn:focus-visible {
  outline: 2px solid var(--color-primary, #4f7cff);
  outline-offset: 2px;
}

/* ---------------------------------------------------------------------------
   6. Pictograme și avataruri
   --------------------------------------------------------------------------- */

.nav-icon,
.btn .icon,
.social-btn-v2 svg {
  transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}
a:hover > .nav-icon,
.btn:hover .icon,
.social-btn-v2:hover svg {
  transform: translateY(-1px) scale(1.08);
}

/* ---------------------------------------------------------------------------
   7. Mai puțină mișcare — totul se oprește
   --------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  a, button, .btn, .card, input, select, textarea,
  .property-card img, .destination-card img, .blog-card img,
  .footer-links a::after, .nav-link::after,
  .nav-icon, .btn .icon, .social-btn-v2 svg {
    transition: none !important;
  }
  .property-card:hover, .destination-card:hover, .feature-card:hover,
  .blog-card:hover, .btn:hover {
    transform: none !important;
  }
}

/* ---------------------------------------------------------------------------
   8. Mascota din antet — retrasă
   ---------------------------------------------------------------------------
   După eliminarea butonului „Intră în cont", mascota GIF rămânea singură în
   colțul din dreapta al antetului, decupată pe jumătate — arăta ca un element
   rupt, nu ca o decorațiune. Antetul se încheie acum curat, cu navigarea.
   --------------------------------------------------------------------------- */
.navbar-mascot { display: none !important; }

/* ---------------------------------------------------------------------------
   9. Subsolul — strat „wow" unificat
   ---------------------------------------------------------------------------
   Aplicat global peste subsolul existent al fiecărei pagini, ca toate să fie
   la fel fără să atingem 37 de fișiere HTML:
     - dâra tricoloră pe muchia de sus, în aceleași nuanțe ca numele animat
       din antet — cele două capete ale paginii se leagă vizual;
     - butoanele sociale devin plăci cu degradeul rețelei respective la hover,
       cu ridicare și umbră colorată.
   --------------------------------------------------------------------------- */

.main-footer {
  position: relative;
}

.main-footer::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg,
    #4f7cff 0%,  #4f7cff 26%,
    #fbc116 37%, #fbc116 63%,
    #e0242e 74%, #e0242e 100%);
  background-size: 200% 100%;
  animation: tricolor-margine 9s linear infinite;
  opacity: 0.85;
}

@keyframes tricolor-margine {
  from { background-position: 0% 0; }
  to   { background-position: 200% 0; }
}

/* Butoanele sociale: plăci rotunjite, fiecare cu degradeul rețelei ei. */
.social-btn-v2 {
  position: relative;
  overflow: hidden;
  width: 50px;
  height: 50px;
  border-radius: 12px;
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 300ms ease,
              color 200ms ease;
}
.social-btn-v2::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 260ms ease;
}
.social-btn-v2.facebook::before  { background: linear-gradient(135deg, #1877f2, #0a5dc7); }
.social-btn-v2.instagram::before { background: linear-gradient(135deg, #f58529, #dd2a7b 55%, #8134af); }
.social-btn-v2.youtube::before   { background: linear-gradient(135deg, #ff4e45, #c4302b); }
.social-btn-v2.linkedin::before  { background: linear-gradient(135deg, #0a66c2, #084b8f); }

/* Icoanele sociale, mărite odată cu butoanele. */
.social-btn-v2 svg { width: 23px; height: 23px; }

.social-btn-v2:hover {
  transform: translateY(-4px) scale(1.08);
  color: #fff;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.4),
              0 0 18px rgba(var(--color-primary-rgb, 79, 124, 255), 0.25);
}
.social-btn-v2:hover::before { opacity: 1; }
.social-btn-v2 svg { position: relative; z-index: 1; }

/* Logo-ul din subsol respiră discret, ca emblema din antet. */
.footer-logo-v2 .logo-footer-wow { animation: logo-plutire 7s ease-in-out infinite; }

/* Titlurile coloanelor din subsol primesc un accent din paletă. */
.footer-v2 h4,
.footer-v2 .footer-col-title {
  position: relative;
  padding-bottom: 0.35rem;
}
.footer-v2 h4::after,
.footer-v2 .footer-col-title::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 26px; height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--color-primary, #4f7cff), var(--color-secondary, #a78bfa));
}

@media (prefers-reduced-motion: reduce) {
  .main-footer::before,
  .footer-logo-v2 .logo-footer-wow { animation: none !important; }
  .social-btn-v2:hover { transform: none !important; }
}

/* ---------------------------------------------------------------------------
   10. Unificarea paletei — detaliile care leagă totul
   ---------------------------------------------------------------------------
   Lucrurile mărunte pe care ochiul le observă fără să le numească: bara de
   derulare, culoarea selecției de text, inelul de focus, cardurile cu aceeași
   sticlă. Toate iau culorile din tema activă, deci rămân corecte și dacă
   utilizatorul își alege altă temă din selector.
   --------------------------------------------------------------------------- */

/* Bara de derulare, în paleta temei */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--color-bg, #0a0f1e); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg,
    var(--color-primary, #4f7cff),
    var(--color-secondary, #a78bfa));
  border-radius: 6px;
  border: 2px solid var(--color-bg, #0a0f1e);
}
::-webkit-scrollbar-thumb:hover { background: var(--color-primary-hover, #6089ff); }
* { scrollbar-color: var(--color-primary, #4f7cff) var(--color-bg, #0a0f1e); scrollbar-width: thin; }

/* Selecția de text */
::selection {
  background: rgba(var(--color-primary-rgb, 79, 124, 255), 0.35);
  color: var(--color-text, #e8edf8);
}

/* Etichetele „badge" primesc micul degradeu al temei. */
.badge,
[class*="badge-"]:not(input):not(select) {
  transition: transform 200ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 220ms ease;
}
.badge:hover { transform: translateY(-1px); }

/* Titlurile mari de secțiune capătă accentul temei, discret. */
.section-header h2,
.section-title {
  position: relative;
}

/* Cardurile de proprietăți: chenar viu în culoarea temei la hover. */
.property-card:hover,
.destination-card:hover {
  border-color: rgba(var(--color-primary-rgb, 79, 124, 255), 0.5);
}

/* Butoanele primare: degradeul temei în loc de o culoare plată. */
.btn-primary {
  background-image: linear-gradient(120deg,
    var(--color-primary, #4f7cff),
    var(--color-secondary, #a78bfa));
  border-color: transparent;
}
.btn-primary:hover {
  background-image: linear-gradient(120deg,
    var(--color-primary-hover, #6089ff),
    var(--color-secondary, #a78bfa));
}

/* Câmpul mare de căutare de pe prima pagină: aprindere la focus. */
.search-bar:focus-within,
.hero-search:focus-within {
  box-shadow: 0 0 0 3px rgba(var(--color-primary-rgb, 79, 124, 255), 0.25),
              0 18px 44px rgba(0, 0, 0, 0.4);
}