html {
  background: #f5f6f7;
}

.section-card {
  margin: 0.75rem 0;
}

.muted {
  color: #6a7682;
}

.metric {
  font-size: 1.5rem;
  font-weight: 700;
  color: #15536e;
}

/* =========================================================
   Perfil profesional — baseline visual aprobada
   (scope pp-, no afecta otras vistas)
   ========================================================= */

.pp-shell {
  --pp-surface: #ffffff;
  --pp-text-main: #111827;
  --pp-text-body: #374151;
  --pp-text-secondary: #64748b;
  --pp-text-muted: #7c8797;
  --pp-border: #e7ebef;
  --pp-accent: #0a6ed1;
  --pp-read: 860px;

  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 2.2rem 1.6rem 5rem;
}

.pp-empty {
  margin: 0 0 1.5rem;
}

.pp-hero {
  width: 100%;
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: 18px;
  padding: 2.5rem 2.7rem 2.3rem;
  box-shadow: 0 1px 4px rgba(0,0,0,.035);
}

.pp-name {
  margin: 0 !important;
  font-size: 2rem !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  color: var(--pp-text-main);
}

.pp-meta {
  margin-top: .9rem;
  color: var(--pp-text-secondary);
  font-size: .9rem;
}

.pp-section {
  width: 100%;
  margin-top: 3rem;
}

.pp-sectionTitle {
  margin: 0 !important;
  font-size: 1.45rem !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: var(--pp-text-main);
}

.pp-sectionSubtitle {
  display: block;
  margin-top: .3rem;
  font-size: .9rem;
  line-height: 1.4;
  color: var(--pp-text-secondary);
}

.pp-employment {
  width: 100%;
  margin-bottom: 1.65rem;
  padding: 1.8rem 1.9rem 1.95rem;
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,.025);
}

.pp-empTop {
  width: 100%;
  gap: 2rem;
}

.pp-empIdentity {
  min-width: 0;
}

.pp-empCompany {
  margin: 0 !important;
  font-size: 1.38rem !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: var(--pp-text-main);
}

.pp-empRole {
  margin-top: .28rem;
  font-size: 1rem;
  line-height: 1.35;
  font-weight: 500;
  color: var(--pp-text-body);
}

.pp-empPeriod {
  padding-top: .2rem;
  font-size: .88rem;
  font-weight: 600;
  white-space: nowrap;
  color: #475569;
}

.pp-empSummary {
  max-width: var(--pp-read);
  margin-top: 1rem;
  font-size: .94rem;
  line-height: 1.62;
  color: #4b5563;
}

.pp-engagements {
  margin-top: 1.55rem;
}

.pp-engagement {
  width: 100%;
  margin-top: 1.45rem;
  margin-left: .2rem;
  padding: .15rem 0 .1rem 1.3rem;
  border-left: 3px solid var(--pp-accent);
}

.pp-engagement:first-child {
  margin-top: 0;
}

.pp-engClient {
  margin: 0 !important;
  font-size: 1.03rem !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  color: #172033;
}

.pp-engContext {
  margin-top: .18rem;
  font-size: .76rem;
  line-height: 1.35;
  font-weight: 600;
  color: var(--pp-text-secondary);
  text-transform: uppercase;
  letter-spacing: .035em;
}

.pp-engSummary {
  max-width: var(--pp-read);
  margin-top: .62rem;
  font-size: .9rem;
  line-height: 1.55;
  color: #475569;
}

.pp-workItems {
  margin-top: .85rem;
}

.pp-workItem {
  width: 100%;
  gap: .62rem;
  margin-top: .42rem;
}

.pp-workItem:first-child {
  margin-top: 0;
}

.pp-workMarker {
  min-width: .55rem;
  padding-top: .02rem;
  color: var(--pp-accent);
  font-weight: 700;
}

.pp-workBody {
  min-width: 0;
  width: 100%;
}

.pp-workTitle {
  font-size: .9rem;
  line-height: 1.5;
  font-weight: 600;
  color: #1f2937;
}

.pp-workText {
  font-size: .9rem;
  line-height: 1.52;
  color: var(--pp-text-body);
}

.pp-workOutcome {
  margin-top: .2rem;
  font-size: .87rem;
  line-height: 1.5;
  color: #4b5563;
}

.pp-skillsPanel {
  width: 100%;
  padding: 1.45rem 1.65rem;
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,.025);
}

.pp-skillCategory {
  width: 100%;
  align-items: flex-start;
  gap: 1rem;
  padding: .9rem 0;
  border-bottom: 1px solid #eef0f2;
}

.pp-skillCategory:first-child {
  padding-top: 0;
}

.pp-skillCategory:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.pp-skillCategoryName {
  flex: 0 0 145px;
  min-width: 0;
  padding-top: .27rem;
  font-size: .88rem;
  line-height: 1.35;
  font-weight: 700;
  color: var(--pp-text-body);
}

.pp-chipContainer {
  flex: 1;
  min-width: 0;
  width: 100%;
  gap: .4rem;
}

.pp-skillChip {
  padding: .27rem .56rem;
  background: #edf4fb;
  border: 1px solid #d8e7f5;
  border-radius: 999px;
  color: #294e70;
  font-size: .78rem;
  line-height: 1.25;
  white-space: nowrap;
}

.pp-skillChipHidden {
  background: #f4f4f4;
  border-color: #e2e2e2;
  color: #8a8a8a;
}

.pp-lower {
  width: 100%;
  gap: 1.35rem;
  align-items: flex-start;
}

.pp-lowerCol {
  min-width: 0;
}

.pp-infoPanel {
  width: 100%;
  margin-top: 1.25rem;
  padding: 1.25rem 1.4rem;
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,.02);
}

.pp-infoRow {
  width: 100%;
  padding: .9rem 0;
  border-bottom: 1px solid #eef0f2;
  align-items: flex-start;
}

.pp-infoRow:first-child {
  padding-top: 0;
}

.pp-infoRow:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.pp-infoMain {
  min-width: 0;
  width: 100%;
}

.pp-infoTitle {
  width: 100%;
  font-size: .91rem;
  line-height: 1.42;
  font-weight: 600;
  color: #1f2937;
}

.pp-infoMeta {
  width: 100%;
  margin-top: .2rem;
  font-size: .83rem;
  line-height: 1.4;
  color: var(--pp-text-secondary);
}

.pp-infoYear {
  flex: none;
  padding-left: 1rem;
  font-size: .85rem;
  line-height: 1.3;
  font-weight: 600;
  color: #475569;
  white-space: nowrap;
}

.pp-achievementsPanel {
  width: 100%;
  margin-top: 1.25rem;
  padding: 1.2rem 1.4rem;
  background: var(--pp-surface);
  border: 1px solid var(--pp-border);
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0,0,0,.02);
}

.pp-achievement {
  width: 100%;
  gap: .72rem;
  padding: .62rem 0;
}

.pp-achievementMarker {
  min-width: .6rem;
  color: var(--pp-accent);
  font-size: 1rem;
}

.pp-achievementBody {
  min-width: 0;
  width: 100%;
}

.pp-achievementTitle {
  font-size: .9rem;
  line-height: 1.5;
  font-weight: 600;
  color: #1f2937;
}

.pp-achievementText {
  font-size: .9rem;
  line-height: 1.52;
  color: var(--pp-text-body);
}

.pp-hidden.sapMPanel {
  margin-top: 2.5rem;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 950px) {
  .pp-shell {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .pp-lower {
    display: block !important;
  }

  .pp-lowerCol {
    width: 100% !important;
  }

  .pp-lowerCol + .pp-lowerCol {
    margin-top: 2.4rem;
  }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 800px) {
  .pp-shell {
    padding: 1rem .75rem 3.5rem;
  }

  .pp-hero {
    padding: 1.45rem 1.15rem;
    border-radius: 14px;
  }

  .pp-name {
    font-size: 1.62rem !important;
    line-height: 1.18 !important;
  }

  .pp-meta {
    font-size: .82rem;
  }

  .pp-section {
    margin-top: 2.35rem;
  }

  .pp-sectionTitle {
    font-size: 1.35rem !important;
  }

  .pp-sectionSubtitle {
    max-width: 95%;
    font-size: .86rem;
    line-height: 1.42;
  }

  .pp-employment {
    padding: 1.3rem 1.05rem 1.4rem;
    margin-bottom: 1.2rem;
    border-radius: 13px;
  }

  .pp-empTop {
    display: block !important;
  }

  .pp-empIdentity {
    width: 100% !important;
  }

  .pp-empCompany {
    font-size: 1.22rem !important;
  }

  .pp-empRole {
    font-size: .94rem;
  }

  .pp-empPeriod {
    display: block;
    margin-top: .35rem;
    padding-top: 0;
    font-size: .82rem;
    white-space: nowrap;
  }

  .pp-empSummary {
    margin-top: .9rem;
    font-size: .88rem;
    line-height: 1.56;
  }

  .pp-engagements {
    margin-top: 1.25rem;
  }

  .pp-engagement {
    margin-left: 0;
    margin-top: 1.25rem;
    padding-left: .9rem;
    border-left-width: 2px;
  }

  .pp-engClient {
    font-size: .98rem !important;
  }

  .pp-engContext {
    font-size: .7rem;
  }

  .pp-engSummary {
    font-size: .86rem;
    line-height: 1.5;
  }

  .pp-workItems {
    margin-top: .72rem;
  }

  .pp-workTitle,
  .pp-workText {
    font-size: .85rem;
    line-height: 1.48;
  }

  .pp-skillsPanel {
    padding: 1.15rem 1rem;
  }

  .pp-skillCategory {
    flex-direction: column;
    align-items: stretch;
    gap: .55rem;
    padding: 1rem 0;
  }

  .pp-skillCategoryName {
    flex: none;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: .9rem;
    line-height: 1.25;
    white-space: nowrap !important;
  }

  .pp-chipContainer {
    width: 100% !important;
    min-width: 0 !important;
  }

  .pp-skillChip {
    padding: .25rem .5rem;
    font-size: .75rem;
  }

  .pp-infoPanel {
    padding: 1.1rem 1rem;
  }

  .pp-infoRow {
    flex-direction: column;
    align-items: stretch;
    gap: .32rem;
    padding: 1rem 0;
  }

  .pp-infoMain {
    width: 100% !important;
    min-width: 0 !important;
  }

  .pp-infoTitle {
    width: 100% !important;
    font-size: .9rem;
    line-height: 1.4;
  }

  .pp-infoMeta {
    width: 100% !important;
    margin-top: .18rem;
    font-size: .83rem;
  }

  .pp-infoYear {
    display: block !important;
    padding-left: 0;
    margin-top: .05rem;
    font-size: .8rem;
    line-height: 1.2;
    white-space: nowrap !important;
  }

  .pp-achievementsPanel {
    padding: 1rem;
  }

  .pp-achievementTitle,
  .pp-achievementText {
    font-size: .86rem;
    line-height: 1.48;
  }
}

/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 390px) {
  .pp-shell {
    padding-left: .55rem;
    padding-right: .55rem;
  }

  .pp-hero {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .pp-employment {
    padding-left: .9rem;
    padding-right: .9rem;
  }

  .pp-skillsPanel,
  .pp-infoPanel,
  .pp-achievementsPanel {
    padding-left: .85rem;
    padding-right: .85rem;
  }

  .pp-skillChip {
    font-size: .73rem;
  }
}


/* =========================================================
   Ofertas / Postulaciones — filtros y detalle
   ========================================================= */

.filterRow .sapMInputBase {
  min-width: 7rem;
}

/* Cada filtro mantiene su etiqueta y su campo juntos al saltar de línea */
.filterField {
  margin-right: .75rem;
  margin-bottom: .5rem;
}
.filterField .sapMLabel {
  margin-bottom: .15rem;
}
.filterFieldAction {
  align-self: flex-end;
}

.detailTitle {
  margin: 0 0 .4rem !important;
  font-size: 1.2rem !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  color: #111827;
}

.detailMeta {
  margin-top: .2rem;
  font-size: .88rem;
  line-height: 1.45;
  color: #4b5563;
}

.detailSubtitle {
  margin: 1.2rem 0 .4rem !important;
  font-size: .95rem !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  color: #1f2937;
}

.detailBody {
  font-size: .9rem;
  line-height: 1.55;
  color: #374151;
  white-space: pre-line;
}

.detailField {
  margin-top: .65rem;
}

.detailFieldLabel {
  margin-bottom: .2rem;
  font-size: .78rem;
  font-weight: 600;
  color: #6b7280;
}

.detailActions {
  gap: .5rem;
  margin-top: .65rem;
  flex-wrap: wrap;
}


/* ==========================================================================
   Login (v2) — composición premium, look SaaS; UI5 solo como motor
   ========================================================================== */
.mdl-page.sapMPage {
  background: #fafbfc;
}
.mdl-page .sapMPageContent {
  padding: 0;
  margin: 0;
}
.mdl-page *,
.mdl-page .sapMTitle,
.mdl-page .sapMText {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.mdl-stage {
  position: relative;
  box-sizing: border-box;
  min-height: 100vh;
  justify-content: center;
  gap: 3rem;
  padding: clamp(1.5rem, 5vw, 4rem);
  overflow: hidden;
}
.mdl-stage::before {
  content: "";
  position: absolute;
  top: -14rem;
  left: -10rem;
  width: 34rem;
  height: 34rem;
  border-radius: 50%;
  background: radial-gradient(circle at center, rgba(99, 102, 241, .10), transparent 62%);
  pointer-events: none;
}
.mdl-stage::after {
  content: "";
  position: absolute;
  right: -12rem;
  bottom: -14rem;
  width: 30rem;
  height: 30rem;
  border-radius: 50%;
  background: radial-gradient(circle at center, rgba(14, 165, 233, .07), transparent 60%);
  pointer-events: none;
}

.mdl-shell {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  box-sizing: border-box;
  gap: clamp(3rem, 9vw, 7rem);
}

/* ---- Zona izquierda: presentación ---- */
.mdl-brand {
  flex: 1 1 46%;
  min-width: 300px;
  max-width: 600px;
  box-sizing: border-box;
  align-items: flex-start;
}
.mdl-owned {
  display: block;
  margin: 0 0 1.6rem !important;
  font-size: .68rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 600;
  color: #9aa3af;
}
.mdl-name {
  display: block;
  margin: 0 !important;
  font-size: clamp(2.6rem, 6vw, 4rem) !important;
  line-height: 1.02;
  font-weight: 800;
  letter-spacing: -.035em;
  color: #0b1220;
}
.mdl-logo {
  display: block;
  width: clamp(180px, 30vw, 240px);
  height: auto;
  margin: 0 !important;
}
.mdl-strapline {
  display: block;
  max-width: 26rem;
  margin: 1.1rem 0 0 !important;
  font-size: clamp(1.05rem, 2vw, 1.28rem);
  line-height: 1.5;
  font-weight: 500;
  color: #3f4a59;
}
.mdl-brief {
  display: block;
  max-width: 30rem;
  margin: 1.4rem 0 0 !important;
  font-size: .9rem;
  line-height: 1.7;
  color: #7a8695;
}

/* ---- Zona derecha: autenticación ---- */
.mdl-login-col {
  flex: 0 1 392px;
  min-width: 300px;
  box-sizing: border-box;
}
.mdl-login-card {
  box-sizing: border-box;
  background: #ffffff;
  border: 1px solid #e7ebf0;
  border-radius: 22px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .03), 0 16px 48px rgba(16, 24, 40, .05);
  padding: clamp(2rem, 5vw, 2.75rem);
  gap: .7rem;
}
.mdl-card-eyebrow {
  display: block;
  margin: 0 0 .4rem !important;
  font-size: .68rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-weight: 700;
  color: #7c3aed;
}
.mdl-card-title {
  display: block;
  margin: 0 !important;
  font-size: 1.55rem !important;
  font-weight: 750;
  letter-spacing: -.02em;
  color: #0b1220;
}
.mdl-card-sub {
  display: block;
  margin: 0 0 .4rem !important;
  font-size: .92rem;
  line-height: 1.6;
  color: #64748b;
}

.mdl-login-btn.sapMBtn {
  height: auto;
  margin: 1.9rem 0 0;
  width: 100%;
}
.mdl-login-btn .sapMBtnInner {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  height: 54px;
  border-radius: 14px;
  border: 1px solid #0b1220;
  background: #0b1220;
  box-shadow: none;
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.mdl-login-btn .sapMBtnInner .sapMBtnContent {
  color: #ffffff;
  font-size: .98rem;
  font-weight: 600;
  letter-spacing: .01em;
}
.mdl-login-btn .sapMBtnInner.sapMBtnHoverable:hover {
  background: #1b2434;
  border-color: #1b2434;
}
.mdl-login-btn .sapMBtnInner.sapMBtnActive {
  background: #2b3547;
  border-color: #2b3547;
}
.mdl-login-btn .sapMBtnInner:focus-visible {
  outline: 2px solid rgba(124, 58, 237, .5);
  outline-offset: 2px;
}

/* ---- Pie ---- */
.mdl-copy {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  margin-top: auto !important;
  color: #9aa3af;
  font-size: .75rem;
  letter-spacing: .01em;
}

@media (max-width: 980px) {
  .mdl-stage {
    justify-content: flex-start;
    padding-top: clamp(3rem, 10vh, 5rem);
  }
  .mdl-shell {
    gap: 3rem;
  }
  .mdl-brand,
  .mdl-login-col {
    flex: 1 1 100% !important;
    min-width: 0;
    max-width: 560px;
  }
  .mdl-login-col {
    display: flex;
    justify-content: center;
  }
  .mdl-login-card {
    width: 100%;
  }
  .mdl-copy {
    margin-top: 1.5rem;
  }
}

/* Independencia de estilos internos UI5 (display/flex propios) */
.mdl-stage,
.mdl-shell {
  display: flex;
}
.mdl-stage {
  flex-direction: column;
  justify-content: center;
}
.mdl-shell {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.mdl-brand,
.mdl-login-col,
.mdl-login-card {
  display: flex;
  flex-direction: column;
}
@media (max-width: 980px) {
  .mdl-shell {
    align-items: stretch;
  }
}

/* ==========================================================================
   Home: KPIs y menú responsivos (desktop / tablet / móvil)
   ========================================================================== */
.home-kpis {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}
.home-kpis .sapMGT {
  width: auto !important;
  flex: 1 1 180px;
  min-width: 158px;
  max-width: 270px;
}
.home-nav {
  max-width: 880px;
}

@media (max-width: 640px) {
  .home-kpis .sapMGT {
    flex: 1 1 100%;
    min-width: 0;
    max-width: none;
  }
  .home-nav {
    max-width: none;
  }
}

/* Administración */
.admin-stats {
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}
.admin-stat {
  flex: 1 1 150px;
  min-width: 138px;
  background: #ffffff;
  border: 1px solid #e7ebf0;
  border-radius: 14px;
  padding: .9rem 1rem;
}
.admin-stat .sapMTitle {
  margin: 0 !important;
  font-size: 1.35rem !important;
}
.admin-stat .sapMText {
  color: #6b7686;
  font-size: .8rem;
  margin-top: .15rem !important;
}

/* ==========================================================================
   Header SaaS + área personal "Mi Perfil"
   ========================================================================== */
.me-header {
  background: #ffffff;
  border-bottom: 1px solid #e7ebef;
}
.me-brand-logo {
  height: 2.25rem;
  width: 2.25rem;
  margin: 0 .25rem;
  cursor: pointer;
}
.me-avatar .sapMBtnInner {
  border-radius: 50%;
  min-width: 2.25rem;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  background: #edf4fb;
  border: 1px solid #d8e7f5;
}
.me-avatar .sapMBtnContent {
  color: #294e70;
  font-size: .78rem;
  font-weight: 700;
  line-height: 2.25rem;
}
.me-avatar .sapMBtnInner.sapMBtnHoverable:hover {
  background: #e2eefb;
  border-color: #c9def2;
}
.me-devBtn .sapMBtnInner {
  border: 1px dashed #b8860b;
  border-radius: .5rem;
  color: #8a6508;
}
.me-devBtn .sapMBtnContent,
.me-devBtn .sapMBtnIcon {
  color: #8a6508;
}

/* ==========================================================================
   MyHome — cuadrícula simétrica de KPIs (sap.f.GridContainer)
   ========================================================================== */
.home-grid {
  width: 100%;
}
.home-grid .sapMGT {
  width: 100% !important;
  min-width: 0;
}

/* Tarjeta destacada "Oportunidades": llamada a la acción principal en azul */
.home-grid .home-tile-primary {
  background: #0a6ed1 !important;
  border-color: #0a6ed1 !important;
  box-shadow: 0 4px 14px rgba(10, 110, 209, .32) !important;
}
.home-grid .home-tile-primary .sapMText,
.home-grid .home-tile-primary .sapMGTSubHdrTxt,
.home-grid .home-tile-primary .sapMNCValue,
.home-grid .home-tile-primary .sapMNCScale,
.home-grid .home-tile-primary .sapMNCIconImage,
.home-grid .home-tile-primary .sapUiIcon {
  color: #ffffff !important;
}
/* Refuerza la legibilidad del texto secundario sobre el azul (WCAG AA) */
.home-grid .home-tile-primary .sapMGTSubHdrTxt .sapMText {
  font-weight: 500;
}

/* ==========================================================================
   MyHome — tabla de oportunidades
   ========================================================================== */
.opp-table {
  background: #ffffff;
  border: 1px solid #e7ebef;
  border-radius: 12px;
}
.opp-table .sapMListTblCell {
  vertical-align: top;
}
.opp-search-phone {
  margin-bottom: .5rem;
}
.list-search {
  max-width: 26rem;
}

/* ==========================================================================
   Oportunidades / Postulaciones — lista en tarjetas
   ========================================================================== */
.offers-count {
  font-weight: 600;
  color: #374151;
}
.offers-list {
  background: transparent;
}
.offers-list .sapMLIB {
  padding: 0;
  background: transparent;
  border-bottom: 0;
}
.offers-list .sapMLIBContent {
  width: 100%;
  padding: 0;
}
.opp-card {
  box-sizing: border-box;
  width: 100%;
  padding: 1rem 1.1rem;
  margin-bottom: .6rem;
  background: #ffffff;
  border: 1px solid #e7ebef;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .03);
}
.opp-main {
  flex: 1 1 60%;
  min-width: 0;
}
.opp-title {
  font-size: 1.02rem;
  line-height: 1.3;
  font-weight: 700;
  color: #111827;
}
.opp-company {
  margin-top: .15rem;
  font-size: .92rem;
  line-height: 1.35;
  font-weight: 400;
  color: #4b5563;
}
.opp-meta {
  gap: .35rem .9rem;
  margin-top: .5rem;
}
.opp-meta .sapMText {
  font-size: .82rem;
  color: #6a7682;
}
.opp-side {
  flex: 0 0 auto;
  align-items: flex-end;
  gap: .6rem;
}
.opp-actions {
  gap: .4rem;
  justify-content: flex-end;
}

@media (max-width: 640px) {
  .opp-card {
    display: block;
  }
  .opp-side {
    align-items: flex-start;
    margin-top: .8rem;
  }
  .opp-actions {
    justify-content: flex-start;
  }
}

/* ==========================================================================
   Detalle de la oferta — vista interna
   ========================================================================== */
.offer-detail {
  box-sizing: border-box;
  max-width: 920px;
  margin: 1rem auto 0;
  padding: 1.8rem 1.8rem 2.4rem;
  background: #ffffff;
  border: 1px solid #e7ebef;
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .03);
}
.offer-detail .detailBody {
  max-width: 780px;
}
.offer-detail .detailField {
  max-width: 420px;
}
.offer-detail .detailActions {
  margin-top: 1.5rem;
}

@media (max-width: 640px) {
  .offer-detail {
    margin-top: 0;
    padding: 1.1rem 1rem 1.6rem;
    border-radius: 12px;
  }
  .offer-detail .detailField {
    max-width: none;
  }
}

/* ==========================================================================
   Login — acción secundaria de registro
   ========================================================================== */
.mdl-register-row {
  justify-content: center;
  align-items: center;
  gap: .35rem;
  margin-top: 1.1rem;
}
.mdl-register-text {
  color: #64748b;
  font-size: .9rem;
}
.mdl-register-link {
  font-size: .9rem;
  font-weight: 600;
}

/* Login — solicitud de invitación inline */
.mdl-invite {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid #e7ebf0;
}
.mdl-invite-label {
  font-size: .85rem;
  color: #64748b;
}
.mdl-invite-input .sapMInputBaseInner {
  width: 100%;
}
.mdl-invite-link {
  align-self: center;
  font-size: .85rem;
}

/* ==========================================================================
   Vistas incrustadas en el onboarding (Importar CV, Asistente, Palabras clave).
   La Page incrustada asume height:100% y su contenido va en una <section> absoluta;
   dentro del onboarding debe medir su contenido (si no, colapsa a 0px).
   ========================================================================== */
.onb-cv-host { width: 100%; }
.onb-cv-host .sapMPage { height: auto !important; }
.onb-cv-host .sapMPage > section { position: static !important; }

/* ==========================================================================
   Login (v3) — landing de entrada (maqueta 2026-09-30). Clases `lnd-*` propias:
   las `mdl-*` siguen en uso por Access.view.xml.
   ========================================================================== */
.lnd-page.sapMPage,
.lnd-page .sapMPageContent {
  background: #F4F6FB;
  padding: 0;
  margin: 0;
}
.lnd-page *,
.lnd-page .sapMText,
.lnd-page .sapMTitle,
.lnd-page .sapMLnk,
.lnd-page .sapMBtnContent {
  font-family: Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.lnd-stage {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  min-height: 100vh;
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem clamp(1.25rem, 5vw, 4rem) 1.75rem;
  gap: 2rem;
}

/* ---- Barra superior ---- */
.lnd-top { gap: 1rem; }
.lnd-brand { gap: .75rem; flex-shrink: 0; }
.lnd-top-actions .lnd-btn-outline { flex-shrink: 0; }
.lnd-mark { width: 40px; height: 40px; }
.lnd-mark img { width: 40px; height: 40px; }
.lnd-wordmark.sapMText {
  font-family: Sora, Figtree, sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -.02em;
  color: #141A3A;
}
.lnd-top-actions { gap: 1.25rem; }
.lnd-top-hint.sapMText { font-size: .95rem; color: #4A5173; }

/* ---- Botones ---- */
.lnd-page .lnd-btn-outline.sapMBtn,
.lnd-page .lnd-btn-primary.sapMBtn { height: auto !important; padding: 0 !important; }
.lnd-page .lnd-btn-outline .sapMBtnInner {
  height: 44px !important;
  min-height: 44px;
  padding: 0 1.25rem !important;
  border-radius: 10px;
  border: 1.5px solid #C9CEE6;
  background: #FFFFFF;
  box-shadow: none;
}
.lnd-page .lnd-btn-outline .sapMBtnInner .sapMBtnContent { line-height: 44px; color: #141A3A; font-weight: 600; font-size: .95rem; }
.lnd-page .lnd-btn-outline .sapMBtnInner.sapMBtnHoverable:hover { background: #F0F2F8; border-color: #AEB5D6; }
.lnd-page .lnd-btn-primary .sapMBtnInner {
  height: 56px !important;
  min-height: 56px;
  padding: 0 2rem !important;
  border-radius: 12px;
  border: 0;
  background: #2F3FD6;
  box-shadow: 0 8px 20px rgba(47, 63, 214, .25);
  transition: background .18s ease, box-shadow .18s ease;
}
.lnd-page .lnd-btn-primary .sapMBtnInner .sapMBtnContent { line-height: 56px; color: #FFFFFF; font-weight: 600; font-size: 1.06rem; }
.lnd-page .lnd-btn-primary .sapMBtnInner.sapMBtnHoverable:hover { background: #1F2BA8; }
.lnd-page .lnd-btn-primary .sapMBtnInner.sapMBtnActive { background: #1A2490; }
/* Foco: sin el anillo UI5 al hacer clic; anillo propio solo con teclado. */
.lnd-page .sapMBtn:focus > .sapMBtnInner,
.lnd-page .sapMBtn .sapMBtnInner.sapMFocusable:focus { outline: none !important; }
.lnd-page .sapMBtn:focus > .sapMBtnInner::before,
.lnd-page .sapMBtn:focus > .sapMBtnInner::after { display: none !important; }
/* Solo en escritorio (teclado): en móvil UI5 enfoca el primer botón al cargar. */
html.sap-desktop .lnd-page .sapMBtn:focus-visible > .sapMBtnInner {
  outline: 3px solid rgba(47, 63, 214, .45) !important;
  outline-offset: 2px;
}
.lnd-link.sapMLnk { font-size: 1rem; font-weight: 600; color: #2F3FD6; }
.lnd-link.sapMLnk:hover { color: #1F2BA8; }

/* ---- Cuerpo: propuesta + vista del producto ---- */
.lnd-main {
  flex: 1 0 auto;
  gap: clamp(2.5rem, 5vw, 4.5rem);
  justify-content: space-between;
}
.lnd-hero {
  flex: 1 1 520px;
  max-width: 640px;
  gap: 1.6rem;
}
.lnd-pill.sapMText {
  align-self: flex-start;
  padding: .35rem .9rem;
  border-radius: 999px;
  background: #E6E9FB;
  color: #2A34A8;
  font-size: .88rem;
  font-weight: 600;
}
.lnd-title.sapMTitle {
  font-family: Sora, Figtree, sans-serif;
  font-size: clamp(2.1rem, 4.2vw, 3.5rem);
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -.025em;
  color: #141A3A;
  white-space: normal;
}
.lnd-lead.sapMText {
  max-width: 35rem;
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  line-height: 1.55;
  color: #3C4366;
}
.lnd-ctas { gap: 1.25rem; }
.lnd-benefits {
  gap: 1.25rem;
  padding-top: .5rem;
}
.lnd-benefit {
  flex: 1 1 160px;
  gap: .45rem;
}
.lnd-benefit-icon.sapUiIcon { font-size: 1.5rem; color: #2F3FD6; }
.lnd-benefit-title.sapMText { font-weight: 600; font-size: 1rem; color: #141A3A; }
.lnd-benefit-text.sapMText { font-size: .9rem; line-height: 1.45; color: #4A5173; }

.lnd-preview {
  flex: 1 1 420px;
  max-width: 560px;
  gap: .9rem;
  padding: 1.75rem;
  border-radius: 24px;
  background: #FFFFFF;
  border: 1px solid #E1E5F2;
  box-shadow: 0 24px 60px rgba(20, 26, 58, .10);
  box-sizing: border-box;
}
.lnd-preview-head { gap: 1rem; }
.lnd-preview-title.sapMText {
  font-family: Sora, Figtree, sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: #141A3A;
}
.lnd-preview-sub.sapMText { font-size: .82rem; color: #5A6184; }
.lnd-tag.sapMText {
  flex-shrink: 0;
  padding: .25rem .65rem;
  border-radius: 999px;
  background: #F0F2F8;
  color: #5A6184;
  font-size: .75rem;
  font-weight: 600;
}
.lnd-offer {
  gap: .75rem;
  padding: 1rem 1.1rem;
  border-radius: 14px;
  border: 1px solid #E1E5F2;
}
.lnd-offer-featured {
  gap: .6rem;
  border: 1.5px solid #CBD2FA;
  background: #F7F8FF;
}
.lnd-offer-row { gap: .75rem; }
.lnd-offer-title.sapMText { font-weight: 600; font-size: 1.02rem; color: #141A3A; }
.lnd-offer-meta.sapMText { font-size: .86rem; color: #5A6184; }
.lnd-offer-why.sapMText { font-size: .88rem; line-height: 1.45; color: #3C4366; }
.lnd-score.sapMText {
  flex-shrink: 0;
  padding: .3rem .65rem;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 700;
  white-space: nowrap;
}
.lnd-score-good.sapMText { background: #DDF5E7; color: #0B6B3A; }
.lnd-score-warn.sapMText { background: #FDEBD3; color: #8A4B00; }
.lnd-offer-actions { gap: .6rem; }
/* Botones de la vista ilustrativa: decorativos, no interactivos. */
.lnd-fake-btn.sapMText {
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 .95rem;
  border-radius: 10px;
  border: 1.5px solid #C9CEE6;
  background: #FFFFFF;
  color: #141A3A;
  font-size: .86rem;
  font-weight: 600;
}
.lnd-fake-btn-dark.sapMText { background: #141A3A; border-color: #141A3A; color: #FFFFFF; }

/* ---- CTA final (solo móvil) y pie ---- */
.lnd-page .lnd-cta-bottom.sapMBtn { display: none; }
.lnd-page .lnd-footer.sapMText {
  display: block;
  width: 100%;
  padding-top: 1rem;
  border-top: 1px solid #E1E5F2;
  font-size: .8rem;
  color: #5A6184;
}

/* ---- Tablet / móvil ---- */
@media (max-width: 980px) {
  .lnd-hero,
  .lnd-preview { flex: 1 1 100%; max-width: none; }
}
@media (max-width: 600px) {
  .lnd-stage { padding-top: 1.25rem; gap: 1.75rem; }
  .lnd-mark, .lnd-mark img { width: 32px; height: 32px; }
  .lnd-wordmark.sapMText { font-size: 1.2rem; }
  .lnd-top-hint.sapMText { display: none; }
  .lnd-page .lnd-btn-outline .sapMBtnInner { padding: 0 .9rem !important; }
  .lnd-page .lnd-ctas { flex-direction: column !important; align-items: stretch !important; }
  .lnd-page .lnd-ctas .lnd-link { align-self: center; }
  .lnd-page .lnd-btn-primary.sapMBtn,
  .lnd-page .lnd-btn-primary .sapMBtnInner { width: 100%; }
  .lnd-page .lnd-benefits { flex-direction: column !important; }
  .lnd-page .lnd-benefit { flex: 0 0 auto; }
  .lnd-preview { padding: 1.1rem; border-radius: 20px; }
  .lnd-page .lnd-cta-bottom.sapMBtn { display: block; }
  .lnd-footer.sapMText { text-align: center; }
}

/* ==========================================================================
   Shell v2 (2026-09-30): marca, menú principal y barra inferior en teléfono
   ========================================================================== */
.me-header .sapMBarLeft { display: flex; align-items: center; gap: 1.75rem; }
.me-brand { gap: .55rem; }
.me-brand-mark { width: 30px; height: 30px; cursor: pointer; }
.me-brand-mark img { width: 30px; height: 30px; }
.me-brand-word.sapMLnk {
  font-family: Sora, Figtree, sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.02em;
  color: #141A3A;
}
.me-brand-word.sapMLnk:hover { color: #141A3A; text-decoration: none; }
.me-mainnav { gap: .25rem; }
.me-navlink.sapMBtn { height: auto; padding: 0; }
.me-header .me-navlink .sapMBtnInner {
  height: 2.5rem !important;
  padding: 0 .85rem !important;
  border: 0 !important;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
}
.me-header .me-navlink .sapMBtnInner .sapMBtnContent {
  font-family: Figtree, sans-serif;
  font-size: .95rem;
  font-weight: 500;
  color: #3C4366;
  line-height: 2.5rem;
}
.me-header .me-navlink .sapMBtnInner.sapMBtnHoverable:hover { background: #F0F2F8; }
.me-header .me-navlink .sapMBtnInner.sapMBtnEmphasized { background: #E6E9FB; }
.me-header .me-navlink .sapMBtnInner.sapMBtnEmphasized .sapMBtnContent { color: #1F2BA8; font-weight: 600; }
/* Anchos intermedios (tablet, ventana reducida): el menú se compacta y, si aún no cabe, se desplaza
   horizontalmente en vez de cortar la última entrada. Bajo 600 px manda la barra inferior. */
.me-header .sapMBarLeft { min-width: 0; }
.me-mainnav { min-width: 0; overflow-x: auto; scrollbar-width: none; }
.me-mainnav::-webkit-scrollbar { display: none; }
.me-mainnav > .sapMFlexItem { flex-shrink: 0; }
@media (max-width: 1150px) {
  .me-header .sapMBarLeft { gap: 1rem; }
  .me-mainnav { gap: .1rem; }
  .me-header .me-navlink .sapMBtnInner { padding: 0 .55rem !important; }
  .me-header .me-navlink .sapMBtnInner .sapMBtnContent { font-size: .9rem; }
}
@media (max-width: 860px) {
  .me-header .me-brand .me-brand-word.sapMLnk { display: none; }
  /* La barra de UI5 no limita su contenedor izquierdo: se reserva el logo y los botones de la derecha. */
  .me-mainnav { max-width: calc(100vw - 200px); }
}

/* Barra inferior de pestañas (solo teléfono: showFooter lo controla App) */
.me-tabbar.sapMTB {
  height: 4.25rem;
  padding: 0;
  justify-content: space-around;
  background: #FFFFFF;
  border-top: 1px solid #E1E5F2;
  box-shadow: none;
}
.me-tab.sapMBtn { flex: 1 1 0; height: 100% !important; margin: 0 !important; padding: 0 !important; overflow: visible; }
.me-tabbar .me-tab .sapMBtnInner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none;
}
.me-tabbar .me-tab .sapMBtnIcon {
  position: static;
  margin: 0 0 .2rem !important;
  font-size: 1.3rem;
  color: #5A6184;
}
.me-tabbar .me-tab .sapMBtnInner .sapMBtnContent {
  display: block !important;
  overflow: visible;
  margin: 0 !important;
  font-family: Figtree, sans-serif;
  font-size: .72rem;
  font-weight: 600;
  line-height: 1;
  padding: 0;
  color: #5A6184;
}
.me-tabbar .me-tab .sapMBtnInner.sapMBtnEmphasized .sapMBtnIcon,
.me-tabbar .me-tab .sapMBtnInner.sapMBtnEmphasized .sapMBtnContent { color: #1F2BA8; }

/* ==========================================================================
   Home v2 (2026-09-30): resultado del día + ofertas destacadas. Clases `hm-*`.
   ========================================================================== */
.hm-page.sapMPage,
.hm-page .sapMPageContent { background: #F4F6FB; }
.hm-page .sapMText,
.hm-page .sapMLnk,
.hm-page .sapMTitle,
.hm-page .sapMBtnContent,
.hm-page .sapMObjStatusText { font-family: Figtree, -apple-system, "Segoe UI", sans-serif; }
.hm-stage {
  box-sizing: border-box;
  max-width: 1344px;
  margin: 0 auto;
  padding: 2.25rem clamp(1rem, 3.5vw, 3rem) 2.5rem;
}
.hm-section { gap: 1.75rem; }
.hm-hero { gap: 1rem; }
.hm-hero-text { gap: .4rem; }
.hm-greet.sapMText { font-size: .95rem; color: #5A6184; }
.hm-title.sapMTitle {
  font-family: Sora, Figtree, sans-serif;
  font-size: clamp(1.6rem, 2.6vw, 2.25rem);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -.02em;
  color: #141A3A;
  white-space: normal;
}
.hm-lead.sapMText { font-size: 1.05rem; line-height: 1.5; color: #3C4366; max-width: 40rem; }
.hm-link.sapMLnk { font-size: .95rem; font-weight: 600; color: #2F3FD6; }
.hm-link-sm.sapMLnk { font-size: .88rem; font-weight: 600; color: #2F3FD6; }

/* Franja de contadores */
.hm-stats { gap: 1rem; }
.hm-stat {
  flex: 1 1 180px;
  gap: .2rem;
  padding: 1rem 1.25rem;
  border-radius: 14px;
  background: #FFFFFF;
  border: 1px solid #E1E5F2;
}
.hm-stat-label.sapMText { font-size: .82rem; font-weight: 600; color: #5A6184; }
.hm-stat-value.sapMLnk {
  font-family: Sora, Figtree, sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  color: #141A3A;
}
.hm-stat-value.sapMLnk:hover { color: #2F3FD6; text-decoration: none; }

/* Cuerpo: ofertas + columna lateral */
.hm-body { gap: 1.75rem; }
.hm-offers { flex: 1 1 560px; min-width: 0; gap: .9rem; }
.hm-offer-list { gap: .9rem; }
.hm-aside { flex: 0 1 360px; min-width: 280px; gap: 1rem; }
.hm-card {
  gap: .7rem;
  padding: 1.3rem 1.5rem;
  border-radius: 16px;
  background: #FFFFFF;
  border: 1px solid #E1E5F2;
}
.hm-offer-list > .sapMFlexItem:first-child > .hm-card,
.hm-offer-list > .hm-card:first-child {
  border: 1.5px solid #CBD2FA;
  box-shadow: 0 10px 30px rgba(20, 26, 58, .06);
}
.hm-card-head { gap: 1rem; }
.hm-card-titles { gap: .25rem; min-width: 0; }
.hm-card-title.sapMLnk {
  font-size: 1.1rem;
  font-weight: 700;
  color: #141A3A;
  white-space: normal;
}
.hm-card-title.sapMLnk:hover { color: #2F3FD6; }
.hm-card-title-text.sapMText { font-size: 1.05rem; font-weight: 700; color: #141A3A; }
.hm-card-meta.sapMText { font-size: .88rem; color: #5A6184; }
.hm-card-why.sapMText { font-size: .93rem; line-height: 1.5; color: #3C4366; }
.hm-card-actions { gap: .6rem; }
.hm-score.sapMObjStatus { flex-shrink: 0; }
.hm-page .hm-score .sapMObjStatusWrapper {
  display: inline-block;
  padding: .3rem .7rem;
  border-radius: 999px;
  background: #F0F2F8;
  white-space: nowrap;
}
.hm-page .hm-score .sapMObjStatusText { font-size: .82rem; font-weight: 700; color: #5A6184; }
.hm-page .hm-score.sapMObjStatusSuccess .sapMObjStatusWrapper { background: #DDF5E7; }
.hm-page .hm-score.sapMObjStatusSuccess .sapMObjStatusText { color: #0B6B3A; }
.hm-page .hm-score.sapMObjStatusWarning .sapMObjStatusWrapper { background: #FDEBD3; }
.hm-page .hm-score.sapMObjStatusWarning .sapMObjStatusText { color: #8A4B00; }
.hm-note-link.sapMLnk { align-self: flex-start; font-size: .85rem; color: #5A6184; }
.hm-empty { gap: .5rem; }

/* Botones del Home */
.hm-page .hm-btn-primary.sapMBtn,
.hm-page .hm-btn-outline.sapMBtn,
.hm-page .hm-btn-ghost.sapMBtn,
.hm-page .hm-btn-light.sapMBtn { height: auto !important; padding: 0 !important; }
.hm-page .hm-btn-primary .sapMBtnInner,
.hm-page .hm-btn-outline .sapMBtnInner,
.hm-page .hm-btn-ghost .sapMBtnInner,
.hm-page .hm-btn-light .sapMBtnInner {
  height: 42px !important;
  padding: 0 1.1rem !important;
  border-radius: 10px;
  box-shadow: none;
}
.hm-page .hm-btn-primary .sapMBtnContent,
.hm-page .hm-btn-outline .sapMBtnContent,
.hm-page .hm-btn-ghost .sapMBtnContent,
.hm-page .hm-btn-light .sapMBtnContent { line-height: 42px; font-size: .9rem; font-weight: 600; }
.hm-page .hm-btn-primary .sapMBtnInner { background: #2F3FD6; border: 0; }
.hm-page .hm-btn-primary .sapMBtnInner.sapMBtnHoverable:hover { background: #1F2BA8; }
.hm-page .hm-btn-primary .sapMBtnContent { color: #FFFFFF; }
.hm-page .hm-btn-outline .sapMBtnInner { background: #FFFFFF; border: 1.5px solid #C9CEE6; }
.hm-page .hm-btn-outline .sapMBtnInner.sapMBtnHoverable:hover { background: #F0F2F8; }
.hm-page .hm-btn-outline .sapMBtnContent { color: #141A3A; }
.hm-page .hm-btn-ghost .sapMBtnInner { background: transparent; border: 0; }
.hm-page .hm-btn-ghost .sapMBtnContent { color: #5A6184; }
.hm-page .hm-btn-light .sapMBtnInner { background: #FFFFFF; border: 0; }
.hm-page .hm-btn-light .sapMBtnContent { color: #141A3A; }

/* Columna lateral */
.hm-side-card {
  gap: .6rem;
  padding: 1.2rem 1.25rem;
  border-radius: 16px;
  background: #FFFFFF;
  border: 1px solid #E1E5F2;
}
.hm-side-title.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1rem; font-weight: 600; color: #141A3A; }
.hm-side-strong.sapMLnk { font-size: .95rem; font-weight: 600; color: #141A3A; white-space: normal; }
.hm-side-strong-text.sapMText { font-size: .95rem; font-weight: 600; color: #141A3A; }
.hm-side-meta.sapMText { font-size: .85rem; line-height: 1.45; color: #5A6184; }
.hm-follow-when.sapMText[data-overdue="yes"] { color: #B42318; font-weight: 600; }
.hm-tags { gap: .5rem; }
.hm-tag.sapMText {
  padding: .35rem .65rem;
  border-radius: 999px;
  background: #F0F2F8;
  color: #3C4366;
  font-size: .82rem;
  font-weight: 600;
}
.hm-shortcuts { gap: 0; padding: .4rem; }
/* Inicio: "Para avanzar hoy" (urgent = ámbar, good = verde, info = azul) */
.hm-recs { gap: .75rem; }
.hm-rec-list { gap: .8rem; }
.hm-rec { gap: .65rem; }
.hm-rec-icon.sapUiIcon { flex: 0 0 auto; width: 30px; height: 30px; line-height: 30px; border-radius: 9px; font-size: .9rem; text-align: center; color: #2F3FD6; background: #E6E9FB; }
.hm-rec[data-tone="urgent"] .hm-rec-icon.sapUiIcon { color: #8A4B00; background: #FDEBD3; }
.hm-rec[data-tone="good"] .hm-rec-icon.sapUiIcon { color: #0B6B3A; background: #DDF5E7; }
.hm-rec-text { gap: .15rem; min-width: 0; }
.hm-rec-text .hm-link-sm.sapMLnk { align-self: flex-start; margin-top: .1rem; }
.hm-page .hm-shortcut.sapMLnk {
  display: flex !important;
  justify-content: space-between;
  padding: .7rem .8rem;
  border-radius: 10px;
  font-size: .95rem;
  font-weight: 600;
  color: #141A3A;
}
.hm-page .hm-shortcut.sapMLnk::after { content: "→"; color: #5A6184; }
.hm-shortcut.sapMLnk:hover { background: #F4F6FB; color: #141A3A; text-decoration: none; }
.hm-page .hm-dark.sapMFlexBox { background-color: #141A3A !important; border-color: #141A3A; }
.hm-page .hm-dark .hm-side-title.sapMText { color: #FFFFFF; }
.hm-page .hm-dark .hm-side-meta.sapMText { color: #C9CEE6; }
.hm-dark .hm-btn-light { align-self: flex-start; }

/* Primer día: lista de pasos */
.hm-checklist { gap: .25rem; margin-top: 1.25rem; }
.hm-progress.sapMPI { margin: .6rem 0 .5rem; border-radius: 999px; }
.hm-progress .sapMPIBar { background: #2F3FD6; }
.hm-step { gap: .9rem; padding: .85rem 0; border-top: 1px solid #EEF0F7; }
.hm-step-text { flex: 1 1 auto; gap: .15rem; min-width: 0; }
.hm-step-icon.sapUiIcon { font-size: 1.4rem; color: #8A93B8; }
.hm-step-icon.sapUiIcon[data-done="yes"] { color: #0B6B3A; }

/* Teléfono */
@media (max-width: 600px) {
  .hm-stage { padding-top: 1.25rem; }
  .hm-section { gap: 1.1rem; }
  .hm-page .hm-hero .hm-link.sapMLnk { display: none !important; }
  .hm-stats { gap: .5rem; flex-wrap: nowrap !important; }
  .hm-stat { flex: 1 1 0; min-width: 0; align-items: center; padding: .65rem .25rem; border-radius: 12px; }
  .hm-stat-label.sapMText { order: 2; font-size: .68rem; text-align: center; white-space: normal; }
  .hm-stat-value.sapMLnk { font-size: 1.25rem; }
  .hm-card { padding: 1rem; }
  .hm-card-actions .hm-btn-primary,
  .hm-card-actions .hm-btn-outline { flex: 1 1 0; }
  .hm-card-actions .hm-btn-primary .sapMBtnInner,
  .hm-card-actions .hm-btn-outline .sapMBtnInner { width: 100%; }
  .hm-aside { flex: 1 1 100%; min-width: 0; }
}
/* Isotipo clicable: sin anillo al enfocar con el mouse; visible con teclado. */
.me-header .me-brand-mark.sapMImg:focus { outline: none; }
.me-header .me-brand-mark.sapMImg:focus-visible { outline: 2px solid rgba(47, 63, 214, .5); outline-offset: 2px; border-radius: 6px; }

/* ==========================================================================
   Mis ofertas v2 (2026-09-30): pestañas por etapa, filtros plegables. Clases `of-*`
   (reutiliza tarjetas, botones y chips `hm-*` del Home).
   ========================================================================== */
.of-stage { gap: 1.25rem; }
.of-head { gap: 1rem; }
.of-manual { gap: .85rem; }
.of-bar { gap: 1rem; border-bottom: 1px solid #E1E5F2; }
.of-tabs { gap: .25rem; }
.hm-page .of-tab.sapMBtn { height: auto !important; padding: 0 !important; }
.hm-page .of-tab .sapMBtnInner {
  height: 48px !important;
  padding: 0 1rem !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none;
}
.hm-page .of-tab .sapMBtnContent { line-height: 45px; font-size: .95rem; font-weight: 600; color: #5A6184; }
.hm-page .of-tab .sapMBtnInner.sapMBtnEmphasized { border-bottom-color: #2F3FD6 !important; }
.hm-page .of-tab .sapMBtnInner.sapMBtnEmphasized .sapMBtnContent { color: #141A3A; font-weight: 700; }
.hm-page .of-tab .sapMBtnInner.sapMBtnHoverable:hover .sapMBtnContent { color: #141A3A; }
.of-tools { gap: .6rem; padding-bottom: .5rem; }
.hm-page .of-search.sapMSF { width: 19rem; }
.hm-page .of-filter-btn .sapMBtnInner { height: 40px !important; border-radius: 10px; padding: 0 .9rem !important; }
.hm-page .of-filter-btn .sapMBtnInner:not(.sapMBtnEmphasized) { background: #FFFFFF; border: 1.5px solid #D5DAEC; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnEmphasized { background: #E6E9FB; border: 1.5px solid #2F3FD6; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnEmphasized .sapMBtnContent,
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnEmphasized .sapMBtnIcon { color: #1F2BA8; }
.hm-page .of-filter-btn .sapMBtnContent { line-height: 37px; font-weight: 600; color: #141A3A; }
.of-filters {
  gap: .9rem;
  padding: 1rem 1.1rem;
  border-radius: 14px;
  background: #FFFFFF;
  border: 1px solid #E1E5F2;
}
.of-field { gap: .3rem; }
.hm-page .of-field .sapMLabel { font-size: .8rem; font-weight: 600; color: #5A6184; }
.hm-page .of-clear .sapMBtnContent { color: #2F3FD6; font-weight: 600; }
.of-list { gap: .9rem; }
.hm-page .of-more.sapMBtn { align-self: flex-start; }
.hm-page .of-more .sapMBtnIcon { color: #5A6184; }

/* Filas de En proceso / Cerradas */
.of-row { gap: 1.25rem; padding: 1.1rem 1.5rem; }
.of-row-main { flex: 1 1 320px; min-width: 0; gap: .25rem; }
.of-stage-chip.sapMObjStatus { flex: 0 0 11rem; }
.hm-page .hm-score.sapMObjStatusInformation .sapMObjStatusWrapper { background: #E6E9FB; }
.hm-page .hm-score.sapMObjStatusInformation .sapMObjStatusText { color: #1F2BA8; }
.of-row-follow { flex: 0 0 12rem; gap: .1rem; }
.of-row-label.sapMText { font-size: .75rem; font-weight: 600; color: #5A6184; }
.of-row-value.sapMText { font-size: .9rem; font-weight: 600; color: #141A3A; }
.of-row-value.sapMText[data-muted="yes"] { font-weight: 500; color: #5A6184; }
.of-row-actions { flex: 0 0 auto; gap: .5rem; }

@media (max-width: 600px) {
  .hm-page .of-hide-phone { display: none !important; }
  .of-head { flex-wrap: nowrap !important; align-items: center !important; }
  .of-bar { border-bottom: 0; }
  .hm-page .of-tabs {
    width: 100%;
    padding: 4px;
    border-radius: 12px;
    background: #E9ECF6;
  }
  .hm-page .of-tab.sapMBtn { flex: 1 1 0; }
  .hm-page .of-tab .sapMBtnInner {
    width: 100%;
    height: 40px !important;
    padding: 0 .25rem !important;
    border-bottom: 0 !important;
    border-radius: 9px;
  }
  .hm-page .of-tab .sapMBtnContent { line-height: 40px; font-size: .78rem; }
  .hm-page .of-tab .sapMBtnInner.sapMBtnEmphasized { background: #FFFFFF !important; box-shadow: 0 1px 3px rgba(20, 26, 58, .12); }
  .of-tools { width: 100%; padding-bottom: 0; }
  .hm-page .of-search.sapMSF { flex: 1 1 auto; width: auto; }
  .of-actions .hm-btn-ghost { flex: 0 0 auto; }
  .of-row { padding: 1rem; gap: .75rem; }
  .of-row-main { flex-basis: 100%; }
  .of-stage-chip.sapMObjStatus { flex: 0 0 auto; }
  .of-row-follow { flex: 1 1 auto; }
}

/* Botones del Home / Mis ofertas: ícono centrado junto al texto, sin anillo de foco al hacer clic
   (se mantiene uno propio con teclado en escritorio) y estado presionado legible. */
.hm-page .hm-btn-outline .sapMBtnInner,
.hm-page .of-filter-btn .sapMBtnInner { display: inline-flex; align-items: center; justify-content: center; }
.hm-page .hm-btn-outline .sapMBtnIcon,
.hm-page .of-filter-btn .sapMBtnIcon { position: static; margin: 0 .45rem 0 0 !important; line-height: 1; font-size: 1rem; }
.hm-page .hm-btn-outline .sapMBtnInner .sapMBtnContent,
.hm-page .of-filter-btn .sapMBtnInner .sapMBtnContent { padding: 0; }
.hm-page .sapMBtn:focus > .sapMBtnInner { outline: none !important; }
.hm-page .sapMBtn:focus > .sapMBtnInner::before,
.hm-page .sapMBtn:focus > .sapMBtnInner::after { display: none !important; }
html.sap-desktop .hm-page .sapMBtn:focus-visible > .sapMBtnInner { outline: 2px solid rgba(47, 63, 214, .45) !important; outline-offset: 2px; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnActive,
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnEmphasized.sapMBtnActive { background: #D9DEF8 !important; border-color: #2F3FD6 !important; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnActive .sapMBtnContent,
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnActive .sapMBtnIcon { color: #1F2BA8 !important; }
.hm-page .of-tab .sapMBtnInner.sapMBtnActive { background: transparent !important; }
.hm-page .hm-btn-outline .sapMBtnInner.sapMBtnActive { background: #E6E9FB !important; }
.hm-page .hm-btn-outline .sapMBtnInner.sapMBtnActive .sapMBtnContent { color: #141A3A !important; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnHoverable:hover { background: #F0F2F8 !important; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnEmphasized.sapMBtnHoverable:hover { background: #D9DEF8 !important; }
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnHoverable:hover .sapMBtnContent,
.hm-page .of-filter-btn .sapMBtnInner.sapMBtnHoverable:hover .sapMBtnIcon { color: #1F2BA8 !important; }

/* ==========================================================================
   Detalle de oferta v2 (2026-09-30). Clases `od-*` (reutiliza `hm-*`).
   Estados visuales vía atributos data-* (customData writeToDom), no clases enlazadas.
   ========================================================================== */
.od-stage { gap: 1.1rem; }
.hm-page .od-back.sapMLnk { align-self: flex-start; }
.od-content { gap: 1.5rem; }
.od-head { gap: 1rem; }
.od-head-text { gap: .5rem; flex: 1 1 520px; min-width: 0; }
.od-chips { gap: .5rem; flex-shrink: 0; }
.od-main { flex: 1 1 560px; }
.od-aside { flex: 0 1 400px; }
.od-eval { gap: 1.25rem; border: 1.5px solid #CBD2FA; }
.od-score {
  flex: 0 0 84px;
  width: 84px;
  height: 84px;
  border-radius: 999px;
  background: #F0F2F8;
}
.od-score[data-tone="good"] { background: #DDF5E7; }
.od-score[data-tone="warn"] { background: #FDEBD3; }
.od-score[data-tone="bad"] { background: #FDE2E0; }
.od-score-value.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.75rem; font-weight: 700; line-height: 1.1; color: #3C4366; }
.od-score-of.sapMText { font-size: .7rem; font-weight: 700; color: #5A6184; }
.od-score[data-tone="good"] .sapMText { color: #0B6B3A; }
.od-score[data-tone="warn"] .sapMText { color: #8A4B00; }
.od-score[data-tone="bad"] .sapMText { color: #B42318; }
.od-eval-text { gap: .4rem; min-width: 0; }
.od-desc { gap: .7rem; }
.od-desc-text.sapMText { font-size: .95rem; line-height: 1.65; color: #3C4366; white-space: pre-line; }
.od-details { gap: .35rem; padding-top: .5rem; }
.hm-page .od-cv-btn.sapMBtn { align-self: stretch; }
.hm-page .od-cv-btn .sapMBtnInner { width: 100%; height: 46px !important; }
.hm-page .od-cv-btn .sapMBtnContent { line-height: 46px; font-size: .95rem; font-weight: 700; }
.hm-page .od-cv-phone.sapMBtn { display: none; }
.od-follow { gap: 1rem; }
.od-field { gap: .4rem; }
.hm-page .od-field .sapMLabel { font-size: .8rem; font-weight: 600; color: #5A6184; }
.od-bar { gap: 4px; }
.od-bar > .sapMFlexItem { flex: 1 1 0; }
.od-bar-step { height: 6px; border-radius: 999px; background: #E1E5F2; }
.od-bar-step[data-on="yes"] { background: #2F3FD6; }
.od-seg {
  gap: 0;
  padding: 3px;
  border-radius: 10px;
  background: #E9ECF6;
}
.od-seg-half { width: 60%; }
.od-seg > .sapMFlexItem { flex: 1 1 0; }
.hm-page .od-seg-btn.sapMBtn { width: 100%; height: auto !important; padding: 0 !important; }
.hm-page .od-seg-btn .sapMBtnInner {
  width: 100%;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  box-shadow: none;
}
.hm-page .od-seg-btn .sapMBtnContent { line-height: 34px; font-size: .85rem; font-weight: 600; color: #5A6184; }
.hm-page .od-seg-btn .sapMBtnInner.sapMBtnEmphasized { background: #FFFFFF !important; box-shadow: 0 1px 3px rgba(20, 26, 58, .12); }
.hm-page .od-seg-btn .sapMBtnInner.sapMBtnEmphasized .sapMBtnContent { color: #141A3A; font-weight: 700; }
.hm-page .od-save.sapMBtn,
.hm-page .od-save .sapMBtnInner { width: 100%; }
.hm-page .od-save .sapMBtnInner { height: 44px !important; }
.hm-page .od-save .sapMBtnContent { line-height: 44px; font-size: .95rem; font-weight: 700; }
.od-updated.sapMText { align-self: center; font-size: .78rem; }
.hm-page .od-discard.sapMBtn { align-self: center; }
.hm-page .od-discard .sapMBtnContent { color: #B42318; font-weight: 600; }
.hm-page .od-restore.sapMBtn { align-self: center; }

@media (max-width: 600px) {
  .od-head { flex-direction: column !important; align-items: flex-start !important; }
  .od-head-text { flex: 0 0 auto; }
  .od-eval .od-score { display: none; }
  .hm-page .od-cv-phone.sapMBtn { display: block; }
  .hm-page .od-cv-phone .sapMBtnInner { width: 100%; height: 50px !important; }
  .hm-page .od-cv-phone .sapMBtnContent { line-height: 50px; font-size: 1rem; font-weight: 700; }
  .od-cv { display: none !important; }
  .od-main { order: 1; }
  .od-aside { order: 2; flex: 1 1 100%; }
  .od-seg-half { width: 100%; }
}
/* Detalle: especificidad sobre los estilos base de FlexBox de UI5. */
.hm-page .od-bar.sapMFlexBox { display: flex; width: 100%; }
.hm-page .od-bar.sapMFlexBox > .sapMFlexItem { flex: 1 1 0 !important; min-width: 0; }
.hm-page .od-bar-step.sapMFlexBox { display: block; width: 100%; height: 6px; border-radius: 999px; background: #E1E5F2; }
.hm-page .od-bar-step.sapMFlexBox[data-on="yes"] { background: #2F3FD6; }
.hm-page .od-seg.sapMFlexBox { display: flex; width: 100%; box-sizing: border-box; padding: 3px; border-radius: 10px; background: #E9ECF6; }
.hm-page .od-seg.sapMFlexBox > .sapMFlexItem { flex: 1 1 0 !important; min-width: 0; }
.hm-page .od-seg-half.sapMFlexBox { width: 60%; }
@media (max-width: 600px) {
  .hm-page .od-seg-half.sapMFlexBox { width: 100%; }
  .hm-page .od-cv-phone.sapMBtn { width: 100%; }
}

/* ==========================================================================
   Seguimientos v2 (2026-09-30): agenda por urgencia. Clases `fu-*` + atributos data-*.
   ========================================================================== */
.fu-stage { gap: 1.25rem; max-width: 1120px; }
.fu-head { gap: 1rem; }
.fu-summary.sapMText[data-pending="yes"] { color: #B42318; font-weight: 600; }
.hm-page .fu-search.sapMSF { width: 20rem; }
.hm-page .fu-undo.sapMFlexBox {
  gap: 1rem;
  padding: .75rem 1rem;
  border-radius: 12px;
  background: #141A3A;
}
.fu-undo-text.sapMText { color: #FFFFFF; font-size: .92rem; }
.hm-page .fu-undo-btn .sapMBtnContent { color: #A9B4FF; font-weight: 700; }
.fu-groups { gap: 1.5rem; }
.fu-group { gap: .6rem; }
.fu-group-label.sapMText { font-size: .8rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #5A6184; }
.fu-group-label.sapMText[data-group="overdue"] { color: #B42318; }
.fu-group-label.sapMText[data-group="today"] { color: #1F2BA8; }
.fu-items { gap: .6rem; }
.hm-page .fu-card.sapMFlexBox { gap: 1.25rem; padding: 1rem 1.25rem; }
.hm-page .fu-card.sapMFlexBox[data-group="overdue"] { border: 1.5px solid #F4C7C3; }
.hm-page .fu-card.sapMFlexBox[data-group="today"] { border: 1.5px solid #CBD2FA; }
.fu-date { flex: 0 0 60px; width: 60px; height: 64px; border-radius: 12px; background: #F0F2F8; }
.fu-date-day.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.4rem; font-weight: 700; line-height: 1; color: #3C4366; }
.fu-date-month.sapMText { font-size: .75rem; font-weight: 700; color: #5A6184; }
.fu-card[data-group="overdue"] .fu-date { background: #FDE2E0; }
.fu-card[data-group="overdue"] .fu-date .sapMText { color: #B42318; }
.fu-card[data-group="today"] .fu-date { background: #E6E9FB; }
.fu-card[data-group="today"] .fu-date .sapMText { color: #1F2BA8; }
.fu-main { flex: 1 1 320px; min-width: 0; gap: .25rem; }
.fu-title-row { gap: .6rem; }
.fu-note.sapMText { font-size: .9rem; color: #3C4366; }
.fu-actions { flex: 0 0 auto; gap: .5rem; }
/* Lo no urgente: "Hecho" como botón secundario. */
.hm-page .fu-card[data-urgent="no"] .fu-done .sapMBtnInner { background: #FFFFFF !important; border: 1.5px solid #C9CEE6 !important; }
.hm-page .fu-card[data-urgent="no"] .fu-done .sapMBtnContent { color: #141A3A !important; }
.hm-page .fu-link-btn .sapMBtnContent { color: #2F3FD6; font-weight: 600; }
@media (max-width: 600px) {
  .hm-page .fu-search.sapMSF { width: 100%; }
  .fu-head > .sapMFlexItem { flex: 1 1 100%; }
  .hm-page .fu-card.sapMFlexBox { gap: .75rem; padding: .9rem; align-items: flex-start !important; }
  .fu-date { flex-basis: 50px; width: 50px; height: 54px; }
  .fu-main { flex: 1 1 200px; }
  .fu-actions { flex: 1 1 100%; }
  .fu-actions > .sapMFlexItem { flex: 1 1 0; }
  .hm-page .fu-actions .sapMBtn,
  .hm-page .fu-actions .sapMBtnInner { width: 100%; }
  /* Tarjetas no urgentes: compactas en teléfono (acciones desde el detalle). */
  .fu-card[data-urgent="no"] .fu-actions { display: none !important; }
}
.hm-page .fu-date.sapMFlexBox { background: #F0F2F8; }
.hm-page .fu-card[data-group="overdue"] .fu-date.sapMFlexBox { background: #FDE2E0; }
.hm-page .fu-card[data-group="today"] .fu-date.sapMFlexBox { background: #E6E9FB; }
.hm-page .fu-link-btn.sapMBtn { align-self: center; }
@media (max-width: 600px) {
  .hm-page .fu-head .fu-search.sapMSF { width: 100% !important; flex: 1 1 100%; }
}

/* ==========================================================================
   Palabras clave v2 (2026-09-30): solo presentación (misma lógica de Terms.controller.js).
   Clases `kw-*` + atributos data-* (reutiliza `hm-*`, `of-*` y `fu-*`).
   ========================================================================== */
.kw-stage { gap: 1.25rem; max-width: 1120px; }
.kw-head { gap: 1rem; }
.kw-intro.sapMText { max-width: 40rem; }
.kw-head-actions { gap: .6rem; }
.hm-page .kw-icon-btn.sapMBtn { height: auto !important; padding: 0 !important; }
.hm-page .kw-icon-btn .sapMBtnInner { height: 42px !important; width: 42px; border-radius: 10px; background: #FFFFFF; border: 1.5px solid #C9CEE6; }
.hm-page .kw-icon-btn .sapMBtnIcon { line-height: 39px; }
.hm-page .kw-icon-btn .sapMBtnIcon { color: #3C4366; }
.kw-bar { gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #E1E5F2; }
.kw-active { gap: .2rem; }
.kw-active-value.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.35rem; font-weight: 700; color: #141A3A; }
.kw-tools { gap: .9rem; }
.hm-page .kw-search.sapMSF { width: 16rem; }

/* Lista: cada término es una tarjeta (sin el fondo/bordes de sap.m.List) */
.hm-page .kw-list .sapMListUl,
.hm-page .kw-list .sapMListItems { background: transparent; }
.hm-page .kw-list .sapMLIB.kw-item {
  padding: 0 0 .6rem;
  background: transparent;
  border: 0;
}
.hm-page .kw-list .sapMLIB.kw-item:focus { outline: none; }
.hm-page .kw-list .sapMLIB.kw-item:focus-visible > .sapMLIBContent { outline: 2px solid rgba(47, 63, 214, .5); border-radius: 16px; }
.hm-page .kw-list .sapMListNoData { padding: 1.5rem; border-radius: 16px; background: #FFFFFF; border: 1px solid #E1E5F2; color: #5A6184; }
.kw-item .sapMCLI, .hm-page .kw-item.sapMCLI { width: 100%; }
.hm-page .kw-card.sapMFlexBox { width: 100%; box-sizing: border-box; gap: 1.25rem; padding: 1rem 1.25rem; }
.hm-page .kw-card.sapMFlexBox[data-enabled="yes"] { border: 1.5px solid #CBD2FA; }
.kw-main { flex: 1 1 320px; min-width: 0; gap: .25rem; }
.kw-title-row { gap: .6rem; }
.kw-term.sapMText { font-size: 1.05rem; font-weight: 700; color: #141A3A; }
.kw-eff { flex: 0 0 8rem; gap: .2rem; }
.kw-actions { flex: 0 0 auto; gap: .75rem; }
.hm-page .kw-del .sapMBtnContent { color: #5A6184; font-weight: 600; }
.hm-page .kw-del .sapMBtnInner.sapMBtnHoverable:hover .sapMBtnContent { color: #B42318; }
.hm-page .hm-score.sapMObjStatusError .sapMObjStatusWrapper { background: #FDE2E0; }
.hm-page .hm-score.sapMObjStatusError .sapMObjStatusText { color: #B42318; }

@media (max-width: 600px) {
  .kw-head > .sapMFlexItem,
  .kw-bar > .sapMFlexItem,
  .kw-tools > .sapMFlexItem { flex: 1 1 100%; }
  /* Fila 1: Añadir + recargar; fila 2: Cargar sugeridos a todo el ancho. */
  .kw-head-actions > .sapMFlexItem:nth-child(1) { flex: 1 1 auto !important; order: 1 !important; }
  .kw-head-actions > .sapMFlexItem:nth-child(3) { order: 2 !important; }
  .kw-head-actions > .sapMFlexItem:nth-child(2) { flex: 1 1 100% !important; order: 3 !important; }
  .kw-tools > .sapMFlexItem:nth-child(2),
  .kw-tools > .sapMFlexItem:nth-child(3) { flex: 1 1 40%; min-width: 0; }
  .hm-page .kw-head-actions .hm-btn-primary.sapMBtn,
  .hm-page .kw-head-actions .hm-btn-outline.sapMBtn,
  .hm-page .kw-head-actions .hm-btn-primary .sapMBtnInner,
  .hm-page .kw-head-actions .hm-btn-outline .sapMBtnInner { width: 100%; }
  .hm-page .kw-search.sapMSF,
  .hm-page .kw-tools .sapMSlt { width: 100% !important; }
  .hm-page .kw-card.sapMFlexBox { gap: .75rem; padding: .9rem; }
  .kw-main { flex: 1 1 100%; }
  .kw-eff { flex: 1 1 auto; }
}

/* ==========================================================================
   Mi CV Maestro v2 (2026-09-30): solo presentación. Armoniza el baseline `pp-*`
   con el sistema `hm-*` (fondo, tipografía, colores, tarjetas) sin modificarlo:
   todo va acotado a `.pv-page`.
   ========================================================================== */
.pv-page .pp-shell {
  --pp-surface: #FFFFFF;
  --pp-text-main: #141A3A;
  --pp-text-body: #3C4366;
  --pp-text-secondary: #5A6184;
  --pp-text-muted: #5A6184;
  --pp-border: #E1E5F2;
  --pp-accent: #2F3FD6;
  box-sizing: border-box;
  max-width: 1120px;
  padding: 2.25rem clamp(1rem, 3.5vw, 3rem) 2.5rem;
}
.pv-head { margin-bottom: 1.5rem; }
/* Mi CV Maestro: acciones sobre el CV (editar, asistente, CV tipo, importar) */
.pv-head-row { gap: 1rem; }
.pv-actions { gap: .5rem; }
.pv-empty.sapMFlexBox { gap: .6rem; border: 1.5px solid #CBD2FA; }
.pv-page .pp-empty { margin: 0; }

/* Tarjetas: mismo borde, radio y sin sombra que el resto de la app */
.pv-page .pp-hero,
.pv-page .pp-employment,
.pv-page .pp-skillsPanel,
.pv-page .pp-infoPanel,
.pv-page .pp-achievementsPanel { border-radius: 16px; box-shadow: none; }
.pv-page .pp-hero { padding: 1.75rem 2rem; border: 1.5px solid #CBD2FA; }
.pv-page .pp-name.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.75rem !important; letter-spacing: -.02em; color: #141A3A; }
.pv-page .pp-meta.sapMText { color: #5A6184; }

/* Encabezados de sección */
.pv-page .pp-section { margin-top: 2.25rem; }
.pv-page .pp-sectionTitle.sapMTitle {
  font-family: Sora, Figtree, sans-serif;
  font-size: 1.25rem !important;
  letter-spacing: -.01em;
  color: #141A3A;
}
.pv-page .pp-sectionSubtitle.sapMText { margin-bottom: .9rem; color: #5A6184; }
.pv-page .pp-infoPanel,
.pv-page .pp-achievementsPanel { margin-top: 0; }
/* Educación + Credenciales lado a lado: 57% + 41% + gap no cabe con el padding de esta página. */
@media (min-width: 951px) {
  .pv-page .pp-lower.sapMFlexBox { flex-wrap: nowrap !important; }
}

/* Experiencia */
.pv-page .pp-employment { margin-bottom: 1rem; padding: 1.5rem 1.75rem; }
.pv-page .pp-empCompany.sapMText { font-size: 1.2rem !important; color: #141A3A; }
.pv-page .pp-empPeriod.sapMText {
  padding: .3rem .7rem;
  border-radius: 999px;
  background: #F0F2F8;
  font-size: .82rem;
  font-weight: 700;
  color: #3C4366;
}
.pv-page .pp-engContext.sapMText { color: #5A6184; }
.pv-page .pp-workMarker.sapMText,
.pv-page .pp-achievementMarker.sapMText { color: #2F3FD6; }

/* Competencias: chips como las etiquetas del Home */
.pv-page .pp-skillChip.sapMText {
  padding: .35rem .65rem;
  border: 0;
  background: #E6E9FB;
  color: #1F2BA8;
  font-size: .8rem;
  font-weight: 600;
}
.pv-page .pp-skillChipHidden.sapMText { background: #F0F2F8; color: #5A6184; }
.pv-page .pp-skillCategory,
.pv-page .pp-infoRow { border-bottom-color: #EEF0F7; }
.pv-page .pp-infoYear.sapMText { color: #3C4366; }

/* Elementos ocultos (Panel plegable) como tarjeta */
.pv-page .pp-hidden.sapMPanel {
  margin-top: 2.25rem;
  border: 1px solid #E1E5F2;
  border-radius: 16px;
  overflow: hidden;
  background: #FFFFFF;
}
.pv-page .pp-hidden .sapMPanelWrappingDiv,
.pv-page .pp-hidden .sapMPanelHdr { background: #FFFFFF; border-bottom: 0; }
.pv-page .pp-hidden .sapMPanelHdr { font-weight: 600; color: #3C4366; }
.pv-page .pp-hidden .sapMPanelContent { background: #FFFFFF; border-top: 1px solid #EEF0F7; }

@media (max-width: 800px) {
  .pv-page .pp-shell { padding: 1.25rem 1rem 3.5rem; }
  .pv-page .pp-hero { padding: 1.25rem 1.1rem; }
  .pv-page .pp-name.sapMText { font-size: 1.45rem !important; }
  .pv-page .pp-employment { padding: 1.2rem 1.05rem; }
  .pv-page .pp-empPeriod.sapMText { display: inline-block; margin-top: .5rem; }
}

/* ==========================================================================
   CV tipo v2 (2026-09-30): vista previa + versiones. Clases `tc-*`
   (reutiliza `hm-*`, `of-*` y `fu-*`).
   ========================================================================== */
.tc-stage { gap: 1.5rem; }
.tc-head { gap: 1rem; }
.tc-intro.sapMText { max-width: 44rem; }
.hm-page .tc-locale .sapMSegBBtn { font-weight: 600; }
.tc-body { gap: 1.75rem; }
.tc-main { flex: 1 1 560px; min-width: 0; }
.tc-aside { flex: 0 1 340px; min-width: 280px; gap: 1rem; }
.hm-page .tc-preview.sapMFlexBox { padding: .75rem; gap: .5rem; }
.tc-frame {
  display: block;
  width: 100%;
  height: min(1120px, 78vh);
  border: 0;
  border-radius: 10px;
  background: #FFFFFF;
}
.tc-side-card { gap: .6rem; }
.tc-label-current.sapMText { color: #1F2BA8; }
.tc-date.sapMText { font-size: 1rem; }
.hm-page .tc-btn.sapMBtn,
.hm-page .tc-btn .sapMBtnInner { width: 100%; }
.hm-page .tc-btn .sapMBtnIcon { color: inherit; }
.hm-page .hm-btn-primary.tc-btn .sapMBtnIcon { color: #FFFFFF; }
.hm-page .tc-profile-link.sapMLnk { align-self: flex-start; }

@media (max-width: 600px) {
  .tc-head > .sapMFlexItem,
  .tc-main,
  .tc-aside { flex: 1 1 100% !important; min-width: 0; }
  /* En teléfono las acciones van primero y la vista previa debajo. */
  .tc-body > .sapMFlexItem:nth-child(2) { order: 1 !important; }
  .tc-body > .sapMFlexItem:nth-child(1) { order: 2 !important; }
  .tc-frame { height: 70vh; }
}

/* ==========================================================================
   Asistente del perfil e Importar CV v2 (2026-10-01): solo presentación (mismos
   controladores). Clases `as-*` / `ig-*` (reutiliza `hm-*`, `of-*` y `fu-*`).
   ========================================================================== */
.as-stage,
.ig-stage { gap: 1.5rem; max-width: 1120px; }
.as-head,
.ig-head { gap: 1rem; }
.as-intro.sapMText,
.ig-intro.sapMText { max-width: 42rem; }
.as-body,
.ig-body { gap: 1.75rem; }
.as-main,
.ig-main { flex: 1 1 560px; min-width: 0; gap: 1rem; }
.as-aside,
.ig-aside { flex: 0 1 340px; min-width: 280px; gap: 1rem; }

/* Listas como tarjetas internas (sin fondo/bordes de sap.m.List) */
.hm-page .as-ops .sapMListUl,
.hm-page .as-examples .sapMListUl,
.hm-page .ig-jobs .sapMListUl { background: transparent; }
.hm-page .as-ops .sapMLIB,
.hm-page .as-examples .sapMLIB,
.hm-page .ig-jobs .sapMLIB { padding: 0; background: transparent; border: 0; }
.hm-page .as-ops .sapMLIB:focus,
.hm-page .as-examples .sapMLIB:focus,
.hm-page .ig-jobs .sapMLIB:focus { outline: none; }
.hm-page .as-ops .sapMListNoData,
.hm-page .ig-jobs .sapMListNoData { padding: .75rem 0; background: transparent; border: 0; color: #5A6184; }

/* Asistente: petición */
.hm-page .as-label.sapMLabel,
.hm-page .ig-uploader .sapMLabel { font-size: .8rem; font-weight: 600; color: #5A6184; }
.hm-page .as-input .sapMInputBaseContentWrapper {
  border: 1.5px solid #D5DAEC;
  border-radius: 12px;
  background: #FFFFFF;
}
.hm-page .as-input.sapMFocus .sapMInputBaseContentWrapper { border-color: #2F3FD6; }
.hm-page .as-input .sapMTextAreaInner { padding: .75rem .9rem; font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: .95rem; line-height: 1.5; color: #141A3A; }

/* Asistente: orientación y propuesta */
.as-proposal.sapMFlexBox { border: 1.5px solid #CBD2FA; }
.as-label-proposal.sapMText { color: #1F2BA8; }
.as-summary.sapMText { font-weight: 600; line-height: 1.45; }
.as-suggestions { gap: .5rem; }
.hm-page .as-suggestion .sapMBtnContent { white-space: normal; }
.hm-page .as-warning.sapMFlexBox { padding: .7rem .9rem; border-radius: 12px; background: #FDEBD3; }
.as-warning-text.sapMText { font-size: .9rem; line-height: 1.45; color: #8A4B00; }
.as-op { gap: .45rem; padding: .9rem 1rem; margin-bottom: .6rem; border-radius: 12px; background: #F7F8FC; border: 1px solid #E1E5F2; }
.as-op-head { gap: .5rem; }
.as-op-kind.sapMText { background: #E6E9FB; color: #1F2BA8; }
.as-diff { gap: .15rem; padding: .5rem .7rem; border-radius: 8px; background: #FFFFFF; border-left: 3px solid #C9CEE6; }
.as-diff-after { border-left-color: #2F3FD6; }
.as-diff-label.sapMText { font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #5A6184; }
.as-diff-text.sapMText { font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important; font-size: .82rem; line-height: 1.45; color: #3C4366; word-break: break-word; }

/* Asistente: ejemplos */
.as-example { gap: .3rem; padding: .85rem 0; border-top: 1px solid #EEF0F7; }
.as-example-prompt.sapMText { font-size: .9rem; font-style: italic; color: #3C4366; }
.hm-page .as-example .hm-link-sm.sapMLnk { align-self: flex-start; }

/* Importar CV: subida */
.ig-upload-row { gap: 1rem; }
.ig-upload-icon.sapUiIcon { font-size: 1.6rem; color: #2F3FD6; width: 52px; height: 52px; line-height: 52px; border-radius: 14px; background: #E6E9FB; }
.ig-upload-text { gap: .15rem; min-width: 0; }
.hm-page .ig-uploader .sapMInputBaseContentWrapper { height: 40px; border: 1.5px dashed #C9CEE6; border-radius: 10px; background: #F7F8FC; }
.hm-page .ig-uploader .sapMInputBaseInner { height: 100%; }
/* El contenedor del FileUploader tiene alto fijo de UI5: se ajusta al campo de 40px para no montarse sobre la acción. */
.hm-page .ig-uploader.sapUiFup { height: auto; min-height: 40px; }
.hm-page .ig-uploader .sapMBtn { height: 40px; padding: 0; margin-left: .5rem; }
.hm-page .ig-uploader .sapMBtnInner { height: 40px; padding: 0 1rem; }
.hm-page .ig-uploader .sapMBtnContent { line-height: 37px; }
.hm-page .ig-uploader .sapMInputBaseInner { font-family: Figtree, -apple-system, "Segoe UI", sans-serif; color: #3C4366; }
.hm-page .ig-uploader .sapMBtnInner { border-radius: 10px; border: 1.5px solid #C9CEE6; background: #FFFFFF; }
.hm-page .ig-uploader .sapMBtnContent { font-weight: 600; color: #141A3A; }

/* Importar CV: propuesta */
.ig-proposal.sapMFlexBox { border: 1.5px solid #CBD2FA; }
.ig-label-proposal.sapMText { color: #1F2BA8; }
.ig-name.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.25rem; }
/* 6 contadores en cuadrícula de 3 columnas (2 filas parejas en escritorio y teléfono). */
.ig-stats.sapMFlexBox { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin-bottom: .4rem; }
.ig-stat { gap: .1rem; padding: .7rem .9rem; border-radius: 12px; background: #F7F8FC; border: 1px solid #E1E5F2; }
.ig-stat-value.sapMText { font-family: Sora, Figtree, sans-serif !important; font-size: 1.4rem; font-weight: 700; color: #141A3A; }
.ig-job { gap: .15rem; padding: .65rem 0; border-top: 1px solid #EEF0F7; }
.ig-actions { margin-top: .5rem; }

/* Importar CV: zona de arrastre, análisis y pegado */
.ig-drop.sapMFlexBox { gap: .9rem; border: 1.5px dashed #C9CEE6; transition: border-color .15s, background .15s; }
.ig-drop.ig-drop-over.sapMFlexBox { border-color: #2F3FD6; background: #F1F3FE; }
.ig-paste.sapMFlexBox,
.ig-proposal.sapMFlexBox { gap: .75rem; }
.ig-analyzing.sapMFlexBox { gap: 1rem; border: 1.5px solid #CBD2FA; }

/* Importar CV: avisos y alternativas */
.ig-warn { gap: .35rem; padding: .7rem .9rem; border-radius: 12px; background: #FDEBD3; }
.ig-warn-text.sapMText { font-size: .9rem; line-height: 1.45; color: #8A4B00; }
.ig-warn-replace { background: #FBE3E1; }
.ig-warn-replace .ig-warn-text.sapMText { color: #8E1F14; }
.ig-alt { gap: .5rem; padding: .8rem .9rem; border-radius: 12px; background: #F1F3FE; border: 1px solid #CBD2FA; }
.ig-alt-actions { gap: .5rem; }
.ig-section-head { margin-top: .6rem; }

/* Importar CV: empleos editables (naranjo = pendiente, rojo = bloquea aplicar) */
.ig-emp { gap: .35rem; padding: .7rem .8rem; margin-bottom: .5rem; border-radius: 12px; background: #F7F8FC; border: 1px solid #E1E5F2; border-left: 4px solid #3BB273; }
.ig-emp[data-issues="pending"] { border-left-color: #F0A030; background: #FFF8EE; }
.ig-emp[data-issues="blocked"] { border-left-color: #D9442F; background: #FFF4F2; }
.ig-emp-text { gap: .1rem; min-width: 0; flex: 1 1 auto; }
.ig-emp-issues.sapMText { font-size: .82rem; font-weight: 600; color: #A15C00; }
.ig-emp[data-issues="blocked"] .ig-emp-issues.sapMText { color: #B3261E; }
.ig-emp-actions { flex: 0 0 auto; }
.ig-emp-form { gap: .6rem; padding-top: .4rem; }
.ig-field { flex: 1 1 220px; min-width: 0; gap: .2rem; }
.ig-field-date { flex: 1 1 140px; }
/* Importar CV: contenido del empleo (descripción, proyectos y tareas) */
.ig-emp-body { gap: .6rem; padding-top: .4rem; }
.ig-field-wide { flex: 1 1 100%; }
.ig-sub-label.sapMText { margin-top: .3rem; font-size: .78rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #5A6184; }
.ig-projects { gap: .5rem; }
.ig-project { gap: .35rem; padding: .6rem .7rem; border-radius: 10px; background: #FFFFFF; border: 1px solid #E1E5F2; }
.ig-project-head { gap: .4rem; }
.ig-project-head .ig-field { flex: 1 1 auto; }
.ig-tasks { gap: .25rem; padding-left: .2rem; }
.ig-task { gap: .35rem; }
.ig-task-dot.sapMText { padding-top: .55rem; color: #2F3FD6; font-weight: 700; }
.hm-page .ig-add-task.sapMBtn { align-self: flex-start; }
/* Importar CV: estudios, certificaciones, idiomas y logros (filas editables en línea) */
.ig-sec { gap: .25rem; padding: .55rem .7rem; }
.ig-sec .ig-emp-form { padding-top: 0; }
.hm-page .ig-sec-del.sapMBtn { flex: 0 0 auto; align-self: flex-end; }

/* Importar CV: habilidades como chips que se pueden quitar */
.ig-chips.sapMFlexBox { gap: .4rem; }
.ig-chip { gap: .1rem; padding: 0 .1rem 0 .7rem; border-radius: 999px; background: #E6E9FB; }
.ig-chip-text.sapMText { font-size: .85rem; font-weight: 600; color: #1F2BA8; }
.hm-page .ig-chip-x.sapMBtn { height: 28px; min-width: 28px; }
.hm-page .ig-chip-x .sapMBtnInner { height: 28px; min-width: 28px; }
.hm-page .ig-chip-x .sapUiIcon { font-size: .7rem; color: #1F2BA8; }
.ig-extra { gap: .5rem; padding: .35rem 0; border-top: 1px solid #EEF0F7; }
.ig-extra-text { gap: .5rem; min-width: 0; flex-wrap: wrap; }

/* Onboarding: nombre en el paso CV y resumen de palabras clave */
.ob-name-card.sapMFlexBox { gap: .4rem; }
.ob-name-card .hm-side-meta.sapMText { margin-top: .35rem; }
.ob-terms-summary.sapMFlexBox { gap: .7rem; border: 1.5px solid #CBD2FA; }
/* Onboarding: vista previa del CV cargado (Mi CV Maestro incrustada, con scroll propio) */
.ob-preview-card.sapMFlexBox { gap: 1rem; border: 1.5px solid #CBD2FA; }
.ob-preview-head { gap: .8rem; }
.ob-preview-actions { gap: .5rem; }
.ob-preview { max-height: 70vh; overflow-y: auto; padding: .25rem .5rem; border-radius: 12px; background: #FFFFFF; border: 1px solid #E1E5F2; }
.ob-host .pv-head { display: none !important; }
.ob-host .pp-shell { padding: 0; max-width: none; }

/* Importar CV: pasos */
.ig-step { gap: .7rem; }
.ig-step-num.sapMText {
  display: block;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 999px;
  text-align: center !important;
  font-size: .78rem;
  font-weight: 700;
  color: #1F2BA8;
  background: #E6E9FB;
}

/* Incrustadas en el onboarding: sin fondo propio, sin márgenes de página ni encabezado
   (el onboarding ya muestra el título del flujo y su botón para volver). */
.onb-cv-host .as-page.sapMPage,
.onb-cv-host .as-page .sapMPageContent,
.onb-cv-host .ig-page.sapMPage,
.onb-cv-host .ig-page .sapMPageContent { background: transparent; }
.onb-cv-host .as-stage,
.onb-cv-host .ig-stage { padding: 0; max-width: none; }
.onb-cv-host .as-head,
.onb-cv-host .ig-head,
.onb-cv-host .as-stage > .sapMFlexItem:has(> .as-head),
.onb-cv-host .ig-stage > .sapMFlexItem:has(> .ig-head) { display: none !important; }

@media (max-width: 600px) {
  .as-head > .sapMFlexItem,
  .ig-head > .sapMFlexItem,
  .as-main,
  .ig-main,
  .as-aside,
  .ig-aside { flex: 1 1 100% !important; min-width: 0; }
  .hm-page .as-proposal .hm-card-actions .hm-btn-primary,
  .hm-page .as-proposal .hm-card-actions .hm-btn-outline,
  .hm-page .ig-actions .hm-btn-primary,
  .hm-page .ig-actions .hm-btn-outline { flex: 1 1 0; }
  .ig-stat { padding: .55rem .6rem; }
  .ig-stat-value.sapMText { font-size: 1.15rem; }
}

/* ==========================================================================
   Onboarding v2 (2026-10-01): 4 pasos en una sola vista. Clases `ob-*`
   (reutiliza `hm-*`, `fu-*` e `ig-*`). Estado del indicador vía [data-state].
   ========================================================================== */
.ob-stage { gap: 1.5rem; max-width: 1120px; }
.ob-section { gap: 1.25rem; }
.ob-body { gap: 1.75rem; }
.ob-main { flex: 1 1 520px; min-width: 0; gap: .9rem; }

/* Indicador de pasos */
.ob-progress { gap: .6rem; }
.ob-steps { gap: .5rem; flex-wrap: wrap; }
.hm-page .ob-step-pill.sapMFlexBox {
  gap: .5rem;
  padding: .45rem .9rem .45rem .45rem;
  border-radius: 999px;
  background: #FFFFFF;
  border: 1px solid #E1E5F2;
}
.ob-step-num.sapMText {
  display: block;
  width: 26px;
  height: 26px;
  line-height: 26px;
  border-radius: 999px;
  text-align: center !important;
  font-size: .8rem;
  font-weight: 700;
  color: #5A6184;
  background: #F0F2F8;
}
.ob-step-title.sapMText { font-size: .88rem; font-weight: 600; color: #5A6184; }
.hm-page .ob-step-pill[data-state="current"] { border: 1.5px solid #2F3FD6; }
.ob-step-pill[data-state="current"] .ob-step-num.sapMText { color: #FFFFFF; background: #2F3FD6; }
.ob-step-pill[data-state="current"] .ob-step-title.sapMText { color: #141A3A; }
.ob-step-pill[data-state="done"] .ob-step-num.sapMText { color: #0B6B3A; background: #DDF5E7; }
.ob-step-pill[data-state="done"] .ob-step-title.sapMText { color: #3C4366; }

/* Bienvenida */
.hm-page .ob-label.sapMLabel { font-size: .8rem; font-weight: 600; color: #5A6184; }
.hm-page .ob-input .sapMInputBaseContentWrapper { height: 44px; border: 1.5px solid #D5DAEC; border-radius: 10px; background: #FFFFFF; }
.hm-page .ob-input.sapMFocus .sapMInputBaseContentWrapper { border-color: #2F3FD6; }
.hm-page .ob-input .sapMInputBaseInner { height: 100%; font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: 1rem; color: #141A3A; }
.hm-page .ob-check .sapMCbLabel { font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: .92rem; color: #3C4366; white-space: normal; }
.hm-page .ob-note.sapMFlexBox { padding: .7rem .9rem; border-radius: 12px; background: #F4F6FB; }
.hm-page .ob-check.sapMCb { margin-top: .2rem; }

/* Tu CV */
.ob-choices { gap: 1rem; }
.ob-choice { flex: 1 1 300px; min-width: 0; }
.ob-choice-main.sapMFlexBox { border: 1.5px solid #CBD2FA; }
.ob-choice-tag.sapMText { align-self: flex-start; background: #E6E9FB; color: #1F2BA8; }
.hm-page .ob-choice .hm-btn-primary,
.hm-page .ob-choice .hm-btn-outline { align-self: flex-start; margin-top: .3rem; }
.hm-page .ob-cv-status.sapMFlexBox { gap: .8rem; padding: .9rem 1.2rem; border: 1.5px solid #BFE6CF; background: #F3FBF6; }
.ob-ok-icon.sapUiIcon { font-size: 1.2rem; color: #0B6B3A; }
.ob-flow { gap: .9rem; }

/* Vistas incrustadas: sin fondo ni márgenes de página. En Palabras clave el título lo pone el paso. */
.ob-host .hm-page.sapMPage,
.ob-host .hm-page .sapMPageContent { background: transparent; }
.ob-host .hm-stage { padding: 0; max-width: none; }
.ob-host .kw-head .hm-hero-text,
.ob-host .kw-head > .sapMFlexItem:has(> .hm-hero-text) { display: none !important; }
/* En el onboarding aún no hay datos de eficiencia: se ocultan Ventana/orden/búsqueda y la columna Eficiencia. */
.ob-host .kw-tools,
.ob-host .kw-eff { display: none !important; }

/* Primera búsqueda */
.hm-page .ob-running.sapMFlexBox { gap: 1rem; }
.ob-running-text { gap: .2rem; min-width: 0; }
.ob-result.sapMFlexBox { border: 1.5px solid #CBD2FA; }
.ob-result-title.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.25rem; }
.hm-page .ob-offers .sapMListUl { background: transparent; }
.hm-page .ob-offers .sapMLIB { padding: 0; background: transparent; border: 0; }
.ob-error.sapMFlexBox { border: 1.5px solid #F4C7C3; }
.hm-page .ob-retry.sapMBtn { align-self: flex-start; }

/* Navegación entre pasos */
.ob-footer { gap: .6rem; padding-top: 1.25rem; border-top: 1px solid #E1E5F2; }
.ob-block.sapMText { padding: .6rem .9rem; border-radius: 10px; background: #FDEBD3; color: #8A4B00; font-size: .9rem; }
.hm-page .ob-primary .sapMBtnInner { min-width: 10rem; }

@media (max-width: 600px) {
  .ob-step-title.sapMText { display: none; }
  .ob-step-pill[data-state="current"] .ob-step-title.sapMText { display: inline; }
  .hm-page .ob-step-pill.sapMFlexBox { padding: .3rem; }
  .hm-page .ob-step-pill[data-state="current"].sapMFlexBox { padding: .3rem .8rem .3rem .3rem; }
  .ob-main,
  .ob-choice { flex: 1 1 100% !important; }
  .ob-body > .sapMFlexItem { flex: 1 1 100% !important; min-width: 0; }
  .hm-page .ob-actions .ob-primary.sapMBtn { flex: 1 1 auto; }
  .hm-page .ob-actions .ob-primary .sapMBtnInner { width: 100%; min-width: 0; }
}

/* ==========================================================================
   Menú del avatar v2 (2026-10-01): quién eres + accesos. Clases `me-*`.
   ========================================================================== */
.me-panel .sapMPopoverCont { padding: 0; }
.me-menu { padding: .5rem; font-family: Figtree, -apple-system, "Segoe UI", sans-serif; }
.me-who { gap: .75rem; padding: .75rem .75rem 1rem; border-bottom: 1px solid #E1E5F2; }
.me-who-avatar.sapMText {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 999px;
  text-align: center !important;
  font-family: Sora, Figtree, sans-serif;
  font-weight: 700;
  color: #1F2BA8;
  background: #E6E9FB;
}
.me-who-text { gap: .1rem; min-width: 0; }
.me-who-name.sapMText { font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: .98rem; font-weight: 700; color: #141A3A; }
.me-who-email.sapMText { font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: .85rem; color: #5A6184; word-break: break-all; }
.me-links { padding-top: .4rem; }
.me-link.sapMBtn { width: 100%; height: auto; padding: 0; }
.me-link .sapMBtnInner {
  justify-content: flex-start;
  width: 100%;
  height: 42px;
  padding: 0 .75rem;
  border: 0 !important;
  border-radius: 10px;
  background: transparent !important;
  box-shadow: none;
}
.me-link .sapMBtnInner.sapMBtnHoverable:hover { background: #F4F6FB !important; }
.me-link .sapMBtnContent { font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: .93rem; font-weight: 600; color: #141A3A; text-align: left; }
.me-link .sapMBtnIcon { color: #5A6184; }
.me-link-out .sapMBtnContent,
.me-link-out .sapMBtnIcon { color: #B42318; }
.me-link .sapMBtnInner { display: flex; align-items: center; gap: .6rem; text-align: left; }
.me-link .sapMBtnInner > .sapMBtnIcon { margin: 0; }
.me-link .sapMBtnContent { flex: 1 1 auto; }
/* Sin el anillo de foco de UI5 al abrir el menú; solo con teclado. */
.me-link.sapMBtn:focus,
.me-link .sapMBtnInner:focus { outline: none; }
.me-link.sapMBtn:focus > .sapMBtnInner::before,
.me-link.sapMBtn:focus > .sapMBtnInner::after { display: none !important; }
.me-link.sapMBtn:focus > .sapMBtnInner { outline: none; border: 0 !important; }
.me-link.sapMBtn:focus-visible > .sapMBtnInner { outline: 2px solid rgba(47, 63, 214, .5); }

/* ==========================================================================
   Mi cuenta (2026-10-01). Clases `ac-*` (reutiliza `hm-*`, `of-*`, `fu-*`).
   ========================================================================== */
.ac-stage { gap: 1.5rem; max-width: 1120px; }
.ac-body { gap: 1.75rem; }
.ac-main { flex: 1 1 560px; min-width: 0; gap: 1rem; }
.ac-aside { flex: 0 1 340px; min-width: 280px; gap: 1rem; }
.ac-card { gap: .9rem; }
.ac-row { gap: 1rem; }
.ac-field { flex: 1 1 220px; min-width: 0; }
.hm-page .ac-input .sapMInputBaseContentWrapper { height: 42px; border: 1.5px solid #D5DAEC; border-radius: 10px; background: #FFFFFF; }
.hm-page .ac-input.sapMFocus .sapMInputBaseContentWrapper { border-color: #2F3FD6; }
.hm-page .ac-input .sapMInputBaseInner { height: 100%; font-family: Figtree, -apple-system, "Segoe UI", sans-serif; font-size: .95rem; color: #141A3A; }
.hm-page .ac-field .hm-link-sm.sapMLnk { align-self: flex-start; }
.hm-page .ac-pref.sapMFlexBox { gap: 1rem; padding: .9rem 1rem; border-radius: 12px; background: #F4F6FB; }
.ac-pref-text { gap: .2rem; min-width: 0; }
.ac-hint.sapMText[data-warn="yes"] { color: #8A4B00; font-weight: 600; }
.ac-item { gap: .3rem; padding: .9rem 0; border-top: 1px solid #EEF0F7; }
.ac-item:first-of-type { border-top: 0; padding-top: 0; }
.hm-page .ac-item .hm-link-sm.sapMLnk { align-self: flex-start; }
.hm-page .ac-delete .sapMBtnContent { color: #B42318; }
.hm-page .ac-delete.sapMBtn { align-self: flex-start; }
.ac-plan { gap: .55rem; }
.ac-plan-name.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.5rem; font-weight: 700; color: #141A3A; }
.ac-quota.sapMText { padding: .5rem .7rem; border-radius: 10px; background: #F4F6FB; }
.ac-sub.sapMText { margin-top: .4rem; }
.ac-services { gap: .35rem; }
.ac-service { gap: .5rem; }
.ac-service-ok.sapUiIcon { font-size: .9rem; color: #0B6B3A; }

@media (max-width: 600px) {
  .hm-page .ac-pref.sapMFlexBox { align-items: flex-start !important; }
  .ac-pref-text { flex: 1 1 auto; }
  .ac-main,
  .ac-aside,
  .ac-field { flex: 1 1 100% !important; min-width: 0; }
}

/* ==========================================================================
   Documento legal (política de datos) en diálogo. Clases `lg-*`.
   ========================================================================== */
.lg-dialog .sapMDialogScrollCont { padding: 0 !important; }
.lg-doc {
  box-sizing: border-box;
  padding: 1.25rem 1.75rem 2rem;
  font-family: Figtree, -apple-system, "Segoe UI", sans-serif;
  font-size: .95rem;
  line-height: 1.6;
  color: #3C4366;
}
.lg-doc .lg-version { margin: 0 0 .5rem; font-size: .82rem; font-weight: 600; color: #5A6184; }
.lg-doc h2 { margin: .25rem 0 .75rem; font-family: Sora, Figtree, sans-serif; font-size: 1.35rem; line-height: 1.25; color: #141A3A; }
.lg-doc h3 { margin: 1.6rem 0 .5rem; font-family: Sora, Figtree, sans-serif; font-size: 1.05rem; color: #141A3A; }
.lg-doc h4 { margin: 1.2rem 0 .4rem; font-size: .98rem; color: #141A3A; }
.lg-doc p { margin: 0 0 .75rem; }
.lg-doc ul,
.lg-doc ol { margin: 0 0 .75rem; padding-left: 1.25rem; }
.lg-doc li { margin-bottom: .3rem; }
.lg-doc strong { color: #141A3A; }
.lg-doc table { width: 100%; margin: .25rem 0 1rem; border-collapse: collapse; font-size: .88rem; }
.lg-doc th,
.lg-doc td { padding: .5rem .6rem; border: 1px solid #E1E5F2; text-align: left; vertical-align: top; }
.lg-doc th { background: #F4F6FB; color: #141A3A; font-weight: 700; }
@media (max-width: 600px) {
  .lg-doc { padding: 1rem; font-size: .92rem; }
  .lg-doc table { display: block; overflow-x: auto; }
}

/* ==========================================================================
   Detalle de oferta: ciclo de la postulación (2026-10-02). Clases `od-*`.
   Estado + botonera, plazo de revisión, contacto por etapas e historial.
   ========================================================================== */
.od-flow, .od-contact { gap: .8rem; }
.hm-page .od-actions.sapMFlexBox { display: flex; gap: .5rem; width: 100%; }
.hm-page .od-actions.sapMFlexBox > .sapMFlexItem { flex: 1 1 0 !important; min-width: 0; }
.hm-page .od-act.sapMBtn,
.hm-page .od-act .sapMBtnInner { width: 100%; }
.hm-page .od-act .sapMBtnContent { overflow: hidden; text-overflow: ellipsis; }
.hm-page .od-actions.sapMFlexBox > .sapMFlexItem:has(.od-act-main) { flex: 1.4 1 0 !important; }
.hm-page .od-act-discard .sapMBtnContent { color: #B42318; }
.hm-page .od-act-full.sapMBtn,
.hm-page .od-act-full .sapMBtnInner { width: 100%; }
.hm-page .od-restore.sapMBtn, .hm-page .od-restore .sapMBtnInner { width: 100%; }

/* Motivo al finalizar */
.od-finish { gap: .55rem; padding: .8rem; border-radius: 12px; background: #F4F6FB; }
.od-reasons { gap: .4rem; }
.hm-page .od-reason.sapMBtn { width: 100%; height: auto !important; padding: 0 !important; }
.hm-page .od-reason .sapMBtnInner {
  width: 100%; height: 40px !important; padding: 0 .9rem !important; border-radius: 10px;
  background: #FFFFFF; border: 1.5px solid #DDE1F0; box-shadow: none; text-align: left;
}
.hm-page .od-reason .sapMBtnInner.sapMBtnHoverable:hover { border-color: #2F3FD6; background: #F7F8FF; }
.hm-page .od-reason .sapMBtnContent { line-height: 40px; font-size: .88rem; font-weight: 600; color: #141A3A; }

/* Plazo de revisión */
.od-deadline { gap: .5rem; padding: .8rem .9rem; border-radius: 12px; background: #EEF8F2; border: 1px solid #CDEBD8; }
.od-deadline[data-tone="warn"] { background: #FFF6EA; border-color: #F6D7AE; }
.od-deadline[data-tone="bad"] { background: #FDEEEC; border-color: #F5C6C0; }
.od-deadline-text.sapMText { font-size: .9rem; font-weight: 700; color: #0B6B3A; }
.od-deadline[data-tone="warn"] .od-deadline-text.sapMText { color: #8A4B00; }
.od-deadline[data-tone="bad"] .od-deadline-text.sapMText { color: #B42318; }
.hm-page .od-deadline .sapMLabel { font-size: .75rem; font-weight: 600; color: #5A6184; }
.od-overdue { gap: .55rem; }
.od-overdue-text.sapMText { font-size: .88rem; color: #3C4366; }

/* Contacto por etapas */
.od-contact-now.sapMText { font-size: .78rem; font-weight: 700; color: #2F3FD6; }
.od-steps { gap: 0; position: relative; }
.hm-page .od-step.sapMBtn { width: 100%; height: auto !important; padding: 0 !important; }
.hm-page .od-step .sapMBtnInner {
  position: relative; width: 100%; height: 40px !important; padding: 0 .5rem 0 2.1rem !important;
  border: 0; border-radius: 10px; background: transparent; box-shadow: none; text-align: left;
}
.hm-page .od-step .sapMBtnInner.sapMBtnHoverable:hover { background: #F4F6FB; }
.hm-page .od-step .sapMBtnContent { line-height: 40px; font-size: .88rem; font-weight: 500; color: #5A6184; }
/* Punto del paso + línea que los une */
.hm-page .od-step .sapMBtnInner::before {
  content: ''; position: absolute; left: .75rem; top: 50%; width: 12px; height: 12px; margin-top: -6px;
  border-radius: 50%; background: #FFFFFF; border: 2px solid #C9CEE6; box-sizing: border-box; z-index: 1;
}
.hm-page .od-step .sapMBtnInner::after {
  content: ''; position: absolute; left: calc(.75rem + 5px); top: 50%; width: 2px; height: 40px; background: #E1E5F2;
}
.hm-page .od-steps > .sapMFlexItem:last-child .od-step .sapMBtnInner::after { display: none; }
.hm-page .od-step[data-state="done"] .sapMBtnInner::before { background: #2F3FD6; border-color: #2F3FD6; }
.hm-page .od-step[data-state="done"] .sapMBtnInner::after { background: #2F3FD6; }
.hm-page .od-step[data-state="done"] .sapMBtnContent { color: #3C4366; }
.hm-page .od-step[data-state="current"] .sapMBtnInner { background: #EEF0FF; }
.hm-page .od-step[data-state="current"] .sapMBtnInner::before {
  width: 16px; height: 16px; margin-top: -8px; left: calc(.75rem - 2px);
  background: #2F3FD6; border: 3px solid #C7CCFA;
}
.hm-page .od-step[data-state="current"] .sapMBtnContent { color: #141A3A; font-weight: 700; }

/* Historial */
.od-history { gap: .8rem; }
.od-timeline { gap: 0; }
.od-tl-item { gap: .75rem; position: relative; padding-bottom: .9rem; }
.od-timeline > .sapMFlexItem:last-child .od-tl-item { padding-bottom: 0; }
.od-tl-item::before {
  content: ''; position: absolute; left: 5px; top: 14px; bottom: 0; width: 2px; background: #E1E5F2;
}
.od-timeline > .sapMFlexItem:last-child .od-tl-item::before { display: none; }
.hm-page .od-tl-dot.sapMFlexBox {
  display: block; flex: 0 0 12px; width: 12px; height: 12px; margin-top: 4px; border-radius: 50%;
  background: #8E96C2; position: relative; z-index: 1;
}
.od-tl-item[data-tone="good"] .od-tl-dot { background: #12A150 !important; }
.od-tl-item[data-tone="warn"] .od-tl-dot { background: #E08A00 !important; }
.od-tl-item[data-tone="info"] .od-tl-dot { background: #2F3FD6 !important; }
.od-tl-item[data-tone="none"] .od-tl-dot { background: #A9AFCB !important; }
.od-tl-text { gap: .1rem; min-width: 0; }
.od-tl-title.sapMText { font-size: .92rem; font-weight: 600; color: #141A3A; }

/* Mis ofertas: marca "Nueva" y plazo de la postulación (2026-10-02) */
.of-new.sapMText {
  align-self: flex-start; padding: .1rem .5rem; border-radius: 999px; background: #E6E9FF;
  font-size: .7rem; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #2F3FD6;
}
.of-deadline.sapMText[data-tone="good"] { color: #0B6B3A; }
.of-deadline.sapMText[data-tone="warn"] { color: #8A4B00; }
.of-deadline.sapMText[data-tone="bad"] { color: #B42318; }
.of-deadline.sapMText[data-tone="none"] { font-weight: 500; color: #5A6184; }
/* Pasos de contacto y motivos: texto alineado a la izquierda */
.hm-page .od-step .sapMBtnInner,
.hm-page .od-reason .sapMBtnInner { display: flex; align-items: center; justify-content: flex-start; }
.hm-page .od-step .sapMBtnContent,
.hm-page .od-reason .sapMBtnContent { width: 100%; text-align: left; }
.od-deadline-base.sapMText { font-size: .78rem; color: #5A6184; margin-top: -.25rem; }
.od-deadline[data-tone="none"] { background: #F4F6FB; border-color: #DDE1F0; }
.od-deadline[data-tone="none"] .od-deadline-text.sapMText { color: #3C4366; }
/* El paso de contacto conserva su estilo mientras se presiona */
.hm-page .od-step .sapMBtnInner.sapMBtnActive { background: #EEF0FF !important; }
.hm-page .od-step .sapMBtnInner.sapMBtnActive .sapMBtnContent { color: #141A3A; }

/* Mi CV Maestro: respuestas frecuentes (postulación asistida F1, 2026-10-02). Clases `pv-ans-*`. */
.ob-host .pv-answers { display: none !important; }
.pv-ans-head { gap: .75rem; margin-bottom: .75rem; }
.pv-ans-headText { gap: .2rem; flex: 1 1 420px; min-width: 0; }
.pv-ans-summary.sapMText { font-size: .82rem; font-weight: 700; color: #2F3FD6; }
.pv-ans-list { gap: .6rem; }
.pv-ans-row { gap: .4rem; padding: .85rem 1rem; border-radius: 12px; background: #FFFFFF; border: 1px solid #E1E5F2; border-left: 4px solid #E1E5F2; }
.pv-ans-row[data-filled="yes"] { border-left-color: #12A150; }
.pv-ans-top { gap: .5rem; }
.pv-ans-q.sapMText { font-size: .92rem; font-weight: 700; color: #141A3A; }
.hm-page .pv-ans-qinput.sapMInputBase { flex: 1 1 auto; max-width: 100%; }
.pv-ans-tools { gap: .1rem; flex-shrink: 0; }
.hm-page .pv-ans-tool .sapMBtnIcon { color: #5A6184; }
.hm-page .pv-ans-text.sapMTextArea { width: 100%; }
.hm-page .pv-ans-suggest.sapMLnk { align-self: flex-start; font-size: .8rem; }
.hm-page .pv-ans-add.sapMBtn { align-self: flex-start; margin-top: .75rem; }
/* La pregunta (texto o campo) ocupa el ancho disponible; las herramientas quedan a la derecha */
.hm-page .pv-ans-top.sapMFlexBox > .sapMFlexItem:first-child,
.hm-page .pv-ans-top.sapMFlexBox > .sapMFlexItem:nth-child(2):not(:last-child) { flex: 1 1 auto !important; min-width: 0; }

/* Detalle de oferta: paquete para postular (postulación asistida F2, 2026-10-02). Clases `od-kit-*`. */
.od-kit { gap: 1.1rem; border: 1.5px solid #CBD2FA; }
.od-kit-head { gap: .75rem; }
.od-kit-headText { gap: .25rem; min-width: 0; }
.od-kit-step { gap: .9rem; padding-top: 1rem; border-top: 1px solid #EEF0F7; }
.od-kit-num.sapMText {
  flex: 0 0 28px; width: 28px; height: 28px; line-height: 28px; text-align: center; border-radius: 50%;
  background: #EEF0FF; color: #2F3FD6; font-weight: 700; font-size: .85rem;
}
.hm-page .od-kit-step.sapMFlexBox > .sapMFlexItem:last-child { flex: 1 1 auto !important; min-width: 0; }
.od-kit-body { gap: .55rem; min-width: 0; }
.od-kit-title.sapMText { font-size: .98rem; font-weight: 700; color: #141A3A; }
.od-kit-sub.sapMText { font-size: .8rem; font-weight: 700; color: #5A6184; text-transform: uppercase; letter-spacing: .03em; margin-top: .4rem; }
.od-kit-options { gap: 1rem; }
.od-kit-option { gap: .3rem; min-width: 200px; }
.hm-page .od-kit-option .sapMLabel { font-size: .75rem; font-weight: 600; color: #5A6184; }
.od-kit-generate, .od-kit-actions { gap: .75rem; }
.hm-page .od-kit-btn.sapMBtn { align-self: flex-start; }
.od-kit-note.sapMText { padding: .6rem .8rem; border-radius: 10px; background: #FFF6EA; color: #8A4B00; font-size: .85rem; }
.hm-page .od-kit-letter.sapMTextArea textarea { font-size: .92rem; line-height: 1.6; }
.od-kit-answers { gap: .6rem; }
.od-kit-answer { gap: .3rem; }
.od-kit-q.sapMText { font-size: .88rem; font-weight: 700; color: #3C4366; }
.od-kit-bank { gap: .5rem; padding: .55rem .75rem; border-radius: 10px; background: #F4F6FB; }
.hm-page .od-kit-bank.sapMFlexBox > .sapMFlexItem:first-child { flex: 1 1 auto !important; min-width: 0; }
.od-kit-bankText { gap: .1rem; min-width: 0; }
.od-kit-done.sapMText { font-size: .88rem; font-weight: 700; color: #0B6B3A; }
.hm-page .od-prepare .sapMBtnIcon { color: inherit; }
.hm-page .od-kit-num.sapMText { display: inline-flex !important; align-items: center; justify-content: center; padding: 0; line-height: 1; }

/* ==========================================================================
   Tu búsqueda en números (2026-10-02). Clases `st-*`. Una serie en azul de marca
   (#2F3FD6, validado contra blanco); barras ≤ 24 px, extremo redondeado de 4 px.
   ========================================================================== */
.st-stage { gap: 1.25rem; }
.st-head { gap: 1rem; }
.hm-page .st-window.sapMFlexBox { width: auto; min-width: 280px; }
.st-content { gap: 1.25rem; }
.st-kpi-value.sapMText { font-family: Sora, Figtree, sans-serif; font-size: 1.9rem; font-weight: 700; line-height: 1.15; color: #141A3A; }
.hm-page .st-cta.sapMBtn { align-self: flex-start; margin-top: .5rem; }
.st-tips { gap: .6rem; border: 1.5px solid #CBD2FA; }
.st-tip-list { gap: .5rem; }
.st-tip { gap: .6rem; }
.hm-page .st-tip-icon.sapUiIcon { color: #2F3FD6; font-size: 1rem; margin-top: .15rem; }
.st-tip-text.sapMText { font-size: .92rem; color: #3C4366; line-height: 1.5; }
.st-grid { gap: 1.25rem; }
.hm-page .st-grid.sapMFlexBox > .sapMFlexItem { flex: 1 1 420px !important; min-width: 0; }
.st-card, .st-card-wide { gap: .75rem; }

/* Embudo: barras horizontales */
.st-funnel { display: flex; flex-direction: column; gap: .7rem; margin-top: .35rem; }
.st-fn-row { display: grid; grid-template-columns: minmax(120px, 38%) 1fr; align-items: center; gap: .75rem; padding: .15rem 0; cursor: default; }
.st-fn-label { font-size: .85rem; color: #3C4366; }
.st-fn-track { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.st-fn-bar { display: block; height: 20px; border-radius: 0 4px 4px 0; background: #2F3FD6; }
.st-fn-value { font-size: .82rem; font-weight: 700; color: #141A3A; white-space: nowrap; }
.st-fn-row:hover .st-fn-bar { background: #1F2BA8; }

/* Actividad: columnas por semana */
.st-weeks { display: flex; align-items: flex-end; gap: 8px; height: 170px; margin-top: .5rem; padding-bottom: .25rem; border-bottom: 1px solid #E1E5F2; }
.st-wk-col { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: .35rem; height: 100%; min-width: 0; cursor: default; }
.st-wk-plot { flex: 1 1 auto; width: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: .2rem; }
.st-wk-bar { display: block; width: min(24px, 70%); border-radius: 4px 4px 0 0; background: #2F3FD6; opacity: .55; }
.st-wk-current .st-wk-bar { opacity: 1; }
.st-wk-col:hover .st-wk-bar { opacity: 1; }
.st-wk-value { font-size: .78rem; font-weight: 700; color: #141A3A; }
.st-wk-label { font-size: .68rem; color: #5A6184; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

/* Tablas */
.st-tr { gap: .5rem; padding: .45rem 0; border-bottom: 1px solid #EEF0F7; }
.st-th .st-td.sapMText { font-size: .72rem; font-weight: 700; color: #5A6184; text-transform: uppercase; letter-spacing: .03em; }
.hm-page .st-tr.sapMFlexBox > .sapMFlexItem { flex: 1 1 0 !important; min-width: 0; }
.hm-page .st-tr.sapMFlexBox > .sapMFlexItem:first-child { flex: 2.2 1 0 !important; }
.st-td.sapMText { font-size: .88rem; color: #141A3A; font-variant-numeric: tabular-nums; }
.st-reasons { gap: .3rem; }
.st-reason-label.sapMText { font-size: .9rem; color: #3C4366; }
.st-reason-value.sapMText { font-size: .9rem; font-weight: 700; color: #141A3A; }

@media (max-width: 600px) {
  .hm-page .st-window.sapMFlexBox { width: 100%; min-width: 0; }
  .st-fn-row { grid-template-columns: 1fr; gap: .25rem; }
  .st-th .st-td.sapMText { font-size: .62rem; }
  .st-td.sapMText { font-size: .8rem; }
  .st-wk-label { font-size: .6rem; }
}
/* Cifras principales: 2×2 en teléfono, el número nunca se parte */
.st-kpi-value.sapMText { white-space: nowrap; }
@media (max-width: 600px) {
  .hm-page .st-kpis.sapMFlexBox, .hm-page .st-kit.sapMFlexBox { display: grid !important; grid-template-columns: 1fr 1fr; gap: .6rem; }
  .hm-page .st-kpis.sapMFlexBox > .sapMFlexItem, .hm-page .st-kit.sapMFlexBox > .sapMFlexItem { min-width: 0; }
  .st-kpi-value.sapMText { font-size: 1.5rem; }
}

/* ===== Calculadora de sueldo (2026-10-15) ===== */
.sc-card { margin-top: 1rem; }
.sc-row { gap: .75rem 1.25rem; margin-top: .75rem; }
/* Los selectores no se encogen: cada campo ocupa lo que necesita y la fila salta de línea. */
.sc-row > .sapMFlexItem { flex: 0 0 auto; }
.sc-field { min-width: 9rem; gap: .25rem; }
.sc-field .sapMSegB { width: auto !important; }
.sc-field .sapMSegB .sapMSegBBtn { width: auto !important; }
.sc-field-amount { min-width: 14rem; }
.sc-field-small { max-width: 9rem; }
.sc-table tr[data-strong="yes"] .sapMText { font-weight: 700; color: #141A3A; }
/* Un monto nunca se parte en dos líneas («$» arriba y la cifra abajo). */
.sc-amount.sapMText { white-space: nowrap; }
.sc-notes { margin-top: 1rem; gap: .35rem; }
@media (max-width: 600px) {
  .sc-field, .sc-field-amount, .sc-field-small { flex: 1 1 100%; max-width: none; min-width: 0; }
}

/* ===== «¿Sabías que?» (2026-10-15) ===== */
.hm-tip-actions { margin-top: .5rem; gap: .75rem; }
.dyk-strip.sapMMsgStrip { border-radius: 8px; }

/* ===== Mis ofertas: filtros de fecha y orden (2026-10-16) ===== */
.of-presets { gap: .35rem; }
.of-applied.sapMText { font-size: .82rem; }