/* ================================================================
   LIBRERÍA DEL OESTE — Theme v2
   References: uline.com (functionality) · linear.app (CSS quality)
   Fonts: Syne 700/800 (display) · DM Sans 300/400/500 (body)
   ================================================================ */

/* ── Variables ───────────────────────────────────────────────── */
:root {
  --orange:       #E87722;
  --orange-dark:  #C5611A;
  --orange-light: #FFF0E6;
  --black:        #111111;
  --gray-900:     #1A1A1A;
  --gray-700:     #444444;
  --gray-500:     #7A7A7A;
  --gray-200:     #E8E8E8;
  --gray-100:     #F4F4F4;
  --white:        #FFFFFF;

  --font-display: 'Syne', sans-serif;
  --font-body:    'DM Sans', sans-serif;

  --container-max: 1280px;
  --container-px:  clamp(16px, 4vw, 40px);

  --ease-out:    cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);

  --shadow-sm:     0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:     0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:     0 12px 32px rgba(0,0,0,0.10);
  --shadow-orange: 0 8px 24px rgba(232,119,34,0.35);
}

/* ── Base ────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--gray-900);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }

/* ── Container ───────────────────────────────────────────────── */
.lo2-container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-px);
}

/* ── Keyframes ───────────────────────────────────────────────── */
@keyframes lo2-slideDown {
  from { transform: translateY(-100%); opacity: 0; }
  to   { transform: translateY(0);     opacity: 1; }
}
@keyframes lo2-fadeUp {
  from { transform: translateY(24px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
@keyframes lo2-pulse {
  0%,100% { transform: scale(1); }
  50%      { transform: scale(1.05); }
}

/* ── Scroll reveal ───────────────────────────────────────────── */
.lo2-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out);
}
.lo2-reveal.lo2-visible { opacity: 1; transform: translateY(0); }

/* ── Announce bar ────────────────────────────────────────────── */
.lo2-announce {
  background: var(--black);
  color: rgba(255,255,255,0.82);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  text-align: center;
  padding: 9px var(--container-px);
  letter-spacing: 0.01em;
}
.lo2-announce__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  flex-wrap: wrap;
}
.lo2-announce__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* ── Header ──────────────────────────────────────────────────── */
.lo2-header {
  height: 68px;
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--gray-200);
  position: sticky;
  top: 0;
  z-index: 100;
  animation: lo2-slideDown 0.5s var(--ease-out) both;
}
.lo2-header__inner {
  height: 100%;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 32px;
  padding-inline: 40px;
  max-width: var(--container-max);
  margin-inline: auto;
}

/* Logo */
.lo2-header__logo {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.lo2-header__logo:hover .lo2-logo-circle {
  animation: lo2-pulse 0.55s var(--ease-out);
}
.lo2-logo-circle {
  width: 40px;
  height: 40px;
  background: var(--orange);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.lo2-logo-circle__top,
.lo2-logo-circle__bottom {
  font-family: var(--font-display);
  font-weight: 800;
  color: var(--white);
  line-height: 1;
  letter-spacing: 0.05em;
}
.lo2-logo-circle__top    { font-size: 9px; }
.lo2-logo-circle__bottom { font-size: 8px; }
.lo2-logo-circle__line {
  width: 22px;
  height: 1px;
  background: rgba(255,255,255,0.45);
  margin: 1.5px 0;
}
.lo2-logo-text { display: flex; flex-direction: column; gap: 1px; }
.lo2-logo-text__name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 15px;
  color: var(--black);
  letter-spacing: -0.01em;
  line-height: 1.1;
}
.lo2-logo-text__sub {
  font-family: var(--font-body);
  font-size: 9.5px;
  font-weight: 400;
  color: var(--gray-500);
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

/* Nav */
.lo2-header__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  list-style: none;
  gap: 0;
}
.lo2-nav-item { position: relative; }
.lo2-nav-link {
  display: block;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--gray-700);
  padding: 8px 14px;
  position: relative;
  text-decoration: none;
  transition: color 0.18s;
  white-space: nowrap;
}
.lo2-nav-link::after {
  content: '';
  position: absolute;
  bottom: 4px;
  left: 14px;
  right: 14px;
  height: 2px;
  background: var(--orange);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.22s var(--ease-out);
}
.lo2-nav-link:hover,
.lo2-nav-link--active { color: var(--black); }
.lo2-nav-link:hover::after,
.lo2-nav-link--active::after { transform: scaleX(1); }

/* Megamenu */
.lo2-megamenu {
  position: absolute;
  top: calc(100% + 6px);
  left: -12px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  padding: 10px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  min-width: 340px;
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.18s var(--ease-out), transform 0.18s var(--ease-out), visibility 0.18s;
  pointer-events: none;
  z-index: 200;
}
.lo2-nav-item:hover .lo2-megamenu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: all;
}
.lo2-megamenu__link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 400;
  color: var(--gray-700);
  transition: background 0.12s, color 0.12s;
  text-decoration: none;
}
.lo2-megamenu__link:hover {
  background: var(--gray-100);
  color: var(--black);
}

/* Search */
.lo2-header__search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--gray-100);
  border: 1.5px solid transparent;
  border-radius: 8px;
  padding: 0 12px;
  height: 36px;
  width: 220px;
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
}
.lo2-header__search:focus-within {
  background: var(--white);
  border-color: var(--gray-200);
  box-shadow: 0 0 0 3px rgba(232,119,34,0.08);
}
.lo2-search-icon { color: var(--gray-500); flex-shrink: 0; }
.lo2-search-input {
  border: none;
  background: transparent;
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--gray-900);
  width: 100%;
  outline: none;
}
.lo2-search-input::placeholder { color: var(--gray-500); }

/* Header actions */
.lo2-header__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

/* ── Buttons ──────────────────────────────────────────────────── */
.lo2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: var(--font-body);
  font-weight: 500;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  border: 1.5px solid transparent;
  transition: transform 0.18s var(--ease-out), box-shadow 0.18s,
              background 0.18s, border-color 0.18s, color 0.18s;
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
}
.lo2-btn:active { transform: scale(0.97) !important; }

.lo2-btn--sm  { height: 32px; padding: 0 14px; font-size: 13px; }
.lo2-btn--md  { height: 40px; padding: 0 20px; font-size: 14px; }
.lo2-btn--lg  { height: 48px; padding: 0 28px; font-size: 15px; }

.lo2-btn--primary {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--white);
}
.lo2-btn--primary:hover {
  background: var(--orange-dark);
  border-color: var(--orange-dark);
  transform: translateY(-2px);
  box-shadow: var(--shadow-orange);
}
.lo2-btn--secondary {
  background: var(--white);
  border-color: var(--gray-200);
  color: var(--black);
  box-shadow: var(--shadow-sm);
}
.lo2-btn--secondary:hover {
  border-color: var(--gray-700);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.lo2-btn--ghost {
  background: transparent;
  border-color: var(--gray-200);
  color: var(--gray-700);
}
.lo2-btn--ghost:hover {
  background: var(--gray-100);
  color: var(--black);
}
/* Header-specific small buttons */
.lo2-btn--login {
  background: transparent;
  border-color: var(--gray-200);
  color: var(--gray-700);
  height: 36px; padding: 0 16px;
  font-size: 13px; border-radius: 7px;
}
.lo2-btn--login:hover { border-color: var(--black); color: var(--black); }
.lo2-btn--contact {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--white);
  height: 36px; padding: 0 16px;
  font-size: 13px; border-radius: 7px;
}
.lo2-btn--contact:hover {
  background: var(--orange-dark);
  border-color: var(--orange-dark);
  transform: translateY(-1px);
  box-shadow: var(--shadow-orange);
}
.lo2-btn--dark-outline {
  background: transparent;
  border-color: rgba(255,255,255,0.25);
  color: var(--white);
}
.lo2-btn--dark-outline:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.5);
  transform: translateY(-2px);
}

/* ── Hero ─────────────────────────────────────────────────────── */
.lo2-hero {
  min-height: 540px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  position: relative;
  overflow: hidden;
}
.lo2-hero__bg-right {
  position: absolute;
  right: 0; top: 0;
  width: 50%; height: 100%;
  background: var(--gray-100);
  clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%);
  pointer-events: none;
}
.lo2-hero__left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 80px var(--container-px) 80px
    max(var(--container-px), calc((100vw - var(--container-max)) / 2 + var(--container-px)));
  animation: lo2-fadeUp 0.7s 0.2s var(--ease-out) both;
  position: relative;
  z-index: 1;
}
.lo2-hero__right {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px
    max(var(--container-px), calc((100vw - var(--container-max)) / 2 + var(--container-px)))
    80px var(--container-px);
  position: relative;
  z-index: 1;
}
.lo2-hero__tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--orange-light);
  color: var(--orange-dark);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 100px;
  margin-bottom: 22px;
  width: fit-content;
}
.lo2-hero__tag-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--orange);
  flex-shrink: 0;
}
.lo2-hero__title {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(36px, 3.8vw, 52px);
  color: var(--black);
  letter-spacing: -0.02em;
  line-height: 1.05;
  margin-bottom: 20px;
}
.lo2-hero__sub {
  font-family: var(--font-body);
  font-weight: 300;
  font-size: 16px;
  color: var(--gray-500);
  line-height: 1.7;
  max-width: 440px;
  margin-bottom: 36px;
}
.lo2-hero__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.lo2-hero__image {
  width: 100%; max-width: 420px;
  aspect-ratio: 4/3;
  background: var(--gray-200);
  border-radius: 16px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 12px; color: var(--gray-500);
  border: 2px dashed var(--gray-200);
  font-family: var(--font-body); font-size: 13px;
}

/* ── Stats ────────────────────────────────────────────────────── */
.lo2-stats {
  padding: 44px 0;
  border-bottom: 1px solid var(--gray-200);
}
.lo2-stats__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
.lo2-stats__item {
  text-align: center;
  padding: 8px 32px;
  position: relative;
}
.lo2-stats__item + .lo2-stats__item::before {
  content: '';
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  height: 48px; width: 1px;
  background: var(--gray-200);
}
.lo2-stats__number {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(38px, 4vw, 48px);
  color: var(--black);
  line-height: 1;
  display: flex; align-items: baseline;
  justify-content: center;
}
.lo2-stats__suffix { color: var(--orange); font-size: 0.6em; margin-left: 2px; }
.lo2-stats__label {
  font-family: var(--font-body);
  font-size: 11.5px; font-weight: 400;
  color: var(--gray-500);
  margin-top: 6px;
  letter-spacing: 0.03em; text-transform: uppercase;
}

/* ── Info strip ───────────────────────────────────────────────── */
.lo2-info-strip {
  background: var(--gray-100);
  border-top: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
}
.lo2-info-strip__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
.lo2-info-strip__item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 18px 24px;
  font-family: var(--font-body);
  font-size: 13px; font-weight: 400;
  color: var(--gray-700);
  position: relative;
}
.lo2-info-strip__item + .lo2-info-strip__item::before {
  content: '';
  position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  height: 28px; width: 1px;
  background: var(--gray-200);
}
.lo2-info-strip__link { color: var(--orange); font-weight: 500; }
.lo2-info-strip__link:hover { text-decoration: underline; color: var(--orange-dark); }

/* ── Section ──────────────────────────────────────────────────── */
.lo2-section { padding: 72px 0; }
.lo2-section__eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: 12px; font-weight: 500;
  color: var(--orange);
  letter-spacing: 0.1em; text-transform: uppercase;
  margin-bottom: 8px;
}
.lo2-section__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(26px, 3vw, 32px);
  color: var(--black);
  letter-spacing: -0.01em;
}
.lo2-section__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 40px; gap: 16px;
}
.lo2-section__header-left { display: flex; flex-direction: column; }
.lo2-section__more {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 500;
  color: var(--gray-500);
  display: inline-flex; align-items: center; gap: 4px;
  flex-shrink: 0; transition: color 0.18s;
}
.lo2-section__more:hover { color: var(--orange); }
.lo2-section__more-arrow { transition: transform 0.18s var(--ease-out); }
.lo2-section__more:hover .lo2-section__more-arrow { transform: translateX(4px); }

/* ── Category grid ────────────────────────────────────────────── */
.lo2-cat-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}
.lo2-cat-card {
  position: relative;
  border: 1.5px solid var(--gray-200);
  border-radius: 12px;
  padding: 28px 20px;
  display: flex; flex-direction: column;
  align-items: flex-start; gap: 14px;
  text-decoration: none; color: var(--gray-900);
  background: var(--white);
  overflow: hidden; cursor: pointer;
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.5s var(--ease-out), transform 0.5s var(--ease-out),
              border-color 0.25s, box-shadow 0.25s;
}
.lo2-cat-card::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: var(--orange);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.28s var(--ease-out);
}
.lo2-cat-card.lo2-visible { opacity: 1; transform: translateY(0); }
.lo2-cat-card.lo2-visible:hover {
  transform: translateY(-6px) !important;
  border-color: var(--orange);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08);
}
.lo2-cat-card.lo2-visible:hover::before { transform: scaleX(1); }
.lo2-cat-card__icon {
  width: 52px; height: 52px;
  border-radius: 12px;
  background: var(--gray-100);
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  transition: background 0.25s;
}
.lo2-cat-card.lo2-visible:hover .lo2-cat-card__icon { background: var(--orange-light); }
.lo2-cat-card__name {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 500;
  color: var(--gray-900); line-height: 1.35;
}

/* ── B2B Banner ───────────────────────────────────────────────── */
.lo2-b2b {
  background: var(--black);
  padding: 64px 0;
}
.lo2-b2b__grid {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center; gap: 48px;
}
.lo2-b2b__label {
  display: block;
  font-family: var(--font-body);
  font-size: 11.5px; font-weight: 500;
  color: var(--orange);
  letter-spacing: 0.1em; text-transform: uppercase;
  margin-bottom: 12px;
}
.lo2-b2b__title {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(24px, 3vw, 36px);
  color: var(--white);
  letter-spacing: -0.02em; line-height: 1.1;
  margin-bottom: 10px;
}
.lo2-b2b__sub {
  font-family: var(--font-body);
  font-weight: 300; font-size: 15px;
  color: rgba(255,255,255,0.55); line-height: 1.65;
  max-width: 480px;
}

/* ── Footer ───────────────────────────────────────────────────── */
.lo2-footer {
  background: #0D0D0D;
  padding: 64px 0 36px;
  border-top: 1px solid rgba(255,255,255,0.07);
}
.lo2-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 48px; margin-bottom: 48px;
}
.lo2-footer__logo-circle {
  width: 44px; height: 44px;
  background: var(--orange); border-radius: 50%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.lo2-footer__logo-top, .lo2-footer__logo-bottom {
  font-family: var(--font-display);
  font-weight: 800; color: var(--white);
  line-height: 1; letter-spacing: 0.05em;
}
.lo2-footer__logo-top    { font-size: 10px; }
.lo2-footer__logo-bottom { font-size: 8px; }
.lo2-footer__logo-line {
  width: 24px; height: 1px;
  background: rgba(255,255,255,0.4); margin: 1.5px 0;
}
.lo2-footer__desc {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 300;
  color: rgba(255,255,255,0.42); line-height: 1.7;
  max-width: 240px;
}
.lo2-footer__col-title {
  font-family: var(--font-display);
  font-size: 13px; font-weight: 700;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.08em; text-transform: uppercase;
  margin-bottom: 16px;
}
.lo2-footer__links { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.lo2-footer__link {
  font-family: var(--font-body);
  font-size: 13px; font-weight: 400;
  color: rgba(255,255,255,0.5);
  text-decoration: none; transition: color 0.15s;
}
.lo2-footer__link:hover { color: var(--white); }
.lo2-footer__contact { display: flex; flex-direction: column; gap: 10px; }
.lo2-footer__contact-row {
  display: flex; align-items: flex-start; gap: 9px;
  font-family: var(--font-body);
  font-size: 13px; font-weight: 400;
  color: rgba(255,255,255,0.5);
  line-height: 1.5; text-decoration: none;
  transition: color 0.15s;
}
.lo2-footer__contact-row svg { flex-shrink: 0; margin-top: 2px; opacity: 0.5; }
.lo2-footer__contact-row:hover { color: rgba(255,255,255,0.8); }
.lo2-footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: 24px;
  display: flex; align-items: center;
  justify-content: space-between;
  flex-wrap: wrap; gap: 8px;
}
.lo2-footer__copy {
  font-family: var(--font-body);
  font-size: 12px; color: rgba(255,255,255,0.28);
}

/* ── About / Nosotros ─────────────────────────────────────────── */
.lo2-about-hero {
  background: var(--gray-100);
  padding: 80px 0;
  border-bottom: 1px solid var(--gray-200);
}
.lo2-about-hero__eyebrow {
  display: block;
  font-family: var(--font-body);
  font-size: 12px; font-weight: 500;
  color: var(--orange);
  letter-spacing: 0.1em; text-transform: uppercase;
  margin-bottom: 12px;
}
.lo2-about-hero__title {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(36px, 5vw, 56px);
  color: var(--black);
  letter-spacing: -0.02em; line-height: 1.05; margin-bottom: 16px;
}
.lo2-about-hero__sub {
  font-family: var(--font-body);
  font-weight: 300; font-size: 17px;
  color: var(--gray-500); max-width: 560px; line-height: 1.65;
}
.lo2-about-who { padding: 80px 0; }
.lo2-about-who__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px; align-items: start;
}
.lo2-about-who__content h2 {
  font-family: var(--font-display);
  font-weight: 700; font-size: 30px;
  letter-spacing: -0.01em; color: var(--black); margin-bottom: 20px;
}
.lo2-about-who__content p {
  font-family: var(--font-body);
  font-size: 15px; color: var(--gray-700);
  line-height: 1.75; margin-bottom: 16px;
}
.lo2-about-image {
  width: 100%; aspect-ratio: 4/3;
  background: var(--gray-100); border-radius: 16px;
  border: 1px solid var(--gray-200);
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: 10px;
  color: var(--gray-500); font-family: var(--font-body); font-size: 13px;
}
.lo2-about-clients {
  background: var(--gray-100); padding: 64px 0;
  border-top: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
}
.lo2-clients-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px; margin-top: 40px;
}
.lo2-client-logo {
  height: 72px; background: var(--white);
  border: 1px solid var(--gray-200); border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-body); font-size: 11px; color: var(--gray-500);
}
.lo2-about-zone { padding: 64px 0; }
.lo2-about-zone h2 {
  font-family: var(--font-display);
  font-weight: 700; font-size: 28px;
  letter-spacing: -0.01em; color: var(--black); margin-bottom: 16px;
}
.lo2-about-zone p {
  font-family: var(--font-body);
  font-size: 15px; color: var(--gray-700);
  line-height: 1.75; max-width: 640px;
}

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .lo2-cat-grid { grid-template-columns: repeat(4, 1fr); }
  .lo2-footer__grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .lo2-about-who__inner { gap: 48px; }
}
@media (max-width: 768px) {
  .lo2-hero { grid-template-columns: 1fr; min-height: auto; }
  .lo2-hero__bg-right { display: none; }
  .lo2-hero__left { padding: 48px var(--container-px); }
  .lo2-hero__right { display: none; }
  .lo2-stats__grid { grid-template-columns: 1fr; }
  .lo2-stats__item + .lo2-stats__item::before { display: none; }
  .lo2-info-strip__grid { grid-template-columns: 1fr; }
  .lo2-info-strip__item + .lo2-info-strip__item::before { display: none; }
  .lo2-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .lo2-b2b__grid { grid-template-columns: 1fr; gap: 28px; }
  .lo2-footer__grid { grid-template-columns: 1fr; gap: 32px; }
  .lo2-about-who__inner { grid-template-columns: 1fr; gap: 36px; }
  .lo2-clients-grid { grid-template-columns: repeat(2, 1fr); }
  .lo2-header__nav { display: none; }
  .lo2-header__search { width: 160px; }
}
@media (max-width: 480px) {
  .lo2-header__search { display: none; }
  .lo2-cat-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}

/* Logo image — clase real detectada en HTML: lo2-logo__img */
.lo2-logo__img,
.lo2-header__logo-img {
  height: 38px !important;
  width: auto !important;
  max-width: none !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Protección header: ninguna regla de producto afecta imágenes del header */
header img,
.lo2-header img,
#header img,
.navbar img,
#top_menu img {
  width: auto !important;
  height: auto !important;
  max-height: 50px !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
}
/* Excepción: el logo tiene tamaño fijo */
header .lo2-logo__img,
.lo2-header .lo2-logo__img {
  height: 38px !important;
  width: auto !important;
}

/* ============================================================
   IMÁGENES DE PRODUCTO — scope estricto por body class
   Shop grid:  body.o_website_sale_products
   Detalle:    body.o_website_sale_product
   ============================================================ */

/* ── GRILLA: contenedor ── */
body.o_website_sale_products .oe_product_cart .oe_product_image,
body.o_website_sale_products .o_wsale_product_grid_wrapper .oe_product_image {
  height: 220px !important;
  background: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  padding: 12px !important;
}

/* Span wrapper */
body.o_website_sale_products .oe_product_image .oe_product_image_img_wrapper,
body.o_website_sale_products .oe_product_image_link .oe_product_image_img_wrapper {
  display: flex !important;
  width: 100% !important;
  height: 100% !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Imagen en grilla */
body.o_website_sale_products img.oe_product_image_img,
body.o_website_sale_products .oe_product_image_link img,
body.o_website_sale_products .oe_product_image img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}

/* ── DETALLE: carrusel ── */
body.o_website_sale_product #o-carousel-product .carousel-inner,
body.o_website_sale_product .o_wsale_product_images .carousel-inner {
  min-height: 380px !important;
  background: #ffffff !important;
}

body.o_website_sale_product #o-carousel-product .carousel-item,
body.o_website_sale_product .o_wsale_product_images .carousel-item {
  background: #ffffff !important;
}

/* Wrapper imagen principal */
body.o_website_sale_product .o_product_detail_img_wrapper {
  align-items: center !important;
  justify-content: center !important;
  background: #ffffff !important;
  padding: 20px !important;
}

/* Imagen principal detalle */
body.o_website_sale_product img.product_detail_img,
body.o_website_sale_product .o_product_detail_img_wrapper img,
body.o_website_sale_product #o-carousel-product .carousel-item img,
body.o_website_sale_product .o_wsale_product_images .carousel-item img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: transparent !important;
}

/* Thumbnails */
body.o_website_sale_product .o_wsale_product_images .o_carousel_product_indicators img,
body.o_website_sale_product .product_detail_img_thumbs img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  background: #ffffff !important;
  padding: 4px !important;
}


/* ============================================================
   Ocultar header y footer nativos de Odoo
   ============================================================ */
#top    { display: none !important; }
#bottom { display: none !important; }

/* ============================================================
   Stats 4 columnas
   ============================================================ */
.lo2-stats__grid--4 {
  grid-template-columns: repeat(4, 1fr) !important;
}

/* ============================================================
   Ticker de marcas
   ============================================================ */
.lo2-ticker-wrap {
  overflow: hidden;
  padding: 28px 0;
  background: var(--gray-100);
  border-top: 1px solid var(--gray-200);
  border-bottom: 1px solid var(--gray-200);
}
.lo2-ticker-inner {
  display: flex;
  align-items: center;
  gap: 48px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 var(--container-px);
}
.lo2-ticker-inner span {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.08em;
  color: var(--gray-500);
  text-transform: uppercase;
  opacity: 0.6;
  transition: opacity 0.2s;
}
.lo2-ticker-inner span:hover { opacity: 1; }

/* ============================================================
   Seccion Como comprar — 4 tarjetas
   ============================================================ */
.lo2-steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.lo2-step-card {
  border: 1.5px solid var(--gray-200);
  border-radius: 12px;
  padding: 32px 24px;
  background: var(--white);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.lo2-step-card:hover {
  border-color: var(--orange);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.lo2-step-card__num {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 32px;
  color: var(--orange);
  margin-bottom: 16px;
  line-height: 1;
}
.lo2-step-card__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  color: var(--black);
  margin-bottom: 10px;
}
.lo2-step-card__text {
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--gray-500);
  line-height: 1.65;
}

/* ============================================================
   B2B — grupos de CTA
   ============================================================ */
.lo2-b2b__cta-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  flex-shrink: 0;
}
.lo2-b2b__secondary-cta {
  font-family: var(--font-body);
  font-size: 13px;
  color: rgba(255,255,255,0.45);
}
.lo2-b2b__inline-link {
  color: rgba(255,255,255,0.75);
  text-decoration: underline;
  transition: color 0.15s;
}
.lo2-b2b__inline-link:hover { color: var(--white); }

/* ============================================================
   Responsive extra
   ============================================================ */
@media (max-width: 1024px) {
  .lo2-steps-grid { grid-template-columns: repeat(2, 1fr); }
  .lo2-stats__grid--4 { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 768px) {
  .lo2-steps-grid { grid-template-columns: 1fr; }
  .lo2-stats__grid--4 { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .lo2-stats__grid--4 { grid-template-columns: 1fr !important; }
}
/* === BOTONES HEADER === */
.lo2-btn-cta {
    background-color: #E87722 !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-left: 10px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    display: inline-block !important;
    cursor: pointer !important;
}
.lo2-btn-cta:hover {
    background-color: #C5611A !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(232,119,34,0.3) !important;
    color: #FFFFFF !important;
    text-decoration: none !important;
}
.lo2-btn-secondary {
    background-color: #FFFFFF !important;
    color: #444444 !important;
    border: 1px solid #E8E8E8 !important;
    padding: 9px 19px !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: all 0.2s ease !important;
}
.lo2-btn-secondary:hover {
    border-color: #444444 !important;
    color: #111111 !important;
    text-decoration: none !important;
}


/* ===== HEADER LIBOESTE OVERRIDE (clases reales arch 4208) ===== */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=DM+Sans:wght@300;400;500;600&display=swap');

.lo2-announce {
    background: #111111 !important;
    color: #FFFFFF !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 12px !important;
    padding: 6px 0 !important;
    width: 100% !important;
}
.lo2-announce__inner {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 32px !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
}
.lo2-announce__item {
    color: #FFFFFF !important;
    font-size: 12px !important;
    letter-spacing: 0.02em !important;
}

.lo2-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: rgba(255,255,255,0.97) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid #E8E8E8 !important;
    width: 100% !important;
}
.lo2-header__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 32px !important;
    padding: 0 40px !important;
    height: 68px !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
}
.lo2-header__logo {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    flex-shrink: 0 !important;
    gap: 10px !important;
}
.lo2-header .lo2-logo__img,
.lo2-header__logo .lo2-logo__img {
    height: 40px !important;
    width: auto !important;
    max-width: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    display: block !important;
}

.lo2-header__nav {
    display: flex !important;
    align-items: center !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 4px !important;
}
.lo2-nav-item {
    position: relative !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.lo2-nav-link {
    display: block !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #444444 !important;
    text-decoration: none !important;
    padding: 8px 14px !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}
.lo2-nav-link:hover {
    color: #111111 !important;
    background: #F4F4F4 !important;
    text-decoration: none !important;
}

.lo2-megamenu {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: -12px !important;
    background: #FFFFFF !important;
    border: 1px solid #E8E8E8 !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.10) !important;
    padding: 12px !important;
    min-width: 460px !important;
    display: none !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4px !important;
    z-index: 1001 !important;
}
.lo2-nav-item:hover .lo2-megamenu {
    display: grid !important;
}
.lo2-megamenu__link {
    display: block !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 13px !important;
    color: #444444 !important;
    padding: 8px 12px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
}
.lo2-megamenu__link:hover {
    background: #FFF0E6 !important;
    color: #E87722 !important;
    text-decoration: none !important;
}

.lo2-header__actions {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-shrink: 0 !important;
}
.lo2-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}
.lo2-btn-secondary {
    background-color: #FFFFFF !important;
    color: #444444 !important;
    border: 1px solid #E8E8E8 !important;
    padding: 9px 19px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
}
.lo2-btn-secondary:hover {
    border-color: #444444 !important;
    color: #111111 !important;
    text-decoration: none !important;
}
.lo2-btn-cta {
    background-color: #E87722 !important;
    color: #FFFFFF !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}
.lo2-btn-cta:hover {
    background-color: #C5611A !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(232,119,34,0.30) !important;
    color: #FFFFFF !important;
    text-decoration: none !important;
}

.lo2-container {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
}

/* === FIX IMAGEN DETALLE — TAMAÑO PROPORCIONAL Y MAXIMIZADO === */

/* 1. Contenedor Maestro (El marco gris) */
#product_detail .o_wsale_product_images,
.o_wsale_product_page .o_wsale_product_images {
    background: #FFFFFF !important;
    border: 1px solid #E8E8E8 !important;
    border-radius: 12px !important;
    padding: 8px !important; /* Padding reducido al mínimo para maximizar la foto */
    margin: 0 auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* 2. El item individual que sostiene la foto */
#product_detail .carousel-item,
#product_detail .product_detail_img {
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    max-width: 560px !important;
    min-height: unset !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 3. La Imagen — forzada a ocupar el 100% del cuadro */
#product_detail .carousel-item img,
#product_detail .product_detail_img img,
.o_wsale_product_page .o_wsale_product_images img,
#product_detail img.img-fluid {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* === CONTENEDOR CARD IMAGEN DETALLE === */
#product_detail .o_wsale_product_images,
#product_detail .product_detail_img,
.o_wsale_product_page .o_wsale_product_images {
    background: #FFFFFF !important;
    border: 1px solid #E8E8E8 !important;
    border-radius: 12px !important;
    padding: 24px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    aspect-ratio: 1 / 1 !important;
    max-width: 560px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
}

/* La imagen llena el contenedor con padding interno respetado */
#product_detail .o_wsale_product_images img,
#product_detail .product_detail_img img,
.o_wsale_product_page .o_wsale_product_images img,
#product_detail img.img-fluid {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    background: transparent !important;
    margin: 0 !important;
}

/* ===== FOOTER LIBOESTE V3 ===== */
.lo2-footer {
    background: #0D0D0D;
    color: rgba(255,255,255,0.5);
    padding: 56px 40px 24px;
    font-family: 'DM Sans', sans-serif;
}
.lo2-footer__main {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
    gap: 40px;
    max-width: 1400px;
    margin: 0 auto 40px;
}
.lo2-footer__logo {
    display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
}
.lo2-footer__logo-circle {
    width: 42px; height: 42px; background: #E87722;
    border-radius: 50%; display: flex; flex-direction: column;
    align-items: center; justify-content: center; flex-shrink: 0;
}
.lo2-footer__logo-lib {
    font-family: 'Syne', sans-serif; font-weight: 800;
    font-size: 13px; color: #fff; line-height: 1;
}
.lo2-footer__logo-oeste {
    font-family: 'Syne', sans-serif; font-weight: 700;
    font-size: 7px; color: #fff; letter-spacing: 0.05em; line-height: 1;
}
.lo2-footer__brand-name {
    font-family: 'Syne', sans-serif; font-weight: 700;
    font-size: 16px; color: #fff; line-height: 1.2;
}
.lo2-footer__brand-name span {
    font-weight: 400; font-size: 11px; opacity: 0.5;
}
.lo2-footer__tagline {
    font-size: 13px; line-height: 1.6; max-width: 280px;
    color: rgba(255,255,255,0.45);
}
.lo2-footer__col h4 {
    font-family: 'Syne', sans-serif; font-weight: 700;
    font-size: 13px; color: #fff; letter-spacing: 0.05em;
    text-transform: uppercase; margin-bottom: 16px;
}
.lo2-footer__col ul {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 10px;
}
.lo2-footer__col ul li,
.lo2-footer__col ul li a {
    font-size: 13px; color: rgba(255,255,255,0.45);
    text-decoration: none; transition: color 0.2s;
}
.lo2-footer__col ul li a:hover { color: #fff; }
.lo2-footer__contact li { line-height: 1.5; }
.lo2-footer__payments {
    max-width: 1400px; margin: 0 auto;
    padding: 24px 0;
    border-top: 1px solid rgba(255,255,255,0.08);
    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.lo2-footer__payments-label {
    font-family: 'Syne', sans-serif; font-weight: 700;
    font-size: 12px; color: #fff; letter-spacing: 0.05em;
    text-transform: uppercase;
}
.lo2-footer__payments-list {
    display: flex; gap: 10px; flex-wrap: wrap;
}
.lo2-pay-badge {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.7);
    font-size: 12px; font-weight: 500;
    padding: 6px 14px; border-radius: 6px;
}
.lo2-footer__bottom {
    max-width: 1400px; margin: 0 auto;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,0.08);
    display: flex; align-items: center; justify-content: space-between;
    font-size: 12px; color: rgba(255,255,255,0.4);
}
@media (max-width: 768px) {
    .lo2-footer__main { grid-template-columns: 1fr; gap: 28px; }
    .lo2-footer__bottom { flex-direction: column; gap: 8px; text-align: center; }
}

/* ===== FIX SECCIÓN CÓMO COMPRAR (v3 — selectores DOM reales) ===== */

/* 1. Título "¿Cómo comprar?" — tipografía Syne */
section.s_features.pt64.pb64.bg-white h2,
section.s_features.bg-white .col-12.text-center h2 {
    font-family: 'Syne', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    color: #111111 !important;
}

/* 2. Números 01/02/03/04 — todos en naranja corporativo, misma tipografía.
      El número es el primer <div> hijo directo de cada .card-body. */
section.s_features.pt64.pb64.bg-white .card-body > div:first-child {
    color: #E87722 !important;
    font-family: 'Syne', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
}

/* 3. Cards uniformes — fondo blanco + borde gris suave + sombra plana.
      El border-bottom de color sigue existiendo (inline !important), se enmascara abajo. */
section.s_features.pt64.pb64.bg-white .card {
    position: relative !important;
    background-color: #FFFFFF !important;
    border: 1px solid #E8E8E8 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

/* 4. Máscara que tapa la franja inferior de color (workaround a inline !important) */
section.s_features.pt64.pb64.bg-white .card::after {
    content: '';
    position: absolute;
    left: -1px;
    right: -1px;
    bottom: -5px;
    height: 6px;
    background: #FFFFFF;
    border-radius: 0 0 12px 12px;
    z-index: 2;
    pointer-events: none;
}

/* 5. Tipografía consistente dentro de la card */
section.s_features.pt64.pb64.bg-white .card h4 {
    font-family: 'Syne', sans-serif !important;
    font-weight: 700 !important;
    color: #111111 !important;
    font-size: 1.05rem !important;
    letter-spacing: -0.01em !important;
}
section.s_features.pt64.pb64.bg-white .card p {
    font-family: 'DM Sans', sans-serif !important;
    color: #555 !important;
    line-height: 1.55 !important;
}

/* 6. Defensiva: si el builder vuelve a inyectar una sección oscura vacía arriba */
section.o_colored_level.bg-black:empty,
section.o_colored_level.bg-dark:empty {
    display: none !important;
}

/* ===== FIX IMAGEN DETALLE PRODUCTO (definitivo v4) ===== */
/* Garantiza altura/ancho reales para el carrusel del detalle de producto.
   El HTML real es:
   .o_wsale_product_images > #o-carousel-product > .o_carousel_product_outer > .carousel-inner > .carousel-item
       > .lo2-product-image-container > img.lo2-product-detail-img            */

#product_detail .o_wsale_product_images,
.o_wsale_product_images {
    min-height: 480px !important;
}
#product_detail .o_wsale_product_images #o-carousel-product,
#product_detail .o_wsale_product_images .o_carousel_product_outer,
#product_detail .o_wsale_product_images .carousel-inner,
#product_detail .o_wsale_product_images .carousel-item {
    min-height: 480px !important;
    height: 100% !important;
}
#product_detail .o_wsale_product_images .carousel-item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
#product_detail .lo2-product-image-container {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 480px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    box-sizing: border-box !important;
    background: #FFFFFF !important;
}
#product_detail .lo2-product-detail-img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    display: block !important;
    background: transparent !important;
    mix-blend-mode: normal !important;
}
@media (min-width: 992px) {
    #product_detail .o_wsale_product_images,
    #product_detail .o_wsale_product_images .carousel-inner,
    #product_detail .o_wsale_product_images .carousel-item,
    #product_detail .lo2-product-image-container {
        min-height: 560px !important;
    }
}

/* ===== BOTONES DETALLE PRODUCTO — NARANJA #E87722 ===== */

/* Agregar al carrito */
#product_detail #add_to_cart,
#product_detail a#add_to_cart,
#product_detail button#add_to_cart,
#product_detail .o_we_buy_btn,
.o_wsale_product_btn #add_to_cart,
#wrap #add_to_cart {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    transition: all 0.25s ease !important;
}

#product_detail #add_to_cart:hover,
#product_detail .o_we_buy_btn:hover,
#wrap #add_to_cart:hover {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(232,119,34,0.3) !important;
}

/* Botón corazón wishlist */
#product_detail .o_wsale_wishlist_btn,
#product_detail .o_add_wishlist,
#product_detail .o_add_wishlist_dyn,
#product_detail button.o_wsale_wishlist_btn,
#wrap .o_wsale_wishlist_btn,
#wrap .o_add_wishlist,
#wrap .o_add_wishlist_dyn {
    border-color: #E87722 !important;
    color: #E87722 !important;
    background: #FFFFFF !important;
}

#product_detail .o_wsale_wishlist_btn:hover,
#product_detail .o_add_wishlist:hover,
#wrap .o_wsale_wishlist_btn:hover,
#wrap .o_add_wishlist:hover {
    background-color: #FFF0E6 !important;
    border-color: #E87722 !important;
    color: #E87722 !important;
}

/* SVG / <i> icon del corazón */
#product_detail .o_wsale_wishlist_btn svg,
#product_detail .o_add_wishlist svg,
#product_detail .o_add_wishlist_dyn svg,
#wrap .o_wsale_wishlist_btn svg,
#wrap .o_add_wishlist svg {
    fill: #E87722 !important;
    stroke: #E87722 !important;
}
#product_detail .o_wsale_wishlist_btn i.fa,
#product_detail .o_add_wishlist i.fa,
#wrap .o_wsale_wishlist_btn i.fa,
#wrap .o_add_wishlist i.fa {
    color: #E87722 !important;
}

/* Override genérico de cualquier btn-primary en la página del producto */
#product_detail .btn-primary:not(.lo2-btn-cta),
#wrap .o_wsale_product_btn_wrapper .btn-primary {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}

#product_detail .btn-primary:not(.lo2-btn-cta):hover,
#wrap .o_wsale_product_btn_wrapper .btn-primary:hover {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
}

/* ===== CATÁLOGO /shop — COLORES NARANJA ===== */

/* 1. CORAZÓN WISHLIST EN CARDS */
.oe_website_sale .o_add_wishlist,
.oe_website_sale .o_add_wishlist_dyn,
.oe_website_sale .o_wsale_wishlist_btn,
.o_wsale_product_grid_wrapper .o_add_wishlist,
.o_wsale_product_grid_wrapper .o_add_wishlist_dyn,
#products_grid .o_add_wishlist,
#products_grid .o_add_wishlist_dyn {
    color: #E87722 !important;
    border-color: #E87722 !important;
    background: rgba(255,255,255,0.9) !important;
}
.oe_website_sale .o_add_wishlist svg,
.oe_website_sale .o_add_wishlist_dyn svg,
.oe_website_sale .o_wsale_wishlist_btn svg,
#products_grid .o_add_wishlist svg,
#products_grid .o_add_wishlist_dyn svg {
    stroke: #E87722 !important;
    fill: none !important;
}
.oe_website_sale .o_add_wishlist i.fa,
.oe_website_sale .o_add_wishlist_dyn i.fa,
.oe_website_sale .o_wsale_wishlist_btn i.fa,
#products_grid .o_add_wishlist i.fa,
#products_grid .o_add_wishlist_dyn i.fa {
    color: #E87722 !important;
}
.oe_website_sale .o_add_wishlist:hover,
.oe_website_sale .o_add_wishlist_dyn:hover,
.oe_website_sale .o_wsale_wishlist_btn:hover {
    background: #FFF0E6 !important;
    border-color: #E87722 !important;
    color: #E87722 !important;
}

/* 2. DROPDOWN ORDENAR — ITEM ACTIVO */
.oe_website_sale .dropdown-item.active,
.oe_website_sale .dropdown-item:active,
#o_wsale_orderby_dropdown .dropdown-item.active,
#o_wsale_orderby_dropdown .dropdown-item:active,
.o_wsale_search_panel .dropdown-item.active,
.o_wsale_apply_categ.active {
    background-color: #E87722 !important;
    color: #FFFFFF !important;
}
.oe_website_sale .dropdown-toggle:focus,
.oe_website_sale .dropdown-toggle:active,
.oe_website_sale .btn-secondary:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 2px rgba(232,119,34,0.2) !important;
}

/* 3. SLIDER DE PRECIO (noUiSlider) */
.oe_website_sale .o_wsale_price_range_input,
.o_wsale_search_panel .noUi-connect,
.o_wsale_search_panel .noUi-handle,
.oe_website_sale .noUi-connect,
.oe_website_sale .noUi-handle,
#wrap .noUi-connect {
    background: #E87722 !important;
    border-color: #E87722 !important;
}
#wrap .noUi-handle,
.oe_website_sale .noUi-handle {
    border: 2px solid #E87722 !important;
    box-shadow: 0 0 0 3px rgba(232,119,34,0.2) !important;
}
#wrap .noUi-handle::before,
#wrap .noUi-handle::after,
.oe_website_sale .noUi-handle::before,
.oe_website_sale .noUi-handle::after {
    background: #E87722 !important;
}

/* 4. PILLS/TABS DE CATEGORÍAS — panel lateral / collapse */
.oe_website_sale .o_wsale_search_panel .nav-link,
.oe_website_sale .o_wsale_category_nav .nav-link,
#o_shop_collapse_category .nav-link,
.o_wsale_search_panel a.nav-link {
    border-radius: 20px !important;
    padding: 6px 16px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #444444 !important;
    border: 1px solid #E8E8E8 !important;
    background: #FFFFFF !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
}
.oe_website_sale .o_wsale_search_panel .nav-link:hover,
.oe_website_sale .o_wsale_category_nav .nav-link:hover,
#o_shop_collapse_category .nav-link:hover {
    border-color: #E87722 !important;
    color: #E87722 !important;
    background: #FFF0E6 !important;
}
.oe_website_sale .o_wsale_search_panel .nav-link.active,
.oe_website_sale .o_wsale_category_nav .nav-link.active,
#o_shop_collapse_category .nav-link.active,
.oe_website_sale .o_wsale_search_panel .nav-link.active *,
#o_shop_collapse_category .nav-link.active * {
    background: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
}

/* Barra horizontal de categorías arriba del grid */
.oe_website_sale .o_wsale_categories_top_bar .nav-link,
.o_wsale_categories_top_bar a,
.o_wsale_products_grid_top_bar .nav-link {
    border-radius: 20px !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #444444 !important;
    border: 1px solid #E8E8E8 !important;
    background: #FFFFFF !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
}
.oe_website_sale .o_wsale_categories_top_bar .nav-link:hover,
.o_wsale_categories_top_bar a:hover,
.o_wsale_products_grid_top_bar .nav-link:hover {
    border-color: #E87722 !important;
    color: #E87722 !important;
    background: #FFF0E6 !important;
}
.oe_website_sale .o_wsale_categories_top_bar .nav-link.active,
.o_wsale_categories_top_bar a.active,
.o_wsale_categories_top_bar a[aria-current],
.o_wsale_products_grid_top_bar .nav-link.active {
    background: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}

/* 5. Tabs "Más Vendidos" / "Novedades" */
.oe_website_sale .o_wsale_sort_tabs .nav-link,
.o_wsale_sort_tabs a {
    border-radius: 20px !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    color: #444444 !important;
    border: 1px solid #E8E8E8 !important;
    background: #FFFFFF !important;
    transition: all 0.2s !important;
}
.oe_website_sale .o_wsale_sort_tabs .nav-link:hover,
.o_wsale_sort_tabs a:hover {
    border-color: #E87722 !important;
    color: #E87722 !important;
    background: #FFF0E6 !important;
}
.oe_website_sale .o_wsale_sort_tabs .nav-link.active,
.o_wsale_sort_tabs a.active {
    background: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}
/* ===== CATÁLOGO /shop — COMPLEMENTO (filmstrip + offcanvas filtros) ===== */

/* Filmstrip (barra horizontal de categorías sobre /shop) */
#o_wsale_categories_filmstrip .o_wsale_filmstrip_link {
    color: #444444 !important;
    transition: color 0.2s ease, background 0.2s ease !important;
    text-decoration: none !important;
}
#o_wsale_categories_filmstrip .o_wsale_filmstrip_link:hover,
#o_wsale_categories_filmstrip .o_wsale_filmstrip_link:focus {
    color: #E87722 !important;
}
#o_wsale_categories_filmstrip .o_wsale_filmstrip_link:hover .o_wsale_filmstrip_item {
    background: #FFF0E6 !important;
    border-radius: 8px !important;
}
#o_wsale_categories_filmstrip input.btn-check:checked ~ .o_wsale_filmstrip_item,
#o_wsale_categories_filmstrip .o_wsale_filmstrip_link[aria-current] .o_wsale_filmstrip_item,
#o_wsale_categories_filmstrip li.active .o_wsale_filmstrip_item {
    background: #FFF0E6 !important;
    border: 1px solid #E87722 !important;
    border-radius: 8px !important;
}
#o_wsale_categories_filmstrip input.btn-check:checked ~ .o_wsale_filmstrip_item span,
#o_wsale_categories_filmstrip li.active span {
    color: #E87722 !important;
    font-weight: 600 !important;
}

/* Offcanvas filtros (#o_wsale_offcanvas) — botón "Filtros" + checks naranja */
#o_wsale_offcanvas .form-check-input:checked {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
}
#o_wsale_offcanvas .btn-primary,
#o_wsale_offcanvas .btn-secondary.active {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}
#o_wsale_offcanvas .nav-link.active,
#o_wsale_offcanvas a.active {
    color: #E87722 !important;
    background: #FFF0E6 !important;
    border-radius: 8px !important;
}

/* Wishlist visible al hover sobre la card del grid */
#o_wsale_products_grid .oe_product_cart .o_add_wishlist,
#o_wsale_products_grid .oe_product_cart .o_add_wishlist_dyn,
#o_wsale_products_grid .oe_product_cart [class*="wishlist"] {
    color: #E87722 !important;
    border-color: #E87722 !important;
}
#o_wsale_products_grid .oe_product_cart .o_add_wishlist i.fa,
#o_wsale_products_grid .oe_product_cart .o_add_wishlist_dyn i.fa {
    color: #E87722 !important;
}

/* Cards "Más Vendidos"/"Novedades" — hover sutil naranja */
.oe_product_cart:hover .oe_product_image {
    box-shadow: 0 0 0 1px #E87722 !important;
}
/* ===== OCULTAR BOTÓN CARRITO EN CARDS ===== */
.oe_website_sale .oe_product_cart .o_wsale_product_btn,
.oe_website_sale .oe_product_cart form:not(.o_wishlist_form):not([action*="wishlist"]),
.oe_website_sale .oe_product_cart button:not(.o_add_wishlist):not(.o_add_wishlist_dyn):not(.o_wsale_wishlist_btn),
.oe_website_sale .o_wsale_product_grid_wrapper .o_wsale_product_btn {
    display: none !important;
}

/* ===== CORAZÓN WISHLIST SIEMPRE VISIBLE ===== */

/* Mostrar siempre + estilo. Selectores con especificidad suficiente
   para ganarle a cualquier regla previa que oculte botones en card. */
.oe_website_sale .oe_product_cart .o_add_wishlist,
.oe_website_sale .oe_product_cart .o_add_wishlist_dyn,
.oe_website_sale .oe_product_cart .o_wsale_wishlist_btn,
.oe_website_sale .o_wsale_product_grid_wrapper .o_add_wishlist,
.oe_website_sale .o_wsale_product_grid_wrapper .o_add_wishlist_dyn,
.oe_website_sale .o_wsale_product_grid_wrapper button.o_add_wishlist_dyn,
#products_grid .o_add_wishlist,
#products_grid .o_add_wishlist_dyn,
#o_wsale_products_grid .o_add_wishlist_dyn {
    opacity: 1 !important;
    visibility: visible !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,0.92) !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 10 !important;
    padding: 0 !important;
}

.oe_website_sale .oe_product_cart .o_add_wishlist:hover,
.oe_website_sale .oe_product_cart .o_add_wishlist_dyn:hover,
.oe_website_sale .o_wsale_product_grid_wrapper .o_add_wishlist:hover,
.oe_website_sale .o_wsale_product_grid_wrapper .o_add_wishlist_dyn:hover {
    background: #FFF0E6 !important;
    transform: scale(1.1) !important;
}

/* Ícono del corazón en naranja */
.oe_website_sale .o_add_wishlist svg,
.oe_website_sale .o_add_wishlist_dyn svg,
.oe_website_sale .o_add_wishlist i,
.oe_website_sale .o_add_wishlist_dyn i,
#products_grid .o_add_wishlist svg,
#products_grid .o_add_wishlist_dyn svg,
#products_grid .o_add_wishlist_dyn i.fa,
.oe_website_sale .o_add_wishlist_dyn i.fa-heart-o,
.oe_website_sale .o_add_wishlist_dyn i.fa-heart {
    color: #E87722 !important;
    fill: none !important;
    stroke: #E87722 !important;
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
    margin: 0 !important;
}

/* Estado activo (producto ya en wishlist) — corazón relleno */
.oe_website_sale .o_add_wishlist.o_wishlist_in svg,
.oe_website_sale .o_add_wishlist_dyn.o_wishlist_in svg,
.oe_website_sale .o_add_wishlist.o_wishlist_in i.fa,
.oe_website_sale .o_add_wishlist_dyn.o_wishlist_in i.fa {
    fill: #E87722 !important;
    stroke: #E87722 !important;
    color: #E87722 !important;
}

/* Contenedor de imagen relativo para que el corazón se posicione */
.oe_website_sale .oe_product_image,
.oe_website_sale .lo2-product-image-wrap,
.o_wsale_product_grid_wrapper .oe_product_image {
    position: relative !important;
}

/* ===== PAGINA LOGIN ===== */
.oe_login_form .btn-primary,
#login_form .btn-primary,
.o_login_form .btn-primary,
form[action="/web/login"] .btn-primary,
form[action*="login"] button[type="submit"],
.o_portal_wrap .btn-primary {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}
.oe_login_form .btn-primary:hover,
#login_form .btn-primary:hover,
form[action*="login"] button[type="submit"]:hover {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
}

/* Link restablecer contrasena */
.oe_login_form a,
#login_form a,
form[action*="login"] a {
    color: #E87722 !important;
}
form[action*="login"] a:hover {
    color: #C5611A !important;
}

/* Input focus naranja */
.oe_login_form .form-control:focus,
#login_form .form-control:focus,
form[action*="login"] .form-control:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 3px rgba(232,119,34,0.15) !important;
}

/* >>> HEADER DINAMICO PERFIL+CARRITO START <<< */
/* === FIX POPOVER CARRITO === */
.popover .btn-primary,
.o_cart_popover .btn-primary,
.toast .btn-primary,
div[role="tooltip"] .btn-primary {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    text-transform: none !important;
    border-radius: 6px !important;
}
.popover .btn-primary:hover,
.o_cart_popover .btn-primary:hover,
.toast .btn-primary:hover,
div[role="tooltip"] .btn-primary:hover {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
}

/* === FIX BREADCRUMBS (Migas de pan) === */
.breadcrumb a,
.o_breadcrumb a,
nav[aria-label="breadcrumb"] a {
    color: #E87722 !important;
    font-family: 'DM Sans', sans-serif !important;
    text-decoration: none !important;
}
.breadcrumb a:hover,
.o_breadcrumb a:hover,
nav[aria-label="breadcrumb"] a:hover {
    color: #C5611A !important;
    text-decoration: underline !important;
}
.breadcrumb-item.active,
.breadcrumb .active {
    color: #7A7A7A !important;
    font-family: 'DM Sans', sans-serif !important;
}

/* === FIX CARRITO DE COMPRAS Y CHECKOUT === */
.oe_cart .btn-primary, #o_cart_summary .btn-primary, .o_wsale_wizard_step_indicator .btn-primary, .o_wsale_checkout .btn-primary {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
    font-family: 'DM Sans', sans-serif !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
}
.oe_cart .btn-primary:hover, #o_cart_summary .btn-primary:hover, .o_wsale_wizard_step_indicator .btn-primary:hover, .o_wsale_checkout .btn-primary:hover {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
}
.oe_cart a, .oe_cart .btn-link, #o_cart_summary a, .o_wsale_checkout a {
    color: #E87722 !important;
}
.oe_cart a:hover, .oe_cart .btn-link:hover, #o_cart_summary a:hover, .o_wsale_checkout a:hover {
    color: #C5611A !important;
    text-decoration: underline !important;
}
/* Progress Bar (Wizard) */
.o_wsale_wizard_step_indicator .nav-link { color: #7A7A7A !important; }
.o_wsale_wizard_step_indicator .active, .o_wsale_wizard_step_indicator .active .badge {
    color: #E87722 !important;
    font-weight: 700 !important;
}

/* === FIX HEADER HOVERS === */
.btn-header-cart { background-color: #E87722 !important; border-color: #E87722 !important; color: #FFFFFF !important; }
.btn-header-cart:hover { background-color: #C5611A !important; border-color: #C5611A !important; color: #FFFFFF !important; }

/* === FIX CORAL EN FORMULARIOS DE CHECKOUT === */
.oe_website_sale .btn-primary,
.o_wsale_checkout .btn-primary,
form.checkout_autoformat .btn-primary,
#o_payment_form_pay {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}
.oe_website_sale .btn-primary:hover,
.o_wsale_checkout .btn-primary:hover,
form.checkout_autoformat .btn-primary:hover,
#o_payment_form_pay:hover {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
}
/* Reemplazar los textos rojos nativos por el naranja corporativo en alertas de form */
.oe_website_sale .text-danger, .js_address_form .text-danger {
    color: #E87722 !important;
}

/* === TENIR SEGUIR COMPRANDO (real) === */
a.text-center[href="/shop"], a.text-center[href="/shop"] i { color: #E87722 !important; text-decoration: none !important; }
a.text-center[href="/shop"]:hover { color: #C5611A !important; }
/* === OCULTAR B2B CONFUSOS (real) === */
#quick_reorder_button, #quick_reorder_sidebar { display: none !important; }
.o_add_wishlist { display: none !important; }

/* === FIX CORAL: VOLVER AL CARRITO Y LINKS SECUNDARIOS === */
.oe_website_sale .btn-link,
form.checkout_autoformat .btn-link {
    color: #E87722 !important;
    text-decoration: none !important;
}
.oe_website_sale .btn-link:hover,
form.checkout_autoformat .btn-link:hover {
    color: #C5611A !important;
    text-decoration: underline !important;
}

/* === FIX CORAL: INPUT FOCUS Y ESTADOS DE ERROR === */
.oe_website_sale .form-control:focus,
.oe_website_sale .form-control.is-invalid,
.oe_website_sale .form-control.is-invalid:focus,
.js_address_form .form-control:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 0.2rem rgba(232, 119, 34, 0.25) !important;
}

/* === FIX CORAL CHECKOUT (clases reales O19) === */
/* Wizard / breadcrumb del checkout (steps 'Orden', etc.) */
#wrapwrap .o_wizard a, #wrapwrap .o_wizard a:visited {
    color: #E87722 !important;
    text-decoration: none !important;
}
#wrapwrap .o_wizard a:hover { color: #C5611A !important; }

/* Links secundarios del checkout (volver al carrito, links de resumen) */
#wrapwrap .o_customer_address_fill a,
#wrapwrap #o_cart_summary a,
#wrapwrap .btn-link {
    color: #E87722 !important;
    text-decoration: none !important;
}
#wrapwrap .o_customer_address_fill a:hover,
#wrapwrap #o_cart_summary a:hover,
#wrapwrap .btn-link:hover {
    color: #C5611A !important;
    text-decoration: underline !important;
}

/* Inputs: focus naranja (frontend) */
#wrapwrap .form-control:focus,
#wrapwrap .form-select:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 0.2rem rgba(232, 119, 34, 0.25) !important;
}
/* Inputs: estado de error/obligatorio (coral nativo -> naranja) */
#wrapwrap .form-control.is-invalid,
#wrapwrap .was-validated .form-control:invalid,
#wrapwrap .form-control.is-invalid:focus,
#wrapwrap .was-validated .form-control:invalid:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 0.2rem rgba(232, 119, 34, 0.25) !important;
}

/* === FIX CORAL ENTREGA (clases reales O19) === */
/* Radios y switches marcados */
#wrapwrap .form-check-input:checked {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
}

/* Boton 'agregar direccion' y contornos primary */
#wrapwrap .btn-outline-primary {
    color: #E87722 !important;
    border-color: #E87722 !important;
    background-color: transparent !important;
}
#wrapwrap .btn-outline-primary:hover {
    color: #FFFFFF !important;
    background-color: #E87722 !important;
    border-color: #E87722 !important;
}

/* Iconos de edicion (lapiz) y textos primary */
#wrapwrap .text-primary,
#wrapwrap i.fa-pencil,
#wrapwrap i.fa-edit {
    color: #E87722 !important;
}
#wrapwrap .text-primary:hover,
#wrapwrap i.fa-pencil:hover,
#wrapwrap i.fa-edit:hover {
    color: #C5611A !important;
}
/* Link 'Edit' de la tarjeta de direccion (a.no-decoration con lapiz) */
#wrapwrap .card-body a.no-decoration {
    color: #E87722 !important;
}
#wrapwrap .card-body a.no-decoration:hover {
    color: #C5611A !important;
}

/* Badge 'direccion principal': turquesa nativo -> gris neutro */
#wrapwrap .badge.text-bg-info,
#wrapwrap .badge.bg-info {
    background-color: #7A7A7A !important;
    color: #FFFFFF !important;
}

/* === LIMPIEZA PORTAL VENTAS (clases reales O19) === */
/* Hover en lista de cotizaciones (/my/quotes) */
.o_portal_my_doc_table tbody tr {
    transition: all 0.2s ease-in-out !important;
    cursor: pointer !important;
}
.o_portal_my_doc_table tbody tr:hover {
    background-color: #F8F9FA !important;
    transform: translateX(4px) !important;
    border-left: 4px solid #E87722 !important;
}

/* Limpieza sidebar: EDI (Odoo promo), nav interna rota, Powered by Odoo */
#portal_connect_software_modal_btn,
#sale_portal_connect_software_modal,
.o_portal_sidebar .navspy,
.o_portal_sidebar ul.bs-sidenav,
.o_portal_sidebar_content .navspy,
.o_portal_sidebar_content .text-muted:has(a[href*="odoo.com"]) {
    display: none !important;
}

/* Botones del sidebar (Descargar / Imprimir / Ver) -> outline naranja */
.o_portal_sidebar .btn-light,
.o_portal_sidebar .btn-secondary {
    background-color: transparent !important;
    border: 1px solid #E87722 !important;
    color: #E87722 !important;
}
.o_portal_sidebar .btn-light:hover,
.o_portal_sidebar .btn-secondary:hover {
    background-color: #E87722 !important;
    color: #FFFFFF !important;
}

/* Chatter: botón Enviar + clip de adjuntar */
.o_portal_chatter .btn-primary,
#sale_order_communication .btn-primary {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
    color: #FFFFFF !important;
}
.o_portal_chatter .btn-primary:hover,
#sale_order_communication .btn-primary:hover {
    background-color: #C5611A !important;
}
.o_portal_chatter .o_chatter_attachment_btn,
.o_portal_chatter .fa-paperclip {
    color: #E87722 !important;
}

/* === FIX: OCULTAR TARJETA DE DOCUMENTOS === */
.o_portal_docs a[href*="/my/documents"],
.o_portal_docs div:has(a[href*="/my/documents"]) {
    display: none !important;
}

/* === FIX: HOVER EN TARJETAS DEL PORTAL === */
.o_portal_docs .o_portal_category {
    transition: all 0.3s ease !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
}
.o_portal_docs .o_portal_category:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 8px 15px rgba(232, 119, 34, 0.15) !important;
    border: 1px solid rgba(232, 119, 34, 0.3) !important;
}
.o_portal_docs .o_portal_category:hover h5 {
    color: #E87722 !important;
}

/* === FIX: BOTONES EN CONEXION Y SEGURIDAD === */
.o_portal_security .btn-light,
.o_portal_security .btn-secondary,
.o_portal_security button[type="submit"] {
    background-color: #FFFFFF !important;
    border: 1px solid #E87722 !important;
    color: #E87722 !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    padding: 8px 16px !important;
    transition: all 0.2s !important;
}
.o_portal_security .btn-light:hover,
.o_portal_security .btn-secondary:hover,
.o_portal_security button[type="submit"]:hover {
    background-color: #E87722 !important;
    color: #FFFFFF !important;
}
/* Eliminar el texto confuso de 'Cerrar todas las cuentas' nativo si existe */
.o_portal_security a:contains("Cerrar todas las cuentas"),
.o_portal_security a:contains("Log out from all devices") {
    display: none !important;
}

/* === FIX: RESTAURACION DE BOTONES DEL HEADER === */
.liboeste-auth-menu { display: flex !important; gap: 1rem !important; align-items: center !important; }
.liboeste-auth-menu li { list-style: none !important; margin: 0 !important; padding: 0 !important; }

/* === FIX: TEXTOS CORAL EN EL INICIO === */
/* Cubre "Solicita tu cuenta", "Conoce mas" y "Ver todas" */
main a.text-primary,
main .text-primary,
.s_title a,
.s_features a {
    color: #E87722 !important;
    text-decoration: none !important;
}
main a.text-primary:hover,
main .text-primary:hover,
.s_title a:hover,
.s_features a:hover {
    color: #C5611A !important;
    text-decoration: underline !important;
}


/* ===== CARRITO NATIVO + PERFIL HEADER (v4) ===== */
/* Botones: carrito nativo (clase o_wsale_my_cart en el <li>, <a> interior) y Mi Perfil (.liboeste-btn-force) */
.lo2-header .o_wsale_my_cart > a,
header .o_wsale_my_cart > a,
.liboeste-btn-force {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 9px 18px !important;
    border-radius: 8px !important;
    border: 1.5px solid #E87722 !important;
    background: #FFFFFF !important;
    color: #E87722 !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    white-space: nowrap !important;
    position: relative !important;
}
/* El <li> del carrito nativo: reset de lista, no rompe el flex del header */
.lo2-header .o_wsale_my_cart,
header .o_wsale_my_cart {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
}
.lo2-header .o_wsale_my_cart > a:hover,
header .o_wsale_my_cart > a:hover,
.liboeste-btn-force:hover {
    background: #E87722 !important;
    color: #FFFFFF !important;
}
.lo2-header .o_wsale_my_cart i,
header .o_wsale_my_cart i,
.liboeste-btn-force i {
    font-size: 16px !important;
}
/* Contador INLINE (solo cuando se muestra: respeta el d-none nativo de cantidad 0) */
.lo2-header .o_wsale_my_cart .my_cart_quantity:not(.d-none),
header .o_wsale_my_cart .my_cart_quantity:not(.d-none) {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 6px !important;
    margin: 0 0 0 2px !important;
    background: #E87722 !important;
    color: #FFFFFF !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 10px !important;
    line-height: 1 !important;
    top: auto !important;
    right: auto !important;
}
.lo2-header .o_wsale_my_cart > a:hover .my_cart_quantity,
header .o_wsale_my_cart > a:hover .my_cart_quantity {
    background: #FFFFFF !important;
    color: #E87722 !important;
}

/* ===== IGUALAR TAMANO CARRITO Y MI PERFIL (v5) ===== */

/* Contenedor flex */
.liboeste-header-fix {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.liboeste-header-fix > li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
}
/* El <li> del carrito nativo es solo wrapper (el boton es el <a> interior) */
.lo2-header .o_wsale_my_cart,
header .o_wsale_my_cart {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* MISMO tamano para los DOS botones reales (<a>) */
.lo2-header .o_wsale_my_cart > a,
header .o_wsale_my_cart > a,
.lo2-header .liboeste-btn-force,
header .liboeste-btn-force {
    height: 44px !important;
    padding: 0 18px !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    line-height: 1 !important;
    border-radius: 8px !important;
    border: 1.5px solid #E87722 !important;
    white-space: nowrap !important;
}
/* Iconos iguales */
.lo2-header .o_wsale_my_cart i,
header .o_wsale_my_cart i,
.lo2-header .liboeste-btn-force i,
header .liboeste-btn-force i {
    font-size: 16px !important;
    line-height: 1 !important;
}
/* Quitar margenes extra del texto/elementos internos del carrito nativo */
.lo2-header .o_wsale_my_cart > a > span,
header .o_wsale_my_cart > a > span,
.lo2-header .o_wsale_my_cart > a > div,
header .o_wsale_my_cart > a > div {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}


/* ===== CARRITO HEADER (v5 — DOM real) ===== */

/* El <a> es el boton real (el li.o_wsale_my_cart es contenedor) */
.lo2-header li.o_wsale_my_cart > a,
header li.o_wsale_my_cart > a,
.liboeste-header-fix li.o_wsale_my_cart > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    height: 44px !important;
    padding: 0 18px !important;
    box-sizing: border-box !important;
    border: 1.5px solid #E87722 !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    color: #E87722 !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    white-space: nowrap !important;
    position: relative !important;
}
.lo2-header li.o_wsale_my_cart > a:hover,
header li.o_wsale_my_cart > a:hover {
    background: #E87722 !important;
    color: #FFFFFF !important;
}

/* El div interno que envuelve icono+badge - compactar */
.lo2-header li.o_wsale_my_cart > a > div,
header li.o_wsale_my_cart > a > div {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* CLAVE: anular fa-stack que reserva 32px */
.lo2-header li.o_wsale_my_cart i.fa-stack,
header li.o_wsale_my_cart i.fa-stack,
.lo2-header li.o_wsale_my_cart i.fa-shopping-cart,
header li.o_wsale_my_cart i.fa-shopping-cart {
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
    font-size: 16px !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

/* Badge contador - circulo compacto inline */
.lo2-header li.o_wsale_my_cart .my_cart_quantity,
header li.o_wsale_my_cart .my_cart_quantity {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #E87722 !important;
    color: #FFFFFF !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
    line-height: 1 !important;
    top: auto !important;
    right: auto !important;
}
.lo2-header li.o_wsale_my_cart > a:hover .my_cart_quantity,
header li.o_wsale_my_cart > a:hover .my_cart_quantity {
    background: #FFFFFF !important;
    color: #E87722 !important;
}

/* Respetar el ocultado nativo cuando cantidad = 0 */
.lo2-header li.o_wsale_my_cart .my_cart_quantity.d-none,
header li.o_wsale_my_cart .my_cart_quantity.d-none {
    display: none !important;
}

/* Texto del carrito */
.lo2-header li.o_wsale_my_cart span,
header li.o_wsale_my_cart span {
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

/* ===== PAGINA MI PERFIL ===== */
.lo2-perfil-titulo {
    font-family: 'Syne', sans-serif !important;
    font-weight: 800 !important;
    color: #111111 !important;
    font-size: 28px !important;
}
.lo2-perfil-datos { margin: 24px 0 32px; }
.lo2-perfil-card {
    display: flex; gap: 20px;
    background: #FFFFFF; border: 1px solid #E8E8E8;
    border-radius: 12px; padding: 24px;
}
.lo2-perfil-avatar {
    width: 64px; height: 64px; border-radius: 50%;
    background: #E87722; color: #FFFFFF;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Syne', sans-serif; font-weight: 800; font-size: 28px;
    flex-shrink: 0; text-transform: uppercase;
}
.lo2-perfil-info { flex: 1; }
.lo2-perfil-info h4 {
    font-family: 'Syne', sans-serif; font-weight: 700; font-size: 20px;
    color: #111111; margin: 0 0 12px;
}
.lo2-perfil-rows { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.lo2-perfil-rows > div {
    display: flex; gap: 12px;
    font-family: 'DM Sans', sans-serif; font-size: 14px; color: #444444;
}
.lo2-lbl { color: #7A7A7A; min-width: 70px; font-weight: 600; }
.lo2-btn-editar {
    display: inline-block; background: #E87722; color: #FFFFFF !important;
    font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 14px;
    padding: 10px 20px; border-radius: 8px; text-decoration: none !important;
    transition: all 0.2s;
}
.lo2-btn-editar:hover { background: #C5611A; }
.o_portal form[action="/my/security"] .btn,
.o_portal .btn-light,
.o_portal_wrap .btn-primary {
    background: #E87722 !important; border-color: #E87722 !important;
    color: #FFFFFF !important; border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important; font-weight: 600 !important;
}
.o_portal form[action="/my/security"] .btn:hover { background: #C5611A !important; }
/* No naranjizar los botones "ojo" de mostrar contrasena */
.o_portal form[action="/my/security"] .o_show_password {
    background: #FFFFFF !important; color: #7A7A7A !important;
    border: 1px solid #CED4DA !important;
}
.lo2-btn-logout {
    background: #FFFFFF !important; border: 1.5px solid #E87722 !important;
    color: #E87722 !important; border-radius: 8px !important;
    padding: 10px 20px !important;
    font-family: 'DM Sans', sans-serif !important; font-weight: 600 !important;
    cursor: pointer !important; transition: all 0.2s !important;
}
.lo2-btn-logout:hover { background: #E87722 !important; color: #FFFFFF !important; }
.o_portal h3, .o_portal h4, .o_portal_wrap h3 {
    font-family: 'Syne', sans-serif !important; color: #111111 !important;
}
.o_portal input:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 3px rgba(232,119,34,0.15) !important;
}

/* ===== PAGINAS DE PAGO/CONFIRMACION ===== */
/* Recuadro del mensaje de estado: de celeste (alert-info) a naranja.
   Acotado al contenedor de confirmacion y al de /payment/status para
   no repintar otros alerts informativos del sitio. */
[name="order_confirmation"] .alert,
[name="o_payment_status_alert"],
.o_payment_status_page [name="o_payment_status_alert"] {
    background: #FFF0E6 !important;
    border: 1px solid #E87722 !important;
    border-left: 4px solid #E87722 !important;
    color: #111111 !important;
    border-radius: 8px !important;
}
/* El icono de estado (i / spinner) en naranja para coherencia */
[name="o_payment_status_alert"] #o_payment_status_icon .fa {
    color: #E87722 !important;
}

/* ===== FIX DETALLES PAGO ===== */
/* (1) Boton "Ver mis pedidos": el tema pinta los <a> en naranja y
   quedaba texto naranja sobre fondo naranja (invisible). Forzar blanco. */
[name="order_confirmation"] a[href="/my/quotes"],
[name="o_payment_status_alert"] a[href="/my/quotes"],
.oe_website_sale a[href="/my/quotes"] {
    color: #FFFFFF !important;
    background: #E87722 !important;
    text-decoration: none !important;
}
[name="order_confirmation"] a[href="/my/quotes"]:hover,
.oe_website_sale a[href="/my/quotes"]:hover {
    background: #C5611A !important;
    color: #FFFFFF !important;
}
/* (4) Ocultar "Omitir" (Skip) -> acotado al alert de /payment/status */
[name="o_payment_status_alert"] a.alert-link {
    display: none !important;
}
/* (4) Ocultar "Espere..." SOLO cuando esta procesando (hay spinner),
   para no ocultar otros headings de estado (ej "¡Gracias!" en done). */
[name="o_payment_status_alert"]:has(.fa-spin) .alert-heading {
    display: none !important;
}

/* ===== UNIFICACIÓN CHECKOUT/CONFIRMACIÓN ===== */

/* A) TIPOGRAFÍA — matar serif nativa en todo el checkout */
.o_website_sale_checkout {
    font-family: var(--font-body, 'DM Sans', sans-serif) !important;
}
.o_website_sale_checkout h1,
.o_website_sale_checkout h2,
.o_website_sale_checkout h3,
.o_website_sale_checkout h4,
.o_website_sale_checkout h5,
.o_website_sale_checkout h6 {
    font-family: var(--font-display, 'Syne', sans-serif) !important;
    color: #111111 !important;
    font-weight: 800 !important;
}

/* B) FIX PANEL STICKY — debajo del header (68px + aire) */
.o_wsale_sticky_object,
.o_total_card.sticky-lg-top {
    top: 84px !important;
}

/* C) CUADRO DE DATOS (entrega/facturación) con branding */
.o_website_sale_checkout .card {
    border: 1px solid #E8E8E8 !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}
/* Labels Entrega/Facturación: celeste -> naranja */
.o_website_sale_checkout .badge.text-bg-info,
.o_website_sale_checkout .badge.bg-info {
    background: #E87722 !important;
    color: #FFFFFF !important;
}

/* D) BADGES GRISES -> naranja branding */
.o_website_sale_checkout .badge.bg-secondary {
    background: #111111 !important;
    color: #FFFFFF !important;
}
.o_website_sale_checkout .badge.bg-light {
    background: #FFF0E6 !important;
    color: #E87722 !important;
    border: 1px solid #E87722 !important;
}

/* E) PANEL PRODUCTO / TOTALES coherente */
.o_website_sale_checkout .o_total_card {
    border: 1px solid #E8E8E8 !important;
    border-radius: 12px !important;
}


/* F) BOTÓN DESCARGAR coherente */
.o_website_sale_checkout .btn-light {
    background: #FFFFFF !important;
    border: 1.5px solid #E87722 !important;
    color: #E87722 !important;
    border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
}
.o_website_sale_checkout .btn-light:hover {
    background: #E87722 !important;
    color: #FFFFFF !important;
}

/* ===== AJUSTE JERARQUÍA TIPOGRÁFICA CONFIRMACIÓN ===== */

/* "Total" y TODOS los montos -> DM Sans (legible), no Syne */
.o_website_sale_checkout tr[name="o_order_total"],
.o_website_sale_checkout tr[name="o_order_total"] td,
.o_website_sale_checkout tr[name="o_order_total"] span,
.o_website_sale_checkout .o_cart_total,
.o_website_sale_checkout .o_total_card td,
.o_website_sale_checkout .o_total_card span,
.o_website_sale_checkout .monetary_field {
    font-family: 'DM Sans', sans-serif !important;
    color: #111111 !important;
}
/* "Total" en DM Sans bold (jerarquía sin Syne) */
.o_website_sale_checkout tr[name="o_order_total"] {
    font-weight: 700 !important;
    font-size: 18px !important;
}

/* JERARQUÍA: "Orden S000xx" (#order_name h5) -> subtítulo gris DM Sans,
   que NO compita con el h3 principal "Pedido recibido" (queda Syne). */
.o_website_sale_checkout #order_name,
.o_website_sale_checkout #order_name h5 {
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 500 !important;
    font-size: 15px !important;
    color: #7A7A7A !important;
}

/* Saludo "¡Gracias por tu pedido!" del banner -> un poco más chico
   para no competir con "Pedido recibido". (Solo el primer parrafo
   del banner; NO se toca '.alert strong' global.) */
[name="order_confirmation"] .alert p:first-child {
    font-size: 18px !important;
}

/* Montos del panel derecho (producto, entrega, subtotal) -> DM Sans */
.o_website_sale_checkout .o_total_card table td,
.o_website_sale_checkout .o_total_card table span,
.o_website_sale_checkout .oe_currency_value {
    font-family: 'DM Sans', sans-serif !important;
}

/* ===== TIPOGRAFÍA GLOBAL (Syne títulos / DM Sans cuerpo) ===== */

/* Títulos -> Syne (reemplaza DM Serif Display nativo) */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--font-display, 'Syne', sans-serif) !important;
}

/* Cuerpo -> DM Sans (refuerzo, SIN !important para no pisar reglas
   especificas como Total/montos/subtitulos ya en DM Sans) */
body, p, span, td, th, li, a, label, input, select, textarea,
button, .o_portal, .oe_website_sale {
    font-family: var(--font-body, 'DM Sans', sans-serif);
}

/* ===== COLOR PRIMARIO GLOBAL (coral -> naranja marca) ===== */

/* Override de las variables fuente del coral #ed6f63 */
:root, body {
    --o-color-1: #E87722 !important;
    --bs-primary: #E87722 !important;
    --bs-primary-rgb: 232,119,34 !important;
    --bs-link-color: #E87722 !important;
    --bs-link-color-rgb: 232,119,34 !important;
    --bs-link-hover-color: #C5611A !important;
    --bs-link-hover-color-rgb: 197,97,26 !important;
    --o-cc1-link: #E87722 !important;
    --o-cc1-btn-primary: #E87722 !important;
    --o-cc1-btn-primary-border: #E87722 !important;
}

/* Refuerzos Bootstrap primary -> naranja */
.text-primary { color: #E87722 !important; }
.bg-primary { background-color: #E87722 !important; }
.border-primary { border-color: #E87722 !important; }
.btn-primary {
    background-color: #E87722 !important;
    border-color: #E87722 !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #C5611A !important;
    border-color: #C5611A !important;
}
.btn-outline-primary {
    color: #E87722 !important;
    border-color: #E87722 !important;
}
.btn-outline-primary:hover {
    background-color: #E87722 !important;
    color: #FFFFFF !important;
}

/* Links nativos -> naranja: se manejan por --bs-link-color (arriba),
   SIN regla blanket 'a {}' para no pisar header/footer de marca. */

/* Focus rings -> naranja (no coral) */
*:focus-visible,
.form-control:focus, .form-select:focus,
input:focus, select:focus, textarea:focus {
    border-color: #E87722 !important;
    box-shadow: 0 0 0 0.2rem rgba(232,119,34,0.25) !important;
    outline-color: #E87722 !important;
}

/* Selección de texto -> naranja claro */
::selection {
    background: #FFE0CC;
    color: #111111;
}
::-moz-selection {
    background: #FFE0CC;
    color: #111111;
}

/* Color combinations o_cc1 (theme) -> naranja */
.o_cc1 a:not(.btn), .o_cc1 .text-primary {
    color: #E87722 !important;
}

/* NO tocar danger/success/warning (errores, alertas) — esos usan
   sus propias variables (--bs-danger, etc.), no el primary. */

/* ===== LO2 PAY MODAL START ===== */
/* Modal de pago B2B - superficie continua, 2 columnas, marca LO */
#modalaccept .modal-content{border:none;border-radius:14px;overflow:hidden;box-shadow:0 24px 60px rgba(17,17,17,.18);}
#modalaccept .modal-header{border-bottom:.5px solid #E8E8E8;padding:20px 28px;background:#fff;}
#modalaccept .modal-title{font-family:var(--font-display,'Syne',sans-serif);font-weight:800;font-size:20px;color:#111111;letter-spacing:-.01em;}
#modalaccept #sign-dialog.modal-body{padding:0;font-family:var(--font-body,'DM Sans',sans-serif);color:#1A1A1A;}

/* Ocultar el texto nativo de confirmacion/monto (redundante: el resumen lo muestra).
   El selector de anticipo (down payment) NO se toca: es un <t t-call>, no un div.mb-3 */
#modalaccept #sign-dialog > div.mb-3{display:none!important;}

/* Grid 2 columnas - zonas borde a borde, sin cards anidados */
#modalaccept .lo2-pay-grid{display:grid;grid-template-columns:42% 58%;align-items:stretch;}
#modalaccept .lo2-pay-summary{background:#FAFAFA;border-right:.5px solid #E8E8E8;padding:28px;display:flex;flex-direction:column;}
#modalaccept .lo2-pay-methods{padding:28px;background:#fff;}

/* Eyebrow / labels */
#modalaccept .lo2-pay-eyebrow{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#7A7A7A;margin:0 0 14px;}
#modalaccept .lo2-pay-ref{font-family:var(--font-display,'Syne',sans-serif);font-weight:700;font-size:15px;color:#111111;margin:0 0 18px;}

/* Lista de productos */
#modalaccept .lo2-pay-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:13px;}
#modalaccept .lo2-pay-item{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;font-size:13.5px;line-height:1.35;}
#modalaccept .lo2-pay-item-qty{color:#7A7A7A;font-variant-numeric:tabular-nums;min-width:14px;}
#modalaccept .lo2-pay-item-qty::after{content:'\00d7';margin-left:3px;color:#C9C9C9;}
#modalaccept .lo2-pay-item-name{color:#1A1A1A;}
#modalaccept .lo2-pay-item-amt{font-weight:500;color:#111111;white-space:nowrap;font-variant-numeric:tabular-nums;}

/* Divisores y subtotales */
#modalaccept .lo2-pay-divider{height:.5px;background:#E8E8E8;margin:20px 0 16px;}
#modalaccept .lo2-pay-line{display:flex;justify-content:space-between;font-size:13px;color:#444444;margin-bottom:8px;}
#modalaccept .lo2-pay-line-val{color:#1A1A1A;font-variant-numeric:tabular-nums;}

/* Total protagonista */
#modalaccept .lo2-pay-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:14px;padding-top:16px;border-top:.5px solid #E8E8E8;}
#modalaccept .lo2-pay-total-label{font-family:var(--font-display,'Syne',sans-serif);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:#111111;}
#modalaccept .lo2-pay-total-val{font-family:var(--font-display,'Syne',sans-serif);font-weight:800;font-size:30px;line-height:1;color:#E87722;font-variant-numeric:tabular-nums;letter-spacing:-.02em;}

/* Fine print de aceptacion (texto propio, conciso) */
#modalaccept .lo2-pay-accept{margin-top:auto;padding-top:22px;margin-bottom:0;font-size:11.5px;line-height:1.5;color:#9A9A9A;}
#modalaccept .lo2-pay-accept b{font-weight:600;color:#7A7A7A;}

/* Branding del widget de pago nativo (sin tocar su markup) */
#modalaccept .lo2-pay-methods #o_payment_methods p,#modalaccept .lo2-pay-methods #o_payment_tokens_heading{font-family:var(--font-display,'Syne',sans-serif);font-weight:700;color:#111111;}
#modalaccept .lo2-pay-methods li[name='o_payment_option']{border:1px solid #E8E8E8!important;border-radius:12px!important;margin-bottom:10px;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;}
#modalaccept .lo2-pay-methods li[name='o_payment_option']:last-child{margin-bottom:0;}
#modalaccept .lo2-pay-methods li[name='o_payment_option']:hover{border-color:#E87722!important;}
#modalaccept .lo2-pay-methods li[name='o_payment_option']:has(input:checked){border-color:#E87722!important;background:#FFF0E6!important;box-shadow:inset 0 0 0 1px #E87722;}
#modalaccept .lo2-pay-methods .list-group{border-radius:0;}

/* Boton de pago - naranja solido con el monto */
#modalaccept .lo2-pay-methods .btn-primary,#modalaccept button[name='o_payment_submit_button']{background:#E87722!important;border-color:#E87722!important;color:#fff!important;font-family:var(--font-body,'DM Sans',sans-serif)!important;font-weight:600!important;border-radius:10px!important;padding:12px 22px!important;letter-spacing:.01em;}
#modalaccept .lo2-pay-methods .btn-primary:hover,#modalaccept button[name='o_payment_submit_button']:hover{background:#C5611A!important;border-color:#C5611A!important;}
#modalaccept .lo2-pay-methods .btn-link{color:#7A7A7A!important;font-weight:500;}

/* Responsive: apilar en mobile */
@media (max-width:767.98px){
  #modalaccept .lo2-pay-grid{grid-template-columns:1fr;}
  #modalaccept .lo2-pay-summary{border-right:none;border-bottom:.5px solid #E8E8E8;}
  #modalaccept .lo2-pay-total-val{font-size:26px;}
}
/* ===== LO2 PAY MODAL END ===== */

/* ===== LO2 POSTPAY START ===== */
/* Pantalla post-pago Momento 2 - datos de transferencia (marca LO) */
.lo2-postpay{max-width:540px;margin:32px auto;padding:0 16px;font-family:var(--font-body,'DM Sans',sans-serif);color:#1A1A1A;}
.lo2-pp-head{text-align:center;margin-bottom:24px;}
.lo2-pp-eyebrow{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:#E87722;margin:0 0 10px;}
.lo2-pp-title{font-family:var(--font-display,'Syne',sans-serif);font-weight:800;font-size:26px;line-height:1.15;color:#111111;margin:0 0 10px;letter-spacing:-.01em;}
.lo2-pp-sub{font-size:14.5px;line-height:1.5;color:#7A7A7A;margin:0;}
.lo2-pp-amount{display:flex;flex-direction:column;align-items:center;gap:5px;padding:22px;margin-bottom:18px;background:#FFF0E6;border-radius:14px;}
.lo2-pp-amount-label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#C5611A;}
.lo2-pp-amount-val{font-family:var(--font-display,'Syne',sans-serif);font-weight:800;font-size:34px;line-height:1;color:#E87722;font-variant-numeric:tabular-nums;}
.lo2-pp-data{background:#FAFAFA;border:.5px solid #E8E8E8;border-radius:14px;overflow:hidden;}
.lo2-pp-row{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:.5px solid #E8E8E8;}
.lo2-pp-row:last-child{border-bottom:none;}
.lo2-pp-k{flex:0 0 82px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#9A9A9A;}
.lo2-pp-v{flex:1;font-size:14.5px;color:#111111;font-weight:500;word-break:break-word;}
.lo2-pp-row-cbu .lo2-pp-cbu{font-size:16px;font-weight:700;letter-spacing:.03em;color:#111111;font-variant-numeric:tabular-nums;-webkit-user-select:all;user-select:all;}
.lo2-pp-copy{flex:0 0 auto;background:#E87722;color:#fff;border:none;border-radius:8px;padding:7px 14px;font-family:var(--font-body,'DM Sans',sans-serif);font-size:12.5px;font-weight:600;cursor:pointer;transition:background .15s ease;}
.lo2-pp-copy:hover{background:#C5611A;}
.lo2-pp-note{margin-top:18px;padding:16px 18px;background:#fff;border:.5px solid #E8E8E8;border-radius:12px;}
.lo2-pp-note p{margin:0;font-size:13px;line-height:1.55;color:#444444;}
.lo2-pp-note strong{color:#111111;font-weight:600;}
@media (max-width:575.98px){
  .lo2-pp-title{font-size:22px;}
  .lo2-pp-amount-val{font-size:28px;}
  .lo2-pp-row{flex-wrap:wrap;}
  .lo2-pp-k{flex:0 0 100%;}
  .lo2-pp-copy{margin-top:6px;}
}
/* ===== LO2 POSTPAY END ===== */

/* ===== LO2 CBU PORTAL START ===== */
/* Bloque CBU en el portal de la orden (Momento 2) - panel destacado */
.lo2-postpay-portal{max-width:none;margin:0 0 28px;padding:26px;background:#fff;border:.5px solid #E8E8E8;border-radius:16px;box-shadow:0 8px 30px rgba(17,17,17,.06);}
.lo2-postpay-portal .lo2-pp-head{text-align:left;}
/* Botones de comprobante (email + WhatsApp) */
.lo2-comprobante-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.lo2-comprobante-btns a{flex:1 1 200px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:10px;font-family:var(--font-body,'DM Sans',sans-serif);font-weight:600;font-size:13.5px;text-decoration:none;transition:background .15s ease;}
.lo2-comprobante-btns a i{font-size:15px;}
.lo2-btn-email{background:#E87722;color:#fff;}
.lo2-btn-email:hover{background:#C5611A;color:#fff;}
.lo2-btn-wsp{background:#25D366;color:#fff;}
.lo2-btn-wsp:hover{background:#1DA851;color:#fff;}
/* ===== LO2 CBU PORTAL END ===== */

/* === LO-FIX-CORAL-DESC v1 (idempotente) === */
/* Descripciones de las lineas del pedido (portal): texto normal, no naranja de marca.
   Scopeado SOLO a la tabla de lineas #sales_order_table; no afecta titulos/acentos. */
#sales_order_table tbody td,
#sales_order_table tbody td span,
#sales_order_table tbody td a {
    color: #212529 !important;
}
/* === /LO-FIX-CORAL-DESC === */

/* === LO-LIST-BADGE v1 === */
.lo-badge-pay, .lo-badge-paid{
   display:inline-block; margin-left:.5rem; padding:.15rem .55rem;
   font-size:.72rem; font-weight:600; border-radius:999px;
   vertical-align:middle; border:1px solid transparent;
}
.lo-badge-pay{  color:var(--orange-dark,#C5611A); background:var(--orange-light,#FFF0E6); border-color:var(--orange,#E87722); }
.lo-badge-paid{ color:#1E7E34; background:#E6F4EA; border-color:#2E7D32; }
.o_portal_my_doc_table tbody tr:hover{ background:#F4F4F4; }
/* === /LO-LIST-BADGE === */

/* === LO2 MOBILE MENU (burger + offcanvas) — inicio === */
.lo2-burger{ display:none; align-items:center; justify-content:center; width:44px; height:44px; min-width:44px; min-height:44px; background:transparent; border:1px solid #E8E8E8; border-radius:8px; color:#111; font-size:20px; cursor:pointer; flex-shrink:0; }
.lo2-offcanvas{ max-width:88vw; }
.lo2-offcanvas .offcanvas-body{ display:flex; flex-direction:column; gap:4px; }
.lo2-oc-cats-title{ font-family:'DM Sans', sans-serif; font-weight:600; font-size:12px; line-height:1.2; text-transform:uppercase; letter-spacing:.04em; color:#999; margin:10px 4px 4px; }
.lo2-offcanvas .lo2-oc-link{ display:flex; align-items:center; min-height:44px; padding:10px 12px; border-radius:8px; font-family:'DM Sans', sans-serif; font-size:15px; color:#333; text-decoration:none; }
.lo2-offcanvas .lo2-oc-link:hover{ background:#FFF0E6; color:#E87722; }
.lo2-offcanvas .lo2-oc-cat{ font-size:14px; color:#555; }
.lo2-oc-search .btn{ background:#E87722; color:#fff; border:none; }
@media (max-width:768px){
  .lo2-burger{ display:inline-flex; }
  .lo2-header__nav{ display:none !important; }
  .lo2-desktop-only{ display:none !important; }
  .lo2-megamenu{ position:static !important; min-width:0 !important; }
}
/* === LO2 MOBILE MENU — fin === */

/* === LO2 HERO CAROUSEL — inicio === */
.lo2-hero__bg-right{ display:block; clip-path:none; background:var(--gray-100); }  /* rectángulo detrás; se ve solo en el triángulo del corte. Naranja: background:#E87722; */
.lo2-hero__right{ position:static; }                       /* para que el media absolute se posicione vs .lo2-hero */
.lo2-hero__media{
  --lo-hero-img-pos:50% 45%;                               /* CALIBRAR: banda del poster visible (Y menor=mas arriba) */
  --lo-hero-clip:polygon(0 0, 100% 0, 100% 84%, 88% 100%, 0 100%);  /* CALIBRAR: diagonal (esquina inf-der, fondo libre) */
  position:absolute; top:0; right:0; bottom:0; width:50%;  /* llena toda la mitad derecha del hero */
  max-width:none; aspect-ratio:auto; border-radius:0; overflow:hidden; box-shadow:none;
  clip-path:var(--lo-hero-clip);
}
.lo2-hero__carousel, .lo2-hero__carousel .carousel-inner, .lo2-hero__carousel .carousel-item{ height:100%; }
.lo2-hero__slide-img{ width:100%; height:100%; object-fit:cover; object-position:var(--lo-hero-img-pos); display:block; }
@media (max-width:768px){                                   /* mobile: imagen COMPLETA, sin diagonal, tarjeta arriba */
  .lo2-hero__right{ display:flex !important; position:static; padding:0 var(--container-px) 32px !important; }
  .lo2-hero__bg-right{ display:none; }
  .lo2-hero__media{ position:static !important; width:100%; max-width:460px; margin:0 auto;
    aspect-ratio:1/1; clip-path:none !important; border-radius:16px; box-shadow:0 8px 24px rgba(0,0,0,.12); }
}
/* === LO2 HERO CAROUSEL — fin === */

/* === LO2 SHOP PAGER (naranja marca) — inicio === */
#o_wsale_pager .pagination{
  --pagination-active-bg:#E87722;
  --pagination-active-border-color:#E87722;
  --pagination-active-color:#FFFFFF;
  --pagination-hover-bg:#FFF0E6;
  --pagination-hover-color:#C5611A;
  --pagination-focus-bg:#FFF0E6;
  --pagination-focus-color:#C5611A;
}
/* === LO2 SHOP PAGER — fin === */