/* vendedora.css — Vision Pro v3: tipografía moderna + sombras profundas */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Instrument+Serif:wght@400&display=swap');

:root {
  --v-purple:     #7b68b3;
  --v-purple-dk:  #5a4a8f;
  --v-purple-lt:  #e8e0f5;
  --v-rose:       #e8a0bf;
  --v-rose-dk:    #d987a8;
  --v-cream:      #fdf8f9;
  --v-soft:       #f3eef9;
  --v-navy:       #2c3e6b;
  --v-text:       #1f1933;
  --v-muted:      #8b7fa6;
  --v-line:       rgba(123,104,179,0.14);
  --v-glow:       rgba(123,104,179,0.22);
  --v-r-lg:       26px;
  --v-r-md:       18px;
  --v-r-sm:       12px;
  /* Sombras MUCHO más profundas (multi-capa + highlight interior) */
  --v-sh-card:
    0 30px 60px -18px rgba(58,47,78,0.22),
    0 18px 40px -20px rgba(58,47,78,0.20),
    0 6px 12px -6px rgba(58,47,78,0.10),
    inset 0 1px 0 rgba(255,255,255,0.95);
  --v-sh-hover:
    0 50px 90px -22px rgba(58,47,78,0.32),
    0 28px 56px -22px rgba(58,47,78,0.26),
    0 10px 20px -8px rgba(58,47,78,0.14),
    inset 0 1px 0 rgba(255,255,255,0.95);
  --v-sh-soft:
    0 14px 36px -10px rgba(58,47,78,0.16),
    0 6px 14px -6px rgba(58,47,78,0.10);
}

/* === Fuente Plus Jakarta Sans en TODO el page-vendedora === */
#page-vendedora,
#page-vendedora * {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

#page-vendedora {
  background: radial-gradient(circle at 100% 0%, #fce8f0 0%, transparent 40%),
              radial-gradient(circle at 0% 100%, #e8e0f5 0%, transparent 50%),
              var(--v-cream);
  min-height: 100vh;
  padding: 28px 0 60px;
  color: var(--v-text);
  letter-spacing: -0.01em;
}

#page-vendedora .vp-shell {
  max-width: 1700px;
  margin: 0 auto;
  padding: 0 28px;
}

/* === NAV PILLS === */
#page-vendedora .vp-topbar {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 28px; flex-wrap: wrap; gap: 14px;
}
#page-vendedora .vp-brand {
  display: flex; align-items: center; gap: 12px;
  font-size: 1.35rem; font-weight: 800;
  color: var(--v-navy); letter-spacing: -0.02em;
}
#page-vendedora .vp-brand-dot {
  width: 40px; height: 40px; border-radius: 13px;
  background: linear-gradient(135deg, var(--v-purple), var(--v-purple-dk));
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 800; font-size: 15px; letter-spacing: -.5px;
  box-shadow: 0 8px 20px var(--v-glow), inset 0 1px 0 rgba(255,255,255,0.3);
}
#page-vendedora .vp-nav {
  display: inline-flex; padding: 4px; gap: 3px;
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.8);
  border-radius: 999px;
  box-shadow: var(--v-sh-soft), inset 0 1px 0 rgba(255,255,255,0.6);
  flex-wrap: nowrap;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
#page-vendedora .vp-nav::-webkit-scrollbar { display: none; }
#page-vendedora .vp-nav-btn {
  background: transparent; border: 0;
  color: var(--v-muted);
  padding: 7px 14px; border-radius: 999px;
  font-weight: 700; font-size: .82rem;
  cursor: pointer; transition: all .2s ease;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 5px;
  letter-spacing: -0.01em;
  white-space: nowrap !important;
  flex-shrink: 0;
  line-height: 1;
}
#page-vendedora .vp-nav-btn:hover { color: var(--v-purple-dk); }
#page-vendedora .vp-nav-btn.active {
  background: var(--v-purple);
  color: #fff;
  box-shadow: 0 8px 20px var(--v-glow), inset 0 1px 0 rgba(255,255,255,0.2);
}

/* === HEADER VISTA === */
#page-vendedora .vp-hello {
  margin-bottom: 28px;
}
#page-vendedora .vp-hello h1 {
  font-size: clamp(2rem, 4.5vw, 2.8rem);
  font-weight: 800; color: var(--v-navy);
  margin: 0 0 4px; line-height: 1.05;
  letter-spacing: -.035em;
}
#page-vendedora .vp-hello p {
  color: var(--v-muted); font-size: 1rem; margin: 0; font-weight: 500;
}

/* === GRID === */
#page-vendedora .vp-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: minmax(120px, auto);
  gap: 20px;
}
#page-vendedora .vp-card {
  background: #fff;
  border-radius: var(--v-r-lg);
  padding: 26px;
  box-shadow: var(--v-sh-card);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;
  border: 1px solid rgba(255,255,255,0.7);
}
#page-vendedora .vp-card.clickable { cursor: pointer; }
#page-vendedora .vp-card.clickable:hover {
  transform: translateY(-6px);
  box-shadow: var(--v-sh-hover);
}

#page-vendedora .vp-c-2 { grid-column: span 2; }
#page-vendedora .vp-c-3 { grid-column: span 3; }
#page-vendedora .vp-c-4 { grid-column: span 4; }
#page-vendedora .vp-c-6 { grid-column: span 6; }
#page-vendedora .vp-r-2 { grid-row: span 2; }

#page-vendedora .vp-card.v-purple {
  background: linear-gradient(135deg, #8b78c3 0%, #5a4a8f 100%);
  color: #fff;
}
#page-vendedora .vp-card.v-rose {
  background: linear-gradient(135deg, #f4b3c9 0%, #d987a8 100%);
  color: #fff;
}
#page-vendedora .vp-card.v-cream {
  background: linear-gradient(135deg, #fff5f7 0%, #fce8f0 100%);
  color: var(--v-navy);
}
#page-vendedora .vp-card.v-soft {
  background: linear-gradient(135deg, #f3eef9 0%, #e8e0f5 100%);
  color: var(--v-navy);
}
#page-vendedora .vp-card.v-dark {
  background: linear-gradient(135deg, #3a2f4e 0%, #2c3e6b 100%);
  color: #fff;
}
#page-vendedora .vp-card.v-mint {
  background: linear-gradient(135deg, #a7e8c8 0%, #6cb88a 100%);
  color: #fff;
}

#page-vendedora .vp-card .vp-eyebrow {
  font-size: .7rem; font-weight: 800; text-transform: uppercase;
  letter-spacing: .14em; opacity: .85; margin-bottom: 10px;
}
#page-vendedora .vp-card .vp-title {
  font-size: 1.6rem; font-weight: 800;
  line-height: 1.1; margin: 0 0 6px;
  letter-spacing: -.025em;
}
#page-vendedora .vp-card .vp-desc {
  font-size: .94rem; opacity: .88; margin: 0;
  line-height: 1.5; font-weight: 500;
}
#page-vendedora .vp-card .vp-big {
  font-size: 3.4rem; font-weight: 800; line-height: 1;
  margin: auto 0 0; letter-spacing: -.04em;
}
#page-vendedora .vp-card .vp-foot {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 18px; font-size: .86rem; font-weight: 600;
}
#page-vendedora .vp-card .vp-blob {
  position: absolute; pointer-events: none;
  width: 240px; height: 240px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.25) 0%, transparent 70%);
  bottom: -90px; right: -70px;
}

#page-vendedora .vp-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 20px; border-radius: 999px;
  background: #fff; color: var(--v-purple-dk);
  border: 0; font-weight: 700; font-size: .86rem;
  cursor: pointer;
  box-shadow:
    0 10px 24px -8px rgba(58,47,78,0.25),
    0 4px 8px -4px rgba(58,47,78,0.15),
    inset 0 1px 0 rgba(255,255,255,0.9);
  transition: transform .15s ease, box-shadow .15s ease;
  letter-spacing: -0.01em;
}
#page-vendedora .vp-pill:hover {
  transform: translateY(-2px);
  box-shadow:
    0 14px 30px -10px rgba(58,47,78,0.30),
    0 6px 12px -6px rgba(58,47,78,0.20),
    inset 0 1px 0 rgba(255,255,255,0.9);
}
#page-vendedora .vp-pill.ghost {
  background: rgba(255,255,255,0.22);
  color: #fff; box-shadow: none;
  border: 1px solid rgba(255,255,255,0.5);
  backdrop-filter: blur(10px);
}
#page-vendedora .vp-pill.dark {
  background: var(--v-purple); color: #fff;
  box-shadow:
    0 12px 28px -8px var(--v-glow),
    0 4px 8px -4px rgba(123,104,179,0.30),
    inset 0 1px 0 rgba(255,255,255,0.2);
}
#page-vendedora .vp-pill.dark:hover {
  box-shadow:
    0 18px 36px -10px rgba(123,104,179,0.45),
    0 6px 12px -6px rgba(123,104,179,0.30),
    inset 0 1px 0 rgba(255,255,255,0.2);
}

/* === LISTA PEDIDOS === */
#page-vendedora .vp-toolbar {
  display: flex; gap: 12px; flex-wrap: wrap;
  align-items: center; margin-bottom: 18px;
}
#page-vendedora .vp-search {
  flex: 1; min-width: 240px;
  position: relative;
}
#page-vendedora .vp-search input {
  width: 100%; padding: 13px 18px 13px 44px;
  border: 1px solid var(--v-line);
  border-radius: 999px;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(14px);
  font-size: .94rem; font-weight: 500;
  color: var(--v-text); outline: none;
  transition: all .2s ease;
  box-shadow: var(--v-sh-soft);
}
#page-vendedora .vp-search input:focus {
  border-color: var(--v-purple);
  box-shadow: 0 0 0 4px var(--v-glow), var(--v-sh-soft);
  background: #fff;
}
#page-vendedora .vp-search::before {
  content: '🔍'; position: absolute;
  left: 18px; top: 50%; transform: translateY(-50%);
  font-size: 14px; opacity: .5;
}
#page-vendedora .vp-chips {
  display: inline-flex; gap: 6px; flex-wrap: wrap;
}
#page-vendedora .vp-chip {
  padding: 9px 18px; border-radius: 999px;
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(10px);
  border: 1px solid var(--v-line);
  color: var(--v-muted); font-weight: 700; font-size: .82rem;
  cursor: pointer; transition: all .2s ease;
  box-shadow: var(--v-sh-soft);
}
#page-vendedora .vp-chip:hover { color: var(--v-purple-dk); transform: translateY(-1px); }
#page-vendedora .vp-chip.active {
  background: var(--v-purple); color: #fff;
  border-color: var(--v-purple);
  box-shadow: 0 10px 24px -6px var(--v-glow);
}

#page-vendedora .vp-pedidos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 18px;
}
#page-vendedora .vp-ped {
  background: #fff; border-radius: var(--v-r-lg);
  padding: 24px;
  box-shadow: var(--v-sh-card);
  cursor: pointer;
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  position: relative; overflow: hidden;
  border: 1px solid rgba(255,255,255,0.7);
}
#page-vendedora .vp-ped:hover {
  transform: translateY(-6px);
  box-shadow: var(--v-sh-hover);
}
/* Línea de color superior eliminada por petición */
#page-vendedora .vp-ped-cod {
  font-size: .68rem; color: var(--v-muted);
  font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
#page-vendedora .vp-ped-esc {
  font-size: 1.2rem; color: var(--v-navy);
  font-weight: 800; margin: 6px 0 14px;
  line-height: 1.2; letter-spacing: -.02em;
}
#page-vendedora .vp-ped-stats {
  display: flex; gap: 18px; flex-wrap: wrap;
  font-size: .85rem; color: var(--v-muted);
  margin-bottom: 14px;
}
#page-vendedora .vp-ped-stats b {
  color: var(--v-navy); font-weight: 800; font-size: 1.15rem;
  letter-spacing: -.02em;
}
#page-vendedora .vp-ped-stat { display: flex; flex-direction: column; gap: 2px; }
#page-vendedora .vp-ped-stat-lbl {
  font-size: .65rem; text-transform: uppercase; letter-spacing: .08em;
  font-weight: 800; color: var(--v-muted);
}
#page-vendedora .vp-ped-tag {
  display: inline-block;
  font-size: .68rem; padding: 4px 11px;
  border-radius: 999px; font-weight: 800;
  text-transform: uppercase; letter-spacing: .06em;
}
#page-vendedora .vp-ped-tag.t-pendiente { background: #fef3c7; color: #92400e; }
#page-vendedora .vp-ped-tag.t-proceso   { background: #dbeafe; color: #1e40af; }
#page-vendedora .vp-ped-tag.t-listo     { background: #d1fae5; color: #065f46; }
#page-vendedora .vp-ped-tag.t-entregado { background: var(--v-purple-lt); color: var(--v-purple-dk); }
#page-vendedora .vp-ped-tag.t-cancelado { background: #fee2e2; color: #991b1b; }
#page-vendedora .vp-ped-progress {
  height: 7px; background: var(--v-soft); border-radius: 99px;
  margin-top: 14px; overflow: hidden;
}
#page-vendedora .vp-ped-progress > div {
  height: 100%; background: linear-gradient(90deg, var(--v-purple), var(--v-rose));
  border-radius: 99px; transition: width .5s ease;
  box-shadow: 0 0 12px rgba(123,104,179,0.4);
}
#page-vendedora .vp-ped-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 14px; font-size: .78rem; color: var(--v-muted); font-weight: 600;
}
#page-vendedora .vp-ped-foot .vp-link {
  color: var(--v-purple-dk); font-weight: 800;
  display: inline-flex; align-items: center; gap: 4px;
}

/* === DETALLE === */
#page-vendedora .vp-back {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,0.85); backdrop-filter: blur(14px);
  border: 1px solid var(--v-line);
  color: var(--v-purple-dk);
  padding: 10px 18px; border-radius: 999px;
  font-weight: 700; font-size: .86rem;
  cursor: pointer;
  margin-bottom: 22px;
  transition: all .15s ease;
  box-shadow: var(--v-sh-soft);
}
#page-vendedora .vp-back:hover {
  background: #fff;
  transform: translateX(-3px);
  box-shadow: var(--v-sh-soft), 0 8px 20px -8px var(--v-glow);
}

#page-vendedora .vp-detail-grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 20px;
}
#page-vendedora .vp-detail-main {
  background: #fff; border-radius: var(--v-r-lg);
  padding: 36px;
  box-shadow: var(--v-sh-card);
  border: 1px solid rgba(255,255,255,0.7);
}
#page-vendedora .vp-detail-side {
  display: flex; flex-direction: column; gap: 20px;
}
#page-vendedora .vp-detail-info-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 18px 28px; margin-top: 24px;
}
#page-vendedora .vp-info-row {
  display: flex; flex-direction: column;
  padding: 16px 0; border-top: 1px solid var(--v-line);
}
#page-vendedora .vp-info-row:first-child,
#page-vendedora .vp-info-row:nth-child(2) { border-top: 0; padding-top: 0; }
#page-vendedora .vp-info-lbl {
  font-size: .68rem; color: var(--v-muted);
  font-weight: 800; text-transform: uppercase; letter-spacing: .08em;
  margin-bottom: 6px;
}
#page-vendedora .vp-info-val {
  font-size: 1rem; color: var(--v-navy); font-weight: 600;
  letter-spacing: -.01em;
}
#page-vendedora .vp-info-val.big {
  font-size: 1.7rem; font-weight: 800;
  letter-spacing: -.03em;
}

/* === FORM admin embebido === */
/* SIN fondo extra ni sombras: dejamos los cards del form con su sombra original (suave) */
#page-vendedora .vp-form-host {
  background: transparent;
  padding: 0;
  border: 0;
  box-shadow: none;
}
/* Solo ajustes mínimos: tipografía y radios redondeados de inputs */
#page-vendedora .vp-form-host input,
#page-vendedora .vp-form-host select,
#page-vendedora .vp-form-host textarea {
  border-radius: 12px !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  transition: all .2s ease;
}
#page-vendedora .vp-form-host input:focus,
#page-vendedora .vp-form-host select:focus,
#page-vendedora .vp-form-host textarea:focus {
  border-color: var(--v-purple) !important;
  box-shadow: 0 0 0 3px var(--v-glow) !important;
}
#page-vendedora .vp-form-host button {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* === PAGOS dentro del detalle === */
#page-vendedora .vp-pagos-card {
  background: #fff; border-radius: var(--v-r-lg);
  padding: 28px;
  box-shadow: var(--v-sh-card);
  border: 1px solid rgba(255,255,255,0.7);
  margin-top: 20px;
}
#page-vendedora .vp-pagos-head {
  display: flex; justify-content: space-between; align-items: flex-end;
  margin-bottom: 18px; flex-wrap: wrap; gap: 12px;
}
#page-vendedora .vp-pagos-head h3 {
  font-size: 1.3rem; color: var(--v-navy);
  margin: 0; font-weight: 800; letter-spacing: -.02em;
}
#page-vendedora .vp-pagos-totales {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 14px; margin-bottom: 22px;
}
#page-vendedora .vp-pagos-tot {
  padding: 14px 18px; border-radius: var(--v-r-md);
  background: var(--v-soft);
}
#page-vendedora .vp-pagos-tot.cobrado  { background: linear-gradient(135deg,#d4f5e0,#a7e8c8); }
#page-vendedora .vp-pagos-tot.pendiente{ background: linear-gradient(135deg,#fff5e5,#fde2c2); }
#page-vendedora .vp-pagos-tot small {
  font-size: .65rem; font-weight: 800; color: var(--v-muted);
  text-transform: uppercase; letter-spacing: .08em;
  display: block; margin-bottom: 4px;
}
#page-vendedora .vp-pagos-tot strong {
  font-size: 1.5rem; font-weight: 800; color: var(--v-navy);
  letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}

#page-vendedora .vp-pago-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 16px; border-radius: 14px;
  margin-bottom: 8px;
  background: var(--v-soft); gap: 12px;
}
#page-vendedora .vp-pago-info { flex: 1; min-width: 0; }
#page-vendedora .vp-pago-info b {
  color: var(--v-navy); font-weight: 800; font-size: 1rem;
  font-variant-numeric: tabular-nums;
}
#page-vendedora .vp-pago-info .meta {
  font-size: .78rem; color: var(--v-muted); margin-top: 2px;
}
#page-vendedora .vp-pago-del {
  background: transparent; border: 0; color: #b91c1c;
  cursor: pointer; padding: 6px 10px; border-radius: 8px;
  font-weight: 700; font-size: .8rem;
  transition: background .15s ease;
}
#page-vendedora .vp-pago-del:hover { background: rgba(185,28,28,0.1); }

#page-vendedora .vp-pago-form {
  display: grid; grid-template-columns: 1fr 1fr 1fr auto;
  gap: 10px; margin-top: 16px; align-items: end;
}
#page-vendedora .vp-pago-form .vp-field { margin-bottom: 0; }
#page-vendedora .vp-pago-form label {
  font-size: .68rem; font-weight: 800; color: var(--v-muted);
  text-transform: uppercase; letter-spacing: .07em; display: block;
  margin-bottom: 6px;
}
#page-vendedora .vp-pago-form input,
#page-vendedora .vp-pago-form select {
  width: 100%; padding: 10px 12px;
  border: 1.5px solid var(--v-line); border-radius: 10px;
  font-family: inherit; font-size: .9rem; color: var(--v-text);
  outline: none; background: #fff;
}
#page-vendedora .vp-pago-form input:focus,
#page-vendedora .vp-pago-form select:focus {
  border-color: var(--v-purple); box-shadow: 0 0 0 3px var(--v-glow);
}
#page-vendedora .vp-dto-bar {
  display: flex; align-items: center; gap: 10px;
  background: var(--v-soft); padding: 10px 14px; border-radius: 12px;
  margin-top: 8px; font-size: .88rem; color: var(--v-navy);
}
#page-vendedora .vp-dto-bar input {
  width: 70px; padding: 6px 10px; border: 1.5px solid var(--v-line);
  border-radius: 8px; text-align: center; font-weight: 700;
}

@media (max-width: 720px) {
  #page-vendedora .vp-pagos-totales { grid-template-columns: 1fr; }
  #page-vendedora .vp-pago-form { grid-template-columns: 1fr 1fr; }
}

/* === FINANZAS === */
#page-vendedora .vp-fin-table {
  background: #fff; border-radius: var(--v-r-lg);
  padding: 8px;
  box-shadow: var(--v-sh-card);
  margin-top: 18px;
  border: 1px solid rgba(255,255,255,0.7);
  overflow: hidden;
}
#page-vendedora .vp-fin-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 12px; padding: 16px 22px;
  border-bottom: 1px solid var(--v-line);
  align-items: center;
  transition: background .15s ease;
}
#page-vendedora .vp-fin-row:last-child { border-bottom: 0; }
#page-vendedora .vp-fin-row:not(.head):hover { background: var(--v-soft); }
#page-vendedora .vp-fin-row.head {
  font-size: .68rem; font-weight: 800;
  color: var(--v-muted); text-transform: uppercase; letter-spacing: .08em;
  background: var(--v-soft);
}
#page-vendedora .vp-fin-row .escuela {
  font-weight: 700; color: var(--v-navy); letter-spacing: -.01em;
}
#page-vendedora .vp-fin-row .escuela small {
  display: block; font-weight: 500; color: var(--v-muted); font-size: .75rem; margin-top: 2px;
}
#page-vendedora .vp-fin-row .num {
  font-weight: 800; color: var(--v-navy); letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
}
#page-vendedora .vp-fin-row .num.muted { color: var(--v-muted); font-weight: 600; }

/* === ESTADOS VACÍOS === */
#page-vendedora .vp-empty {
  text-align: center; padding: 70px 24px;
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(14px);
  border-radius: var(--v-r-lg);
  box-shadow: var(--v-sh-soft);
  border: 1px solid rgba(255,255,255,0.7);
}
#page-vendedora .vp-empty-ic {
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--v-purple-lt);
  display: flex; align-items: center; justify-content: center;
  font-size: 36px; margin: 0 auto 18px;
  box-shadow: 0 12px 24px -6px var(--v-glow);
}
#page-vendedora .vp-empty h3 {
  color: var(--v-navy); font-size: 1.5rem;
  margin: 0 0 8px; font-weight: 800; letter-spacing: -.025em;
}
#page-vendedora .vp-empty p {
  color: var(--v-muted); margin: 0 0 22px; font-weight: 500;
}

/* === RESPONSIVE === */
@media (max-width: 900px) {
  #page-vendedora .vp-grid { grid-template-columns: repeat(4, 1fr); }
  #page-vendedora .vp-c-3, #page-vendedora .vp-c-4 { grid-column: span 4; }
  #page-vendedora .vp-c-2 { grid-column: span 2; }
  #page-vendedora .vp-detail-grid { grid-template-columns: 1fr; }
  #page-vendedora .vp-fin-row {
    grid-template-columns: 2fr 1fr 1fr;
  }
  #page-vendedora .vp-fin-row .col-pagado { display: none; }
}
@media (max-width: 560px) {
  #page-vendedora { padding: 18px 0 50px; }
  #page-vendedora .vp-shell { padding: 0 16px; }
  #page-vendedora .vp-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  #page-vendedora .vp-c-2, #page-vendedora .vp-c-3, #page-vendedora .vp-c-4 { grid-column: span 2; }
  #page-vendedora .vp-card { padding: 22px; border-radius: var(--v-r-md); }
  #page-vendedora .vp-card .vp-big { font-size: 2.5rem; }
  #page-vendedora .vp-card .vp-title { font-size: 1.35rem; }
  #page-vendedora .vp-topbar { flex-direction: column; align-items: stretch; gap: 10px; }
  #page-vendedora .vp-brand { font-size: 1.15rem; }
  #page-vendedora .vp-brand-dot { width: 34px; height: 34px; border-radius: 11px; font-size: 13px; }
  #page-vendedora .vp-nav { width: 100%; justify-content: space-between; }
  #page-vendedora .vp-nav-btn { padding: 8px 11px !important; font-size: .78rem !important; flex: 1; justify-content: center; }
  #page-vendedora .vp-nav-btn.active { box-shadow: 0 4px 10px var(--v-glow); }
  #page-vendedora .vp-detail-main { padding: 24px; }
  #page-vendedora .vp-detail-info-grid { grid-template-columns: 1fr; }
  #page-vendedora .vp-info-row { border-top: 1px solid var(--v-line) !important; padding-top: 14px !important; }
  #page-vendedora .vp-fin-row { grid-template-columns: 1fr 1fr; padding: 12px 16px; font-size: .85rem; }
  #page-vendedora .vp-fin-row .col-pagado, #page-vendedora .vp-fin-row .col-estado { display: none; }
}