/* =============================================================
   Adevly — Sistema unificado de botones
   Especificidad body + clase = (0,1,2) > Elementor Kit (0,1,1)
   ============================================================= */


/* -------------------------------------------------------------
   TOKENS — edita aquí para cambiar toda la paleta
   ------------------------------------------------------------- */
:root {
  --adevly-btn-bg:          var(--adevly-cta-primary-bg, #000000);
  --adevly-btn-color:       var(--adevly-cta-primary-color, #ffffff);
  --adevly-btn-border:      var(--adevly-cta-primary-border, #000000);
  --adevly-btn-hover-bg:    var(--adevly-cta-primary-hover-bg, #00998E);
  --adevly-btn-hover-color: var(--adevly-cta-primary-hover-color, #ffffff);
  --adevly-btn-hover-border:var(--adevly-cta-primary-hover-border, #00998E);
  --adevly-btn-disabled-bg: #cccccc;
  --adevly-btn-radius:      var(--adevly-cta-size-md-radius, 0px);
  --adevly-btn-padding:     var(--adevly-cta-size-md-padding-y, 15px) var(--adevly-cta-size-md-padding-x, 30px);
  --adevly-btn-font-size:   var(--adevly-cta-size-md-font-size, 14px);
  --adevly-btn-font-weight: 500;
  --adevly-btn-tracking:    var(--adevly-cta-size-md-tracking, 3px);
  --adevly-btn-transition:  background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

body .adevly-cta-role-primary {
  --adevly-cta-current-bg: var(--adevly-cta-primary-bg, #000000);
  --adevly-cta-current-color: var(--adevly-cta-primary-color, #ffffff);
  --adevly-cta-current-border: var(--adevly-cta-primary-border, #000000);
  --adevly-cta-current-hover-bg: var(--adevly-cta-primary-hover-bg, #00998E);
  --adevly-cta-current-hover-color: var(--adevly-cta-primary-hover-color, #ffffff);
  --adevly-cta-current-hover-border: var(--adevly-cta-primary-hover-border, #00998E);
}

body .adevly-cta-role-secondary {
  --adevly-cta-current-bg: var(--adevly-cta-secondary-bg, #ffffff);
  --adevly-cta-current-color: var(--adevly-cta-secondary-color, #000000);
  --adevly-cta-current-border: var(--adevly-cta-secondary-border, #000000);
  --adevly-cta-current-hover-bg: var(--adevly-cta-secondary-hover-bg, #00998E);
  --adevly-cta-current-hover-color: var(--adevly-cta-secondary-hover-color, #ffffff);
  --adevly-cta-current-hover-border: var(--adevly-cta-secondary-hover-border, #00998E);
}

body .adevly-cta-size-sm {
  --adevly-cta-current-font-size: var(--adevly-cta-size-sm-font-size, 12px);
  --adevly-cta-current-padding: var(--adevly-cta-size-sm-padding-y, 10px) var(--adevly-cta-size-sm-padding-x, 18px);
  --adevly-cta-current-radius: var(--adevly-cta-size-sm-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-sm-tracking, 2px);
}

body .adevly-cta-size-md {
  --adevly-cta-current-font-size: var(--adevly-cta-size-md-font-size, 14px);
  --adevly-cta-current-padding: var(--adevly-cta-size-md-padding-y, 15px) var(--adevly-cta-size-md-padding-x, 30px);
  --adevly-cta-current-radius: var(--adevly-cta-size-md-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-md-tracking, 3px);
}

body .adevly-cta-size-lg,
body #place_order,
body button[name="woocommerce_checkout_place_order"] {
  --adevly-cta-current-font-size: var(--adevly-cta-size-lg-font-size, 15px);
  --adevly-cta-current-padding: var(--adevly-cta-size-lg-padding-y, 18px) var(--adevly-cta-size-lg-padding-x, 32px);
  --adevly-cta-current-radius: var(--adevly-cta-size-lg-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-lg-tracking, 3px);
}

body .adevly-cta-size-lg {
  --adevly-cta-current-font-size: var(--adevly-cta-size-lg-font-size, 15px);
  --adevly-cta-current-padding: var(--adevly-cta-size-lg-padding-y, 18px) var(--adevly-cta-size-lg-padding-x, 32px);
  --adevly-cta-current-radius: var(--adevly-cta-size-lg-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-lg-tracking, 3px);
}

body .adevly-cta-scope-role-primary .adevly-cta:not(.adevly-coupon-submit),
body .adevly-cta-scope-role-primary #place_order,
body .adevly-cta-scope-role-primary button[name="woocommerce_checkout_place_order"] {
  --adevly-cta-current-bg: var(--adevly-cta-primary-bg, #000000);
  --adevly-cta-current-color: var(--adevly-cta-primary-color, #ffffff);
  --adevly-cta-current-border: var(--adevly-cta-primary-border, #000000);
  --adevly-cta-current-hover-bg: var(--adevly-cta-primary-hover-bg, #00998E);
  --adevly-cta-current-hover-color: var(--adevly-cta-primary-hover-color, #ffffff);
  --adevly-cta-current-hover-border: var(--adevly-cta-primary-hover-border, #00998E);
}

body .adevly-cta-scope-role-secondary .adevly-cta:not(.adevly-coupon-submit),
body .adevly-cta-scope-role-secondary #place_order,
body .adevly-cta-scope-role-secondary button[name="woocommerce_checkout_place_order"] {
  --adevly-cta-current-bg: var(--adevly-cta-secondary-bg, #ffffff);
  --adevly-cta-current-color: var(--adevly-cta-secondary-color, #000000);
  --adevly-cta-current-border: var(--adevly-cta-secondary-border, #000000);
  --adevly-cta-current-hover-bg: var(--adevly-cta-secondary-hover-bg, #00998E);
  --adevly-cta-current-hover-color: var(--adevly-cta-secondary-hover-color, #ffffff);
  --adevly-cta-current-hover-border: var(--adevly-cta-secondary-hover-border, #00998E);
}

body .adevly-cta-scope-size-sm .adevly-cta:not(.adevly-coupon-submit),
body .adevly-cta-scope-size-sm #place_order,
body .adevly-cta-scope-size-sm button[name="woocommerce_checkout_place_order"] {
  --adevly-cta-current-font-size: var(--adevly-cta-size-sm-font-size, 12px);
  --adevly-cta-current-padding: var(--adevly-cta-size-sm-padding-y, 10px) var(--adevly-cta-size-sm-padding-x, 18px);
  --adevly-cta-current-radius: var(--adevly-cta-size-sm-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-sm-tracking, 2px);
}

body .adevly-cta-scope-size-md .adevly-cta:not(.adevly-coupon-submit),
body .adevly-cta-scope-size-md #place_order,
body .adevly-cta-scope-size-md button[name="woocommerce_checkout_place_order"] {
  --adevly-cta-current-font-size: var(--adevly-cta-size-md-font-size, 14px);
  --adevly-cta-current-padding: var(--adevly-cta-size-md-padding-y, 15px) var(--adevly-cta-size-md-padding-x, 30px);
  --adevly-cta-current-radius: var(--adevly-cta-size-md-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-md-tracking, 3px);
}

body .adevly-cta-scope-size-lg .adevly-cta:not(.adevly-coupon-submit),
body .adevly-cta-scope-size-lg #place_order,
body .adevly-cta-scope-size-lg button[name="woocommerce_checkout_place_order"] {
  --adevly-cta-current-font-size: var(--adevly-cta-size-lg-font-size, 15px);
  --adevly-cta-current-padding: var(--adevly-cta-size-lg-padding-y, 18px) var(--adevly-cta-size-lg-padding-x, 32px);
  --adevly-cta-current-radius: var(--adevly-cta-size-lg-radius, 0px);
  --adevly-cta-current-tracking: var(--adevly-cta-size-lg-tracking, 3px);
}


/* =============================================================
   1. PRIMARIO — negro sólido, hover teal
   Usado en: .adevly-btn, .adevly-cta, checkout, filtros, búsqueda,
             paginación, cupón-copy, cart-empty
   ============================================================= */

body .adevly-btn,
body .adevly-cta,
body[class*="elementor-kit-"] .adevly-btn,
body[class*="elementor-kit-"] .adevly-cta,
body[class*="elementor-kit-"] button.adevly-cta,
body[class*="elementor-kit-"] input[type="button"].adevly-cta,
body[class*="elementor-kit-"] input[type="submit"].adevly-cta,
body #adevly_place_order,
body[class*="elementor-kit-"] #adevly_place_order,
body .adevly-coupon-copy__btn,
body[class*="elementor-kit-"] .adevly-coupon-copy__btn,
body #place_order,
body[class*="elementor-kit-"] #place_order,
body button[name="woocommerce_checkout_place_order"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--adevly-cta-current-bg, var(--adevly-btn-bg));
  color: var(--adevly-cta-current-color, var(--adevly-btn-color));
  border: 2px solid var(--adevly-cta-current-border, var(--adevly-btn-border));
  padding: var(--adevly-cta-current-padding, var(--adevly-btn-padding));
  font-size: var(--adevly-cta-current-font-size, var(--adevly-btn-font-size));
  font-weight: var(--adevly-btn-font-weight);
  text-transform: uppercase;
  letter-spacing: var(--adevly-cta-current-tracking, var(--adevly-btn-tracking));
  line-height: 1;
  border-radius: var(--adevly-cta-current-radius, var(--adevly-btn-radius));
  cursor: pointer;
  text-decoration: none;
  transition: var(--adevly-btn-transition);
  white-space: nowrap;
  box-sizing: border-box;
}

body .adevly-btn:hover,
body .adevly-btn:focus,
body .adevly-cta:hover,
body .adevly-cta:focus,
body[class*="elementor-kit-"] .adevly-btn:hover,
body[class*="elementor-kit-"] .adevly-btn:focus,
body[class*="elementor-kit-"] .adevly-cta:hover,
body[class*="elementor-kit-"] .adevly-cta:focus,
body[class*="elementor-kit-"] button.adevly-cta:hover,
body[class*="elementor-kit-"] button.adevly-cta:focus,
body[class*="elementor-kit-"] input[type="button"].adevly-cta:hover,
body[class*="elementor-kit-"] input[type="button"].adevly-cta:focus,
body[class*="elementor-kit-"] input[type="submit"].adevly-cta:hover,
body[class*="elementor-kit-"] input[type="submit"].adevly-cta:focus,
body #adevly_place_order:hover,
body[class*="elementor-kit-"] #adevly_place_order:hover,
body .adevly-coupon-copy__btn:hover,
body[class*="elementor-kit-"] .adevly-coupon-copy__btn:hover,
body #place_order:hover,
body[class*="elementor-kit-"] #place_order:hover,
body button[name="woocommerce_checkout_place_order"]:hover {
  background: var(--adevly-cta-current-hover-bg, var(--adevly-btn-hover-bg));
  border-color: var(--adevly-cta-current-hover-border, var(--adevly-btn-hover-border));
  color: var(--adevly-cta-current-hover-color, var(--adevly-btn-hover-color));
}

body .adevly-btn:disabled,
body .adevly-btn[disabled],
body #place_order:disabled,
body button[name="woocommerce_checkout_place_order"]:disabled,
body .adevly-coupon-copy__btn:disabled {
  background: var(--adevly-btn-disabled-bg);
  border-color: var(--adevly-btn-disabled-bg);
  cursor: not-allowed;
  opacity: 0.7;
}

/* Elementor Icons (FA como SVG) debe heredar color del botón */
body .adevly-button-widget__btn .elementor-button-icon.e-font-icon-svg,
body .adevly-button-widget__btn .elementor-button-icon.e-font-icon-svg path {
  fill: currentColor;
  stroke: currentColor;
}

/* Evita que reglas globales de svg lo estiren al 100% en botones full-width */
body .adevly-button-widget__btn .elementor-button-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 1;
}
body .adevly-button-widget__btn .elementor-button-icon.e-font-icon-svg {
  width: 1em;
  height: 1em;
  max-width: 1em;
  max-height: 1em;
}

/* Ancho completo */
body .adevly-btn--full,
body #adevly_place_order,
body .adevly-coupon-copy__btn,
body #place_order,
body button[name="woocommerce_checkout_place_order"] {
  width: 100%;
}

/* Paginación — letter-spacing más ajustado */
body .adevly-pga-pagination--simple .adevly-pga-pagination__btn,
body .adevly-pga-btn {
  min-width: 150px;
  letter-spacing: .04em;
}
body .adevly-pga-pagination--simple .adevly-pga-pagination__btn.is-disabled {
  opacity: .35;
  pointer-events: none;
}


/* =============================================================
   2. SECUNDARIO — compatibilidad para botones sin .adevly-cta
   ============================================================= */

body .adevly-btn--secondary {
  background: var(--adevly-cta-current-bg, var(--adevly-cta-secondary-bg));
  color: var(--adevly-cta-current-color, var(--adevly-cta-secondary-color));
  border: 2px solid var(--adevly-cta-current-border, var(--adevly-cta-secondary-border));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: var(--adevly-cta-current-padding, var(--adevly-btn-padding));
  font-size: var(--adevly-cta-current-font-size, var(--adevly-btn-font-size));
  font-weight: var(--adevly-btn-font-weight);
  text-transform: uppercase;
  letter-spacing: var(--adevly-cta-current-tracking, var(--adevly-btn-tracking));
  line-height: 1;
  border-radius: var(--adevly-cta-current-radius, var(--adevly-btn-radius));
  cursor: pointer;
  text-decoration: none;
  transition: var(--adevly-btn-transition);
  white-space: nowrap;
  box-sizing: border-box;
}

body .adevly-btn--secondary:hover,
body .adevly-btn--secondary:focus {
  background: var(--adevly-cta-current-hover-bg, var(--adevly-btn-hover-bg));
  border-color: var(--adevly-cta-current-hover-border, var(--adevly-btn-hover-border));
  color: var(--adevly-cta-current-hover-color, var(--adevly-btn-hover-color));
}

/* Cupón apply — outline pequeño, sin uppercase */
body .adevly-coupon-form input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--adevly-cta-current-bg, var(--adevly-cta-secondary-bg));
  color: var(--adevly-cta-current-color, var(--adevly-cta-secondary-color));
  border: 1px solid var(--adevly-cta-current-border, rgba(0,0,0,.3));
  padding: 0 var(--adevly-cta-size-sm-padding-x);
  height: 45px;
  font-size: var(--adevly-cta-current-font-size, var(--adevly-cta-size-sm-font-size));
  font-weight: var(--adevly-btn-font-weight);
  letter-spacing: 0;
  cursor: pointer;
  transition: var(--adevly-btn-transition);
  white-space: nowrap;
  box-sizing: border-box;
}
body .adevly-coupon-form input[type="submit"]:hover {
  background: var(--adevly-cta-current-hover-bg, var(--adevly-cta-secondary-hover-bg));
  color: var(--adevly-cta-current-hover-color, var(--adevly-cta-secondary-hover-color));
  border-color: var(--adevly-cta-current-hover-border, var(--adevly-cta-secondary-hover-border));
}


/* =============================================================
   3. MINI CART ACTIONS — layout
   ============================================================= */

body .adevly-mini-cart-actions a {
  flex: 1;
}

body .adevly-vsel__btn:disabled { opacity: .4; cursor: not-allowed; }


/* =============================================================
   5. GHOST — texto + underline, hover teal
   Usado en: continue, reset filtros, .adevly-btn--ghost
   ============================================================= */

body a.adevly-cart-page-continue,
body .adevly-filters-applied__reset,
body .adevly-btn--ghost {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  color: #000;
  border: none;
  padding: 0;
  font-size: 12px;
  font-weight: var(--adevly-btn-font-weight);
  text-decoration: underline;
  text-transform: none;
  letter-spacing: normal;
  cursor: pointer;
  transition: color 0.3s ease;
  white-space: nowrap;
  box-sizing: border-box;
}
body a.adevly-cart-page-continue:hover,
body .adevly-filters-applied__reset:hover,
body .adevly-btn--ghost:hover,
body .adevly-btn--ghost:focus {
  color: var(--adevly-btn-hover-bg);
  background: transparent;
}

/* Continue — color gris en reposo */
body a.adevly-cart-page-continue { color: #646464; }


/* =============================================================
   5b. LINKS DE ACCIÓN — texto pequeño, estilo propio
   No son botones: cancel buscador, eliminar mini cart / cart page
   ============================================================= */

/* Eliminar ítem — mini cart y cart page comparten clase .adevly-mini-cart-remove */
body .adevly-mini-cart-remove,
body a.adevly-mini-cart-remove,
body a.adevly-cart-page-remove {
  display: inline-block;
  background: transparent;
  border: none;
  padding: 0;
  font-size: 12px;
  font-weight: var(--adevly-btn-font-weight);
  text-decoration: underline;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #000;
  cursor: pointer;
  transition: color 0.3s ease;
  opacity: 0.7;
}
body .adevly-mini-cart-remove:hover,
body a.adevly-mini-cart-remove:hover,
body a.adevly-cart-page-remove:hover { color: var(--adevly-btn-hover-bg); opacity: 1; }


/* =============================================================
   6. ICONO — transparente, sin color de texto propio
   Usado en: close, toggle, trigger carrito
   ============================================================= */

body .adevly-filters-close,
body .adevly-mini-cart-close,
body .adevly-menu-close,
body .adevly-modal-shell__close,
body .adevly-mini-cart-btn,
body .adevly-password-toggle {
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Close mini-cart — sticky arriba */
body .adevly-filters-close,
body .adevly-mini-cart-close {
  position: sticky;
  top: 0;
  margin-left: auto;
  display: block;
}

body .adevly-mini-cart-close {
  font-size: var(--adevly-mini-cart-close-icon-size, 30px);
  color: var(--adevly-mini-cart-close-icon-color, #000);
}

body .adevly-filters-close {
  font-size: var(--adevly-filters-close-icon-size, 30px);
  color: var(--adevly-filters-close-icon-color, #000);
}

/* Close menu — sticky arriba */
body .adevly-menu-close {
  font-size: var(--adevly-pro-mobile-close-icon-size, 30px);
  color: var(--adevly-pro-mobile-close-icon-color, #000);
}

/* Password toggle — posicionado dentro del input */
body .adevly-password-toggle {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: #222;
  font-size: 16px;
  line-height: 1;
}
body .adevly-password-toggle:hover { background: rgba(0,0,0,.06); }


/* =============================================================
   7. AUTH — primario/outline con border-radius 12px
   ============================================================= */

body .adevly-auth-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 46px;
  padding: 12px 18px;
  background: #111;
  color: #fff;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: var(--adevly-btn-font-size);
  font-weight: var(--adevly-btn-font-weight);
  text-decoration: none;
  cursor: pointer;
  transition: var(--adevly-btn-transition);
  white-space: nowrap;
  box-sizing: border-box;
}
body .adevly-auth-button:hover,
body .adevly-auth-button:focus {
  background: var(--adevly-btn-hover-bg);
  border-color: var(--adevly-btn-hover-border);
  color: #fff;
}

body .adevly-auth-button--secondary {
  background: transparent;
  color: #111;
  border-color: rgba(0,0,0,.15);
}
body .adevly-auth-button--secondary:hover,
body .adevly-auth-button--secondary:focus {
  background: var(--adevly-btn-hover-bg);
  border-color: var(--adevly-btn-hover-border);
  color: #fff;
}


/* =============================================================
   8. RESET — neutraliza color de <a> del Elementor Kit
   Solo afecta links sin clase propia dentro de widgets adevly-
   ============================================================= */

body [class*="adevly-"] a:not([class]) {
  color: inherit;
}