:root {
  --theme-color: #ffb34a;
  --theme-color2: #ffd78a;
  --theme-color3: #14b8a6;
  --title-color: #ffffff;
  --body-color: #a8a29e;
  --smoke-color: rgba(30, 30, 30, 0.7);
  --smoke-color2: #1e1e1e;
  --smoke-color3: #1e1e1e;
  --body-bg: #131210;
  --black-color: #131210;
  --white-color: #ffffff;
  --light-color: #57534e;
  --gray-color: #dee8ff;
  --slate-400: #94A3B8;
  --yellow-color: #ffb539;
  --success-color: #2dd4bf;
  --error-color: #f43f5e;
  --ot-border-color: #404040;
  --colors-gray-700: #404040;
  --surface-dark: #292524;
  --success-message: #2dd4bf;
  --error-message: #fb7185;
  --title-font: "Roboto", sans-serif;
  --body-font: "Roboto", sans-serif;
  --icon-font: "Font Awesome 6 Pro";
  --main-container: 1280px;
  --container-gutters: 30px;
  --section-space: 60px;
  --section-space-mobile: 40px;
  --section-title-space: 40px;
  --ripple-ani-duration: 5s;
  --mgt-color-error: rgb(7, 8, 8) 5;
  --mgt-color-link: #ffd78a;
  --mgt-color-link-hover: var(--theme-color);
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-bg-opacity: 1;
  --tw-border-opacity: 1;

  --Primary-200: #ffd78a;
  --Primary-300: #ffc666;

  --Secondary-300: #5eead4;

  --Surface-Primary: #ffb34a;
  --Surface-Primary-Hover: #f1a035;
  --Surface-Dark-Hover: #1c1917;
  --Text-Action-Primary-Solid: #020617;
  --Text-Action-Dark-Solid: #fafafa;
  --Colors-Gray-50: #fafafa;
  --Text-Action-Light-Text: #fff;
  --mt-header-height: 0px;
  --mt-main-width: 784px;
}

[data-fit-main] {
  inline-size: var(--mt-main-width, 100%);
  max-inline-size: 100%;
  min-width: 0;
}

.empty-d-none:empty {
  display: none;
}

[hidden] {
  display: none !important;
}



/*
* MODAL
*/

/* Error modal siempre encima de cualquier otro modal */
#mt-error-modal.modal {
  z-index: 4000 !important;
}

/* Su backdrop también por encima del resto */
.modal-backdrop.mt-error {
  z-index: 3990 !important;
}

.modal {
  --bs-modal-width: 600px;
}

@media (max-width: 575.98px) {
  .modal {
    --bs-modal-margin: 16px;
  }
}

/* MD-DOWN */
@media (max-width: 767.98px) {
  .modal .modal-content {
    --modal-content-padding: 32px 16px 16px;
  }
}

@media (min-width: 1024px) {
  .modal.modal-profile {
    --bs-modal-width: 1024px;
  }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
  .modal.modal-profile {
    --bs-modal-width: cal(100vw - (var(--modal-content-padding) * 2));
  }
}

.modal .modal-dialog {
  display: flex;
  flex-direction: column;
  justify-content: space-around;

  width: var(--bs-modal-width);
  max-width: min(var(--bs-modal-width), calc(100% - var(--bs-modal-margin) * 2));
  max-height: calc(100% - var(--bs-modal-margin)*2);
}

.modal .modal-content {
  --modal-content-padding: 16px;
  --modal-content-border: 1px solid var(--ot-border-color);
  --modal-content-border-radius: 16px;

  padding: var(--modal-content-padding);
  background: var(--black-color);
  border: var(--modal-content-border);
  border-radius: var(--modal-content-border-radius);
  box-shadow: 0px 8px 10px -6px rgba(0, 0, 0, 0.1),
    0px 20px 20px 20px rgba(0, 0, 0, 0.1);

  overflow-y: auto;
}

.modal .modal-body {
  --bs-modal-padding: 0;
  overflow-y: auto;
}

.modal .modal-image-warning {
  width: auto;
  height: 93px;
}

.modal-backdrop {
  --bs-backdrop-bg: rgba(19, 18, 16, 0.9);
  --bs-backdrop-opacity: 1;
  background-color: var(--bs-backdrop-bg) !important;
}

#mt-request-payout-modal .modal-dialog {
  --bs-modal-width: 700px;
}

.modal-dialog.modal-mega {
  --bs-modal-width: 800px;
}


/* SCROLL BAR --- */

/* Selecciona solo el modal que sea scrollable */
.modal-dialog.modal-mega .modal-content {
  /* O el elemento que haga scroll */
  overflow-y: auto;
  scrollbar-width: thin;
  /* Para Firefox */
  scrollbar-color: #404040 var(--smoke-color2);
  /* Para Firefox (thumb y track) */
}

/* Para WebKit (Chrome, Edge, Safari) */
.modal-dialog.modal-mega .modal-content::-webkit-scrollbar {
  width: 0.5rem;
  /* scrollbar-w-2 */
}

.modal-dialog.modal-mega .modal-content::-webkit-scrollbar-track {
  background: var(--smoke-color2k);
  /* scrollbar-track-mgt-dark */
  border-radius: 9999px;
  /* scrollbar-track-rounded-full */
}

.modal-dialog.modal-mega .modal-content::-webkit-scrollbar-thumb {
  background: #404040;
  /* scrollbar-thumb-neutral-700 */
  border-radius: 9999px;
  /* scrollbar-thumb-rounded-full */
}

.wc-checkout-in-modal .modal-cancel {
  display: unset !important;
}

/*
   * Notifications
*/

/* Cuando el cupón viene por URL: oculta el banner grande de Woo.
   OJO: el DOM sigue existiendo, así tu JS lo lee y lo convierte a inline. */
body.mt-coupon-from-url .woocommerce .woocommerce-message,
body.mt-coupon-from-url .woocommerce .woocommerce-error {
  display: none !important;
}


.coupon-form .form-control.invalid_coupon {
  border: 1px solid var(--error-color) !important;
}

input#coupon_code.form-control.invalid_coupon::placeholder,
input#coupon_code.form-control.invalid_coupon:focus::placeholder {
  color: var(--error-color, #ef4444) !important;
  opacity: 1 !important;
}

/* Prefijos por compatibilidad */
input#coupon_code.form-control.invalid_coupon::-webkit-input-placeholder {
  color: var(--error-color, #ef4444) !important;
}

input#coupon_code.form-control.invalid_coupon::-moz-placeholder {
  color: var(--error-color, #ef4444) !important;
  opacity: 1 !important;
}

input#coupon_code.form-control.invalid_coupon:-ms-input-placeholder {
  color: var(--error-color, #ef4444) !important;
}

input#coupon_code.form-control.invalid_coupon::-ms-input-placeholder {
  color: var(--error-color, #ef4444) !important;
}

.coupon_text {
  margin-top: 8px;
  font-family: var(--Type-Font-Family-Body, Roboto);
  font-size: var(--Text-FontSize-Body-sm, 14px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--Text-Lineheight-Body-sm, 20px);
  /* opcional: reserva mínima de altura para cero salto visual */
  min-height: var(--Text-Lineheight-Body-sm, 20px);
  text-align: left;
}

.coupon_text.invalid-text {
  color: var(--error-color, var(--Error-500, #f43f5e));
}

.coupon_text.sucefull-text {
  color: var(--success-message);
}

/* Oculto por defecto: no reserva espacio */
.coupon-message-container {
  display: none;
  margin-bottom: 0;
}

/* Cuando tu JS quite d-none, que se muestre y tenga margen */
.coupon-message-container:not(.d-none) {
  display: block;
}

.notifications {
  gap: 1rem;
  align-content: flex-start;
  border-radius: var(--bs-border-radius-lg);
  padding-bottom: 0.5rem;
  background-color: var(--smoke-color2);
  display: none;
  padding: 16px;
}

.notifications.show {
  display: flex !important;
}

.notifications.notifications-success {
  color: var(--success-message);
}

.notifications.notifications-error {
  color: var(--error-message);
}

/*--- Reset Bootstrap container ---*/
.container {
  width: 100% !important;
  padding-left: 1rem;
  padding-right: 1rem;
  margin-left: auto;
  margin-right: auto;
}

/* Mobile >768px */
@media (max-width: 767.98px) {
  .container {
    max-width: 540px !important;
  }
}

/* Laptop fluido hasta 1279px */
@media (min-width: 768px) and (max-width: 1199.98px) {
  .container {
    max-width: 800px !important;
  }
}

/* Desktop fijo (1200px en adelante) */
@media (min-width: 1200px) {
  .container {
    max-width: 1280px !important;
  }
}

/*--- Two Columns Layout ---*/

.two-columns {
  display: flex;
  gap: var(--two-columns-gap);
}

/* Mobile */
@media (max-width: 767.98px) {
  .two-columns {
    flex-direction: column;
    --two-columns-gap: 32px;
  }
}

/* Tablet - Up */
@media (min-width: 768px) {
  .my-account .two-columns__col:first-child {
    flex: 1 1 35%;
    max-width: unset;
  }

  .my-account .two-columns__col:last-child {
    flex: 1 1 65%;
    max-width: unset;
  }

  .two-columns__col:first-child {
    flex: 1 1 57%;
    max-width: calc(57% - var(--two-columns-gap) / 2);
  }

  .two-columns__col:last-child {
    flex: 1 1 43%;
    max-width: calc(43% - var(--two-columns-gap) / 2);
  }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991.98px) {
  .two-columns {
    --two-columns-gap: 16px;
  }

  .two-columns.my-account {
    max-width: 800px;
  }
}

/* Laptop */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .two-columns {
    --two-columns-gap: 32px;
  }
}

/* Desktop */
@media (min-width: 1200px) {
  .two-columns {
    --two-columns-gap: 64px;
  }
}

/* ------ TYPOGRAPHIES ------ */

.heading-sm-medium {
  --title-size: 24px;
  --title-line-height: 28px;
  --title-weight: 500;
  --title-margin: 0;
  text-transform: uppercase;
}

/* ------ Z-INDEX ------ */

:root {
  --z-base: 0;
  --z-sticky: 10;
  --z-fixed: 20;
  --z-dropdown: 30;
  --z-tooltip: 50;
  --z-backdrop: 70;
  --z-modal: 80;
  --z-toast: 110;
  --z-loader: 9999;
}

.z-base {
  z-index: var(--z-base);
}

.z-sticky {
  z-index: var(--z-sticky);
}

.z-fixed {
  z-index: var(--z-fixed);
}

.z-dropdown {
  z-index: var(--z-dropdown);
}

.z-tooltip {
  z-index: var(--z-tooltip);
}

.z-backdrop {
  z-index: var(--z-backdrop);
}

.z-modal {
  z-index: var(--z-modal);
}

.z-toast {
  z-index: var(--z-toast);
}

.z-loader {
  z-index: var(--z-loader);
}

.sticky-bottom {
  z-index: var(--z-sticky);
}

/* ----- CUSTOM WIDHT------ */

.w-0 {
  width: 0;
}

.w-2 {
  width: 0.5rem;
}

.w-3 {
  width: 0.75rem;
}

.w-4 {
  width: 1rem;
}

.w-5 {
  width: 1.25rem;
}

.w-6 {
  width: 1.5rem;
}

.w-7 {
  width: 1.75rem;
}

.w-9 {
  width: 2.25rem;
}

.w-10 {
  width: 2.5rem;
}

.w-12 {
  width: 3rem;
}

.w-24 {
  width: 6rem;
}

.w-140px {
  width: 140px;
}

.w-170px {
  width: 170px;
}

.w-197px {
  width: 197px;
}

.w-2_25rem {
  width: 2.25rem;
}

.w-230px {
  width: 230px;
}

.w-250px {
  width: 250px;
}

.w-260px {
  width: 260px;
}

.w-265px {
  width: 265px;
}

.w-278px {
  width: 278px;
}

.w-280px {
  width: 280px;
}

.w-288px {
  width: 288px;
}

.w-308px {
  width: 308px;
}

.w-30px {
  width: 30px;
}

.w-328px {
  width: 328px;
}

.w-360px {
  width: 360px;
}

.w-32px {
  width: 32px;
}

.w-36px {
  width: 36px;
}

.w-62px {
  width: 62px;
}

.w-75px {
  width: 75px;
}

.w-90px {
  width: 90px;
}

.w-calc-1 {
  width: calc(100dvw - 24px);
}

.w-calc-2 {
  width: calc(100vw - 32px);
}

.w-calc-3 {
  width: calc(72% - 52px);
}

.w-var-button {
  width: var(--button-width);
}

.w-auto {
  width: auto;
}

.w-fit {
  width: fit-content;
}

.w-full {
  width: 100%;
}

.w-max {
  width: max-content;
}

.w-screen {
  width: 100vw;
}

.w-300px-important {
  width: 300px !important;
}

.w-95px-important {
  width: 95px !important;
}

.w-max-224px {
  max-width: 224px;
}

.w-max-320px {
  max-width: 320px;
}

.w-max-600px {
  max-width: 600px;
}

@media (max-width: 575.98px) {
  .mobile-max-width-100 {
    max-width: fit-content;
  }
}

@media (max-width: 405.98px) {
  .mobile-max-width-100 {
    max-width: 100px;
  }
}

/* ----- CUSTOM HEIGHT ------ */

.h-0 {
  height: 0;
}

.h-2 {
  height: 0.5rem;
}

.h-3 {
  height: 0.75rem;
}

.h-3_5 {
  height: 0.875rem;
}

.h-4 {
  height: 1rem;
}

.h-5 {
  height: 1.25rem;
}

.h-6 {
  height: 1.5rem;
}

.h-7 {
  height: 1.75rem;
}

.h-9 {
  height: 2.25rem;
}

.h-10 {
  height: 2.5rem;
}

.h-12 {
  height: 3rem;
}

.h-14 {
  height: 3.5rem;
}

.h-24 {
  height: 6rem;
}

.h-0px {
  height: 0;
}

.h-1px {
  height: 1px;
}

.h-2px {
  height: 2px;
}

.h-100px {
  height: 100px;
}

.h-124px {
  height: 124px;
}

.h-288px {
  height: 288px;
}

.h-290px {
  height: 290px;
}

.h-24px {
  height: 24px;
}

.h-30px {
  height: 30px;
}

.h-32px {
  height: 32px;
}

.h-36px {
  height: 36px;
}

.h-332px {
  height: 332px;
}

.h-354px {
  height: 354px;
}

.h-387px {
  height: 387px;
}

.h-389px {
  height: 389px;
}

.h-409px {
  height: 409px;
}

.h-44_63px {
  height: 44.63px;
}

.h-441px {
  height: 441px;
}

.h-460px {
  height: 460px;
}

.h-47px {
  height: 47px;
}

.h-48px {
  height: 48px;
}

.h-65px {
  height: 65px;
}

.h-750px {
  height: 750px;
}

.h-80px {
  height: 80px;
}

.h-calc-1 {
  height: calc(100% - 16px - 52px);
}

.h-calc-2 {
  height: calc(100dvh - 68px);
}

.h-auto {
  height: auto;
}

.h-dvh {
  height: 100dvh;
}

.h-fit {
  height: fit-content;
}

.h-full {
  height: 100%;
}

.h-screen {
  height: 100vh;
}

.max-h-70vh {
  max-height: 70vh;
}

.max-h-85vh {
  max-height: 85vh;
}

.max-h-dvh {
  max-height: 100dvh;
}

.max-h-max {
  max-height: max-content;
}

.min-h-6 {
  min-height: 1.5rem;
}

.min-h-29px {
  min-height: 29px;
}

.min-h-354px {
  min-height: 354px;
}

.min-h-668px {
  min-height: 668px;
}

.min-h-calc-1 {
  min-height: calc(50dvh - 60px - 16px - 32px);
}

.max-h-58px {
  max-height: 58px;
}

/* -----  (translate, rotate, transform) ------ */

.translate-x-neg-25-important {
  --tw-translate-x: -25% !important;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

.translate-x-neg-50 {
  --tw-translate-x: -50%;
}

.translate-x-neg-50-transform {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-x-neg-10 {
  --tw-translate-x: -2.5rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-neg-50 {
  --tw-translate-y: -50%;
}

.translate-y-neg-50-transform {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.translate-y-neg-36px {
  --tw-translate-y: -36px;
}

.translate-y-neg-36px-transform {
  --tw-translate-y: -36px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-180 {
  --tw-rotate: 180deg;
}

.rotate-180-transform {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

/* ----- CUSTOM SIZES------ */

.size-3 {
  width: 0.75rem;
  height: 0.75rem;
}

.size-3of4 {
  width: 75%;
  height: 75%;
}

.size-25px {
  width: 25px;
  height: 25px;
}

/* ---- ROUNDED -------*/

.rounded {
  border-radius: 0.25rem;
}

.rounded-2xl {
  border-radius: 1rem;
}

.rounded-10 {
  border-radius: 10px;
}

.rounded-12 {
  border-radius: 12px;
}

.rounded-20 {
  border-radius: 20px;
}

.rounded-20px {
  border-radius: 20px;
}

.rounded-20px {
  border-radius: 20px;
}

.rounded-64px {
  border-radius: 64px;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.rounded-none {
  border-radius: 0;
}

.rounded-sm {
  border-radius: 0.125rem;
}

.rounded-xl {
  border-radius: 0.75rem;
}

.rounded-bl-64px {
  border-bottom-left-radius: 64px;
}

.rounded-br-64px {
  border-bottom-right-radius: 64px;
}

.rounded-tl-64px {
  border-top-left-radius: 64px;
}

.rounded-tr-64px {
  border-top-right-radius: 64px;
}

.rounded-16px {
  border-radius: 16px !important;
}

.rounded-tl-16px {
  border-top-left-radius: 16px;
}

.rounded-tr-16px {
  border-top-right-radius: 16px;
}

/* ----- BORDER ------ */

.border {
  border-width: 1px !important;
}

.border-0 {
  border-width: 0;
}

.border-2 {
  border-width: 2px;
}

.border-4 {
  border-width: 4px;
}

.border-b {
  border-bottom-width: 1px;
}

.border-l {
  border-left-width: 1px;
}

.border-t {
  border-top-width: 1px;
}

.border-t-0_5px {
  border-top-width: 0.5px;
}

.border-t-1px {
  border-top-width: 1px;
}

.border-solid {
  border-style: solid;
}

.border-smoke {
  border-color: rgb(30 30 30 / var(--tw-border-opacity));
}

.border-494949 {
  border-color: rgb(73 73 73 / var(--tw-border-opacity));
}

.border-black {
  border-color: rgb(0 0 0 / var(--tw-border-opacity));
}

.border-gray-500 {
  border-color: rgb(107 114 128 / var(--tw-border-opacity));
}

.border-mgt-primary {
  border: 1px solid var(--mgt-color-primary);
}

.border-neutral-300 {
  border-color: rgb(212 212 212 / var(--tw-border-opacity));
}

.border-neutral-700 {
  border-color: rgb(64 64 64 / var(--tw-border-opacity)) !important;
}

.border-stone-400 {
  border-color: rgb(168 162 158 / var(--tw-border-opacity));
}

.border-transparent {
  border-color: transparent;
}

.border-white-10 {
  border-color: rgba(255, 255, 255, 0.1);
}

.border-zinc-950-10 {
  border-color: rgba(9, 9, 11, 0.1);
}

.border-zinc-950-5 {
  border-color: rgba(9, 9, 11, 0.05);
}

.border-b-zinc-950-10 {
  border-bottom-color: rgba(9, 9, 11, 0.1);
}

.border-l-zinc-950-5 {
  border-left-color: rgba(9, 9, 11, 0.05);
}

.border-mg-buttton-primary {
  border: 2px solid var(--theme-color);
}

.border-mg-buttton-secondary {
  border: 1px solid var(--ot-border-color);
}

.border-bottom-separator {
  border-bottom: 1px solid #292524;
}

.border-bottom-separator-2 {
  border-bottom: 2px solid var(--colors-gray-700, #404040);
}

.border-gray {
  border: 1px solid var(--colors-gray-700, #404040);
}

.border-top-gray {
  border-top: 1px solid var(--colors-gray-700, #404040);
}

.border-bottom-gray {
  border-bottom: 1px solid var(--colors-gray-700, #404040);
}

.border-gray-800 {
  border: 1px solid var(--Colors-Gray-800, #292524);
}

.border-top-gray-800 {
  border-top: 1px solid var(--Colors-Gray-800, #292524);
}

.border-bottom-gray-800 {
  border-bottom: 1px solid var(--Colors-Gray-800, #292524);
}


.border-bottom-dark {
  border-bottom: 1px solid var(--surface-dark, #292524);
}

.outline-dark {
  outline: 1px solid #404040;
}

.outline-offset-1px {
  outline-offset: -1px;
}

/* ----- CUSTOM BACKGROUND------ */

.bg-mgt-primary {
  background-color: var(--theme-color) !important;
}

.bg-111 {
  background-color: rgb(17 17 17 / var(--tw-bg-opacity, 1));
}

.bg-111-80 {
  background-color: rgb(17 17 17 / 0.8);
}

.bg-mega-black {
  background-color: rgb(19 18 16 / var(--tw-bg-opacity, 1));
}

.bg-131210 {
  background-color: var(--black-color);
}

.bg-131210-90 {
  background-color: rgb(19 18 16 / 0.9);
}

.bg-151211 {
  background-color: rgb(21 18 17 / var(--tw-bg-opacity, 1));
}

.bg-1e1e1e {
  background-color: rgb(30 30 30 / var(--tw-bg-opacity, 1));
}

.bg-1e1e1e-70 {
  background-color: rgb(30 30 30 / 0.7);
}

.bg-292524 {
  background-color: rgb(41 37 36 / var(--tw-bg-opacity, 1));
}

.bg-black {
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.bg-black-10 {
  background-color: rgb(0 0 0 / 0.1);
}

.bg-teal-400 {
  background-color: rgb(45 212 191 / var(--tw-bg-opacity, 1));
}

.bg-stone-800 {
  background-color: rgb(41 37 36 / var(--tw-bg-opacity, 1));
}

.bg-stone-950 {
  background-color: rgb(12 10 9 / var(--tw-bg-opacity, 1));
}

.bg-teal-500 {
  background-color: rgb(20 184 166 / var(--tw-bg-opacity, 1));
}

.bg-transparent {
  background-color: transparent;
}

.bg-red-400 {
  background-color: rgb(248 113 113 / var(--tw-bg-opacity, 1));
}

.bg-stone-800 {
  background-color: rgb(41 37 36 / var(--tw-bg-opacity, 1));
}

.bg-secondary {
  background-color: var(--theme-color3) !important;
}

.bg-404040 {
  background-color: var(--colors-gray-700);
}

.bg-a8a29e {
  background-color: #A8A29E;
}

.back-otp-back:hover {
  background-color: rgb(41 37 36 / var(--tw-bg-opacity, 1)) !important;
}

/* ------ FILL ------ */

.fill-success {
  fill: var(--success-message);
}

.fill-error {
  fill: var(--error-message);
}

.fill-fb923c {
  fill: #fb923c;
}

.fill-blue-400 {
  fill: #60a5fa;
}

.fill-current {
  fill: currentColor;
}

.fill-primary {
  fill: var(--theme-color);
}

.fill-body {
  fill: var(--body-color);
}

.fill-white {
  fill: var(--white-color);
}


/* -------- Custom Flex --------*/

.flex-basis-0 {
  flex-basis: 0;
}

.flex-basis-1 {
  flex-basis: 1;
}

.flex-1-1-0 {
  flex: 1 1 0;
}

.flex-1-0-0 {
  flex: 1 0 0;
}

/* -------- TEXT --------*/

.text-black {
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.text-stone-400 {
  color: rgb(168 162 158 / var(--tw-text-opacity, 1));
}

.text-0a0a0a {
  color: rgb(10 10 10 / var(--tw-text-opacity, 1));
}

.text-131210 {
  color: rgb(19 18 16 / var(--tw-text-opacity, 1));
}

.text-14b8a6 {
  color: rgb(20 184 166 / var(--tw-text-opacity, 1));
}

.text-3d2900 {
  color: rgb(61 41 0 / var(--tw-text-opacity, 1));
}

.text-57534e {
  color: var(--light-color);
}

.text-a8a29e {
  color: var(--body-color);
}

.text-f43f5e {
  color: var(--error-color);
}

.text-ffb54d {
  color: var(--theme-color);
}

.text-ffd78a {
  color: var(--theme-color2);
}

.text-60A5FA {
  color: #60a5fa;
}

.text-blue-400 {
  color: rgb(96 165 250 / var(--tw-text-opacity, 1));
}

.text-gray-300 {
  color: rgb(209 213 219 / var(--tw-text-opacity, 1));
}

.text-gray-400 {
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}

.text-gray-500 {
  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
}

.text-gray-900 {
  color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.text-green-500 {
  color: rgb(34 197 94 / var(--tw-text-opacity, 1));
}

.text-mgt-dark {
  color: var(--mgt-dark);
}

.text-mgt-gray-light {
  color: rgb(168 162 158 / var(--tw-text-opacity, 1));
}

.text-mgt-link {
  color: var(--mgt-color-link);
}

.text-mgt-primary {
  color: var(--mgt-color-primary);
}

.text-neutral-50 {
  color: rgb(250 250 250 / var(--tw-text-opacity, 1));
}

.text-neutral-700 {
  color: rgb(64 64 64 / var(--tw-text-opacity, 1));
}

.text-orange-600 {
  color: rgb(234 88 12 / var(--tw-text-opacity, 1));
}

.text-primary {
  color: var(--theme-color) !important;
}

.text-red-400 {
  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
}

.text-red-500 {
  color: rgb(239 68 68 / var(--tw-text-opacity, 1));
}

.text-rose-400 {
  color: rgb(251 113 133 / var(--tw-text-opacity, 1));
}

.text-rose-500 {
  color: var(--error-message);
}

.text-rose-600 {
  color: rgb(225 29 72 / var(--tw-text-opacity, 1));
}

.text-secondary {
  color: var(--mgt-color-teal);
}

.text-slate-800 {
  color: rgb(30 41 59 / var(--tw-text-opacity, 1));
}

.text-slate-950 {
  color: rgb(2 6 23 / var(--tw-text-opacity, 1));
}

.text-stone-300 {
  color: rgb(214 211 209 / var(--tw-text-opacity, 1));
}

.text-stone-500 {
  color: rgb(120 113 108 / var(--tw-text-opacity, 1));
}

.text-stone-800 {
  color: rgb(41 37 36 / var(--tw-text-opacity, 1));
}

.text-teal-400 {
  color: rgb(45 212 191 / var(--tw-text-opacity, 1));
}

.text-teal-500 {
  color: rgb(20 184 166 / var(--tw-text-opacity, 1));
}

.text-teal-600 {
  color: rgb(13 148 136 / var(--tw-text-opacity, 1));
}

.text-white {
  color: var(--white-color);
}

.text-zinc-400 {
  color: rgb(161 161 170 / var(--tw-text-opacity, 1));
}

.text-zinc-500 {
  color: rgb(113 113 122 / var(--tw-text-opacity, 1));
}

.text-zinc-950 {
  color: rgb(9 9 11 / var(--tw-text-opacity, 1));
}

.text-2dd4bf {
  color: #2dd4bf;
}

/* -------- TEXT SIZE --------*/

.text-base {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}

.text-sm {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.text-xs {
  font-size: 0.75rem !important;
  line-height: 1rem !important;
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.text-5xl {
  font-size: 3rem;
  line-height: 1;
}

.text-7xl {
  font-size: 4.5rem;
  line-height: 1;
}

.text-10px {
  font-size: 10px;
}

.text-14px {
  font-size: 14px;
}

.text-32px {
  font-size: 32px;
}

.text-40px {
  font-size: 40px;
}

.text-14px-line-20px {
  font-size: 14px !important;
  line-height: 20px !important;
}

/*----- Line Height ------*/

.leading-10 {
  line-height: 2.5rem;
}

.leading-5 {
  line-height: 1rem;
}

.leading-6 {
  line-height: 1.5rem;
}

.leading-7 {
  line-height: 1.75rem;
}

.leading-8 {
  line-height: 2rem;
}

.leading-25px {
  line-height: 25px;
}

.leading-36px {
  line-height: 36px;
}

.leading-48px {
  line-height: 48px;
}

.leading-60px {
  line-height: 60px;
}

.leading-loose {
  line-height: 2;
}

.leading-none {
  line-height: 1;
}

.leading-normal {
  line-height: 1.5;
}

.leading-tight {
  line-height: 1.25;
}

.with-icon-offset {
  padding-inline-start: calc(var(--mt-icon-size, 24px) + var(--mt-gap, 8px));
}

/* ---- Badge -----*/

.badge-mega {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--black-color);
  text-transform: uppercase;
  font-size: var(--Text-FontSize-Body-sm, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.badge-mega-sm {
  padding: 4px 8px;
  border-radius: 12px;
  height: fit-content;
  line-height: 1.1;
}

.badge-mega-md {
  padding: 2px 12px;
  border-radius: 16px;
  min-height: 28px;
}

.badge-mega-fit-content {
  width: fit-content;
  margin: auto;
}

.badge-mega-active {
  background-color: var(--theme-color3);
}

.badge-mega-hold {
  background-color: #a8a29e;
}

.badge-mega-cancelled {
  background-color: var(--error-color);
}

.badge-mega-pending {
  background-color: #94a3b8;
}

.badge-mega-pending-cancel {
  background-color: #94a3b8;
}

.badge-mega-expired {
  background-color: #f43f5e;
}

.badge-mega-breached {
  background-color: #f43f5e;
}

.badge-mega-error {
  background-color: #f43f5e;
}

.badge-mega-default {
  background-color: var(--Colors-Gray-200);
}

.badge-mega-primary {
  background-color: var(--Surface-Primary-Hover);
}

.badge-mega-secondary {
  background-color: #14b8a6;
}

.badge-mega-evaluation {
  background-color: #e5e5e5;
}

.badge-mega-funded {
  background-color: #14b8a6;
}

/* --- Custom Button ------*/

.mega-btn-md {
  font-size: 16px;
  /* puedes reemplazar con tu var global si prefieres */
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  display: flex;
  padding: 12px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 12px;
  text-align: center;
  min-height: 48px;
  white-space: nowrap;
}

/* Botón primario (hereda de mega-btn-md) */
.mega-btn-primary-md {
  color: var(--Text-Action-Primary-Solid);
  background: var(--theme-color);
  border: 1px solid var(--theme-color);
}

.mega-btn-primary-md:is([disabled]) {
  border: 1px solid transparent;
}

.mega-btn-primary-md:not([disabled]):hover,
.mega-btn-primary-md:not([disabled]).active {
  color: var(--black-color);
  background-color: var(--Surface-Primary-Hover);
  border: 1px solid var(--Surface-Primary-Hover);
}

.mega-btn-primary-md:is([disabled]):focus,
.mega-btn-primary-md:is([disabled]):focus-within {
  border: 1px solid var(--Primary-200);
}

.mega-btn-md.mega-btn-primary-md:is(.disabled, [disabled]) {
  background: var(--light-color, #57534e);
  color: var(--surface-dark, #292524);
  border: transparent;
  pointer-events: none;
}

/* Botón secundario (hereda de mega-btn-md) */
.mega-btn-secondary-md {
  color: var(--Text-Action-Dark-Solid);
  background: var(--surface-dark);
  border: 1px solid var(--colors-gray-700);
}

.mega-btn-secondary-md:hover,
.mega-btn-secondary-md:active {
  background: var(--Surface-Dark-Hover);
  border: 1px solid var(--colors-gray-700);
}

.mega-btn-secondary-md:focus,
.mega-btn-secondary-md:focus-within {
  border: 1px solid var(--Colors-Gray-50);
}

.mega-btn-md.mega-btn-secondary-md:is(.disabled, [disabled]) {
  background: var(--light-color, #57534e);
  color: var(--surface-dark, #292524);
}

/* Botón default (hereda de mega-btn-md) */
.mega-btn-default-md {
  color: var(--surface-dark);
  background: var(--white-color);
  border: 1px solid var(--white-color);
}

.mega-btn-default-md:hover,
.mega-btn-default-md:active {
  background: #d4d4d4;
  border: 1px solid #d4d4d4;
  color: var(--surface-dark, #292524);
}

.mega-btn-default-md:focus,
.mega-btn-default-md:focus-within {
  border: 1px solid transparent;
}

.mega-btn-md.mega-btn-default-md.disabled {
  background: var(--light-color, #57534e);
  color: var(--surface-dark, #292524);
}

/* Botón dark (hereda de mega-btn-md) */
.mega-btn-dark-md {
  color: var(--surface-dark);
  background: #131210;
  border: 1px solid #404040;
}

.mega-btn-dark-md:hover,
.mega-btn-dark-md:active {
  background: #131210;
  border: 1px solid #d4d4d4;
}

.mega-btn-dark-md:focus,
.mega-btn-dark-md:focus-within {
  border: 1px solid #404040;
}

.mega-btn-md.mega-btn-dark-md.disabled {
  background: var(--light-color, #57534e);
  color: var(--surface-dark, #292524);
}

/* BTN OUTLINE (from mega-btn-md) */
.mega-btn-outline-md {
  color: var(--Text-Action-Light-Text);
  background: transparent;
  border: 1px solid transparent;
}

.mega-btn-outline-md:hover {
  background: rgba(255, 255, 255, 0.1);
}

.mega-btn-outline-md:active {
  background: var(--White, #fff);
}

.mega-btn-outline-md:focus,
.mega-btn-outline-md:focus-within {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.mega-btn-outline-md.disabled {
  color: var(--Text-Action-Disabled-Text, #57534e);
}

/* BTN ADD ICON (from mega-btn-md) */
.mega-btn-add-icon-md {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.mega-btn-add-icon-md:before {
  content: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_12273_4451" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_12273_4451)"><path d="M11 13H5V11H11V5H13V11H19V13H13V19H11V13Z" fill="black"/></g></svg>');
  display: inline-block;
  width: 24px;
  height: 24px;
}

.mega-btn-next-icon-md:after {
  content: url('data:image/svg+xml,<svg width="8" height="12" viewBox="0 0 8 12" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M4.6 6L0 1.4L1.4 0L7.4 6L1.4 12L0 10.6L4.6 6Z" fill="black"/> </svg>');
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
}

/*----- PADING ------*/

.p-x-16-mega {
  padding-left: 16px;
  padding-right: 16px;
}

.p-y-12-mega {
  padding-top: 12px;
  padding-bottom: 12px;
}

/* ------ PLUGINS ------ */

/* Country Code Phone Field Dropdown */
.iti__country-list[role="listbox"] {
  z-index: var(--z-dropdown);
  clip-path: inset(0 round 8px);
}

/* Country Code Phone Field Flag Container */
.iti__flag-container {
  bottom: unset;
  height: 48px;
}

/* Google Maps Address Autocompletion*/
.pac-container {
  border-radius: 8px;
}

/* ------ CREDIT CARD FORM NMI------ */

.wc-nmi-elements-field.is-focused {
  box-shadow: none;
  border-color: var(--theme-color);
  background-color: var(--smoke-color);
}

.wc-nmi-elements-field {
  border: none;
  outline: 1px solid var(--ot-border-color);
  outline-offset: -1px;
  transition: outline-color 0.3s ease;
  border-radius: 12px;
  min-height: 48px;
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  max-width: 100%;
  padding: 0;
}

.wc-nmi-elements-field:hover {
  outline-color: var(--title-color);
}

.wc-nmi-elements-field.is-focused {
  outline-color: var(--theme-color);
  box-shadow: none;
}

.wc-nmi-elements-field.is-invalid {
  outline-color: var(--error-color);
}

label[for="wc-nmi-new-payment-method"] {
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 24px !important;
}

/* ------ PAYMENT METHOD / REVIEW BOX ------ */

.woocommerce-checkout #payment {
  background-color: unset;
  border-radius: unset;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.woocommerce-checkout #payment .payment_box .wc-payment-form,
.woocommerce-checkout #payment div.payment_box .wc-credit-card-form,
.woocommerce .woocommerce-checkout #payment ul.payment_methods .wc-saved-payment-methods li,
.woocommerce-checkout #payment div.payment_box p:last-child,
.woocommerce-checkout #payment div.form-row.place-order {
  background-color: var(--smoke-color2);
  padding: 16px;
  margin: 0 !important;
}

.woocommerce-checkout #payment .payment_box .wc-payment-form {
  padding-top: 0;
}

.woocommerce-checkout #payment .payment_box .woocommerce-SavedPaymentMethods:not([data-count="0"])+.wc-payment-form {
  padding-top: 0;
}

.collapsable {
  transition: all var(--collapsable-animation-duration, 300ms) ease-in-out;
}

.woocommerce-checkout #payment div.payment_box p.woocommerce-SavedPaymentMethods-saveNew {
  padding-top: 0;
}

.woocommerce-checkout #payment div.payment_box {
  border-bottom-right-radius: 16px;
  border-bottom-left-radius: 16px;
  overflow: hidden;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods .wc-saved-payment-methods li.woocommerce-SavedPaymentMethods-token {
  border-radius: 16px;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods .wc-saved-payment-methods:not([data-count="0"]) li.woocommerce-SavedPaymentMethods-new {
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}

.woocommerce-checkout #payment .payment_box .woocommerce-SavedPaymentMethods[data-count="0"] {
  display: none;
}

.woocommerce-checkout #payment .payment_box .woocommerce-SavedPaymentMethods[data-count="0"]+.wc-payment-form {
  padding-top: 16px;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}

.woocommerce-checkout #payment .place-order {
  border-radius: 16px;
}

.woocommerce-checkout-payment .form-check input.form-check-input {
  border: 2px solid var(--theme-color);
  border-radius: 4px;
  height: 18px;
  transform: translateY(7px);
}

/* ------- Saved Mayment Method  ------- */
ul.woocommerce-SavedPaymentMethods li input[type="radio"]~label {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-left: 0;
}

ul.woocommerce-SavedPaymentMethods li input[type="radio"]~label::before {
  position: unset;
  flex-shrink: 0;
}

.saved-cc-content {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-grow: 1;
  color: var(--title-color);
  line-height: 24px;
}

/* MD-DOWN */
@media (max-width: 1199.98px) {
  .saved-cc-content {
    flex-wrap: wrap;
  }
}

.saved-cc-body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.saved-cc-number {
  text-transform: capitalize;
}

.saved-cc-exp-date {
  color: var(--body-color);
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.saved-cc-change {
  width: fit-content;
  font-size: var(--Text-FontSize-Body-sm, 14px);
  line-height: var(--Text-Lineheight-Body-sm, 20px);
  text-decoration-line: underline;
}

.saved-cc-badge {
  width: fit-content;
  height: fit-content;
  color: var(--black-color);
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  text-transform: uppercase;
  white-space: nowrap;
  padding: 2px 12px;
  border-radius: 16px;
  background-color: var(--theme-color3);
}

/* My Account = Payment Methods */

.my-account-payment-methods {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.saved-cc {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  border-radius: var(--Border-Radius-md, 8px);
  background: var(--Surface-Page, #1e1e1e);
}

.saved-cc-default {
  order: -1;
}

.saved-cc-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

@media (max-width: 767px) {
  .saved-cc-actions {
    width: 100%;
  }
}

.saved-cc-actions .default {
  order: -1;
}

.saved-cc-actions .delete {
  /* order: 2; */
}

.add-method {
  display: flex;
}

@media (max-width: 767px) {
  .add-method {
    flex-direction: column;
  }
}

@media (max-width: 1199px) {
  .woocommerce_account_payment_methods .no-methods {
    gap: 16px;
  }
}

@media (min-width: 1200px) {
  .woocommerce_account_payment_methods .no-methods {
    gap: 32px;
  }
}

.woocommerce_account_payment_methods .no-methods {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.woocommerce_account_payment_methods .no-methods_title {
  color: var(--Text-Headings, #fff);
  font-size: var(--Text-FontSize-Heading-sm, 24px);
  font-weight: 500;
  line-height: var(--Text-Lineheight-Heading-sm, 28px);
  text-align: center;
  text-transform: uppercase;
}

.woocommerce_account_payment_methods .no-methods_description {
  max-width: 500px;
  text-align: center;
}

.woocommerce_account_payment_methods .no-methods_types_title {
  color: var(--Text-Headings, #fff);
  text-align: center;
  font-size: var(--Text-FontSize-Heading-xs, 20px);
  text-transform: uppercase;
}

.woocommerce_account_payment_methods .no-methods_types_list {
  display: flex;
  gap: 16px;
}

/* MY PROFILE */
.mt-my-profile {
  display: flex;
  gap: 8px 16px;
  justify-content: start;
  align-items: center;
}

.mt-my-profile__avatar {
  overflow: hidden;
  flex: 1 1 auto;
}

.mt-my-profile__avatar_link {
  text-decoration: none;
  opacity: 0.8;
  transition: opacity 0.3s ease-in-out;
}

.mt-my-profile__avatar_link {
  text-decoration: none;
  opacity: 0.8;
  transition: opacity 0.3s ease-in-out;
}

.mt-my-profile__avatar_link:hover {
  opacity: 1;
}

.mt-my-profile.collapsed {
  flex-direction: column;
}

/* MT-AVATAR */

.mt-avatar__wrapper {
  display: flex;
  gap: 16px;
  align-items: center;
  overflow: hidden;
}

.mt-avatar__initials {
  width: var(--avatar-size, 64px);
  height: var(--avatar-size, 64px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 500;
  background: var(--black-color);
  color: var(--title-color);
  text-transform: uppercase;
  text-align: center;
  border: 1px solid var(--ot-border-color);
  overflow: hidden;
}

.mt-avatar.collapsed .mt-avatar__user-information {
  display: none !important;
}

.mt-user-profile-card__avatar-container .text-14px-line-20px {
  font-size: 16px !important;
}

/* ------- Addons ------- */

.available-info .addons-item:hover {
  border-color: var(--title-color);
}

.available-info .addons-item:focus,
.available-info .addons-item:focus-visible {
  border-color: var(--theme-color);
}

.available-info .addons-item.active {
  border-color: var(--theme-color);
}

/* ------ Plan Addon Updates ------ */

.variation-list .metaInfo li.addon-applied .metaInfo__value {
  text-decoration: line-through;
}

.variation-list .metaInfo li.metaInfo_no-default:not(.addon-applied) {
  display: none;
}

.variation-list .metaInfo li.metaInfo_no-default .metaInfo__label,
.variation-list .metaInfo li.metaInfo_no-default .metaInfo__value {
  display: none;
}

.variation-list .metaInfo span.metaInfo__addon {
  color: var(--theme-color);
}

.variation-list .metaInfo span.metaInfo__addon:before {
  content: " ";
}

.metaInfo li.addon_dependant_meta {
  color: var(--theme-color);
}

.metaInfo li.metaInfo_no-default:before {
  content: url('data:image/svg+xml,<svg width="18" height="13" viewBox="0 0 18 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.54998 13L0.849976 7.29998L2.27498 5.87498L6.54998 10.15L15.725 0.974976L17.15 2.39998L6.54998 13Z" fill="%23ffb34a"/></svg>');
}

/* --------Cart -------- */

.woocommerce-checkout .shop_table .product-total .subscription-price {
  white-space: nowrap;
  padding-left: 8px;
}

/* ------ SWIPPER -----------*/
.faq-carousel {
  background: var(--Surface-Page, #1e1e1e);
  border-radius: 16px;
  padding: 0;
  /* el padding queda solo en header y content */
  overflow: hidden;
}

/* Encabezado global */
.faq-header {
  display: flex;
  justify-content: space-between;
  padding: 16px;
  flex-direction: column;
  gap: 32px;
}

.faq-title {
  color: var(--Text-Headings, white);
  font-size: 20px;
  font-family: Roboto, sans-serif;
  font-weight: 500;
  text-transform: uppercase;
}

/* Controles a la derecha del encabezado */
.faq-controls {
  width: 100%;
  display: flex;
  align-items: center;
  position: relative;
}

/* Estilos flechas y paginación */
.faq-carousel .swiper-button-prev,
.faq-carousel .swiper-button-next {
  position: relative;
  z-index: 1;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.faq-carousel .swiper-button-prev svg,
.faq-carousel .swiper-button-next svg {
  width: 24px;
  height: 24px;
}

.faq-carousel .swiper-button-prev {
  order: 0;
  margin-right: auto;
  left: 0;
}

.faq-carousel .swiper-button-next {
  order: 2;
  margin-left: auto;
  right: 0;
}

/* Quitar flechas por defecto */
.faq-carousel .swiper-button-prev::after,
.faq-carousel .swiper-button-next::after {
  content: none !important;
}

/* Paginación centrada */
.faq-carousel .swiper-pagination {
  order: 1;
  flex: 0 0 auto;
  margin: 0 auto;
  position: static;
  display: flex;
  gap: 4px;
  justify-content: center;
  align-items: center;
  width: auto !important;
}

.faq-carousel .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
  opacity: 0.4;
  transition: opacity 0.3s;
}

.faq-carousel .swiper-pagination-bullet-active {
  opacity: 1;
}

/* Contenido de los slides */
.faq-slide-content {
  padding: 16px;
  color: var(--Text-Headings, white);
  font-family: Roboto, sans-serif;
}

.faq-slide-title {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 16px;
}

.faq-slide-body {
  color: var(--Text-Body, #a8a29e);
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 16px;
}

.faq-link {
  color: var(--Text-Link, #ffd78a);
  text-decoration: underline;
  font-weight: 500;
}

.faq-separator {
  border: none;
  border-top: 1px solid var(--colors-gray-700, #404040);
  margin: 16px 0;
}

.faq-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 500;
}

.faq-ask-btn {
  padding: 4px 12px;
  background: var(--Surface-Dark, #292524);
  border: 1px solid var(--colors-gray-700, #404040);
  border-radius: 4px;
  color: var(--Text-Action-Dark-Solid, #fafafa);
  text-transform: uppercase;
  cursor: pointer;
}

/* ----- Subcription Page ------- */

.progress-circle {
  width: 48px;
  height: 48px;
}

.rotate-svg {
  transform: rotate(-90deg);
}

.circle-label {
  color: #a8a29e;
  font-size: 14px;
  font-weight: 700;
  font-family: Roboto, sans-serif;
}

.separator {
  height: 1px;
  width: 100%;
  background: #292524;
}

.subscription-auto-renew-toggle {
  top: 0px;
}

/* Estado base del ícono */
.subscription-auto-renew-toggle__i {
  border: 1px solid #404040 !important;
  background-color: #1e1e1e !important;
  width: 40px !important;
}

/* Estado ON */
.subscription-auto-renew-toggle--on .subscription-auto-renew-toggle__i::before {
  background: #ffb34a !important;
  transform: translateY(-2px) !important;
  width: 22px;
  height: 22px;
}

/* Estado OFF */
.subscription-auto-renew-toggle--off .subscription-auto-renew-toggle__i::before {
  background: #ffffff !important;
  transform: translateY(-2px) !important;
  width: 22px;
  height: 22px;
}

.subscription-auto-renew-toggle--visually-disabled .subscription-auto-renew-toggle__i {
  background-color: #57534e !important;
  border-color: #57534e !important;
}

.subscription-auto-renew-toggle--visually-disabled.no-active .subscription-auto-renew-toggle__i::before {
  background: #a8a29e !important;
}

/* ---- Mega Admin Addons  ----- */

#wc_checkout_add_ons_add_on_data .mega-admin-addons textarea {
  width: 100%;
}

/* ------ Mega My Account Custon Navigation -------- */
.mega-navigation .mega-navigation-list {
  display: flex;
  flex-direction: row;
  gap: 24px;
  border-bottom: 1px solid #404040;
}

.mega-navigation .woocommerce-MyAccount-navigation li.is-active {
  color: var(--theme-color);
  border-bottom: 1px solid #ffb34a;
}

.mega-navigation .woocommerce-MyAccount-navigation li.is-active a {
  background-color: transparent;
  border-color: transparent;
  color: var(--theme-color);
}

.mega-navigation .woocommerce-MyAccount-navigation li a {
  color: #ffffff;
  border: none;
  background-color: transparent;
  padding: 12px 0;
}

/* ------- Mega Acordion -------*/
.subscription-orders-accordion {
  border: 2px solid var(--smoke-color2, #1e1e1e);
}

.mega-accordion .mega-accordion-item {
  border: 0;
  background: transparent;
}

.mega-accordion .mega-accordion-item:not(:last-of-type) {
  border-bottom: 1px solid var(--surface-dark, #292524);
}

.mega-accordion .mega-accordion-button {
  background: var(--smoke-color2, #1e1e1e);
  padding: 16px;
}

.mega-accordion .accordion-button::after {
  display: none !important;
}

.mega-accordion .accordion-button .accordion-arrow {
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}

.mega-accordion .accordion-button:not(.collapsed) .accordion-arrow {
  transform: rotate(180deg);
}

/* ---- Reset Accordion Styles ---*/
.mega-accordion .accordion-button:not(.collapsed) {
  background: var(--body-bg, #131210);
  box-shadow: none;
  padding: 16px;
}

.mega-accordion .accordion-item:first-of-type .accordion-button,
.mega-accordion .accordion-item:last-of-type .accordion-button.collapsed {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.mega-accordion .accordion-button:focus {
  z-index: initial !important;
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

.mega-accordion .accordion-body {
  background: var(--body-bg, #131210);
  border-top: 1px solid var(--surface-dark, #292524);
}

.mega-accordion .accordion-body-list .accordion-body-list-item:not(:last-child) {
  border-bottom: 1px solid var(--surface-dark, #292524);
}

/* --- End Reset Accordion Styles -----*



/* ----- Modal Subscription ----*/

/* --- Card Layout & Styles --- */
.subscription-grid {
  gap: 8px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(177px, 1fr));
  justify-content: center;
  justify-items: center;
}

@media screen and (max-width: 576px) {
  .subscription-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }
}

.subscription-card {
  cursor: pointer;
  padding: 12px;
  width: 100%;
}

.subscription-card__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.subscription-card.active {
  background: var(--Surface-Dark, #292524);
  border-radius: var(--Border-Radius-lg, 12px);
}

.checkmark-icon {
  display: none;
  height: 24px;
  width: 24px;
  z-index: 5;
}

.subscription-card.active .checkmark-icon {
  display: block;
}

/* --- Dot Colors by Status --- */
.dot-status-active {
  color: var(--theme-color3);
}

.dot-status-cancelled {
  color: var(--error-color);
}

.dot-status-breached {
  color: var(--error-color);
}

.dot-status-reset {
  color: var(--error-color);
}

.dot-status-passed {
  color: var(--Colors-Gray-200);
}

.dot-status-upgraded {
  color: var(--Colors-Gray-200);
}

.dot-status-default {
  color: var(--Colors-Gray-200);
}

.dot-status-draft {
  color: var(--Colors-Gray-200);
}

.dot-status-expired {
  color: var(--error-color);
}

.dot-status-hold {
  color: #a8a29e;
}

.dot-status-pending {
  color: #94a3b8;
}

.dot-status-pending-cancel {
  color: #94a3b8;
}

.dot-status-pending-activation {
  color: var(--theme-color);
}

/* --- Dot Position --- */
.logo-container {
  display: inline-block;
  position: relative;
  z-index: 1;
  margin-left: 0;
}

.logo-container+.logo-container {
  margin-left: -10px;
  z-index: 2;
}

.dot-indicator {
  bottom: 0;
  height: 12px;
  right: 0;
  transform: translate(0px, -5px);
  width: 12px;
  z-index: 2;
}

/* --- Modal Scroll Layout ----- */
@media (min-width: 768px) {
  .modal-subcription .modal-body {
    max-height: 515px;
  }
}

.modal-subcription .modal-header,
.modal-subcription .modal-footer {
  flex-shrink: 0;
}

.modal-subcription .modal-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
}

.modal-subcription .modal-footer {
  border: 0;
}

/* --- Scroll Area --- */
.subscription-scroll-area {
  flex: 1 1 auto;
  overflow-y: auto;
  padding-right: 8px;
}

.modal-subcription .subscription-scroll-area {
  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
  scrollbar-width: thin;
}

.modal-subcription .subscription-scroll-area::-webkit-scrollbar {
  width: 8px;
}

.modal-subcription .subscription-scroll-area::-webkit-scrollbar-track {
  background: transparent;
}

.modal-subcription .subscription-scroll-area::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.15);
  border-radius: 4px;
}

.modal-subcription .subscription-scroll-area::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.25);
}

/* --- Estilo del selector de estado (modal-subcription) --- */
/* --- Estilo del selector de estado (modal-subcription) --- */
#subscription-status-select,
#mega-navigation-select {
  display: flex;
  height: 48px;
  padding: var(--Spacing-sm, 12px) var(--Spacing-md, 16px);
  align-items: flex-start;
  gap: var(--Scale-400, 16px);
  align-self: stretch;

  border-radius: var(--Border-Radius-lg, 12px);
  border: var(--Border-Width-sm, 1px) solid var(--Colors-Gray-700, #404040);
  background: rgba(30, 30, 30, 0.7);

  color: #ffffff;
  font-size: 16px;
  font-family: Roboto, sans-serif;
  font-weight: 500;
  line-height: 24px;

  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 8L0 0h12L6 8z' fill='%23FFFFFF'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 12px 8px;
}

/* Accesibilidad en Firefox */
#subscription-status-select:-moz-focusring,
#mega-navigation-select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #ffffff;
}

/* --- Opciones del dropdown --- */
#subscription-status-select option,
#mega-navigation-select option {
  background-color: #ffffff;
  color: #000000;
}

/* Opción seleccionada */
#subscription-status-select option:checked,
#mega-navigation-select option:checked {
  background-color: #3b82f6;
  color: white;
}

/* Hover en algunos navegadores */
#subscription-status-select option:hover,
#mega-navigation-select option:hover {
  background-color: #e5e5e5;
  color: black;
}

/* --- End Modal Subscription  ----- */

/* --- Google Site Kit - Custom Sign In Btn  ----- */

.google-signin-btn {
  position: relative;
  width: 100%;
  height: 48px;
  overflow: hidden;

  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 12px;

  border-radius: var(--Border-Radius-lg, 12px);
  border: var(--Border-Width-md, 2px) solid var(--Surface-Light, #fff);
  background: var(--Surface-Light, #fff);
}

.google-signin-btn:before {
  content: url('data:image/svg+xml,<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.9181 13.63V10.438H20.9341C21.0755 11.0113 21.148 11.5995 21.1501 12.19C21.2201 13.297 21.0565 14.4063 20.6699 15.4459C20.2832 16.4855 19.6822 17.4321 18.9059 18.2243C18.1295 19.0165 17.1952 19.6365 16.1636 20.0441C15.132 20.4517 14.0263 20.6377 12.9181 20.59C10.6457 20.59 8.46642 19.6873 6.85961 18.0805C5.2528 16.4737 4.3501 14.2944 4.3501 12.022C4.3501 9.74968 5.2528 7.57037 6.85961 5.96356C8.46642 4.35675 10.6457 3.45405 12.9181 3.45405C15.0479 3.42206 17.1061 4.22293 18.6541 5.68605L16.2541 8.08605C15.3589 7.25439 14.1758 6.80267 12.9541 6.82605C11.5633 6.82605 10.2295 7.37854 9.24603 8.36198C8.26259 9.34542 7.7101 10.6792 7.7101 12.07C7.7101 13.4608 8.26259 14.7946 9.24603 15.7781C10.2295 16.7615 11.5633 17.314 12.9541 17.314C14.0463 17.4039 15.1331 17.0856 16.0042 16.4206C16.8753 15.7557 17.4689 14.7913 17.6701 13.714L12.9181 13.63Z" fill="black"/></svg>');
  width: 24px;
  height: 24px;
}

.google-signin-btn:after {
  content: "Continue with Google";

  color: var(--Text-Action-Light-Solid, #292524);
  font-family: var(--Type-Font-Family-Body, Roboto);
  font-size: var(--Text-FontSize-Body-md, 16px);
  font-style: normal;
  font-weight: 500;
  line-height: var(--Text-Lineheight-Body-md, 24px);
  /* 150% */
  text-transform: uppercase;

  text-wrap: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.google-signin-btn .googlesitekit-sign-in-with-google__frontend-output-button {
  position: absolute;
  inset: 0;
  opacity: 0.001;
  filter: brightness(5);
}

.google-signin-btn .googlesitekit-sign-in-with-google__frontend-output-button [id$="overlay"],
/* Firefox uses an overlay div */
.google-signin-btn .googlesitekit-sign-in-with-google__frontend-output-button iframe

/* Chrome uses the iframe content div */
  {
  scale: 10;
}

/* --- END Google Site Kit - Custom Sign In Btn  ----- */

/* ------ Page No Order ---- */

.no-order.stepper {
  height: 32px;
}

.stepper-line {
  width: 78%;
  height: 4px;
  top: 0px;
  position: absolute;
  background: var(--Colors-Gray-700, #404040);
  border-radius: 4px;
  left: 50%;
  transform: translateX(-50%);
}

.stepper-numbers-wrapper {
  width: 78%;
  left: 0px;
  top: 0;
  position: absolute;
  justify-content: space-between;
  align-items: center;
  display: inline-flex;
  transform: translateY(-12px);
  right: 0;
  margin: 0 auto;
}

.stepper-numbers-circle {
  width: 32px;
  height: 32px;
  position: relative;
  background: var(--Surface-Body, #131210);
  overflow: hidden;
  border-radius: 64px;
  outline: 2px var(--Surface-Primary, #ffb34a) solid;
  outline-offset: -2px;
}

.stepper-numbers-text {
  left: 11px;
  top: 4px;
  position: absolute;
  text-align: center;
  color: var(--Text-Action-Primary-Text, #ffb34a);
  font-size: 16px;
  font-family: Roboto;
  font-weight: 700;
  line-height: 24px;
  word-wrap: break-word;
}

@media (max-width: 940px) {
  .block-object-rules {
    flex-direction: column;
  }
}

.btn-challenge {
  width: 100%;
}

@media (max-width: 991px) {
  .btn-challenge {
    /* width: max-content; */
  }
}

/* ------ End Page No Order ------*/

/*** Custom Pagination */

.pagination-arrow.prev-disable {
  padding: 4px;
  background: var(--Surface-Dark, #292524);
  border-radius: 4px;
  outline: 1px var(--Colors-Gray-700, #404040) solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
  opacity: 0.3;
  pointer-events: none;
}

.pagination-arrow.prev-active {
  padding: 4px;
  background: var(--Surface-Dark, #292524);
  border-radius: 4px;
  outline: 1px var(--Colors-Gray-700, #404040) solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.pagination-arrow.next-active {
  padding: 4px;
  background: var(--Surface-Dark, #292524);
  border-radius: 4px;
  outline: 1px var(--Colors-Gray-700, #404040) solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.pagination-arrow.next-disable {
  padding: 4px;
  background: var(--Surface-Dark, #292524);
  border-radius: 4px;
  outline: 1px var(--Colors-Gray-700, #404040) solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
  opacity: 0.3;
  pointer-events: none;
}

a.pagination-number-wrapper {
  width: 28px;
  padding: 4px 12px;
  background: var(--Surface-Dark, #292524);
  border-radius: 4px;
  outline: 1px var(--Colors-Gray-700, #404040) solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.pagination-number-wrapper {
  width: 28px;
  padding: 4px 12px;
  background: #1c1917;
  border-radius: 4px;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.pagination-number {
  color: var(--Text-Action-Dark-Solid, #fafafa);
  font-size: 14px;
  font-family: Roboto;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 20px;
  word-wrap: break-word;
}

a.pagination-number {
  width: 28px;
  padding: 4px 12px;
  background: var(--Surface-Dark, #292524);
  border-radius: 4px;
  outline: 1px var(--Colors-Gray-700, #404040) solid;
  outline-offset: -1px;
  justify-content: center;
  align-items: center;
  display: flex;
}

/* ------ Stripe Checkbox - Updates Subscriptions Payment Method to New Card */
#add_payment_method #payment ul.payment_methods input[type="checkbox"]#wc-stripe-update-subs-payment-method-card {
  appearance: none;
  -webkit-appearance: none;
  display: inline-block;
  visibility: visible;
  opacity: 1;
  cursor: pointer;
  width: 18px;
  height: 18px;
  border: 2px solid var(--theme-color);
  border-radius: 4px;
  padding: 0px;
  transform: unset;
  transition: background-color 0.3s ease-in-out;
}

#add_payment_method #payment ul.payment_methods input[type="checkbox"]#wc-stripe-update-subs-payment-method-card:checked {
  content: "";
  background-image: url('data:image/svg+xml,<svg width="11" height="8" viewBox="0 0 11 8" fill="black" xmlns="http://www.w3.org/2000/svg"><path d="M3.79862 5.95955C3.56125 6.1967 3.17661 6.19661 2.93935 5.95935L1.23284 4.25284C0.992563 4.01256 0.603211 4.01188 0.362087 4.2513V4.2513C0.119756 4.49193 0.119063 4.88366 0.360543 5.12514L2.79623 7.56083C3.1125 7.87709 3.62527 7.87709 3.94153 7.56083L10.3317 1.17062C10.5718 0.930539 10.5718 0.541287 10.3317 0.301203V0.301203C10.0917 0.0612002 9.70264 0.0611083 9.46252 0.300998L3.79862 5.95955Z" stroke="black" stroke-width="0.8" fill="black"/></svg>');
  background-size: 11px;
  background-repeat: no-repeat;
  background-position: center;
  background-color: var(--theme-color);
}

.list-reboot {
  list-style-type: none;
  margin-block: 0;
  padding: 0;
}

/*------------- (step 1) -------------------- */

.product-section__header {
  display: flex;
  align-items: center;
  gap: 8px;
}

.plan-includes__title,
.product-section__title {
  font-size: var(--Text-FontSize-Body-lg, 20px);
  font-weight: 700;
  line-height: var(--Text-Lineheight-Body-lg, 32px);
}

.product-section__list {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 8px;
}

ul.product-section__list>li {
  list-style: none;
}

ul.product-section__list li:not(.glide__slide) {
  display: inherit;
}

ul.product-section__list {
  padding-left: 0;
  margin-bottom: 0;
}

.mt-account-type-points {
  display: flex;
  justify-content: center;
  padding-top: 20px;
}

.mt-account-type-points__pointer {
  width: 15px !important;
  height: 15px !important;
}

.mt-account-type-points__pointer.glide__bullet--active {
  background-color: #8c8c8c !important;
}

.mt-account-type-points__pointer:not(.glide__bullet--active) {
  background-color: #3d3d3d !important;
}

@media (max-width: 768px) {
  .product-section__list {
    grid-auto-flow: row;
    grid-template-columns: 1fr;
    grid-auto-columns: unset;
  }

  .product-section__list.product-section__list_grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/*-------------New Checkout (step 2) -------------------- */

.mt-card-plataform {
  min-width: 247px;
}

.mt-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px 16px;
}

@media (max-width: 767.98px) {
  .mt-meta-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mt-card-plataform {
    width: 100%;
  }
}

/* ≤ 575px → 1 columna */
@media (max-width: 575.98px) {
  .mt-meta-grid {
    grid-template-columns: 1fr;
  }
}

.mt-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mt-meta-text {
  line-height: 1.2;
}

.mt-meta-label {
  display: block;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  color: #ffffff;
}

.mt-meta-value {
  display: block;
  color: var(--Text-Body, #a8a29e);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}

.addons-header {
  padding-left: 30px;
}

.available-info .addons-item.addons-item-new {
  margin-bottom: 0;
}

.available-info .addons-item-new:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 16px;
  width: 18px;
  height: 18px;
  border: 2px solid var(--theme-color);
  border-radius: 4px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  text-align: center;
  line-height: 11px;
  padding: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
}

.mt-billing-card .iti {
  width: 100%;
}

.pac-hidden .pac-container {
  display: none !important;
}

.pac-container {
  z-index: 999999 !important;
}

.mt-payment-cards .woocommerce-SavedPaymentMethods.wc-saved-payment-methods.default-only {
  display: flex;
  flex-direction: row;
}

.mt-payment-cards.mt-payment-cards-v2 .woocommerce-SavedPaymentMethods.wc-saved-payment-methods.default-only {
  display: flex;
  flex-direction: column;
}

@media (max-width: 767.98px) {
  .mt-payment-cards .woocommerce-SavedPaymentMethods.wc-saved-payment-methods.default-only {
    flex-direction: column;
  }

  #mt-billing-change {
    transform: translateY(-60px);
  }
}

.mt-payment-cards .saved-cc-badge {
  position: absolute;
  right: 0;
  top: 0;
}

.mt-payment-cards .woocommerce-SavedPaymentMethods-token {
  flex: 1 1 0;
  /*border: 1px solid var(--Colors-Gray-700, #404040);*/
}

.mt-payment-cards .woocommerce-SavedPaymentMethods-new {
  border-radius: 16px;
  flex: 1 1 0;
  display: flex;
  /*border: 1px solid var(--Colors-Gray-700, #404040);*/
}

.mt-payment-cards .saved-cc-content {
  align-items: start;
}

.mt-payment-cards .wc-upe-form.wc-payment-form {
  border-radius: 16px;
  padding: 16px !important;
  /*border: 1px solid var(--Colors-Gray-700, #404040);*/
}

.mt-payment-cards .saved-cc-body {
  gap: 4px;
}

.review-container .form-check input.form-check-input {
  border: 2px solid var(--theme-color);
  border-radius: 4px;
  height: 18px;
  transform: translateY(7px);
}

.review-container .form-check {
  margin-bottom: 0 !important;
}

.review-container .form-check .form-check-input {
  display: inline-block;
  width: 18px;
  height: 18px;
  padding: 0;
  -webkit-box-shadow: unset;
  box-shadow: unset;
  border-radius: 100%;
  background-color: transparent;
  border: 1px solid var(--theme-color);
  margin-right: 10px;
  margin-bottom: 0;
  margin-left: 2px;
  border-radius: 0;
  cursor: pointer;
  -webkit-transform: translateY(7px);
  transform: translateY(7px);
  visibility: visible;
  opacity: 1;
}

.review-container .form-check .form-check-input:checked {
  background-color: var(--theme-color);
  border-color: var(--theme-color);
  background-size: 11px;
}

.review-container .form-check .form-check-input:checked[type="checkbox"] {
  background-image: url('data:image/svg+xml,<svg width="11" height="8" viewBox="0 0 11 8" fill="black" xmlns="http://www.w3.org/2000/svg"><path d="M3.79862 5.95955C3.56125 6.1967 3.17661 6.19661 2.93935 5.95935L1.23284 4.25284C0.992563 4.01256 0.603211 4.01188 0.362087 4.2513V4.2513C0.119756 4.49193 0.119063 4.88366 0.360543 5.12514L2.79623 7.56083C3.1125 7.87709 3.62527 7.87709 3.94153 7.56083L10.3317 1.17062C10.5718 0.930539 10.5718 0.541287 10.3317 0.301203V0.301203C10.0917 0.0612002 9.70264 0.0611083 9.46252 0.300998L3.79862 5.95955Z" stroke="black" stroke-width="0.8" fill="black"/></svg>');
}

.review-container .form-check .form-check-label {
  display: inline-block !important;
  color: var(--title-color);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  padding-left: 0;
}

.review-container .form-check .form-check-label a {
  color: var(--theme-color);
  text-decoration: underline;
}

.review-container .form-check .form-check-label a:hover {
  color: var(--title-color);
}

.review-container .form-check .form-check-label strong {
  font-weight: 500;
  color: var(--title-color);
}

.place-order .privacy.woocommerce-invalid.woocommerce-invalid-required-field {
  flex-direction: column;
  align-items: stretch !important;
}

.place-order .privacy.woocommerce-invalid.woocommerce-invalid-required-field .invalid-feedback.privacy-policy-error {
  margin-bottom: 8px;
  margin-top: -8px;
}

.place-order .woocommerce-validated .invalid-feedback.privacy-policy-error {
  display: none !important;
}

.mt-payment-cards .woocommerce-SavedPaymentMethods-saveNew {
  background-color: transparent !important;
}

/* ===========================
   HEADER + NAV + MOBILE DRAWER
   =========================== */

/* Evita doble sticky del wrapper del tema */
.ot-header .sticky-wrapper {
  position: static;
}

.mega-navbar {
  --nav-h: 72px;
  min-height: var(--nav-h);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  gap: 8px;
  backdrop-filter: blur(12.5px);
  -webkit-backdrop-filter: blur(12.5px);
  position: sticky;
  top: 0;
  z-index: 1000;
}

@media (min-width: 992px) {
  .mega-navbar {
    --nav-h: 100px;
  }
}

.mega-navbar>.nav-left,
.mega-navbar>.nav-tabs,
.mega-navbar>.nav-right {
  flex: 0 0 auto;
  min-width: 0;
  height: var(--nav-h);
  display: flex;
  align-items: center;
}

.mega-navbar .nav-right {
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.mega-navbar .nav-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Logo cuadrado oculto por defecto */
.mega-navbar .brand-tile {
  display: none;
}

/* Logo wordmark visible por defecto */
.mega-navbar .brand-wordmark {
  display: inline-flex;
}

/* Cuando la pantalla sea 1140px o menor */
@media (max-width: 1199.98px) {
  .mega-navbar .brand-tile {
    display: inline-flex;
  }

  .mega-navbar .brand-wordmark {
    display: none;
  }
}

.mega-navbar .brand-tile img {
  width: 60px;
  height: 60px;
  object-fit: cover;
}

@media (min-width: 992px) {
  .mega-navbar .brand-wordmark img {
    height: 60px;
    width: auto;
    display: block;
  }
}

.mega-navbar .nav-tabs {
  display: none;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: none;
}

@media (min-width: 1024.98px) {
  .mega-navbar .nav-tabs {
    display: inline-flex;
  }
}

.mega-navbar .nav-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 12px;
  text-transform: uppercase;
  color: #fafafa;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-decoration: none;
}

.mega-navbar .nav-tab.is-active {
  background: #1e1e1e;
}

.mega-navbar .nav-tab[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.mega-navbar .icon-btn {
  padding: 12px;
  border-radius: 12px;
  background: #292524;
  outline: 1px solid #404040;
  outline-offset: -1px;
  border: 0;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.mega-navbar .icon-btn svg {
  display: block;
}

.mega-navbar .burger {
  display: inline-flex;
}

@media (min-width: 1024.98px) {
  .mega-navbar .burger {
    display: none;
  }
}

@media (max-width: 1024.98px) {
  .mega-navbar .logout {
    display: none;
  }
}

.mega-navbar .mega-mobile-menu {
  position: static;
  flex: 0 0 100%;
  width: 100%;
  order: 999;
  backdrop-filter: blur(8px);
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: height 520ms cubic-bezier(0.22, 0.85, 0.36, 1),
    opacity 520ms linear;
  will-change: height;
  pointer-events: none;
}

.mega-navbar .mega-mobile-menu.is-open {
  opacity: 1;
  pointer-events: auto;
}

.mega-navbar .mega-mobile-menu .mm-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 16px 0;
}

.mega-navbar .mega-mobile-menu .mm-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.mega-navbar .mega-mobile-menu .mm-link,
.mega-navbar .mega-mobile-menu .nav-tab {
  display: block;
  width: 100%;
  padding: 12px 16px;
  border-radius: 12px;
  text-transform: uppercase;
  color: #fafafa;
  text-decoration: none;
  text-align: center;
}

.mega-navbar .mega-mobile-menu .mm-link.is-active {
  outline: 1px solid #404040;
}

.mega-navbar .mega-mobile-menu .mm-link[disabled] {
  opacity: 0.5;
  pointer-events: none;
}

@media (min-width: 1024.98px) {
  .mega-navbar .mega-mobile-menu {
    display: none !important;
  }
}

/*--------- Modal Thanksyou -------*/

#order-copy-chip {
  cursor: pointer;
}

body.mt-checkout-frozen {
  overflow: hidden !important;
}

body.mt-checkout-frozen .woocommerce-checkout,
body.mt-checkout-frozen form.checkout {
  pointer-events: none;
}

body.mt-checkout-frozen .modal,
body.mt-checkout-frozen .modal * {
  pointer-events: auto;
}

.modal {
  z-index: 1999 !important;
}

.modal-backdrop {
  z-index: 1998 !important;
}

.mt-subscriptions {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* cuando estamos colocando la orden: sin clicks ni foco detrás */
body.mt-placing form.checkout,
body.mt-placing .woocommerce-checkout {
  pointer-events: none;
}

/* botón deshabilitado: feedback visual */
#place_order[disabled] {
  cursor: not-allowed;
  opacity: 0.7;
}

/*** Account Overview – FeatureContent (interior) ***/
/* ===== TABS / CARRUSEL ===== */
.mt-feature-tabs {
  display: block;
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.mt-tabs-row {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
}

.mt-tabs-viewport {
  flex: 1 1 0%;
  min-width: 0;
  width: 0;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.mt-toggle-group {
  flex: 1 1 0%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  box-sizing: border-box;
}

.mt-toggle-group::-webkit-scrollbar {
  display: none;
}

.mt-toggle-group>.mt-toggle-button {
  scroll-snap-align: start;
}

.mt-tabs-gradient {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 48px;
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease;
}

.mt-tabs-gradient--left {
  left: 0;
  background: linear-gradient(270deg,
      rgba(19, 18, 16, 0) 0%,
      var(--Surface-Body, #131210) 100%);
}

.mt-tabs-gradient--right {
  right: 0;
  background: linear-gradient(90deg,
      rgba(19, 18, 16, 0) 0%,
      var(--Surface-Body, #131210) 100%);
}

.mt-tabs-row .mt-btn[disabled] {
  opacity: 0.45;
}

/* ===== CHIP (toggle) ===== */
.mt-toggle-button {
  display: inline-flex;
  padding: 12px 16px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 12px;
  border: 1px solid var(--Colors-Gray-700, #404040);
  background: var(--Surface-Dark, #292524);
  color: var(--Colors-Gray-400, #a8a29e);
  font: 500 16px/24px Roboto, system-ui, sans-serif;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.15s ease, border-color 0.15s ease,
    color 0.15s ease, box-shadow 0.15s ease;
}

.mt-toggle-button:hover {
  border-color: var(--Primary-400, #ffb34a);
  background: var(--Primary-400, #ffb34a);
  color: var(--Surface-Body, #131210);
}

.mt-toggle-button.active,
.mt-toggle-button[aria-selected="true"] {
  border-color: var(--Primary-500, #f1a035);
  background: var(--Primary-500, #f1a035);
  color: var(--Surface-Body, #131210);
}

.mt-toggle-button:focus-visible {
  outline: 0;
  border-color: var(--White, #fff);
  background: var(--Surface-Primary, #ffb34a);
  color: var(--Surface-Body, #131210);
}

.mt-toggle-button[disabled],
.mt-toggle-button.disabled,
.mt-toggle-button.is-disabled,
.mt-toggle-button[aria-disabled="true"] {
  pointer-events: none;
  cursor: not-allowed;
  border-color: var(--Surface-Disabled, #57534e);
  background: var(--Surface-Disabled, #57534e);
  color: var(--surface-dark, #292524);
}

/* ===== PANEL ===== */
.mt-feature-panel {
  padding: 16px;
  background: var(--Surface-Page, #1e1e1e);
  border-radius: 16px;
  /*border: 1px solid var(--Colors-Gray-700, #404040);*/
  min-height: 96px;
  color: #e5e5e5;
  box-sizing: border-box;
}

.mt-feature-panel[hidden] {
  display: none !important;
}

/* ===== CONTENIDO DEL PANEL ===== */
.mt-summary {
  align-self: stretch;
  display: inline-flex;
  padding: 0 16px;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  align-content: center;
}

.mt-summary__col {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.mt-summary__title {
  color: var(--Text-Body, #a8a29e);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

.mt-summary__title--center {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.mt-summary__divider {
  height: 219px;
  transform-origin: top left;
  border-left: 1px solid var(--Colors-Gray-700, #404040);
  opacity: 0.9;
}

@media (max-width: 767.98px) {
  .mt-summary__divider {
    display: none;
  }
}

.mt-summary__avg {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 48px;
}

.mt-summary__avg-label {
  color: var(--Text-Body, #a8a29e);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

.mt-summary__avg-value {
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

.mt-summary__avg-value--success {
  color: var(--Text-Success, #2dd4bf);
}

.mt-summary__avg-value--error {
  color: var(--Error-500, #f43f5e);
}

.mt-summary__ratio {
  color: var(--Text-Headings, #fff);
  text-transform: uppercase;
  text-align: center;
}

.mt-summary__ratio-value {
  font-size: 48px;
  line-height: 60px;
  font-weight: 500;
}

.mt-summary__nodata {
  color: var(--Text-Headings, #fff);
  font-size: 20px;
  line-height: 24px;
  text-align: center;
  text-transform: uppercase;
}

.mt-rr {
  width: 100%;
  max-width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
}

.mt-rr__head {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mt-rr-title {
  font: 700 16px/24px Roboto, system-ui, sans-serif;
}

.mt-rr-title.success {
  color: var(--Text-Success, #2dd4bf);
}

.mt-rr-title.error {
  color: var(--Error-500, #f43f5e);
}

/* ====== Dual bar ====== */
.mt-dualbar {
  grid-column: 1 / -1;
  position: relative;
  height: 8px;
  background: var(--Colors-Gray-700, #404040);
  border-radius: 4px;
  overflow: hidden;
  --split: 50%;
}

.mt-dualbar.has-data {
  background: transparent;
}

.mt-dualbar::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 4px;
  left: var(--split);
  transform: translateX(-50%);
  background: var(--Surface-Page, #1e1e1e);
  pointer-events: none;
}

.mt-dualbar--reward-full::after,
.mt-dualbar--risk-full::after {
  display: none;
}

.mt-dualbar__seg {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 0%;
}

.mt-dualbar__seg--reward {
  left: 0;
  background: var(--Success-400, #2dd4bf);
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.mt-dualbar__seg--risk {
  right: 0;
  background: var(--Error-500, #f43f5e);
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.mt-dualbar__seg.is-full {
  border-radius: 4px;
}

.is-empty.mt-dualbar {
  --split: 50% !important;
}

.mt-dualbar.is-empty .mt-dualbar__seg {
  width: 0%;
}

/* ===== DONUT SVG ===== */
.mt-donut {
  --size: 184px;
  --inner: var(--Colors-Gray-950, #0a0a0a);
  --mt-donut-color: var(--Success-400, #2dd4bf);
  --mt-donut-value: 0;
  position: relative;
  width: var(--size);
  height: var(--size);
}

.mt-donut__svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

.mt-donut__track,
.mt-donut__value {
  fill: none;
  stroke-width: 6;
}

.mt-donut__track {
  stroke: var(--Colors-Gray-800, #292524);
}

.mt-donut__value {
  stroke: var(--mt-donut-color);
  stroke-linecap: round;
  stroke-dasharray: 100;
  stroke-dashoffset: calc(100 - var(--mt-donut-value));
  transition: stroke-dashoffset 0.3s ease;
}

.mt-donut__center {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width: 62%;
  height: 62%;
  border-radius: 9999px;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mt-donut__percent {
  color: var(--mt-donut-color);
  font-size: 48px;
  line-height: 60px;
  font-weight: 500;
  text-transform: uppercase;
}

.mt-donut.is-success {
  --mt-donut-color: var(--Success-400, #2dd4bf);
}

.mt-donut.is-error {
  --mt-donut-color: var(--Error-500, #f43f5e);
}

.mt-donut.is-empty .mt-donut__value {
  stroke-dashoffset: 100;
}

.mt-donut.is-empty .mt-donut__percent {
  color: var(--Text-Body, #a8a29e);
}

/* ===== MOBILE: stack + center ===== */
@media (max-width: 767.98px) {
  .mt-summary {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 24px;
    padding: 0 12px;
  }

  .mt-summary__col {
    width: 100%;
    align-items: center;
    text-align: center;
    gap: 16px;
  }

  .mt-summary__divider {
    display: block !important;
    width: 100%;
    height: 0;
    border-top: 1px solid var(--Colors-Gray-700, #404040);
    opacity: 0.6;
    transform: none;
    margin: 8px 0;
  }

  .mt-rr {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
  }

  .mt-dualbar {
    width: 100%;
  }
}

/****** Account Overview ---- Dayly Journal */

/* ===== Daily Journal (GRID) ===== */
#mt-daily-journal {
  --dj-bg: var(--Surface-Page, #1e1e1e);
  --cols: 14;
  --cols-other: 13;
  --col-w: 95px;
  --dj-viewport: 784px;
  box-sizing: border-box;
  overflow: hidden;
  /* clip, el scroll vive en .dj-scroll */
}

/* Viewport: fija el ancho visible para forzar scroll-x si no cabe */
#mt-daily-journal .dj-viewport {
  inline-size: var(--dj-viewport, 784px);
  max-inline-size: 100%;
}

#mt-daily-journal .dj-clip {
  position: relative;
  overflow: hidden;
  border-radius: inherit;
  background: var(--dj-bg);
  isolation: isolate;
}

#mt-daily-journal .dj-scroll {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  /* scroll horizontal */
  overflow-y: hidden;
  background: var(--dj-bg);
  border-radius: inherit;
  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
  scrollbar-width: thin;
}

/* WebKit */
#mt-daily-journal .dj-scroll::-webkit-scrollbar {
  height: 8px;
}

#mt-daily-journal .dj-scroll::-webkit-scrollbar-track {
  background: transparent;
}

#mt-daily-journal .dj-scroll::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 8px;
}

/* Grid suma de anchos -> obliga scroll-x */
#mt-daily-journal .dj-grid {
  display: grid;
  grid-template-columns: 60px repeat(var(--cols-other), var(--col-w));
  inline-size: max-content;
  min-inline-size: max-content;
  background: var(--dj-bg);
}

/* Tipografías */
#mt-daily-journal .dj-head {
  color: var(--Text-Headings, #fff);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.25;
  background: var(--dj-bg);
  padding: 0.75rem 0.9rem;
}

#mt-daily-journal .dj-cell {
  color: var(--Text-Body, #a8a29e);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  background: var(--dj-bg);
  padding: 0.75rem 0.9rem;
  min-width: 0;
  word-break: break-word;
  white-space: normal;
}

/* Bordes solo por fila */
#mt-daily-journal .dj-headrow {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

#mt-daily-journal .dj-row {
  border-bottom: var(--Type-letter-spacing-sm, 1px) solid var(--Colors-Gray-800, #292524);
}

#mt-daily-journal .dj-row.is-last {
  border-bottom: 0;
  /* quitar borde al último visible de la página */
}

/* Alineaciones */
#mt-daily-journal .is-left {
  text-align: left;
}

#mt-daily-journal .is-right {
  text-align: right;
}

/* Icono (clickable) */
#mt-daily-journal .mt-dj-visibility {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

/* Paginado */
#mt-daily-journal .dj-pager {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
  padding: 0.5rem 0 0;
  align-items: center;
}

#mt-daily-journal .dj-btn {
  background: #0f0f10;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 0.5rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.8rem;
}

.dj-btn.mt-dj-prev,
.dj-btn.mt-dj-next {
  padding: 4px !important;
}

#mt-daily-journal .dj-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

#mt-daily-journal .dj-btn.active {
  background: #1f1f20;
}

/* Overlay */

.daily-journal {
  position: relative;
  overflow: hidden;
}

/* Cuando no hay datos */
.daily-journal.is-empty {
  cursor: not-allowed;
}

/* Overlay (mismo look & feel que el chart, con clases propias) */
.daily-journal__overlay {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  pointer-events: all;
  cursor: not-allowed;
}

.daily-journal__overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #1e1e1e;
  opacity: 0.7;
}

/* Texto del overlay */
.dj-overlay__text {
  position: relative;
  z-index: 1;
  color: #fff;
  padding: 12px 16px;
  width: 220px;
  text-align: center;
  font-size: var(--Text-FontSize-Body-md, 16px);
  font-weight: 500;
  line-height: var(--Text-Lineheight-Body-md, 24px);
}

/* Feedback form */

/* Popover (tooltip) sin overlay */
.mt-popover {
  position: fixed;
  inset: 0;
  z-index: 10000;
  pointer-events: none;
}

.mt-popover[hidden] {
  display: none;
}

.mt-popover .mt-modal__panel {
  position: absolute;
  pointer-events: auto;
  width: min(310px, calc(100% - 32px));
  padding: 16px;
  background: var(--Surface-Body, #131210);
  border-radius: 16px;
  outline: 1px solid var(--Colors-Gray-700, #404040);
  outline-offset: -1px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  color: var(--Text-Headings, #fff);
}

.mt-modal__close {
  cursor: pointer;
}

/* Flecha (apunta al icono) */
/* Base: sin posición ni rotación fija */
.mtfb-arrow {
  position: absolute;
  width: 16px;
  height: 16px;
  background: var(--Surface-Body, #131210);
  border-left: 1px solid var(--Colors-Gray-700, #404040);
  border-top: 1px solid var(--Colors-Gray-700, #404040);
}

/* Panel ABajo del icono → flecha en el borde SUPERIOR del panel, apuntando hacia arriba */
.mtfb-arrow[data-side="top"] {
  top: -8px;
  transform: rotate(45deg);
}

/* Panel AArriba del icono → flecha en el borde INFERIOR del panel, apuntando hacia abajo */
.mtfb-arrow[data-side="bottom"] {
  bottom: -8px;
  transform: rotate(225deg);
}

/* Caritas con tus clases de icono */

.mtfb-mood [data-mood] {
  cursor: pointer;
}

.mtfb-mood [data-mood].is-active {
  outline: 2px solid var(--Surface-Primary, #ffb34a);
}

.mtfb-mood [data-mood]:focus-visible {
  outline: 2px solid #fff;
}

.mtfb-plan {
  display: flex;
  gap: 8px;
}

.mtfb-plan label {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 12px 16px;
  border-radius: 12px;
  background: #292524;
  outline: 1px solid #404040;
  color: #a8a29e;
  margin-bottom: 8px;
}

.mtfb-plan input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.mtfb-plan label:has(input:checked) {
  color: #131210;
  background: var(--Primary-500, #f1a035);
  border: var(--Border-Width-sm, 1px) solid var(--Primary-500, #f1a035);
}

/* Nota + botón */
.mtfb-note-label {
  display: block;
  margin: 10px 0 6px 0;
  font: 500 16px/24px Roboto, system-ui, sans-serif;
}

textarea.mtfb-note {
  height: 100% !important;
  max-height: 76px !important;
  resize: none;
  box-sizing: border-box;
  min-height: 76px;
  overflow: hidden;
}

.mtfb-note::placeholder {
  color: #404040;
}

.mtfb-save {
  width: 100%;
  height: 28px;
  padding: 4px 12px;
  border-radius: 4px;
  border: 1px solid var(--Surface-Primary, #ffb34a);
  background: var(--Surface-Primary, #ffb34a);
  color: var(--Text-Action-Primary-Solid, #020617);
  font: 500 14px/20px Roboto, system-ui, sans-serif;
  text-transform: uppercase;
  cursor: pointer;
}

.mtfb-save:active {
  transform: translateY(1px);
}

/* Botón Edit negro, sin borde */
.mtfb-edit {
  width: 100%;
  height: 28px;
  padding: 4px 12px;
  border-radius: 4px;
  border: none;
  background: transparent;
  color: #ffb34a;
  font: 500 14px/20px Roboto, system-ui, sans-serif;
  text-transform: uppercase;
  cursor: pointer;
}

.mtfb-edit:active {
  transform: translateY(1px);
}

/* Estados deshabilitados */
.mtfb-mood [data-mood][disabled] {
  cursor: not-allowed;
}

.mtfb-plan label:has(input[disabled]) {
  cursor: not-allowed;
}

.mtfb-note:disabled {
  cursor: not-allowed;
  border-radius: var(--Border-Radius-lg, 12px) !important;
  border: var(--Border-Width-sm, 1px) solid var(--Colors-Gray-700, #404040) !important;
  background: rgba(30, 30, 30, 0.7) !important;
}

.mtfb-save[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}

.mt-card.account-settings__section {
  gap: 24px;
}

.account-settings__sections-wrapper>*+* {
  margin-top: 16px;
}

.toggle-panel__title-wrapper {
  margin-bottom: 0;
  width: 100%;
  line-height: inherit;
}

.toggle-panel__header {
  background-color: transparent;
  border: none;
  width: 100%;
  padding: 0;
  display: flex;
  text-align: left;
  gap: 16px;
  justify-content: space-between;
}

.toggle-panel__header[disabled] {
  cursor: not-allowed;
}

.toggle-panel__header[disabled] .toggle-panel__title,
.toggle-panel__header[disabled] .toggle-panel__icon,
.toggle-panel__header[disabled] .toggle-panel__description,
.toggle-panel__header[disabled] .toggle-panel__arrow {
  opacity: 0.2;
}

.toggle-panel__header[disabled] .toggle-panel__title {
  color: white;
}

.toggle-panel__header[disabled] .toggle-panel__description {
  color: #a8a29e;
}

.toggle-panel__icon {
  display: flex;
  align-items: self-start;
}

.toggle-panel__title {
  color: white;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}

.toggle-panel__details {
  flex: 1;
}

.toggle-panel .toggle-panel__header[aria-expanded="true"] .toggle-panel__arrow {
  transform: rotate(0deg);
  align-self: self-start;
}

.toggle-panel__arrow {
  transform: rotate(180deg);
  display: flex;
  align-items: end;
}

.toggle-panel__description {
  color: #a8a29e;
  font-size: 16px;
  flex: 1;
  font-weight: 700;
  line-height: 24px;
}

.mt-user-profile-card {
  display: flex;
  padding: 20px;
  outline: 1px var(--colors-gray-700) solid;
  outline-offset: -1px;
  margin-bottom: 32px;
}

.mt-user-profile-card__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media (max-width: 767px) {
    .mt-user-profile-card__wrapper {
        display: inline;
    }

    .mt-user-profile-card__details {
        padding-left: 112px;
    }

    .mt-user-profile-card__details .mt-user-profile-card__member-since {
        text-align: left;
    }
}

.mt-user-profile-card__avatar-container {}

.mt-user-profile-card__member-since {
  font-size: 16px;
  text-align: right;
}

.mt-user-profile-card__details>*+* {
  margin-top: 8px;
}

.mt-user-profile-card__status-icon {
  display: flex;
}

.mt-user-profile-card__avatar-image {
  width: 96px;
  position: relative;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
}

.mt-user-profile-card__avatar-image--initials {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mt-user-profile-card__status {
  display: flex;
  align-items: center;
  font-weight: 500;
  gap: 4px;
}

.w-phone-full .iti {
  width: 100%;
}

/* ======= APEX TOOLTIP CONTAINER - GRAPGIC CHART ======= */


.account-performance-chart.is-empty {
  min-height: 505px;
  position: relative;
}

.account-performance-chart.mt-card {
  position: relative;
  overflow: hidden;
}

.account-performance-chart__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.apc-overlay__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.account-performance-chart__overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #1e1e1e;
  opacity: 0.7;
}

.apc-overlay__text {
  position: relative;
  z-index: 1;
  color: #fff;
  padding: 12px 16px;
  text-align: center;
  width: 220px;
  font-size: var(--Text-FontSize-Body-md, 16px);
  font-weight: 500;
  line-height: var(--Text-Lineheight-Body-md, 24px);
}

.account-performance-chart__overlay {
  pointer-events: all;
  cursor: not-allowed;
}

.account-performance-chart__overlay[hidden] {
  pointer-events: none;
}

.account-performance-chart.is-empty {
  cursor: not-allowed;
}

/* Normaliza la estructura interna que renderiza LWC (tabla/canvas) */
#account-performance-chart .tv-lightweight-charts,
#account-performance-chart table {
  margin: 0 !important;


}

#account-performance-chart table td {
  padding: 0 !important;
  border: 0 !important;
}

#account-performance-chart table tr:first-child td:nth-child(2) {
  border-right: 1px solid var(--ot-border-color) !important;
  /* separador vertical */
}

#account-performance-chart table tr:last-child td:nth-child(2) {
  border-top: 1px solid var(--ot-border-color) !important;
  /* separador horizontal inferior */
}

.mt-chart-tip {
  position: fixed;
  /* fuera del contenedor */
  pointer-events: none;
  background: #111;
  color: #fff;
  padding: 8px 10px;
  border-radius: 8px;
  font: 12px/1.25 system-ui;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .35);
  opacity: 0;
  /* se muestra desde JS */
  transition: opacity .12s ease;
  z-index: 9999;
  max-width: 260px;
  word-break: normal;
  white-space: nowrap;
}




/* Account Selection */

.account-reset-button--inside {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.account-reset-button--outside {
  width: 100%;
  margin-top: 16px;
}

@media (max-width: 767.98px) {
  .account-reset-button--inside {
    display: none !important;
  }
}

#changeSubcriptionModal #mt-acc-filter-btn {
  background: #1e1e1e;
  border: 1px solid #3b3b3b;
  color: #fff;
}

#changeSubcriptionModal #mt-acc-filter-menu {
  border: 1px solid #3b3b3b;
  background: #1e1e1e;
  border-radius: 12px;
  overflow: hidden;
}

#changeSubcriptionModal #mt-acc-filter-menu .dropdown-item {
  color: #fff;
}

#changeSubcriptionModal #mt-acc-filter-menu .dropdown-item:hover {
  background: #2a2a2a;
  color: #fff;
}

#changeSubcriptionModal #mt-acc-filter-menu .dropdown-item.active,
#changeSubcriptionModal #mt-acc-filter-menu .dropdown-item:active {
  background: #ffb34a;
  color: #000;
}

@media (max-width: 575.98px) {

  /* Oculta el icono del diamante solo si es descendiente directo 
    del contenedor con la clase .mt-account-selection.
  */
  .mt-account-selection #mt-selection-icon_diamond {
    display: none !important;
  }

  /* Oculta el logo de la plataforma solo si es descendiente directo 
    del contenedor con la clase .mt-account-selection.
  */
  .mt-account-selection #mt-platform-logo {
    display: none !important;
  }

  .mt-account-selection #mt-account-id-badge {
    display: none !important;
  }
}

/***** Account Notifications *****/

.mt-account-notifications {
  position: absolute;
  left: 395px;
  top: 215px;
  width: auto;
  max-height: 70vh;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 20px 20px rgba(0, 0, 0, 0.1);
  padding: 8px;
  z-index: 1055;
  overflow: visible;
  /* permite que la flecha sobresalga */
}

/* Flecha (desktop) */
.mt-notifications__arrow {
  position: absolute;
  top: 23px;
  left: -19px;
  width: 26px;
  height: 14px;
  background: #fff;
  clip-path: polygon(0 100%, 50% 0, 100% 100%);
  pointer-events: none;
  transform: rotate(270deg);
}

.mt-notifications__header {
  padding: 0 8px;
}

/* Body: ancho completo + scroll interno + respeta bordes inferiores */
.mt-notifications__body {
  padding: 0 0 8px;
  max-height: calc(70vh - 30px);
  overflow-x: hidden;
  overflow-y: auto;
  background: #fff;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  background-clip: padding-box;

  /* Scroll minimal (solo thumb visible) */
  scrollbar-gutter: stable both-edges;
  padding-right: 12px;
  /* reserva ancho del scrollbar */
}

/* WebKit */
.mt-notifications__body::-webkit-scrollbar {
  width: 10px;
}

.mt-notifications__body::-webkit-scrollbar-track {
  background: transparent;
}

.mt-notifications__body::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 8px;
  border: 2px solid transparent;
}

.mt-notifications__body::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.5);
}

.mt-notifications__body::-webkit-scrollbar-button {
  height: 10px;
  background: transparent;
}

/* Firefox */
@supports (scrollbar-color: auto) {
  .mt-notifications__body {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.35) transparent;
  }
}

/* Hover de cada notificación */
.mt-notification-account {
  transition: background-color 0.15s ease, border-radius 0.15s ease;
}

.mt-notification-account:hover {
  border-radius: var(--Border-Radius-md, 8px);
  background: var(--Colors-Gray-100, #f5f5f5);
}

/* Control “ocultar notificación” (ojito) */
.mt-notification-account .mt-notif-hide-ctrl {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease;
}

.mt-notification-account:hover .mt-notif-hide-ctrl,
.mt-notification-account:focus-within .mt-notif-hide-ctrl {
  opacity: 1;
  visibility: visible;
}

.mt-notif-hide-ctrl i {
  display: inline-block;
  line-height: 1;
}

/* Mobile = modal fullscreen */
@media (max-width: 767.98px) {
  .mt-account-notifications {
    position: fixed;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    border-radius: 0;
    box-shadow: none;
    padding: 16px 8px;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    max-height: 100%;
    overflow: auto;
    /* hace scroll el panel entero */
  }

  .mt-notifications__arrow {
    display: none !important;
  }

  .mt-notifications__body {
    padding: 0 0 8px;
    max-height: none;
    overflow: visible;
    /* evita doble scroll en mobile */
    scrollbar-color: auto;
    scrollbar-width: auto;
    padding-right: 0;
  }
}

/* Paleta mínima */
.bg-success-100 {
  background: #ccfbf1 !important;
}

.bg-success-600 {
  background: #0d9488 !important;
}

.text-success-600 {
  color: #0d9488 !important;
}

.bg-error-100 {
  background: #ffe4e6 !important;
}

.bg-error-600 {
  background: #e11d48 !important;
}

.text-error-600 {
  color: #e11d48 !important;
}

.bg-warning-100 {
  background: #ffedd5 !important;
}

.bg-warning-600 {
  background: #ea580c !important;
}

.text-warning-600 {
  color: #ea580c !important;
}

.bg-gray-100 {
  background: #f5f5f5 !important;
}

.bg-gray-200 {
  background: #e5e5e5 !important;
}

.js-mt-goto-account {
  cursor: pointer;
}

.js-mt-goto-account:focus {
  outline: 2px solid #e5e5e5;
  outline-offset: 2px;
}

/***** End Account Notifications **/

/***** Modal Payout **/

#mt-payout-acc-menu .dropdown-item:focus,
.dropdown-item:hover {
  color: var(--bs-dropdown-link-hover-color);
  background-color: #2a2a2a;
}

button#mt-payout-acc-btn:hover,
button#mt-payout-acc-btn:active {
  background: #131210;
  border: 1px solid #d4d4d4;
}

@media (min-width: 992px) {
  .mt-acc-menu {
    max-height: 230px;
    overflow-y: auto;
    overflow-x: hidden;

  }
}


/* ===== End Modal Payout ===== */


/* ===== Trades History (mismas columnas fijas tipo Daily Journal) ===== */
#mt-trades {
  --cols: 11;
  --colw: 95px;
  --bg: var(--Surface-Page, #1E1E1E);
}


#mt-trades .dj-viewport {
  max-inline-size: 100%
}

#mt-trades .dj-clip {
  position: relative;
  overflow: hidden;
  border-radius: inherit;
  background: var(--bg)
}

#mt-trades .dj-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  background: var(--bg);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .15) transparent;
}

#mt-trades .dj-grid {
  display: grid;
  grid-template-columns: repeat(var(--cols), var(--colw));
  inline-size: max-content
}

#mt-trades .dj-headrow {
  border-bottom: 1px solid rgba(255, 255, 255, .12)
}

#mt-trades .dj-row {
  border-bottom: 1px solid var(--Colors-Gray-800, #292524)
}

#mt-trades .dj-head {
  color: var(--Text-Headings, #fff);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.25;
  background: var(--dj-bg);
  padding: 0.75rem 0.9rem;
}

#mt-trades .dj-cell {
  color: var(--Text-Body, #a8a29e);
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  background: var(--dj-bg);
  padding: 0.75rem 0.9rem;
  min-width: 0;
  word-break: break-word;
  white-space: normal;
}

#mt-trades .dj-cell--side {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
}

#mt-trades .is-right {
  text-align: right
}

#mt-trades .is-left {
  text-align: left
}

/* Empty-state (alias para cualquiera de los dos) */
#mt-trades .dj-rows>.dj-empty,
#mt-trades .dj-rows>.mt-empty {
  text-align: center;
  padding: 16px;
  margin: 16px auto;
  max-width: 520px;
  color: var(--Text-Body, #A8A29E);
  font: 500 14px/20px Roboto, system-ui, sans-serif;
  border: 1px dashed rgba(255, 255, 255, .12);
  border-radius: 12px;
  background: #1e1e1e;
}

/* Header & segmented buttons */
#mt-trades .tr-headbar {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between
}

#mt-trades .tr-title {
  color: var(--Text-Body, #A8A29E);
  font: 500 16px/24px Roboto, system-ui, sans-serif
}

#mt-trades .tr-seg {
  display: flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--Colors-Gray-700, #404040);
  border-radius: 8px;
  background: var(--Surface-Page, #1E1E1E)
}

#mt-trades .tr-seg__btn {
  color: #fff;
  background: transparent;
}

#mt-trades .tr-seg__btn[aria-pressed="true"] {
  background: #fff;
  color: #292524
}

/* Pills */
#mt-trades .mt-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 8px;
  border-radius: 12px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: .75rem;
  line-height: 16px
}

#mt-trades .mt-pill--sec {
  background: var(--Secondary-500, #14B8A6);
  color: var(--Surface-Body, #131210)
}

#mt-trades .mt-pill--err {
  background: var(--Error-500, #F43F5E);
  color: var(--Surface-Body, #131210)
}

/* Pager */
#mt-trades .dj-pager {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
  padding: 0.5rem 0 0;
  align-items: center;
}

#mt-trades .dj-btn {
  background: #0f0f10;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 0.5rem;
  padding: 0.25rem 0.75rem;
  font-size: 0.8rem;
}


#mt-trades .dj-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

#mt-trades .dj-btn.active {
  background: #1f1f20;
}


#mt-trades .dj-empty {
  text-align: center;
  padding: 16px;
  color: var(--Text-Body, #A8A29E);
  font: 500 14px/20px Roboto, system-ui, sans-serif;
}

/* ===== End Trade History ===== */

/* ===== Journal Calendar (Account Overview) ===== */
.mt-account-journal-cal__wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-end;
}

/* Header */
.mt-account-journal-cal__header {
  display: flex;
  gap: 8px;
  align-items: center;
  width: 100%;
  justify-content: flex-end;

}

.mt-account-journal-cal__title-row {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mt-account-journal-cal__title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mt-card__title__journal {
  color: var(--Text-Body, #A8A29E);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}

.mt-account-journal-cal__nav-row {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1 1 auto;
  justify-content: flex-end;
}

.mt-account-journal-cal__nav-btn {
  padding: 4px;
  border-radius: 4px;
}

.mt-account-journal-cal__today {
  padding: 12px 16px;
  background: var(--Surface-Dark, #292524);
  border-radius: 12px;
  outline: 1px solid var(--Colors-Gray-700, #404040);
  outline-offset: -1px;
  color: #FAFAFA;
  text-transform: uppercase;
  font-weight: 500;
}

/* Dropdowns */
.mt-dd {
  position: relative;
  width: 160px;
}

.mt-dd .mt-dd__button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid var(--Colors-Gray-700, #404040);
  background: rgba(30, 30, 30, 0.70);
  color: var(--Text-Body, #A8A29E);
  font: 500 16px/24px Roboto, system-ui, sans-serif;
  cursor: pointer;
}

.mt-dd .mt-dd__button:focus {
  outline: 1px solid #ffb34a;
  box-shadow: 0 0 0 2px rgba(255, 179, 74, .15);
}

.mt-dd[aria-expanded="true"] .mt-dd__button .mt-icon_caret-down {
  transform: rotate(180deg);
}

.mt-dd .mt-dd__panel {
  position: absolute;
  inset: auto 0 0 0;
  transform: translateY(calc(100% + 6px));
  background: #1e1e1e;
  border-radius: 12px;
  border: 1px solid var(--Colors-Gray-700, #404040);
  max-height: 280px;
  overflow: auto;
  padding: 6px;
  z-index: 20;
  scrollbar-color: rgba(255, 255, 255, .15) transparent;
  scrollbar-width: thin;
}

.mt-dd .mt-dd__option {
  display: flex;
  align-items: center;
  width: 100%;
  color: var(--Text-Body, #A8A29E);
  background: transparent;
  border: 0;
  border-radius: 8px;
  padding: 10px 12px;
  text-align: left;
  cursor: pointer;
  font: 500 16px/24px Roboto, system-ui, sans-serif;
}

.mt-dd .mt-dd__option:hover {
  background: #2a2a2a;
  color: #fff;
}

.mt-dd .mt-dd__option[aria-selected="true"],
.mt-dd .mt-dd__option.is-active {
  background: #ffb34a;
  color: #000;
}

.mt-dd .mt-dd__panel::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.mt-dd .mt-dd__panel::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .15);
  border-radius: 8px;
}

.mt-dd .mt-dd__panel::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, .25);
}

.mt-icon_caret-down {
  mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path d="M7 10l5 5 5-5H7z" fill="black"/></svg>');
  background-color: currentColor;
  width: 20px;
  height: 20px;
  display: inline-block;
}

/* Days of week */
.mt-cal-head {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  padding: 16px 0;
}

.mt-cal-dow {
  text-align: center;
  color: var(--Text-Body, #A8A29E);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

/* Calendar grid */
.mt-trade-calendar {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-auto-rows: 92px;
  gap: 8px;
}

/* Cells */
.mt-cal-cell {
  min-width: 60px;
  min-height: 60px;
  padding: 4px;
  border: none;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.05);
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.mt-cal-cell--other {
  opacity: 1;
}

.mt-cal-cell__day {
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.mt-cal-cell__pnl {
  width: 100%;
  text-align: center;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.mt-cal-cell__trades {
  width: 100%;
  text-align: center;
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
}

/* Positioning for tooltip */
.mt-account-journal-cal__body {
  position: relative;
}

/* Floating tooltip (same look as other tooltips) */
.mt-cal-tooltip {
  position: absolute;
  z-index: 30;
  transform: translate(-50%, -100%);
  pointer-events: none;
}

.mt-cal-tooltip__panel {
  position: relative;
  padding: 8px 12px;
  background: #0B0B0B;
  border-radius: 8px;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: #FAFAFA;
  font-family: Roboto, system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  min-width: 80px;
}

.mt-cal-tooltip__panel::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: #0B0B0B transparent transparent transparent;
}

.mt-cal-tooltip__pnl {
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.mt-cal-tooltip__pnl.is-positive {
  color: var(--Success-400, #2DD4BF);
}

.mt-cal-tooltip__pnl.is-negative {
  color: var(--Error-300, #FDA4AF);
}

.mt-cal-tooltip__trades {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}

/* Mobile */
@media (max-width: 768px) {
  .mt-account-journal-cal__header {
    align-items: flex-end;
    flex-wrap: wrap;
  }

  .mt-account-journal-cal__nav-row {
    flex: 1 1 100%;
    justify-content: center;
  }

  .mt-account-journal-cal__today {
    align-self: stretch;
    width: 100%;
    text-align: center;
  }

  .mt-trade-calendar {
    grid-auto-rows: 40px;
  }

  .mt-cal-cell {
    min-height: 40px !important;
    padding: 4px !important;
    min-width: auto !important;
  }

  .mt-cal-cell__pnl,
  .mt-cal-cell__trades {
    display: none;
  }

}

/* Desktop: tooltip not needed */
@media (min-width: 769px) {
  .mt-cal-tooltip {
    display: none;
  }

}

@media (max-width:394px) {

  .mt-dd__button {
    max-width: 114px;
  }

  .mt-dd__button span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* ===== Account Data Global Card ===== */


.mt-grid--3x2 {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  /* < 576px → 1 card */
}

@media (min-width: 576px) {
  .mt-grid--3x2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    /* 576–767px → 2 cards */
  }
}

@media (min-width: 768px) {
  .mt-grid--3x2 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    /* ≥ 768px → 3 cards */
  }
}

/* Scope solo al primer card con el mini-chart */
.mt-card.mt-card-chart .mt-card__chart {
  margin-top: 0 !important;
}

.mt-card.mt-card-chart table {
  border: 0 !important;
  margin: 0 !important;
  border-collapse: collapse;
}

.mt-card.mt-card-chart table td,
.mt-card.mt-card-chart table th {
  border: 0 !important;
  margin: 0 !important;
  padding: 0;
}

#billing-information-form .iti{
    width: 100%;
}



/* ===== End Account Data Global Card ===== */

/* =====  Account Data ===== */

/* default: en desktop NO limites ancho */
.mt-account-data-credentials {
  flex: 1 1 auto;
  max-width: fit-content;
  min-width: 0;
  /* ya lo tienes pero lo dejo por claridad */
}

.mt-account-data .mt-card-wrapper {
  position: relative;
}

.mt-account-data .mt-card-wrapper.mt-agrement-missing .mt-card-content {
  filter: blur(5px);
}

.mt-account-data .mt-agreement-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 5;
  pointer-events: auto;
}

.mt-account-data .mt-agreement-overlay__inner {
  max-width: 520px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}

.mt-account-data .mt-agreement-overlay__text {
  color: #fff;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
}


/* ===== End Account Data ===== */

/* ===== Start Account Request Payout ===== */

.mt-account-payout .mt-card-content.mt-payout-not-verify {
  filter: blur(5px);
}

.mt-account-payout .mt-payout-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 5;
  pointer-events: auto;
}

.mt-account-payout .mt-payout-overlay__inner {
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  padding: 16px;
}

.mt-account-payout .mt-payout-overlay__text {
  color: #fff;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  flex: 1 1 0;
}

/* ===== End Account Request Payout ===== */