/* NM2 Mobile Fixes v2 - asset bundle (cache-busting via URL hash) */

/* === TIENDA: 1 column full-width on mobile <=991px === */
@media (max-width: 991px) {
  html body .nm2-container.nm2-shop-layout-grid,
  html body div.nm2-container.nm2-shop-layout-grid {
    display: block !important;
    grid-template-columns: 1fr !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
  }
  html body .nm2-shop-sidebar { display: none !important; }
  html body #nm2-shop-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  html body article.nm2-shop-card,
  html body article.nm2-card.nm2-shop-card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }
}

/* === BUSCADOR #nm2-vs: compacto + ancho completo en mobile (TODAS las páginas) === */
@media (max-width: 991px) {
  html body #nm2-vs.nm2-vs {
    padding: 4px 8px !important;
    min-height: 0 !important;
  }
  html body #nm2-vs #nm2-vs-chip,
  html body #nm2-vs form.nm2-vs-chip {
    width: calc(100% - 16px) !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    height: 40px !important;
    padding: 4px 6px 4px 14px !important;
    box-sizing: border-box !important;
  }
  html body #nm2-vs #nm2-vs-input {
    width: 100% !important;
    height: 32px !important;
    font-size: 15px !important;
  }
  html body #nm2-vs #nm2-vs-mic {
    width: 32px !important;
    height: 32px !important;
    flex-shrink: 0 !important;
  }
  html body.o_website_url_home #nm2-vs .nm2-vs-hint,
  html body .nm2-page-home #nm2-vs .nm2-vs-hint {
    display: none !important;
  }
}


/* === NM2 Mobile Menu user card === */
.nm2-mb-user-card {
  margin: 8px 12px 12px;
  padding: 14px 14px;
  border: 2px solid #0F172A;
  background: #FAFAFA;
  border-radius: 14px;
  box-shadow: 4px 4px 0 #0F172A;
  box-sizing: border-box;
}
.nm2-mb-user-card__top {
  display: flex; align-items: center; gap: 10px;
  color: #0F172A;
}
.nm2-mb-user-card__txt { line-height: 1.2; }
.nm2-mb-user-card__greet {
  font-weight: 800;
  font-size: 15px;
  color: #0F172A;
  letter-spacing: .2px;
}
.nm2-mb-user-card__role {
  margin-top: 3px;
  font-size: 11px;
  font-weight: 700;
  color: #1B4FE0;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* Logout button */
.nm2-mb-logout-form {
  margin: 12px;
}
.nm2-mb-logout-btn {
  width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  padding: 14px 16px;
  background: #0F172A;
  color: #FFFFFF;
  border: 2px solid #0F172A;
  border-radius: 12px;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .5px;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 4px 4px 0 #F59E0B;
  transition: transform .15s ease, box-shadow .15s ease;
}
.nm2-mb-logout-btn:hover,
.nm2-mb-logout-btn:focus {
  transform: translate(2px, 2px);
  box-shadow: 2px 2px 0 #F59E0B;
}
.nm2-mb-logout-btn:active {
  transform: translate(4px, 4px);
  box-shadow: 0 0 0 #F59E0B;
}


/* === NM2 Mobile Menu — performance: open faster + isolate transitions === */
@media (max-width: 991px) {
  /* Quitar transition: all heredada del wrapper raíz — innecesaria y costosa */
  html body #nm2-mobile-menu.nm2-mobile-menu {
    transition: none !important;
    will-change: auto !important;
  }
  /* Acelerar el slide del panel: 160ms (era 220ms) + GPU hint */
  html body #nm2-mobile-menu .nm2-mobile-menu-panel {
    transition: transform 160ms cubic-bezier(.2,.7,.2,1) !important;
    will-change: transform !important;
    /* Forzar compositing GPU desde el inicio para evitar repaint en el primer frame */
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  html body #nm2-mobile-menu.is-open .nm2-mobile-menu-panel {
    -webkit-transform: translateX(0) !important;
            transform: translateX(0) !important;
  }
  /* Acelerar el fade del backdrop a la mitad para que “aparezca” antes */
  html body #nm2-mobile-menu .nm2-mobile-menu-backdrop {
    transition: opacity 120ms cubic-bezier(.2,.7,.2,1) !important;
    will-change: opacity !important;
  }
}


/* ====== APPENDED 2026-05-23 — /my brutalist redesign ====== */

/* ============================================================
   NM2 v4 — Portal /my (vista 665 con hero inyectado)
   SCOPE: solo .o_portal_portal_my_home + clases NM2 propias
   No usa pseudo-content textual. Estiliza HTML que SÍ existe.
   ============================================================ */

/* Tokens locales al scope */
body.o_portal_portal_my_home {
  --nm2p-ink: #0F172A;
  --nm2p-blue: #1B4FE0;
  --nm2p-blue-deep: #0B2A8A;
  --nm2p-amber: #F59E0B;
  --nm2p-bg: #F8FAFC;
  --nm2p-card: #FFFFFF;
  --nm2p-mute: #64748B;
  --nm2p-soft: #F1F5F9;
  --nm2p-line: #E2E8F0;
  background: var(--nm2p-bg) !important;
}

/* Container — respiro lateral y vertical */
body.o_portal_portal_my_home #wrap.o_portal_wrap > .container {
  padding-left: 20px !important;
  padding-right: 20px !important;
  padding-top: 20px !important;
  padding-bottom: 80px !important;
}
@media (min-width: 992px) {
  body.o_portal_portal_my_home #wrap.o_portal_wrap > .container {
    padding-left: 32px !important;
    padding-right: 32px !important;
    padding-top: 28px !important;
    max-width: 1100px !important;
  }
}

/* Ocultar el wrapper viejo "Mi cuenta + avatar" (lo reemplaza nuestro hero) */
body.o_portal_portal_my_home #wrap.o_portal_wrap > .container > .wrapper.col-12 {
  display: none !important;
}

/* ============================================================
   HERO NM2 — bloque inyectado por la vista heredada
   ============================================================ */
.nm2-my-hero {
  position: relative;
  background: linear-gradient(135deg, #0F172A 0%, #0B2A8A 100%);
  color: #fff;
  border: 2px solid var(--nm2p-ink, #0F172A);
  border-radius: 18px;
  padding: 22px 20px 24px;
  box-shadow: 6px 6px 0 var(--nm2p-amber, #F59E0B);
  overflow: hidden;
  /* [NM2-2026-05-23] margin-top 32->56: respiro entre buscador y banner en /my */
  margin: 56px 0 22px;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}
.nm2-my-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(400px 200px at 100% 0%, rgba(245,158,11,.18), transparent 60%),
    radial-gradient(300px 200px at 0% 100%, rgba(27,79,224,.32), transparent 60%);
  pointer-events: none;
}
.nm2-my-hero__inner { position: relative; z-index: 1; }

.nm2-my-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--nm2p-amber, #F59E0B);
  margin-bottom: 10px;
}
.nm2-my-hero__dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--nm2p-amber, #F59E0B);
  box-shadow: 0 0 10px rgba(245,158,11,.7);
  animation: nm2pPulse 2s ease-in-out infinite;
}
@keyframes nm2pPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .5; transform: scale(.6); }
}

.nm2-my-hero__title {
  margin: 0 0 4px;
  font-size: 28px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -.6px;
  color: #ffffff;
}
/* Specificity guard: el CSS principal pinta TODOS los spans del portal en #3B4458.
   Usamos #wrapwrap.o_portal .o_portal_wrap para empatarle specificity. */
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero .nm2-my-hero__name,
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero__title .nm2-my-hero__name,
body.o_portal_portal_my_home .nm2-my-hero .nm2-my-hero__name {
  color: #F59E0B !important;
  font-weight: 900 !important;
}
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero,
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero .nm2-my-hero__title {
  color: #FFFFFF !important;
}
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero .nm2-my-hero__sub {
  color: #CBD5E1 !important;
}
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero .nm2-my-hero__badge--amber {
  color: #0F172A !important;
}
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero .nm2-my-hero__badge:not(.nm2-my-hero__badge--amber) {
  color: #FFFFFF !important;
}
#wrapwrap.o_portal .o_portal_wrap .nm2-my-hero .nm2-my-hero__eyebrow {
  color: #F59E0B !important;
}
.nm2-my-hero__sub {
  margin: 0 0 14px;
  font-size: 13px;
  font-weight: 500;
  color: #CBD5E1;
  line-height: 1.4;
}
.nm2-my-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.nm2-my-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .4px;
  text-decoration: none;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.22);
  color: #ffffff;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: transform .15s ease, background .15s ease;
}
.nm2-my-hero__badge:hover,
.nm2-my-hero__badge:focus {
  color: #ffffff;
  text-decoration: none;
  background: rgba(255,255,255,.18);
}
.nm2-my-hero__badge--amber {
  background: var(--nm2p-amber, #F59E0B);
  color: var(--nm2p-ink, #0F172A);
  border-color: var(--nm2p-amber, #F59E0B);
  text-transform: uppercase;
}
.nm2-my-hero__badge--link {
  background: transparent;
  border-color: rgba(255,255,255,.4);
}
.nm2-my-hero__badge--link:hover {
  background: rgba(255,255,255,.10);
}

@media (min-width: 768px) {
  .nm2-my-hero { padding: 28px 28px 30px; margin-top: 40px; }
  .nm2-my-hero__title { font-size: 34px; }
  .nm2-my-hero__sub { font-size: 14px; }
}

/* ============================================================
   GRID — .nm2-my-grid añade gancho al .o_portal_my_home
   ============================================================ */
body.o_portal_portal_my_home .nm2-my-grid .o_portal_docs {
  gap: 12px !important;
  row-gap: 12px !important;
}

/* Botón "Pagar ahora" del alert — botón pill amber brutalist */
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert .btn,
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert button.btn,
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert .btn-primary {
  background: var(--nm2p-amber) !important;
  background-color: var(--nm2p-amber) !important;
  color: var(--nm2p-ink) !important;
  border: 2px solid var(--nm2p-ink) !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .4px !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 var(--nm2p-ink) !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
  line-height: 1.2 !important;
  height: auto !important;
}

/* ============================================================
   ALERTAS (portal_alert_category) — Facturas/Cotizaciones pendientes
   ============================================================ */
body.o_portal_portal_my_home #portal_alert_category {
  margin-top: 4px !important;
  gap: 12px !important;
  row-gap: 12px !important;
}
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert {
  background: var(--nm2p-card) !important;
  border: 2px solid var(--nm2p-ink) !important;
  border-radius: 14px !important;
  padding: 14px !important;
  box-shadow: 3px 3px 0 var(--nm2p-ink) !important;
  color: var(--nm2p-ink) !important;
  gap: 14px !important;
  transition: transform .15s ease, box-shadow .15s ease !important;
  align-items: center !important;
}
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert:hover,
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert:focus,
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 var(--nm2p-ink) !important;
  text-decoration: none !important;
  color: var(--nm2p-ink) !important;
}
/* El span del contador (placeholder_count) toma forma de número-tile */
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert span[data-placeholder_count] {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  background: var(--nm2p-blue);
  color: #fff !important;
  border: 2px solid var(--nm2p-ink);
  border-radius: 12px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-weight: 900 !important;
  box-shadow: 2px 2px 0 var(--nm2p-amber);
  font-family: 'Inter', system-ui, sans-serif;
}

/* Heading "Facturas a pagar" etc. */
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert h5 {
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--nm2p-ink) !important;
  margin: 0 !important;
  font-family: 'Inter', system-ui, sans-serif !important;
}
body.o_portal_portal_my_home #portal_alert_category .o_portal_index_card > a.alert p {
  font-size: 12px !important;
  color: var(--nm2p-mute) !important;
  margin: 2px 0 0 !important;
  line-height: 1.35 !important;
}

/* ============================================================
   GRID DOCUMENTOS (portal_client_category, _service, _common)
   ============================================================ */
body.o_portal_portal_my_home #portal_client_category,
body.o_portal_portal_my_home #portal_service_category,
body.o_portal_portal_my_home #portal_vendor_category,
body.o_portal_portal_my_home #portal_common_category {
  margin-top: 22px !important;
  gap: 12px !important;
  row-gap: 12px !important;
}

body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert) {
  background: var(--nm2p-card) !important;
  border: 2px solid var(--nm2p-ink) !important;
  border-radius: 14px !important;
  padding: 16px 14px !important;
  text-decoration: none !important;
  color: var(--nm2p-ink) !important;
  box-shadow: 4px 4px 0 var(--nm2p-blue) !important;
  transition: transform .15s ease, box-shadow .15s ease !important;
  gap: 14px !important;
  align-items: flex-start !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert):hover,
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert):focus,
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert):active {
  transform: translate(3px, 3px) !important;
  box-shadow: 1px 1px 0 var(--nm2p-blue) !important;
  text-decoration: none !important;
  color: var(--nm2p-ink) !important;
}

/* Sombras alternadas para variedad */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none):nth-of-type(2n) > a:not(.alert) {
  box-shadow: 4px 4px 0 var(--nm2p-amber) !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none):nth-of-type(2n) > a:not(.alert):hover,
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none):nth-of-type(2n) > a:not(.alert):active {
  box-shadow: 1px 1px 0 var(--nm2p-amber) !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none):nth-of-type(3n) > a:not(.alert) {
  box-shadow: 4px 4px 0 var(--nm2p-ink) !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none):nth-of-type(3n) > a:not(.alert):hover,
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none):nth-of-type(3n) > a:not(.alert):active {
  box-shadow: 1px 1px 0 var(--nm2p-ink) !important;
}

/* Heading h5 dentro de cada card */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert) h5 {
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--nm2p-ink) !important;
  margin: 0 !important;
  font-family: 'Inter', system-ui, sans-serif !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert) p {
  font-size: 12px !important;
  color: var(--nm2p-mute) !important;
  margin: 3px 0 0 !important;
  line-height: 1.35 !important;
}

/* Si la entrada tiene icono (entry.image) — show it y estilízalo */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_icon {
  display: flex !important;
  flex: 0 0 auto !important;
  width: 44px !important;
  height: 44px !important;
  background: var(--nm2p-soft) !important;
  border: 2px solid var(--nm2p-ink) !important;
  border-radius: 12px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  overflow: hidden !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_icon img,
body.o_portal_portal_my_home .o_portal_my_home .o_portal_icon i {
  max-width: 24px !important;
  max-height: 24px !important;
  width: 24px !important;
  height: 24px !important;
  color: var(--nm2p-blue) !important;
}

/* FAB WhatsApp en /my — subir 96px para no tapar última card */
body.o_portal_portal_my_home .nm2-wa-fab,
body.o_portal_portal_my_home a[href*="wa.me"][class*="fab"],
body.o_portal_portal_my_home a[href*="whatsapp"][class*="fab"] {
  bottom: 96px !important;
}

/* Sidebar desktop separado */
@media (min-width: 992px) {
  body.o_portal_portal_my_home .o_portal_content {
    padding-right: 16px !important;
  }
}


/* ==========================================================================
   FIX: íconos del portal (.o_portal_icon img) — restaurar tamaño y aire
   ========================================================================== */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card .o_portal_icon {
  flex: 0 0 56px !important;
  width: 56px !important;
  height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #F1F4FB !important;
  border: 2px solid var(--nm2p-ink) !important;
  border-radius: 12px !important;
  box-shadow: 2px 2px 0 var(--nm2p-blue) !important;
  padding: 6px !important;
  align-self: center !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card .o_portal_icon > span[role="img"] {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card .o_portal_icon img {
  width: 100% !important;
  height: 100% !important;
  max-width: 40px !important;
  max-height: 40px !important;
  object-fit: contain !important;
  display: block !important;
}
/* Sombra alternada del icon-tile para variedad */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:nth-of-type(2n) .o_portal_icon {
  box-shadow: 2px 2px 0 var(--nm2p-amber) !important;
}
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:nth-of-type(3n) .o_portal_icon {
  box-shadow: 2px 2px 0 var(--nm2p-ink) !important;
}
/* Forzar carga inmediata (no lazy) cuando esté en viewport directo */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card .o_portal_icon img[loading="lazy"] {
  content-visibility: visible;
}
/* Asegurar que las cards de #portal_client_category también tengan padding correcto */
body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card:not(.d-none) > a:not(.alert) {
  padding: 14px !important;
  gap: 14px !important;
  align-items: center !important;
}

.nm2-cache-bust-mpiwsla16915g2 { content: "mpiwsla16915g2"; }


/* ============================================================
   FIX IMG_8002 — 2026-05-23
   3 issues:
   (1) Cards corridas a la izquierda (no centradas)
   (2) Hero/search desbordados a la derecha
   (3) 2 FABs de WhatsApp superpuestos — eliminar el viejo
   Causa raíz #1+#2: Bootstrap row.justify-content-between con
   col-12.col-lg-8 deja hueco a la derecha (donde estaría col-lg-4).
   En mobile el contenido queda corrido a la izquierda.
   Solución: en mobile resetear el negative-margin del row y
   hacer que el .o_portal_content ocupe todo el container.
   ============================================================ */

/* (1+2) Centrado del portal en mobile/tablet */
@media (max-width: 991.98px) {
  body.o_portal_portal_my_home .o_portal_wrap > .container > .row.justify-content-between,
  body.o_portal_portal_my_home .o_portal_wrap > .container > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    --bs-gutter-x: 0 !important;
  }
  body.o_portal_portal_my_home .o_portal_wrap > .container > .row > .o_portal_content {
    padding-left: 0 !important;
    padding-right: 0 !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
  /* El grid interno y rows anidados también */
  body.o_portal_portal_my_home .o_portal_my_home > .row,
  body.o_portal_portal_my_home .o_portal_my_home .o_portal_docs,
  body.o_portal_portal_my_home .o_portal_my_home .o_portal_category {
    margin-left: 0 !important;
    margin-right: 0 !important;
    --bs-gutter-x: 8px !important;
  }
  /* Cards: padding lateral uniforme dentro del grid */
  body.o_portal_portal_my_home .o_portal_my_home .o_portal_index_card {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* Container: padding lateral simétrico igual al de las cards */
  body.o_portal_portal_my_home .o_portal_wrap > .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* (3) Ocultar el FAB de WhatsApp viejo (#nm2-wa-fab inyectado por nm2-custom.js).
   El nuevo .nm2-fab-wa (con halo verde animado) ya lo cubre todo.
   Mayor especificidad (body + #wrapwrap + id) para vencer reglas previas. */
body #nm2-wa-fab,
body.o_portal_portal_my_home #nm2-wa-fab,
body #wrapwrap #nm2-wa-fab,
html body a#nm2-wa-fab,
html body a#nm2-wa-fab[href*="wa.me"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

/* Cache-bust */
.nm2-fix-img8002-v2-mpix7173 { content: "fix-img8002-v2"; }


/* ============================================================
   FIX IMG_8003 — 2026-05-23
   Tablas portal Odoo (cotizaciones, pedidos, facturas) desbordan
   en mobile porque las columnas tienen white-space:nowrap y la
   tabla mide 568px en un viewport de 393px.
   Solución limpia:
   - table-layout: fixed con anchos proporcionales por tipo
   - Fechas: solo dd/mm/yyyy (CSS truncate, no toca contenido)
   - Font-size ligeramente menor en mobile
   - Quitar nowrap, dejar que ellipsis trabaje
   ============================================================ */

@media (max-width: 575.98px) {
  /* Aplica a las 3 vistas portal con tablas */
  body.o_sale_portal_my_quotations .o_portal_wrap .table-responsive,
  body.o_sale_portal_my_orders .o_portal_wrap .table-responsive,
  body.o_account_portal_my_invoices .o_portal_wrap .table-responsive {
    overflow-x: hidden !important;
  }

  body.o_sale_portal_my_quotations .o_portal_my_doc_table,
  body.o_sale_portal_my_orders .o_portal_my_doc_table,
  body.o_account_portal_my_invoices .o_portal_my_doc_table {
    table-layout: fixed !important;
    width: 100% !important;
    font-size: 13px !important;
  }

  /* Headers y celdas: ellipsis universal */
  body.o_sale_portal_my_quotations .o_portal_my_doc_table th,
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td,
  body.o_sale_portal_my_orders .o_portal_my_doc_table th,
  body.o_sale_portal_my_orders .o_portal_my_doc_table td,
  body.o_account_portal_my_invoices .o_portal_my_doc_table th,
  body.o_account_portal_my_invoices .o_portal_my_doc_table td {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    font-size: 13px !important;
    vertical-align: middle !important;
  }

  /* ---- COTIZACIONES (5 columnas: Número | Fecha | Válido | Estado | Total) ---- */
  /* Número: estrecho (S00020 = 6 chars) ~22% */
  /* Fecha: media ~28% */
  /* Válido: media ~22% */
  /* Estado: chip pequeño ~4% (oculto en mobile, ya está vacío) */
  /* Total: ~24% */
  body.o_sale_portal_my_quotations .o_portal_my_doc_table th:nth-child(1),
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td:nth-child(1) {
    width: 22% !important;
  }
  body.o_sale_portal_my_quotations .o_portal_my_doc_table th:nth-child(2),
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td:nth-child(2) {
    width: 28% !important;
  }
  body.o_sale_portal_my_quotations .o_portal_my_doc_table th:nth-child(3),
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td:nth-child(3) {
    width: 24% !important;
  }
  body.o_sale_portal_my_quotations .o_portal_my_doc_table th:nth-child(4),
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td:nth-child(4) {
    width: 0% !important;
    padding: 0 !important;
    display: none !important;
  }
  body.o_sale_portal_my_quotations .o_portal_my_doc_table th:nth-child(5),
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td:nth-child(5) {
    width: 26% !important;
    text-align: right !important;
  }

  /* ---- ÓRDENES (asumiendo similar layout) ---- */
  body.o_sale_portal_my_orders .o_portal_my_doc_table th:nth-child(1),
  body.o_sale_portal_my_orders .o_portal_my_doc_table td:nth-child(1) {
    width: 24% !important;
  }
  body.o_sale_portal_my_orders .o_portal_my_doc_table th:nth-child(2),
  body.o_sale_portal_my_orders .o_portal_my_doc_table td:nth-child(2) {
    width: 32% !important;
  }
  body.o_sale_portal_my_orders .o_portal_my_doc_table th:nth-child(3),
  body.o_sale_portal_my_orders .o_portal_my_doc_table td:nth-child(3) {
    width: 22% !important;
  }
  body.o_sale_portal_my_orders .o_portal_my_doc_table th:nth-child(4),
  body.o_sale_portal_my_orders .o_portal_my_doc_table td:nth-child(4) {
    display: none !important;
  }
  body.o_sale_portal_my_orders .o_portal_my_doc_table th:nth-child(5),
  body.o_sale_portal_my_orders .o_portal_my_doc_table td:nth-child(5) {
    width: 22% !important;
    text-align: right !important;
  }

  /* ---- FACTURAS ---- */
  body.o_account_portal_my_invoices .o_portal_my_doc_table th:nth-child(1),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(1) {
    width: 26% !important;
  }
  body.o_account_portal_my_invoices .o_portal_my_doc_table th:nth-child(2),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(2) {
    width: 28% !important;
  }
  body.o_account_portal_my_invoices .o_portal_my_doc_table th:nth-child(3),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(3) {
    width: 22% !important;
  }
  body.o_account_portal_my_invoices .o_portal_my_doc_table th:nth-child(4),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(4) {
    display: none !important;
  }
  body.o_account_portal_my_invoices .o_portal_my_doc_table th:nth-child(5),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(5) {
    width: 24% !important;
    text-align: right !important;
  }

  /* Truncar fechas largas: oculta la hora cuando hay espacio:colon: */
  body.o_sale_portal_my_quotations .o_portal_my_doc_table td:nth-child(2),
  body.o_sale_portal_my_orders .o_portal_my_doc_table td:nth-child(2),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(2),
  body.o_account_portal_my_invoices .o_portal_my_doc_table td:nth-child(3) {
    font-variant-numeric: tabular-nums;
  }

  /* Headers: dos líneas si es necesario (white-space normal solo en th) */
  body.o_sale_portal_my_quotations .o_portal_my_doc_table thead th,
  body.o_sale_portal_my_orders .o_portal_my_doc_table thead th,
  body.o_account_portal_my_invoices .o_portal_my_doc_table thead th {
    white-space: normal !important;
    line-height: 1.2 !important;
    font-size: 12px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  /* Estado badge: si por algún motivo se muestra, ponerlo flotante */
  body.o_sale_portal_my_quotations .o_portal_my_doc_table .badge,
  body.o_sale_portal_my_orders .o_portal_my_doc_table .badge,
  body.o_account_portal_my_invoices .o_portal_my_doc_table .badge {
    font-size: 10px !important;
    padding: 3px 6px !important;
  }

  /* Container: padding consistente con /my */
  body.o_sale_portal_my_quotations .o_portal_wrap > .container,
  body.o_sale_portal_my_orders .o_portal_wrap > .container,
  body.o_account_portal_my_invoices .o_portal_wrap > .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  body.o_sale_portal_my_quotations .o_portal_wrap > .container > .row,
  body.o_sale_portal_my_orders .o_portal_wrap > .container > .row,
  body.o_account_portal_my_invoices .o_portal_wrap > .container > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    --bs-gutter-x: 0 !important;
  }
  body.o_sale_portal_my_quotations .o_portal_wrap > .container > .row > [class*="col-"],
  body.o_sale_portal_my_orders .o_portal_wrap > .container > .row > [class*="col-"],
  body.o_account_portal_my_invoices .o_portal_wrap > .container > .row > [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

/* Cache-bust */
.nm2-fix-img8003-mpiy4xks { content: "fix-img8003-portal-tables"; }