body{background:#0f172a;color:#e5e7eb;font-family:system-ui}
.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center}
.auth-card{background:#020617;border:1px solid #1e293b;border-radius:24px;width:100%;max-width:420px;padding:32px}
.auth-title{font-size:26px;font-weight:800;text-align:center;margin-bottom:20px}
.auth-input{width:100%;padding:18px;border-radius:14px;border:1px solid #334155;background:#020617;color:white;margin-bottom:14px}
.auth-btn{width:100%;padding:18px;border-radius:14px;border:0;color:#ffffff;background:#2563eb;font-weight:800}
/* Safari iOS form text fix */
input, select, textarea, button{
  font-size:16px !important;
  -webkit-text-size-adjust:100%;
  -webkit-appearance:none;
  appearance:none;
}

.auth-input, .auth-btn{
  font-size:18px !important;
  color:#ffffff !important;
}

input, select, textarea, button{
  -webkit-text-size-adjust:100%;
}

.auth-link{
  text-align:center;
  font-size:15px;            /* mărimea textului */
           /* culoare text */
  margin-top:16px;
  font-weight:500;
  
}

.auth-link a{
 text-decoration:none !important;
  color:#3b82f6;             /* culoare link */
  font-weight:700;
  margin-left:6px;
}

.auth-link a:hover{
  color:#60a5fa;             /* hover */
 text-decoration:none !important;
}


.pw-wrap{
  position:relative;
}

.pw-wrap input{
  padding-right:56px;
}

.pw-eye{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  background:none;
  border:0;
  padding:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  height:24px;
  width:24px;
}

.pw-eye svg{
  width:22px;
  height:22px;
  stroke:#94a3b8;
  fill:none;
  stroke-width:2;
}
.pw-eye.open svg{
  stroke:#ef4444;
}

.ui-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.6);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:1000;
}

.ui-modal-card{
  position:relative;              /* CRITICAL */
  background:#020617;
  border:1px solid #1e293b;
  border-radius:20px;
  padding:28px 26px 26px;
  max-width:340px;
  width:90%;
  text-align:center;
}

.ui-modal-close{
  position:absolute;
  right:14px;
  top:12px;
  cursor:pointer;
  font-size:18px;
  color:#ef4444;
}


.pw-hint{
  position:absolute;
  left:14px;
  bottom:8px;
  font-size:11px;
  color:#64748b;
    background: #020617;
  pointer-events:none;
}


.modal-btn{
  background:#2563eb;
  color:white;
  padding:10px 16px;
  border-radius:10px;
  text-decoration:none;
  font-weight:700;
}
.modal-btn.alt{
  background:#020617;
  border:1px solid #334155;
}



/* =========================
   Cloudflare Turnstile
   ========================= */

.turnstile-wrap{
  width:100%;
  margin:4px 0 18px auto; 
  border-radius:14px;
  overflow:hidden;
  background:#FAFAFA;


  /* 🔑 cheie pentru aliniere */
  display:flex;
 justify-content:flex-end;  /* ALINIERE DREAPTA */
}

/* iframe-ul injectat de Cloudflare */
.turnstile-wrap iframe{
  width:300px !important;     /* lățimea nativă Turnstile */
  min-height:68px;
  border:0;
  display:block;
  background:#FAFAFA;
}
/* =========================
   Cloudflare Turnstile – Dark Mask
   ========================= */

.turnstile-wrap{
  position:relative;          /* NECESAR pt overlay */
}

/* masca vizuală */
.turnstile-wrap::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0, 0, 0, 0.30);  /* dark mask subtil */
  pointer-events:none;           /* NU blochează click */
  border-radius:14px;            /* IDENTIC cu containerul */
}




.brand-center{
  width:100%;
  max-width:420px;          /* EXACT ca auth-card */
  display:flex;
  justify-content:center;

  margin-bottom:-24px;      /* 🔑 TRAGE LOGO-UL PESTE CARD */
  z-index:10;
}

.auth-card{
  position:relative;
  z-index:1;
}

/* ===== TIPSOFY LOGO – DOT + TEXT (CORECT) ===== */
.brand-tipsofy-text{
  display:inline-flex;
  align-items:center;
  gap:4px;
  text-decoration:none;

  font-weight:900;
  font-size:40px;
  letter-spacing:0.34em;
  color:#e5e7eb;
  text-transform:uppercase;
  line-height:1;

  /* 🔑 corecție de centrare optică */
  padding-left: 0.100em;

  text-shadow:
    0 10px 14px rgba(85, 134, 240, 0.35),
    0 0 28px rgba(37,99,235,.25);
}

/* sfera albastră */
.brand-dot{
  width:14px;
  height:14px;
  border-radius:50%;
  background:radial-gradient(
    circle at 30% 30%,
    #93c5fd,
    #2563eb 60%,
    #1e40af
  );
  box-shadow:
    0 10px 12px rgba(37,99,235,.6),
    0 0 22px rgba(37,99,235,.35);

  flex-shrink:0;
  margin-right:-8px;
  transform: translateY(10px);
}
.auth-card{
  position:relative;
}

.brand-center{
  position:absolute;
  top:-80px;
  left:50%;
  transform:translateX(-50%);
  z-index:10;
}

/* ===== DATE OF BIRTH ===== */

.dob-block{
  margin-bottom:14px;
}

.dob-label{
  display:block;
  font-size:13px;
  color:#94a3b8;
  margin:0 0 6px 6px;
}

.dob-wrap{
  display:flex;
  gap:10px;
}

.dob-wrap .auth-input{
  flex:1;
}


/* ===== COUNTRY SELECT (FIXED) ===== */

.country-select{
  position:relative;
  margin-bottom:14px;
  z-index:20;
}

/* câmpul vizibil – IDENTIC cu auth-input */
.country-display{
  display:flex;
  align-items:center;
  gap:12px;

  width:100%;
  padding:18px;
  border-radius:14px;
  border:1px solid #334155;
  background:#020617;
  color:white;
  cursor:pointer;
  box-sizing:border-box;
}

.country-display .placeholder{
color:white  !important;
  font-size: 18px !important;

}

.placeholder{
color:white  !important;
  font-size: 18px !important;

}

/* dropdown */
.country-dropdown{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% + 6px);

  background:#020617;
  border:1px solid #334155;
  border-radius:14px;
  display:none;
  z-index:50;
}

/* deschis */
.country-select.open .country-dropdown{
  display:block;
}

/* search */
.country-search{
  width:100%;
  padding:14px;
  border:0;
  border-bottom:1px solid #334155;
  background:#020617;
  color:white;
  outline:none;
  box-sizing:border-box;
}

/* listă */
.country-list{
  max-height:240px;
  overflow-y:auto;
}

/* item */
.country-item{
  display:flex;
  align-items:center;
  gap:12px;

  padding:12px 16px;
  cursor:pointer;
}

/* hover */
.country-item:hover{
  background:#1e293b;
}

/* STEAGURI – FIX IMPORTANT */
.country-item .flag,
.country-display .flag{
  width:22px;
  height:16px;
  object-fit:cover;
  flex-shrink:0;
  display:block;
}

.account-card{
  max-width: 1100px;
  margin: 0 auto;
}

.account-header{
  margin-bottom: 24px;
}

.account-form .form-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:20px;
}

@media(max-width:900px){
  .account-form .form-grid{
    grid-template-columns:1fr;
  }
}

.form-actions{
  margin-top:32px;
}

/* =========================================
   COUNTRY SELECT – COLLAPSE BY DEFAULT
   ========================================= */

/* dropdown-ul TREBUIE ascuns implicit */
.country-dropdown{
  display: none !important;
}

/* se deschide DOAR când JS pune .open */
.country-select.open .country-dropdown{
  display: block !important;
}