
:root{--rosa:#F4A7B9;--rosa-pill:#FADADF;--marino:#2D3070;--marino2:#3D4A8A;--marino-dark:#232860;--gris:#6B7280;--texto:#1a1a2e;--blanco:#fff;--verde:#2E7D52}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;color:var(--texto);overflow-x:hidden;background-image:linear-gradient(160deg,#FADADF 0%,#F9C5D0 15%,#F6CDD6 30%,#F3C2CE 45%,#F5D0D8 60%,#F8D8DF 75%,#FAD5DC 90%,#F6C8D2 100%);background-attachment:fixed;min-height:100vh}

/* NAVBAR */
.navbar{background:rgba(255,255,255,0.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(244,167,185,0.25);padding:0 clamp(16px,5vw,56px);display:flex;align-items:center;height:70px;position:sticky;top:0;z-index:200}
.logo-area{display:flex;align-items:center;margin-right:auto}
.logo-circle{width:52px;height:52px;border-radius:50%;border:2px solid var(--rosa);background:white;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.logo-circle img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.nav-center{display:flex;align-items:center;gap:4px;list-style:none;margin-left:auto}
.nav-center a{font-size:14px;font-weight:500;color:var(--marino);text-decoration:none;padding:7px 18px;border-radius:30px;transition:all .2s}
.nav-center a.active{background:var(--marino);color:white;font-weight:600}
.nav-center a:hover:not(.active){background:rgba(244,167,185,0.2)}
.nav-right{display:flex;align-items:center;gap:8px;margin-left:16px}
.nav-icon{width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(244,167,185,0.4);background:rgba(255,255,255,0.7);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;position:relative;font-size:15px;text-decoration:none;color:var(--marino)}
.nav-icon:hover{border-color:var(--rosa);background:rgba(255,255,255,0.95)}
.cart-n{position:absolute;top:-4px;right:-4px;width:18px;height:18px;border-radius:50%;background:var(--marino);color:white;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center}
.ham{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;border:none;background:transparent;margin-left:12px}
.ham span{display:block;width:22px;height:1.5px;background:var(--marino);border-radius:2px;transition:all .3s}
.ham.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.ham.open span:nth-child(2){opacity:0}
.ham.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:150}
.drawer{position:fixed;top:70px;right:-100%;width:min(300px,88vw);height:calc(100vh - 70px);background:rgba(255,245,248,0.97);z-index:200;padding:28px 20px;transition:right .3s ease;border-left:1px solid rgba(244,167,185,0.3);overflow-y:auto;backdrop-filter:blur(12px)}
.drawer.open{right:0}
.drawer ul{list-style:none;display:flex;flex-direction:column;gap:2px}
.drawer ul a{display:block;padding:12px 16px;font-size:15px;font-weight:500;color:var(--marino);text-decoration:none;border-radius:10px;transition:all .2s}
.drawer ul a:hover{background:rgba(244,167,185,0.25)}
.drawer-cart{display:flex;align-items:center;justify-content:space-between;margin-top:14px;background:var(--marino);color:white;padding:12px 16px;border-radius:10px;font-size:15px;font-weight:600;text-decoration:none}

/* PAGE */
.page-wrap{min-height:calc(100vh - 70px);display:flex;align-items:center;justify-content:center;padding:clamp(32px,5vw,64px) clamp(16px,4vw,32px)}
.account-card{background:rgba(255,255,255,0.88);backdrop-filter:blur(16px);border-radius:24px;border:1px solid rgba(244,167,185,0.25);width:100%;max-width:480px;overflow:hidden;box-shadow:0 24px 64px rgba(244,167,185,0.2)}

/* LOGO TOP */
.card-top{padding:32px 40px 0;text-align:center}
.card-logo{width:72px;height:72px;border-radius:50%;border:2px solid var(--rosa);background:white;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;overflow:hidden}
.card-logo img{width:100%;height:100%;object-fit:cover}
.card-brand{font-family:'Great Vibes',cursive;font-size:32px;color:var(--marino);margin-bottom:4px}
.card-subtitle{font-size:12px;color:var(--gris);font-weight:300}

/* TABS */
.tabs{display:grid;grid-template-columns:1fr 1fr;margin:24px 40px 0;background:rgba(244,167,185,0.15);border-radius:12px;padding:4px;gap:4px}
.tab-btn{padding:10px;border:none;border-radius:9px;font-family:'Jost',sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;background:transparent;color:var(--gris)}
.tab-btn.active{background:var(--marino);color:white}

/* FORM */
.form-wrap{padding:24px 40px 36px}
.tab-panel{display:none}
.tab-panel.active{display:block}
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:12px;font-weight:600;color:var(--marino);margin-bottom:6px;letter-spacing:.3px}
.form-group input{width:100%;padding:12px 16px;border-radius:12px;border:1.5px solid rgba(244,167,185,0.4);background:rgba(255,255,255,0.8);font-family:'Jost',sans-serif;font-size:14px;color:var(--texto);outline:none;transition:border-color .2s}
.form-group input:focus{border-color:var(--rosa);background:white}
.form-group input::placeholder{color:rgba(107,114,128,0.6)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-check{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.form-check input[type=checkbox]{width:16px;height:16px;accent-color:var(--marino);cursor:pointer}
.form-check label{font-size:12px;color:var(--gris);cursor:pointer;line-height:1.5}
.form-check label a{color:var(--marino);font-weight:500}
.btn-submit{width:100%;background:var(--marino);color:white;border:none;border-radius:30px;padding:14px;font-family:'Jost',sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:all .2s;letter-spacing:.3px;margin-bottom:16px}
.btn-submit:hover{background:var(--marino2);transform:translateY(-1px)}
.form-divider{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.form-divider hr{flex:1;border:none;border-top:1px solid rgba(244,167,185,0.3)}
.form-divider span{font-size:11px;color:var(--gris);font-weight:400}
.btn-social{width:100%;background:rgba(255,255,255,0.8);color:var(--texto);border:1.5px solid rgba(244,167,185,0.35);border-radius:30px;padding:12px;font-family:'Jost',sans-serif;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:10px}
.btn-social:hover{border-color:var(--rosa);background:white}
.forgot-link{display:block;text-align:center;font-size:12px;color:var(--marina,#2D3070);text-decoration:none;margin-top:8px;opacity:.7;transition:opacity .2s}
.forgot-link:hover{opacity:1}
.switch-text{text-align:center;font-size:12px;color:var(--gris);margin-top:16px}
.switch-text a{color:var(--marino);font-weight:600;text-decoration:none}

/* BENEFITS */
.benefits{background:rgba(244,167,185,0.1);padding:20px 40px;border-top:1px solid rgba(244,167,185,0.2)}
.benefits-title{font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--marino);margin-bottom:12px}
.benefits-list{list-style:none;display:flex;flex-direction:column;gap:8px}
.benefits-list li{display:flex;align-items:center;gap:8px;font-size:12px;color:#3a3a5c;font-weight:300}
.benefits-list li::before{content:'✦';color:var(--rosa);font-size:10px;flex-shrink:0}

/* FOOTER */
.footer{background:var(--marino-dark);color:rgba(255,255,255,.75);padding:clamp(32px,4vw,48px) clamp(16px,5vw,56px) clamp(20px,3vw,28px)}
.ft-bottom{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.35);font-weight:300;flex-wrap:wrap;gap:8px}
.woo span{color:var(--rosa);font-weight:600}

/* RESPONSIVE */
@media(max-width:640px){
  .nav-center,.nav-right{display:none}
  .ham{display:flex}
  .card-top{padding:24px 24px 0}
  .tabs{margin:20px 24px 0}
  .form-wrap{padding:20px 24px 28px}
  .benefits{padding:16px 24px}
  .form-row{grid-template-columns:1fr}
  .account-card{border-radius:18px}
}
@media(max-width:380px){
  .page-wrap{padding:16px}
  .card-brand{font-size:26px}
}

@media(max-width:1024px){body{-webkit-text-size-adjust:100%}}


/* ================================================================
   CUENTA — WordPress + WooCommerce overrides
   ================================================================ */
.page-template-page-cuenta .site-content,
.page-template-page-cuenta #content,
.page-template-page-cuenta #primary,
.page-template-page-cuenta #main,
.page-template-page-cuenta .entry-content,
.page-template-page-cuenta article {
  padding: 0 !important; margin: 0 !important;
  max-width: 100% !important; width: 100% !important;
}
.page-template-page-cuenta h1.entry-title,
.page-template-page-cuenta .entry-header { display: none !important; }

/* ── Formulario DreamyGlobes ── */
.dg-form { width: 100% !important; }
.dg-form .form-group {
  margin-bottom: 16px !important;
}
.dg-form label {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #2D3070 !important;
  letter-spacing: 0.3px !important;
  display: block !important;
  margin-bottom: 6px !important;
}
.dg-form .required { color: #F4A7B9 !important; }
.dg-form .input-text,
.dg-form input[type="email"],
.dg-form input[type="password"],
.dg-form input[type="text"] {
  width: 100% !important;
  padding: 12px 16px !important;
  border-radius: 14px !important;
  border: 1.5px solid rgba(244,167,185,0.35) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  color: #1a1a2e !important;
  background: rgba(255,255,255,0.8) !important;
  outline: none !important;
  transition: border-color .2s !important;
  box-sizing: border-box !important;
}
.dg-form .input-text:focus,
.dg-form input:focus {
  border-color: #F4A7B9 !important;
  background: white !important;
}
.dg-form .form-check {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  margin-bottom: 12px !important;
}
.dg-form .form-check label,
.dg-form .form-check span {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  color: #6B7280 !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
}
.dg-form .form-check a { color: #2D3070 !important; font-weight: 500 !important; }
.dg-form .form-check input[type="checkbox"] {
  width: 16px !important; height: 16px !important;
  margin-top: 2px !important; flex-shrink: 0 !important;
  accent-color: #2D3070 !important;
}
.dg-btn-submit {
  width: 100% !important;
  background: #2D3070 !important;
  color: white !important;
  border: none !important;
  border-radius: 30px !important;
  padding: 14px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all .2s !important;
  margin-top: 8px !important;
  margin-bottom: 16px !important;
  display: block !important;
}
.dg-btn-submit:hover {
  background: #3D4A8A !important;
  transform: translateY(-1px) !important;
}
.register-notes {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  color: #6B7280 !important;
  font-weight: 300 !important;
  text-align: center !important;
  padding: 8px 0 !important;
  font-style: italic !important;
}

/* ── Forgot link & switch text ── */
.forgot-link {
  display: block !important;
  text-align: center !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #6B7280 !important;
  text-decoration: none !important;
  margin-bottom: 12px !important;
  transition: color .2s !important;
}
.forgot-link:hover { color: #2D3070 !important; }
.switch-text {
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  color: #6B7280 !important;
  text-align: center !important;
  margin: 0 !important;
}
.switch-text a {
  color: #2D3070 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

/* ── WooCommerce error/success messages ── */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  list-style: none !important;
}
.woocommerce-error { background: #FFEBEE !important; color: #C62828 !important; border: 1px solid #EF9A9A !important; }
.woocommerce-message { background: #E8F5E9 !important; color: #2E7D32 !important; border: 1px solid #A5D6A7 !important; }

/* ── Card brand typography ── */
.card-brand {
  font-family: 'Great Vibes', cursive !important;
  font-size: clamp(32px,5vw,48px) !important;
  color: #2D3070 !important;
}
.card-subtitle {
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  color: #6B7280 !important;
}
.tab-btn {
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
.tab-btn.active {
  font-weight: 700 !important;
  color: #2D3070 !important;
}
.benefits-title {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: #2D3070 !important;
}
.benefits-list li {
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  font-weight: 300 !important;
  color: #6B7280 !important;
}


/* ── Redes sociales — Nextend Social Login ── */
.social-divider {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 16px 0 !important;
}
.social-divider hr {
  flex: 1 !important;
  border: none !important;
  border-top: 1px solid rgba(244,167,185,0.3) !important;
  margin: 0 !important;
}
.social-divider span {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  color: #6B7280 !important;
  white-space: nowrap !important;
}
.social-btns {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}
/* Nextend button override */
.social-btns .nsl-button,
.social-btns .nsl-button-default,
.social-btns a.nsl-button {
  width: 100% !important;
  border-radius: 30px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 12px 20px !important;
  border: 1.5px solid rgba(244,167,185,0.4) !important;
  background: rgba(255,255,255,0.9) !important;
  color: #2D3070 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  transition: all .2s !important;
  box-shadow: none !important;
}
.social-btns .nsl-button:hover,
.social-btns a.nsl-button:hover {
  border-color: #F4A7B9 !important;
  background: white !important;
  transform: translateY(-1px) !important;
}
.social-btns .nsl-button img,
.social-btns a.nsl-button img {
  width: 18px !important;
  height: 18px !important;
  pointer-events: none !important;
}


/* ── WooCommerce formularios nativos estilizados ── */
.woocommerce-form-login,
.woocommerce-form-register {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.woocommerce-form-login .form-row,
.woocommerce-form-register .form-row {
  margin-bottom: 16px !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}
.woocommerce-form-login label,
.woocommerce-form-register label {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #2D3070 !important;
  margin-bottom: 6px !important;
  display: block !important;
}
.woocommerce-form-login input.input-text,
.woocommerce-form-register input.input-text,
.woocommerce-form-login input[type="email"],
.woocommerce-form-login input[type="password"],
.woocommerce-form-register input[type="email"],
.woocommerce-form-register input[type="password"],
.woocommerce-form-register input[type="text"] {
  width: 100% !important;
  padding: 12px 16px !important;
  border-radius: 14px !important;
  border: 1.5px solid rgba(244,167,185,0.35) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  color: #1a1a2e !important;
  background: rgba(255,255,255,0.8) !important;
  outline: none !important;
  transition: border-color .2s !important;
  box-sizing: border-box !important;
}
.woocommerce-form-login input:focus,
.woocommerce-form-register input:focus {
  border-color: #F4A7B9 !important;
  background: white !important;
}
.woocommerce-form-login__rememberme,
.woocommerce-form__label-for-checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  color: #6B7280 !important;
  cursor: pointer !important;
  margin-bottom: 16px !important;
}
.woocommerce-form__input-checkbox {
  width: 16px !important;
  height: 16px !important;
  accent-color: #2D3070 !important;
}
.woocommerce-form-login button[type="submit"],
.woocommerce-form-register button[type="submit"],
.woocommerce-Button {
  width: 100% !important;
  background: #2D3070 !important;
  color: white !important;
  border: none !important;
  border-radius: 30px !important;
  padding: 14px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all .2s !important;
  margin-top: 4px !important;
  margin-bottom: 16px !important;
  display: block !important;
}
.woocommerce-form-login button[type="submit"]:hover,
.woocommerce-form-register button[type="submit"]:hover {
  background: #3D4A8A !important;
  transform: translateY(-1px) !important;
}
.woocommerce-LostPassword a {
  font-family: 'Jost', sans-serif !important;
  font-size: 12px !important;
  color: #6B7280 !important;
  text-decoration: none !important;
  display: block !important;
  text-align: center !important;
  margin-bottom: 12px !important;
}
.woocommerce-LostPassword a:hover { color: #2D3070 !important; }
.woocommerce-privacy-policy-text {
  font-family: 'Jost', sans-serif !important;
  font-size: 11px !important;
  color: #6B7280 !important;
  font-weight: 300 !important;
  text-align: center !important;
  margin: 8px 0 !important;
}
.woocommerce-privacy-policy-text a { color: #2D3070 !important; }
.woocommerce-error, .woocommerce-message {
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  list-style: none !important;
  border-left: none !important;
}
.woocommerce-error { background: #FFEBEE !important; color: #C62828 !important; border: 1px solid #EF9A9A !important; }
.woocommerce-message { background: #E8F5E9 !important; color: #2E7D32 !important; border: 1px solid #A5D6A7 !important; }

/* ── Nextend Social Login — integración automática ── */
#nsl-container, .nsl-container { margin: 16px 0 !important; }
.nsl-container-buttons { display: flex !important; flex-direction: column !important; gap: 10px !important; }
.nsl-button {
  width: 100% !important;
  border-radius: 30px !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 12px 20px !important;
  border: 1.5px solid rgba(244,167,185,0.4) !important;
  background: rgba(255,255,255,0.9) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  transition: all .2s !important;
  box-shadow: none !important;
}
.nsl-button:hover { border-color: #F4A7B9 !important; background: white !important; }


/* ── Botón Google ── */
.dg-btn-google {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 12px 20px !important;
  border-radius: 30px !important;
  border: 1.5px solid rgba(244,167,185,0.4) !important;
  background: rgba(255,255,255,0.9) !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #2D3070 !important;
  text-decoration: none !important;
  transition: all .2s !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}
.dg-btn-google:hover {
  border-color: #F4A7B9 !important;
  background: white !important;
  transform: translateY(-1px) !important;
  color: #2D3070 !important;
}
.dg-btn-google svg { flex-shrink: 0 !important; }


/* ── Tabs cuenta — texto siempre visible ── */
.tab-btn {
  color: #6B7280 !important;
  background: rgba(244,167,185,0.15) !important;
}
.tab-btn.active {
  background: #2D3070 !important;
  color: white !important;
  font-weight: 700 !important;
}
.tab-btn:not(.active):hover {
  background: rgba(244,167,185,0.25) !important;
  color: #2D3070 !important;
}

/* ============================================================
   Nextend Social Login — Modal de redirección estilizado
   ============================================================ */
#nsl-redirect-overlay {
  background: rgba(45, 48, 112, 0.3) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
}
#nsl-redirect-overlay-container {
  border-radius: 20px !important;
  font-family: 'Jost', sans-serif !important;
  box-shadow: 0 24px 64px rgba(244,167,185,0.25) !important;
  border: 1px solid rgba(244,167,185,0.2) !important;
  padding: 36px 32px !important;
}
#nsl-redirect-overlay-title {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  color: #2D3070 !important;
}
#nsl-redirect-overlay-text {
  font-family: 'Jost', sans-serif !important;
  font-size: 13px !important;
  color: #6B7280 !important;
  font-weight: 300 !important;
}
#nsl-redirect-overlay-spinner {
  border-color: rgba(244,167,185,0.3) !important;
  border-top-color: #F4A7B9 !important;
}
