/* ============================================================
   TS NYKAA STYLE - CSS (v2.0.1)
   Replace the file at: /wp-content/plugins/ts-nykaa-login/assets/ts-nykaa-style.css
============================================================ */

/* ---------- Modal ---------- */
.nykaa-login-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nykaa-modal-overlay { position:absolute; inset:0; background:rgba(0,0,0,0.45); }
.nykaa-modal-card {
  position: relative;
  width: 420px;
  max-width:94%;
  background:#fff;
  border-radius:12px;
  padding:22px;
  box-shadow:0 12px 40px rgba(0,0,0,0.18);
  z-index:100000;
}
.nykaa-close { position:absolute; right:12px; top:10px; border:none; background:transparent; font-size:18px; cursor:pointer; color:#666; }
.nykaa-title { margin:0 0 6px 0; font-size:20px; font-weight:700; color:#111; }
.nykaa-sub { margin:0 0 14px 0; color:#666; font-size:13px; }

/* ---------- Sign in (Nykaa pill) ---------- */
.ts-nykaa-signin {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background: linear-gradient(180deg,#ff2a6d,#ff1f68);
  color:#fff;
  padding:9px 18px;
  border-radius:18px;
  font-weight:700;
  font-size:14px;
  border:none;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(255,42,109,0.14);
  transition: transform .08s ease, box-shadow .12s ease;
}
.ts-nykaa-signin:hover { transform: translateY(-1px); box-shadow:0 10px 26px rgba(255,42,109,0.18); }
.ts-nykaa-signin:focus { outline:none; box-shadow:0 0 0 4px rgba(255,42,109,0.12); }

/* ---------- Logged-in header: flat icon + name, dropdown works ---------- */
.ts-user-menu { position:relative; display:inline-block; font-family:inherit; }

/* trigger button - flat (no grey bubble, no border) */
.ts-user-trigger {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  background:transparent;
  border:none;
  cursor:pointer;
  color:#111;
  border-radius:6px;
}

/* subtle hover */
.ts-user-trigger:hover { background: rgba(0,0,0,0.03); }

/* Icon inline — slightly larger for clarity */
.ts-user-icon-inline { display:inline-flex; align-items:center; justify-content:center; padding:0; margin:0; background:transparent; border-radius:0; }
.ts-inline-icon, .ts-user-icon-inline svg { width:20px; height:20px; display:block; }

/* name — lighter weight 300 as requested */
.ts-user-name-inline { font-size:14px; font-weight:300; color:#111; line-height:1; }

/* hide caret if present */
.ts-caret, .ts-user-trigger .ts-caret { display:none !important; }

/* ---------- Dropdown menu (still present) ---------- */
.ts-user-dropdown {
  display:none;
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  background:#fff;
  border:1px solid #eee;
  min-width:200px;
  border-radius:10px;
  box-shadow:0 14px 40px rgba(18,18,18,0.08);
  padding:6px 0;
  z-index:99999;
}
.ts-ud-link { display:block; padding:10px 14px; font-size:14px; color:#333; text-decoration:none; }
.ts-ud-link:hover { background:#f7f7f7; }

/* ---------- SVG path color control ---------- */
.ts-custom-path { fill:#222 !important; transition: fill .12s ease; }

/* ---------- Visibility rules ---------- */
body.logged-in .ts-nykaa-signin { display:none !important; }
body:not(.logged-in) .ts-user-menu { display:none !important; }

/* ---------- Accessibility tweaks ---------- */
.ts-user-trigger { -webkit-tap-highlight-color: transparent; }
.ts-nykaa-signin { -webkit-tap-highlight-color: transparent; }

/* ---------- Responsive ---------- */
@media (max-width:640px) {
  .ts-user-name-inline { display:none; }
  .ts-user-trigger { padding:6px; }
  .ts-nykaa-signin { padding:7px 12px; font-size:13px; border-radius:14px; }
}