/**

 * Sinlio Cuenta ? portal cliente aplicaci?n (PORTAL-CLIENTE-001).

 * Tipograf?a: Inter (stack local/sistema). Sin Google Fonts ni CDN.

 * Marker: SINLIO_PORTAL_CLIENTE_001_APP_CSS

 */



*,

*::before,

*::after { box-sizing: border-box; }



html.sinlio-portal-html {

  scrollbar-gutter: stable;

}



html.sinlio-portal-html,

body.sinlio-portal {

  margin: 0;

  width: 100%;

  max-width: 100%;

  min-height: 100%;

}



.sinlio-portal {

  /* Brand + warm accent (HF01 premium) */

  --sinlio-brand: #5FABAC;

  --sinlio-brand-strong: #356F70;

  --sinlio-brand-deep: #173F40;

  --sinlio-brand-soft: #E7F3F2;

  --sinlio-ink: #173536;

  --sinlio-text: #344445;

  --sinlio-muted: #687879;

  --sinlio-border: #DCE7E5;

  --sinlio-background: #F2F6F5;

  --sinlio-surface: #FFFFFF;

  --sinlio-success: #2F6B54;

  --sinlio-warning: #9A6B2F;

  --sinlio-danger: #A94442;

  --sinlio-info: #3F6971;

  --sinlio-accent: #D87455;

  --sinlio-accent-soft: #FBECE6;

  --sinlio-accent-strong: #B65338;

  --sinlio-accent-urgent: var(--sinlio-accent);

  --sinlio-radius-control: 10px;

  --sinlio-radius-card: 16px;

  --sinlio-space-1: 4px;

  --sinlio-space-2: 8px;

  --sinlio-space-3: 12px;

  --sinlio-space-4: 16px;

  --sinlio-space-5: 24px;

  --sinlio-space-6: 32px;

  --sinlio-space-7: 48px;

  --sinlio-content-max: 1200px;

  --sinlio-header-h: 64px;

  --sinlio-mobile-nav-h: 68px;

  --sinlio-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --sinlio-shadow: 0 1px 0 rgba(23, 53, 54, 0.05);

  --sinlio-focus: 0 0 0 3px rgba(95, 171, 172, 0.38);

  --sinlio-transition: 150ms ease;



  /* Compat aliases used by page templates */

  --sinlio-canvas: var(--sinlio-background);

  --sinlio-front-max-width: var(--sinlio-content-max);

  --sinlio-front-gutter: 32px;

  --sinlio-front-radius: var(--sinlio-radius-control);

  --sinlio-front-focus: var(--sinlio-focus);

  --sinlio-front-bg: var(--sinlio-background);

  --sinlio-front-surface: var(--sinlio-surface);

  --sinlio-front-border: var(--sinlio-border);

  --sinlio-front-text: var(--sinlio-text);

  --sinlio-front-muted: var(--sinlio-muted);

  --sinlio-brand-dark: var(--sinlio-brand-strong);



  color: var(--sinlio-text);

  background: var(--sinlio-background);

  font-family: var(--sinlio-font);

  font-size: 15.5px;

  line-height: 1.55;

  -webkit-font-smoothing: antialiased;

}



.sinlio-portal a { color: var(--sinlio-brand-strong); text-decoration: none; }

.sinlio-portal a:hover { text-decoration: underline; }

.sinlio-portal :focus-visible {

  outline: none;

  box-shadow: var(--sinlio-focus);

}



.sinlio-portal__skip {

  position: absolute;

  left: -9999px;

  top: 0;

  z-index: 100;

  padding: 8px 12px;

  background: var(--sinlio-brand-strong);

  color: #fff;

}

.sinlio-portal__skip:focus { left: 12px; top: 12px; }



/* ?? App shell ?? */

.sinlio-app {

  min-height: 100vh;

  display: flex;

  flex-direction: column;

  padding-bottom: 0;

}



.sinlio-app__header {

  position: sticky;

  top: 0;

  z-index: 40;

  background: var(--sinlio-surface);

  border-bottom: 1px solid var(--sinlio-border);

}



.sinlio-app__header-inner {

  max-width: var(--sinlio-content-max);

  margin: 0 auto;

  padding: 0 var(--sinlio-space-5);

  min-height: var(--sinlio-header-h);

  display: flex;

  align-items: center;

  gap: var(--sinlio-space-4);

}



.sinlio-app__brand {

  display: inline-flex;

  align-items: center;

  flex: 0 0 auto;

  text-decoration: none;

}

.sinlio-app__logo { display: block; height: 28px; width: auto; }

.sinlio-app__brand-text {

  font-weight: 600;

  color: var(--sinlio-ink);

  font-size: 18px;

}



.sinlio-app__studio {

  margin: 0;

  max-width: 180px;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  font-size: 13px;

  color: var(--sinlio-muted);

  border-left: 1px solid var(--sinlio-border);

  padding-left: var(--sinlio-space-4);

}



.sinlio-app__nav {

  display: none;

  flex: 1 1 auto;

  align-items: center;

  justify-content: center;

  gap: 4px;

}



.sinlio-app__nav-link {

  padding: 8px 12px;

  border-radius: 999px;

  color: var(--sinlio-text) !important;

  font-size: 14px;

  font-weight: 500;

  text-decoration: none !important;

  transition: background var(--sinlio-transition), color var(--sinlio-transition);

}

.sinlio-app__nav-link:hover { background: var(--sinlio-brand-soft); }

.sinlio-app__nav-link.is-active {

  background: var(--sinlio-brand-soft);

  color: var(--sinlio-brand-strong) !important;

  font-weight: 600;

}



.sinlio-app__header-actions {

  margin-left: auto;

  display: flex;

  align-items: center;

  gap: var(--sinlio-space-3);

}



.sinlio-app__help {

  font-size: 14px;

  font-weight: 500;

  color: var(--sinlio-muted) !important;

  text-decoration: none !important;

}

.sinlio-app__help:hover { color: var(--sinlio-brand-strong) !important; }



.sinlio-app__user { position: relative; }

.sinlio-app__user-toggle {

  list-style: none;

  cursor: pointer;

  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding: 4px 8px 4px 4px;

  border-radius: 999px;

  border: 1px solid var(--sinlio-border);

  background: var(--sinlio-surface);

}

.sinlio-app__user-toggle::-webkit-details-marker { display: none; }

.sinlio-app__avatar {

  width: 32px;

  height: 32px;

  border-radius: 50%;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  background: var(--sinlio-brand-soft);

  color: var(--sinlio-brand-strong);

  font-size: 12px;

  font-weight: 600;

}

.sinlio-app__user-name {

  font-size: 14px;

  font-weight: 500;

  color: var(--sinlio-ink);

  max-width: 120px;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}

.sinlio-app__user-menu {

  position: absolute;

  right: 0;

  top: calc(100% + 6px);

  min-width: 220px;

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-card);

  box-shadow: var(--sinlio-shadow);

  padding: 6px;

  z-index: 50;

}

.sinlio-app__user-menu a,

.sinlio-app__logout button {

  display: block;

  width: 100%;

  text-align: left;

  padding: 10px 12px;

  border: 0;

  background: transparent;

  border-radius: 8px;

  color: var(--sinlio-text);

  font: inherit;

  font-size: 14px;

  cursor: pointer;

  text-decoration: none !important;

}

.sinlio-app__user-menu a:hover,

.sinlio-app__logout button:hover,

.sinlio-app__user-menu a.is-active { background: var(--sinlio-brand-soft); }

.sinlio-app__logout { margin: 4px 0 0; padding: 0; border-top: 1px solid var(--sinlio-border); }



.sinlio-app__main {

  flex: 1 1 auto;

  padding: var(--sinlio-space-5) var(--sinlio-space-5) var(--sinlio-space-7);

}

.sinlio-app__content {

  max-width: var(--sinlio-content-max);

  margin: 0 auto;

}

.sinlio-app__crumbs {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  margin-bottom: var(--sinlio-space-4);

  font-size: 13px;

  color: var(--sinlio-muted);

}

.sinlio-app__crumbs-sep { opacity: 0.5; }



.sinlio-app__pagehead {

  display: flex;

  flex-wrap: wrap;

  align-items: flex-start;

  justify-content: space-between;

  gap: var(--sinlio-space-4);

  margin-bottom: var(--sinlio-space-5);

}

.sinlio-app__title,

.sinlio-portal__title {

  margin: 0 0 6px;

  font-size: 30px;

  line-height: 1.2;

  font-weight: 600;

  color: var(--sinlio-ink);

  letter-spacing: -0.02em;

}

.sinlio-app__lead,

.sinlio-portal__lead {

  margin: 0;

  max-width: 42rem;

  color: var(--sinlio-muted);

  font-size: 15px;

}

.sinlio-portal__eyebrow { display: none; }



/* Buttons */

.sinlio-btn,

.sinlio-portal__btn {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  min-height: 40px;

  padding: 8px 16px;

  border-radius: var(--sinlio-radius-control);

  border: 1px solid transparent;

  font: inherit;

  font-size: 14px;

  font-weight: 600;

  cursor: pointer;

  text-decoration: none !important;

  transition: background var(--sinlio-transition), border-color var(--sinlio-transition), color var(--sinlio-transition);

}

.sinlio-btn--primary,

.sinlio-portal__btn--primary,

.sinlio-portal__btn {

  background: var(--sinlio-brand);

  color: #fff !important;

  border-color: var(--sinlio-brand);

}

.sinlio-btn--primary:hover,

.sinlio-portal__btn--primary:hover,

.sinlio-portal__btn:hover { background: var(--sinlio-brand-strong); border-color: var(--sinlio-brand-strong); }

.sinlio-btn--secondary,

.sinlio-portal__btn--secondary {

  background: var(--sinlio-surface);

  color: var(--sinlio-ink) !important;

  border-color: var(--sinlio-border);

}

.sinlio-btn--secondary:hover,

.sinlio-portal__btn--secondary:hover { background: var(--sinlio-brand-soft); }

.sinlio-btn--text,

.sinlio-portal__btn--text {

  background: transparent;

  color: var(--sinlio-brand-strong) !important;

  border-color: transparent;

  min-height: auto;

  padding: 4px 0;

  font-weight: 500;

}

.sinlio-btn--danger {

  background: var(--sinlio-danger);

  color: #fff !important;

}

.sinlio-portal__btn--brand {

  background: var(--sinlio-brand-strong);

  color: #fff !important;

}



/* Cards / panels */

.sinlio-card,

.sinlio-portal__panel,

.sinlio-portal__card-block {

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-card);

  padding: var(--sinlio-space-5);

  margin-bottom: var(--sinlio-space-4);

  box-shadow: var(--sinlio-shadow);

}

.sinlio-card--status { border-left: 4px solid var(--sinlio-brand); }

.sinlio-card--status.is-warning { border-left-color: var(--sinlio-warning); }

.sinlio-card--status.is-danger { border-left-color: var(--sinlio-danger); }

.sinlio-card--status.is-success { border-left-color: var(--sinlio-success); }

.sinlio-card--status.is-info { border-left-color: var(--sinlio-info); }

.sinlio-card--status.is-brand { border-left-color: var(--sinlio-brand); }



.sinlio-portal__h2,

.sinlio-section-title {

  margin: 0 0 var(--sinlio-space-3);

  font-size: 18px;

  font-weight: 600;

  color: var(--sinlio-ink);

}



.sinlio-badge,

.sinlio-portal__status {

  display: inline-flex;

  align-items: center;

  padding: 2px 10px;

  border-radius: 999px;

  background: var(--sinlio-brand-soft);

  color: var(--sinlio-brand-strong);

  font-size: 13px;

  font-weight: 500;

}



.sinlio-notice,

.sinlio-portal__msg,

.sinlio-portal__notice {

  padding: 12px 14px;

  border-radius: var(--sinlio-radius-control);

  border: 1px solid var(--sinlio-border);

  background: var(--sinlio-brand-soft);

  color: var(--sinlio-ink);

  margin-bottom: var(--sinlio-space-4);

}

.sinlio-notice--error,

.sinlio-portal__msg--error,

.sinlio-portal__notice--error,

.sinlio-portal__notice--err {

  background: #fbf0ef;

  border-color: #efd0ce;

  color: var(--sinlio-danger);

}

.sinlio-notice--ok,

.sinlio-portal__notice--ok { background: #edf7f2; border-color: #c9e5d8; }



.sinlio-empty,

.sinlio-portal__empty,

.sinlio-portal__empty-state {

  padding: var(--sinlio-space-5);

  text-align: center;

  color: var(--sinlio-muted);

}



.sinlio-muted,

.sinlio-portal__muted,

.sinlio-portal__hint { color: var(--sinlio-muted); font-size: 14px; }

.sinlio-portal__num { font-variant-numeric: tabular-nums; font-weight: 600; }



.sinlio-grid-2 {

  display: grid;

  gap: var(--sinlio-space-4);

  grid-template-columns: 1fr;

}

@media (min-width: 768px) {

  .sinlio-grid-2 { grid-template-columns: 1fr 1fr; }

}



.sinlio-service-card {

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-card);

  padding: var(--sinlio-space-4);

  background: var(--sinlio-surface);

}

.sinlio-service-card h3 { margin: 0 0 4px; font-size: 16px; }

.sinlio-service-card__funcs {

  margin: 10px 0 0;

  font-size: 13px;

  color: var(--sinlio-muted);

}



.sinlio-row,

.sinlio-payment-row,

.sinlio-doc-row {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 8px 16px;

  padding: 12px 0;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-row:last-child,

.sinlio-payment-row:last-child,

.sinlio-doc-row:last-child { border-bottom: 0; }



.sinlio-portal__facts {

  display: grid;

  gap: 12px;

  margin: 0;

}

.sinlio-portal__fact {

  display: grid;

  gap: 2px;

}

.sinlio-portal__fact dt {

  margin: 0;

  font-size: 13px;

  color: var(--sinlio-muted);

}

.sinlio-portal__fact dd {

  margin: 0;

  font-size: 15px;

  font-weight: 500;

  color: var(--sinlio-ink);

}



.sinlio-portal__table-wrap { overflow-x: auto; }

.sinlio-portal__table {

  width: 100%;

  border-collapse: collapse;

  font-size: 14px;

}

.sinlio-portal__table th,

.sinlio-portal__table td {

  text-align: left;

  padding: 10px 8px;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal__table th { color: var(--sinlio-muted); font-weight: 500; }



.sinlio-portal__dl {

  display: grid;

  grid-template-columns: minmax(120px, 180px) 1fr;

  gap: 8px 16px;

  margin: 0;

}

.sinlio-portal__dl dt { color: var(--sinlio-muted); margin: 0; }

.sinlio-portal__dl dd { margin: 0; }



.sinlio-portal__actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

  margin: var(--sinlio-space-4) 0;

}

.sinlio-portal__actions--tight { margin-top: var(--sinlio-space-3); }



.sinlio-portal__filters {

  display: flex;

  flex-wrap: wrap;

  gap: 12px;

  margin-bottom: var(--sinlio-space-4);

}

.sinlio-portal__filters label {

  display: grid;

  gap: 4px;

  font-size: 13px;

  color: var(--sinlio-muted);

}

.sinlio-portal__filters select,

.sinlio-portal input[type="text"],

.sinlio-portal input[type="email"],

.sinlio-portal input[type="password"],

.sinlio-portal input[type="tel"],

.sinlio-portal textarea,

.sinlio-portal select {

  min-height: 40px;

  padding: 8px 12px;

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-control);

  background: var(--sinlio-surface);

  font: inherit;

  color: var(--sinlio-text);

  width: 100%;

  max-width: 100%;

}

.sinlio-portal textarea { min-height: 120px; resize: vertical; }



.sinlio-form-row {

  display: grid;

  gap: var(--sinlio-space-4);

  margin-bottom: var(--sinlio-space-4);

}

@media (min-width: 768px) {

  .sinlio-form-row--2 { grid-template-columns: 1fr 1fr; }

}



/* Support layout */

.sinlio-support {

  display: grid;

  gap: var(--sinlio-space-4);

}

@media (min-width: 1024px) {

  .sinlio-support--split {

    grid-template-columns: minmax(260px, 320px) 1fr;

    align-items: start;

  }

}

.sinlio-support__list {

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-card);

  background: var(--sinlio-surface);

  overflow: hidden;

}

.sinlio-support__item {

  display: block;

  padding: 12px 14px;

  border-bottom: 1px solid var(--sinlio-border);

  color: inherit !important;

  text-decoration: none !important;

}

.sinlio-support__item:hover,

.sinlio-support__item.is-active { background: var(--sinlio-brand-soft); }

.sinlio-support__item-title { font-weight: 600; color: var(--sinlio-ink); }

.sinlio-support__item-meta { font-size: 13px; color: var(--sinlio-muted); margin-top: 2px; }



/* Lightweight editor */

.sinlio-editor {

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-control);

  background: var(--sinlio-surface);

  overflow: hidden;

}

.sinlio-editor__toolbar {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  padding: 6px;

  border-bottom: 1px solid var(--sinlio-border);

  background: #fafcfc;

}

.sinlio-editor__toolbar button {

  min-width: 32px;

  min-height: 32px;

  border: 0;

  border-radius: 6px;

  background: transparent;

  cursor: pointer;

  font: inherit;

  font-size: 13px;

  font-weight: 600;

  color: var(--sinlio-ink);

}

.sinlio-editor__toolbar button:hover { background: var(--sinlio-brand-soft); }

.sinlio-editor__surface {

  min-height: 140px;

  padding: 12px;

  outline: none;

}

.sinlio-editor__fallback { border: 0; border-radius: 0; box-shadow: none; }



/* Mobile bottom nav */

.sinlio-app__mobile-nav {

  display: flex;

  position: fixed;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 45;

  background: var(--sinlio-surface);

  border-top: 1px solid var(--sinlio-border);

  padding: 4px 4px calc(4px + env(safe-area-inset-bottom, 0px));

  justify-content: space-around;

}

.sinlio-app__mobile-link {

  flex: 1 1 0;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 2px;

  min-height: 56px;

  padding: 4px;

  color: var(--sinlio-muted) !important;

  text-decoration: none !important;

  font-size: 12px;

  font-weight: 500;

  background: transparent;

  border: 0;

  list-style: none;

}

.sinlio-app__mobile-link::-webkit-details-marker { display: none; }

.sinlio-app__mobile-link.is-active,

.sinlio-app__mobile-more.is-active > summary {

  color: var(--sinlio-brand-strong) !important;

}

.sinlio-app__mobile-more { position: relative; flex: 1 1 0; }

.sinlio-app__mobile-more-panel {

  position: absolute;

  right: 4px;

  bottom: calc(100% + 8px);

  min-width: 200px;

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-card);

  padding: 6px;

  box-shadow: 0 -4px 20px rgba(23, 53, 54, 0.08);

}

.sinlio-app__mobile-more-panel a,

.sinlio-app__mobile-more-panel button {

  display: block;

  width: 100%;

  text-align: left;

  padding: 12px;

  border: 0;

  background: transparent;

  border-radius: 8px;

  font: inherit;

  font-size: 14px;

  color: var(--sinlio-text);

  cursor: pointer;

  text-decoration: none !important;

}

.sinlio-app__mobile-more-panel a:hover,

.sinlio-app__mobile-more-panel button:hover { background: var(--sinlio-brand-soft); }



@media (min-width: 1024px) {

  .sinlio-app__nav { display: flex; }

  .sinlio-app__mobile-nav { display: none; }

  .sinlio-app { padding-bottom: 0; }

}

@media (max-width: 1023px) {

  .sinlio-app { padding-bottom: calc(var(--sinlio-mobile-nav-h) + 8px); }

  .sinlio-app__user-name { display: none; }

  .sinlio-app__help { display: none; }

  .sinlio-app__studio { display: none; }

  .sinlio-app__title,

  .sinlio-portal__title { font-size: 26px; }

}



/* Auth / front access variant */

body.sinlio-front {

  margin: 0;

  min-height: 100vh;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 24px;

  background: var(--sinlio-background, #F4F7F6);

  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  color: #2D3A3A;

}

.sinlio-front__access-card,

.sinlio-front__msg {

  width: 100%;

  max-width: 420px;

  background: #fff;

  border: 1px solid #DDE7E6;

  border-radius: 14px;

  padding: 28px 24px;

  box-shadow: 0 1px 0 rgba(23, 53, 54, 0.04);

}

.sinlio-front__brand-logo { display: block; height: 32px; width: auto; margin: 0 auto 20px; }

.sinlio-front label { display: grid; gap: 6px; margin-bottom: 14px; font-size: 14px; font-weight: 500; }

.sinlio-front input[type="text"],

.sinlio-front input[type="email"],

.sinlio-front input[type="password"] {

  min-height: 42px;

  padding: 8px 12px;

  border: 1px solid #DDE7E6;

  border-radius: 9px;

  font: inherit;

}

.sinlio-front button[type="submit"],

.sinlio-front .sinlio-front__btn {

  width: 100%;

  min-height: 44px;

  border: 0;

  border-radius: 9px;

  background: #5FABAC;

  color: #fff;

  font: inherit;

  font-weight: 600;

  cursor: pointer;

}

.sinlio-front__error { color: #A94442; margin-bottom: 12px; font-size: 14px; }



/* SINLIO_PROSPECTOS_ONBOARDING_001: extensiones m�nimas del front de acceso

   para el alta/onboarding de prospectos, reutilizando la misma paleta y

   tipograf�a de .sinlio-front en vez de crear un estilo nuevo. */

.sinlio-front__access-card--wide { max-width: 560px; }

.sinlio-front select,

.sinlio-front textarea {

  min-height: 42px;

  padding: 8px 12px;

  border: 1px solid #DDE7E6;

  border-radius: 9px;

  font: inherit;

  width: 100%;

}

.sinlio-front__field-row {

  display: grid;

  gap: 12px;

  grid-template-columns: 1fr;

}

@media (min-width: 480px) {

  .sinlio-front__field-row { grid-template-columns: 1fr 1fr; }

}

.sinlio-front__check {

  display: flex;

  align-items: flex-start;

  gap: 8px;

  font-weight: 400;

}

.sinlio-front__check input[type="checkbox"] { margin-top: 3px; }

.sinlio-front__honeypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.sinlio-front__btn--secondary {

  background: #fff;

  color: #2D3A3A;

  border: 1px solid #DDE7E6;

  margin-bottom: 14px;

}

.sinlio-front__hint-ok { color: #2E7D5B; margin-bottom: 12px; font-size: 14px; }

.sinlio-front__steps { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; color: #6D7C7C; }

.sinlio-front__steps li.is-current { color: #2D3A3A; font-weight: 600; }

.sinlio-front__steps li.is-done { color: #5FABAC; }

.sinlio-front__status-list { display: grid; gap: 2px 12px; grid-template-columns: auto 1fr; margin: 16px 0; font-size: 14px; }

.sinlio-front__status-list dt { color: #6D7C7C; }

.sinlio-front__status-list dd { margin: 0 0 10px; font-weight: 600; text-align: right; }



/* Invite / legacy class bridges */

.sinlio-invite__head { margin-bottom: var(--sinlio-space-5); }

.sinlio-invite__grid { display: grid; gap: var(--sinlio-space-4); }

@media (min-width: 900px) {

  .sinlio-invite__grid { grid-template-columns: 1.4fr 1fr; }

}

.sinlio-invite__policy-list { margin: 0; padding-left: 1.1rem; }

.sinlio-portal__hero-grid {

  display: grid;

  gap: var(--sinlio-space-4);

}

@media (min-width: 900px) {

  .sinlio-portal__hero-grid { grid-template-columns: 1.5fr 1fr; }

}

.sinlio-portal__econ-grid {

  display: grid;

  gap: var(--sinlio-space-3);

  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));

}

.sinlio-portal__econ-item {

  display: grid;

  gap: 4px;

  padding: 12px;

  border: 1px solid var(--sinlio-border);

  border-radius: 12px;

}

.sinlio-portal__econ-label { font-size: 13px; color: var(--sinlio-muted); }

.sinlio-portal__econ-value { font-size: 16px; font-weight: 600; color: var(--sinlio-ink); }

.sinlio-portal__ticket-list,

.sinlio-portal__simple-list { list-style: none; margin: 0; padding: 0; }

.sinlio-portal__ticket-item {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  gap: 8px;

  padding: 12px 0;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal__split {

  display: grid;

  gap: var(--sinlio-space-4);

}

@media (min-width: 900px) {

  .sinlio-portal__split { grid-template-columns: 1fr 1fr; }

}

.sinlio-portal__tabs {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

  margin-bottom: var(--sinlio-space-4);

}

.sinlio-portal__tab {

  padding: 8px 12px;

  border-radius: 999px;

  border: 1px solid var(--sinlio-border);

  background: var(--sinlio-surface);

  color: var(--sinlio-text) !important;

  text-decoration: none !important;

  font-size: 13px;

  font-weight: 500;

}

.sinlio-portal__tab.is-active {

  background: var(--sinlio-brand-soft);

  border-color: transparent;

  color: var(--sinlio-brand-strong) !important;

}

.sinlio-copy-feedback[aria-live] { font-size: 13px; color: var(--sinlio-success); }



@media (prefers-reduced-motion: reduce) {

  .sinlio-portal *,

  .sinlio-portal *::before,

  .sinlio-portal *::after {

    transition: none !important;

    animation: none !important;

  }

}



@media (max-width: 320px) {

  .sinlio-app__header-inner,

  .sinlio-app__main { padding-left: 12px; padding-right: 12px; }

  .sinlio-app__title { font-size: 22px; }

}



/* ===== HF01 premium cohesion / mobile ===== */

.sinlio-portal { font-size: 15.5px; }

.sinlio-app__header-inner {

  max-width: min(100%, var(--sinlio-content-max));

  padding: 0 32px;

  min-height: 64px;

}

.sinlio-app__main { padding: 28px 32px 56px; }

.sinlio-app__content { max-width: var(--sinlio-content-max); width: 100%; }

.sinlio-app__logo { height: 32px; }

.sinlio-app__nav-link {

  min-height: 40px;

  display: inline-flex;

  align-items: center;

  padding: 10px 14px;

  font-size: 14px;

  font-weight: 500;

  position: relative;

}

.sinlio-app__nav-link.is-active {

  font-weight: 600;

  color: var(--sinlio-ink) !important;

  background: var(--sinlio-brand-soft);

}

.sinlio-app__nav-link.is-active::after {

  content: "";

  position: absolute;

  left: 14px;

  right: 14px;

  bottom: 4px;

  height: 2px;

  background: var(--sinlio-brand);

  border-radius: 2px;

}

.sinlio-app__title, .sinlio-portal__title {

  font-size: clamp(28px, 2.4vw, 32px);

  font-weight: 650;

  letter-spacing: -0.025em;

  color: var(--sinlio-ink);

}

.sinlio-app__lead, .sinlio-portal__lead {

  font-size: 15.5px;

  color: var(--sinlio-muted);

  max-width: 40rem;

}

.sinlio-section-title, .sinlio-portal__h2 {

  font-size: 20px;

  font-weight: 650;

  color: var(--sinlio-ink);

}

.sinlio-btn, .sinlio-portal__btn {

  min-height: 42px;

  padding: 10px 18px;

  font-size: 14.5px;

  font-weight: 600;

  transition: background var(--sinlio-transition), border-color var(--sinlio-transition), transform var(--sinlio-transition);

}

.sinlio-btn--primary, .sinlio-portal__btn--primary, .sinlio-portal__btn {

  background: var(--sinlio-brand-strong);

  border-color: var(--sinlio-brand-strong);

  color: #fff !important;

}

.sinlio-btn--primary:hover, .sinlio-portal__btn--primary:hover, .sinlio-portal__btn:hover {

  background: var(--sinlio-brand-deep);

  border-color: var(--sinlio-brand-deep);

}

.sinlio-btn--accent {

  background: var(--sinlio-accent);

  border-color: var(--sinlio-accent);

  color: #fff !important;

}

.sinlio-btn--accent:hover {

  background: var(--sinlio-accent-strong);

  border-color: var(--sinlio-accent-strong);

}

.sinlio-btn--secondary, .sinlio-portal__btn--secondary {

  background: var(--sinlio-brand-soft);

  border-color: transparent;

  color: var(--sinlio-brand-deep) !important;

}

.sinlio-btn--secondary:hover, .sinlio-portal__btn--secondary:hover {

  background: #d9eceb;

}

.sinlio-btn--text {

  color: var(--sinlio-brand-strong) !important;

  font-weight: 600;

  text-decoration: none !important;

}

.sinlio-btn--text::after { content: " ?A"; }



/* Surfaces: continuity over stacked white cards */

.sinlio-surface {

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-card);

  padding: 28px 28px 8px;

  margin-bottom: 24px;

  box-shadow: var(--sinlio-shadow);

}

.sinlio-surface__section {

  padding: 20px 0;

  border-top: 1px solid var(--sinlio-border);

}

.sinlio-surface__section:first-child {

  border-top: 0;

  padding-top: 0;

}

.sinlio-surface__section:last-child { padding-bottom: 20px; }

.sinlio-card, .sinlio-portal__panel, .sinlio-portal__card-block {

  box-shadow: none;

}

.sinlio-hero {

  display: grid;

  gap: 24px;

  padding: 28px 32px;

  margin-bottom: 24px;

  border-radius: var(--sinlio-radius-card);

  background: var(--sinlio-brand-soft);

  border: 1px solid var(--sinlio-border);

  position: relative;

  overflow: hidden;

}

.sinlio-hero::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  width: 4px;

  background: var(--sinlio-brand);

}

.sinlio-hero.is-warning::before,

.sinlio-hero.is-attention::before { background: var(--sinlio-accent); }

.sinlio-hero.is-danger::before { background: var(--sinlio-danger); }

.sinlio-hero.is-success::before { background: var(--sinlio-success); }

@media (min-width: 900px) {

  .sinlio-hero { grid-template-columns: 1.4fr 1fr; align-items: center; }

}

.sinlio-hero__kicker {

  margin: 0 0 6px;

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 0.02em;

  text-transform: uppercase;

  color: var(--sinlio-brand-strong);

}

.sinlio-hero__title {

  margin: 0 0 8px;

  font-size: clamp(28px, 3vw, 36px);

  font-weight: 700;

  letter-spacing: -0.03em;

  color: var(--sinlio-ink);

  line-height: 1.15;

}

.sinlio-hero__text { margin: 0; font-size: 16px; color: var(--sinlio-text); max-width: 36rem; }

.sinlio-hero__aside {

  padding: 18px 20px;

  border-radius: 14px;

  background: rgba(255,255,255,0.78);

  border: 1px solid var(--sinlio-border);

}

.sinlio-hero__aside-label {

  margin: 0 0 4px;

  font-size: 13px;

  font-weight: 600;

  color: var(--sinlio-muted);

}

.sinlio-hero__aside-value {

  margin: 0 0 12px;

  font-size: 22px;

  font-weight: 650;

  font-variant-numeric: tabular-nums;

  color: var(--sinlio-ink);

}

.sinlio-ops {

  display: grid;

  gap: 24px;

}

@media (min-width: 900px) {

  .sinlio-ops { grid-template-columns: 1.35fr 1fr; }

}

.sinlio-ops .sinlio-surface { margin-bottom: 0; }

.sinlio-empty-premium {

  text-align: center;

  max-width: 420px;

  margin: 0 auto;

  padding: 28px 16px 36px;

}

.sinlio-empty-premium__icon {

  width: 56px;

  height: 56px;

  margin: 0 auto 14px;

  border-radius: 16px;

  display: grid;

  place-items: center;

  background: var(--sinlio-brand-soft);

  color: var(--sinlio-brand-strong);

}

.sinlio-empty-premium h2 {

  margin: 0 0 8px;

  font-size: 22px;

  font-weight: 650;

  color: var(--sinlio-ink);

}

.sinlio-empty-premium p {

  margin: 0 0 18px;

  color: var(--sinlio-muted);

  font-size: 15px;

}

.sinlio-invite-editorial {

  text-align: center;

  padding: 36px 24px 40px;

  border-radius: var(--sinlio-radius-card);

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

}

.sinlio-invite-editorial__art {

  width: 88px;

  height: 88px;

  margin: 0 auto 18px;

  border-radius: 24px;

  background: var(--sinlio-brand-soft);

  border: 1px solid var(--sinlio-border);

}

.sinlio-credit-compact {

  display: flex;

  flex-wrap: wrap;

  gap: 16px 28px;

  padding: 16px 0;

}

.sinlio-credit-compact strong {

  display: block;

  font-size: 20px;

  font-variant-numeric: tabular-nums;

  color: var(--sinlio-ink);

}

.sinlio-credit-compact span { font-size: 13px; color: var(--sinlio-muted); }

.sinlio-row:hover, .sinlio-doc-row:hover, .sinlio-payment-row:hover, .sinlio-support__item:hover {

  background: var(--sinlio-brand-soft);

}

.sinlio-doc-row, .sinlio-payment-row, .sinlio-support__item {

  border-radius: 10px;

  transition: background var(--sinlio-transition);

  padding-left: 10px;

  padding-right: 10px;

}

.sinlio-badge--accent {

  background: var(--sinlio-accent-soft);

  color: var(--sinlio-accent-strong);

}

.sinlio-portal__num { font-variant-numeric: tabular-nums; font-weight: 650; }



/* Mobile bottom nav - always tangible */

.sinlio-app__mobile-nav {

  display: flex !important;

  min-height: calc(64px + env(safe-area-inset-bottom, 0px));

  padding-bottom: env(safe-area-inset-bottom, 0px);

  box-shadow: 0 -8px 24px rgba(23, 53, 54, 0.06);

}

.sinlio-app__mobile-link { min-width: 44px; min-height: 44px; font-size: 12px; font-weight: 600; gap: 3px; }

.sinlio-app__mobile-link .sinlio-portal__nav-icon { width: 22px; height: 22px; }

.sinlio-app__mobile-link.is-active,

.sinlio-app__mobile-more.is-active > summary {

  color: var(--sinlio-brand-deep) !important;

}

@media (min-width: 1024px) {

  .sinlio-app__mobile-nav { display: none !important; }

  .sinlio-app { padding-bottom: 0; }

}

@media (max-width: 1023px) {

  .sinlio-app { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }

  .sinlio-app__header-inner, .sinlio-app__main { padding-left: 20px; padding-right: 20px; }

  .sinlio-app__studio { display: block; max-width: 110px; font-size: 12px; }

  .sinlio-surface { padding: 20px 18px 4px; }

  .sinlio-hero { padding: 22px 18px; }

}

.sinlio-support--split .sinlio-support__list { min-width: 280px; }

.sinlio-support--split { min-height: 420px; }

@media (max-width: 390px) {

  .sinlio-app__mobile-link span { font-size: 12px; letter-spacing: 0; }

}





/* ============================================================

   HF02 ? Application canvas, controls, footer (COMPROBAR-00B)

   Marker: SINLIO_PORTAL_CLIENTE_001_HF02_APP_CANVAS

   ============================================================ */

.sinlio-portal--hf02 {

  --sinlio-content-max: 1200px;

  --sinlio-canvas-min: 1040px;

  --sinlio-control-h: 44px;

  --sinlio-footer-space: 48px;

}

.sinlio-portal--hf02 .sinlio-app__studio { display: none !important; }

.sinlio-portal--hf02 .sinlio-app__header-inner,

.sinlio-portal--hf02 .sinlio-app__content {

  max-width: var(--sinlio-content-max);

  width: 100%;

  margin-left: auto;

  margin-right: auto;

}

.sinlio-portal--hf02 .sinlio-app__main {

  padding: 24px 32px 32px;

}

.sinlio-portal--hf02 .sinlio-app__pagehead,

.sinlio-portal--hf02 .sinlio-app__title,

.sinlio-portal--hf02 .sinlio-app__lead {

  /* Floating title pattern retired ? page context lives in canvas */

}

.sinlio-portal--hf02 .sinlio-canvas {

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

  border-radius: 18px;

  box-shadow: var(--sinlio-shadow);

  width: 100%;

  min-width: 0;

  overflow: hidden;

}

.sinlio-portal--hf02 .sinlio-canvas__body {

  padding: 0;

  width: 100%;

}

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-portal__panel,

.sinlio-portal--hf02 .sinlio-canvas__body > section,

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-surface,

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-support,

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-invite,

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-settings,

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-ops,

.sinlio-portal--hf02 .sinlio-canvas__body > .sinlio-hero {

  max-width: none !important;

  width: 100%;

}

.sinlio-portal--hf02 .sinlio-surface {

  border: 0;

  box-shadow: none;

  border-radius: 0;

  background: transparent;

  padding: 24px 28px 8px;

}

.sinlio-portal--hf02 .sinlio-surface + .sinlio-surface {

  border-top: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf02 .sinlio-hero {

  margin: 0;

  border-radius: 0;

  border: 0;

  border-bottom: 1px solid var(--sinlio-border);

  padding: 28px 32px;

  width: 100%;

  max-width: none;

}

.sinlio-portal--hf02 .sinlio-ops {

  display: grid;

  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);

  gap: 0;

  width: 100%;

  max-width: none;

  margin: 0;

}

.sinlio-portal--hf02 .sinlio-ops > * {

  border-right: 1px solid var(--sinlio-border);

  min-width: 0;

}

.sinlio-portal--hf02 .sinlio-ops > *:last-child { border-right: 0; }



/* Page context */

.sinlio-page-context {

  padding: 22px 28px 0;

  border-bottom: 1px solid var(--sinlio-border);

  background: var(--sinlio-brand-soft);

}

.sinlio-page-context__row {

  display: flex;

  flex-wrap: wrap;

  align-items: flex-start;

  justify-content: space-between;

  gap: 16px;

  padding-bottom: 18px;

}

.sinlio-page-context__title {

  margin: 0;

  font-size: 26px;

  line-height: 1.2;

  font-weight: 700;

  color: var(--sinlio-ink);

  letter-spacing: -0.02em;

}

.sinlio-page-context__intro {

  margin: 8px 0 0;

  max-width: 40rem;

  color: var(--sinlio-text);

  font-size: 15.5px;

}

.sinlio-page-context__status { margin: 8px 0 0; }

.sinlio-page-context__meta { margin: 6px 0 0; color: var(--sinlio-muted); font-size: 13.5px; }

.sinlio-page-context__tabs {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  margin: 0 -4px;

  padding-bottom: 0;

}

.sinlio-page-context__tab {

  display: inline-flex;

  align-items: center;

  min-height: 40px;

  padding: 8px 14px;

  border-radius: 10px 10px 0 0;

  color: var(--sinlio-muted) !important;

  font-weight: 600;

  text-decoration: none !important;

}

.sinlio-page-context__tab:hover { background: rgba(255,255,255,0.7); color: var(--sinlio-ink) !important; }

.sinlio-page-context__tab.is-active {

  background: #fff;

  color: var(--sinlio-brand-deep) !important;

  box-shadow: inset 0 -2px 0 var(--sinlio-brand);

}



/* User context (account name ? never next to logo) */

.sinlio-app__user-context {

  margin: 0;

  padding: 10px 12px 8px;

  font-size: 12.5px;

  color: var(--sinlio-muted);

  border-bottom: 1px solid var(--sinlio-border);

}



/* Global footer */

.sinlio-app__footer {

  margin-top: 20px;

  padding: 18px 8px calc(12px + env(safe-area-inset-bottom, 0px));

  text-align: center;

}

.sinlio-app__footer-text {

  margin: 0;

  font-size: 13px;

  color: var(--sinlio-muted);

  line-height: 1.45;

}

.sinlio-app__footer-link {

  color: var(--sinlio-brand-strong) !important;

  font-weight: 600;

  text-decoration: none !important;

}

.sinlio-app__footer-link:hover { text-decoration: underline !important; }

@media (max-width: 1023px) {

  .sinlio-portal--hf02 .sinlio-app__footer {

    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));

  }

}



/* SinlioControlSystem */

.sinlio-portal--hf02 input[type="text"],

.sinlio-portal--hf02 input[type="email"],

.sinlio-portal--hf02 input[type="password"],

.sinlio-portal--hf02 input[type="number"],

.sinlio-portal--hf02 input[type="search"],

.sinlio-portal--hf02 input[type="tel"],

.sinlio-portal--hf02 input[type="url"],

.sinlio-portal--hf02 input[type="date"],

.sinlio-portal--hf02 input[type="time"],

.sinlio-portal--hf02 textarea,

.sinlio-portal--hf02 select,

.sinlio-portal--hf02 .sinlio-select__trigger {

  min-height: var(--sinlio-control-h);

  padding: 10px 14px;

  border: 1px solid var(--sinlio-border);

  border-radius: var(--sinlio-radius-control);

  background: #fff;

  color: var(--sinlio-ink);

  font: inherit;

  width: 100%;

  max-width: 100%;

  appearance: none;

  -webkit-appearance: none;

  transition: border-color var(--sinlio-transition), box-shadow var(--sinlio-transition);

}

.sinlio-portal--hf02 textarea { min-height: 120px; resize: vertical; }

.sinlio-portal--hf02 input:hover,

.sinlio-portal--hf02 textarea:hover,

.sinlio-portal--hf02 select:hover,

.sinlio-portal--hf02 .sinlio-select__trigger:hover {

  border-color: #c5d6d4;

}

.sinlio-portal--hf02 input:focus-visible,

.sinlio-portal--hf02 textarea:focus-visible,

.sinlio-portal--hf02 select:focus-visible,

.sinlio-portal--hf02 .sinlio-select__trigger:focus-visible {

  outline: none;

  border-color: var(--sinlio-brand);

  box-shadow: var(--sinlio-focus);

}

.sinlio-portal--hf02 input:disabled,

.sinlio-portal--hf02 textarea:disabled,

.sinlio-portal--hf02 select:disabled {

  opacity: 0.55;

  background: #f5f8f7;

  cursor: not-allowed;

}

.sinlio-portal--hf02 label {

  display: grid;

  gap: 6px;

  font-weight: 600;

  color: var(--sinlio-ink);

  font-size: 14px;

}

.sinlio-portal--hf02 .sinlio-form-grid,

.sinlio-portal--hf02 .sinlio-portal__form .sinlio-form-row {

  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 16px 20px;

}

@media (max-width: 767px) {

  .sinlio-portal--hf02 .sinlio-form-grid,

  .sinlio-portal--hf02 .sinlio-portal__form .sinlio-form-row {

    grid-template-columns: 1fr;

  }

}



/* SinlioSelect */

.sinlio-select { position: relative; width: 100%; }

.sinlio-select__trigger {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  cursor: pointer;

  text-align: left;

}

.sinlio-select__trigger-value { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.sinlio-select__chevron {

  width: 18px; height: 18px; flex: 0 0 auto;

  background: no-repeat center / 16px

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23687879' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");

}

.sinlio-select__panel {

  position: absolute;

  z-index: 40;

  left: 0; right: 0; top: calc(100% + 4px);

  max-height: 280px;

  overflow: auto;

  background: #fff;

  border: 1px solid var(--sinlio-border);

  border-radius: 12px;

  box-shadow: 0 12px 32px rgba(23,53,54,0.12);

  padding: 6px;

}

.sinlio-select__option {

  display: block;

  width: 100%;

  text-align: left;

  min-height: 44px;

  padding: 10px 12px;

  border: 0;

  border-radius: 8px;

  background: transparent;

  font: inherit;

  color: var(--sinlio-ink);

  cursor: pointer;

}

.sinlio-select__option:hover,

.sinlio-select__option.is-active { background: var(--sinlio-brand-soft); }

.sinlio-select__option.is-selected { font-weight: 700; color: var(--sinlio-brand-deep); }

.sinlio-select__search {

  margin: 0 0 6px;

  min-height: 40px !important;

}

@media (max-width: 767px) {

  .sinlio-select[data-native-mobile="1"] .sinlio-select__panel { display: none !important; }

}



/* SinlioComposer */

.sinlio-composer {

  border: 1px solid var(--sinlio-border);

  border-radius: 14px;

  background: #fff;

  overflow: hidden;

  display: flex;

  flex-direction: column;

  min-height: 200px;

}

.sinlio-composer__toolbar {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  padding: 8px 10px;

  border-bottom: 1px solid var(--sinlio-border);

  background: #f7fafa;

}

.sinlio-composer__toolbar button {

  min-width: 40px;

  min-height: 40px;

  border: 0;

  border-radius: 8px;

  background: transparent;

  color: var(--sinlio-ink);

  cursor: pointer;

  font: inherit;

}

.sinlio-composer__toolbar button:hover,

.sinlio-composer__toolbar button.is-active { background: var(--sinlio-brand-soft); color: var(--sinlio-brand-deep); }

.sinlio-composer__surface {

  min-height: 200px;

  padding: 14px 16px;

  outline: none;

}

.sinlio-portal--hf02 .sinlio-invite-editorial__copy { min-width: 0; }

.sinlio-portal--hf02 .sinlio-services-canvas {

  padding: 8px 20px 24px;

  width: 100%;

}

.sinlio-activity-row {

  display: grid;

  grid-template-columns: 40px minmax(0, 1fr) auto;

  gap: 12px;

  align-items: start;

  padding: 12px 0;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-activity-row:last-child { border-bottom: 0; }

.sinlio-activity-row__icon {

  width: 36px; height: 36px; border-radius: 10px;

  background: var(--sinlio-brand-soft);

  display: grid; place-items: center;

}

.sinlio-front--access .sinlio-app__footer { margin-top: 28px; }

.sinlio-portal--hf02 .screen-reader-text,

.sinlio-portal .screen-reader-text {

  border: 0;

  clip: rect(1px, 1px, 1px, 1px);

  clip-path: inset(50%);

  height: 1px;

  margin: -1px;

  overflow: hidden;

  padding: 0;

  position: absolute;

  width: 1px;

  word-wrap: normal !important;

}



.sinlio-composer__fallback {

  min-height: 180px;

  border: 0 !important;

  border-radius: 0 !important;

  box-shadow: none !important;

}

.sinlio-composer__footer {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  padding: 10px 12px;

  border-top: 1px solid var(--sinlio-border);

  background: #fbfcfc;

}

.sinlio-composer__attachments {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

  width: 100%;

}

.sinlio-composer__chip {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  padding: 6px 10px;

  border-radius: 999px;

  background: var(--sinlio-brand-soft);

  font-size: 13px;

}



/* Alias editor ? composer */

.sinlio-portal--hf02 .sinlio-editor {

  border: 1px solid var(--sinlio-border);

  border-radius: 14px;

  overflow: hidden;

  background: #fff;

}

.sinlio-portal--hf02 .sinlio-editor__toolbar {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  padding: 8px 10px;

  background: #f7fafa;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf02 .sinlio-editor__toolbar button {

  min-width: 40px; min-height: 40px; border: 0; border-radius: 8px; background: transparent; cursor: pointer;

}

.sinlio-portal--hf02 .sinlio-editor__surface { min-height: 180px; padding: 14px 16px; }



/* SinlioUploader */

.sinlio-uploader {

  border: 1.5px dashed #c5d6d4;

  border-radius: 14px;

  padding: 20px;

  background: #f8fbfb;

  text-align: center;

  transition: border-color var(--sinlio-transition), background var(--sinlio-transition);

}

.sinlio-uploader.is-dragover {

  border-color: var(--sinlio-brand);

  background: var(--sinlio-brand-soft);

}

.sinlio-uploader__icon {

  width: 40px; height: 40px; margin: 0 auto 10px;

  border-radius: 12px;

  background: var(--sinlio-brand-soft);

}

.sinlio-uploader__title { margin: 0 0 4px; font-weight: 700; color: var(--sinlio-ink); }

.sinlio-uploader__hint { margin: 0 0 14px; color: var(--sinlio-muted); font-size: 13.5px; }

.sinlio-uploader__input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }

.sinlio-uploader__cta { min-height: 44px; }

.sinlio-uploader__list { margin: 14px 0 0; display: grid; gap: 8px; text-align: left; }

.sinlio-uploader__item {

  display: flex; align-items: center; justify-content: space-between; gap: 12px;

  padding: 10px 12px; border-radius: 10px; background: #fff; border: 1px solid var(--sinlio-border);

}

.sinlio-uploader__progress {

  height: 4px; border-radius: 999px; background: #e4eeec; overflow: hidden; margin-top: 6px;

}

.sinlio-uploader__progress > span {

  display: block; height: 100%; background: var(--sinlio-brand); width: 0%; transition: width 120ms linear;

}



/* Empty state inside canvas */

.sinlio-empty-state {

  display: grid;

  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);

  gap: 24px;

  align-items: center;

  padding: 28px;

  width: 100%;

}

.sinlio-empty-state__copy h2 { margin: 0 0 8px; font-size: 22px; color: var(--sinlio-ink); }

.sinlio-empty-state__copy p { margin: 0 0 16px; max-width: 36rem; color: var(--sinlio-text); }

.sinlio-empty-state__art {

  min-height: 160px;

  border-radius: 16px;

  background: var(--sinlio-brand-soft);

  border: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf02 .sinlio-empty-premium {

  max-width: none !important;

  width: 100%;

  padding: 28px;

  text-align: left;

  display: grid;

  grid-template-columns: minmax(0, 1.2fr) minmax(180px, 0.8fr);

  gap: 24px;

  align-items: center;

}

.sinlio-portal--hf02 .sinlio-empty-premium__icon {

  order: 2;

  width: 100%;

  min-height: 140px;

  display: grid;

  place-items: center;

  border-radius: 16px;

  background: var(--sinlio-brand-soft);

}

.sinlio-portal--hf02 .sinlio-invite-editorial {

  max-width: none !important;

  width: 100%;

  margin: 0;

  padding: 32px;

  display: grid;

  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);

  gap: 28px;

  align-items: center;

  text-align: left;

}

.sinlio-portal--hf02 .sinlio-invite-editorial__art {

  min-height: 220px;

  border-radius: 18px;

  order: 2;

}

.sinlio-portal--hf02 .sinlio-invite-editorial .sinlio-app__title,

.sinlio-portal--hf02 .sinlio-invite-editorial .sinlio-app__lead {

  max-width: 36rem;

  margin-left: 0;

}



/* Services full canvas */

.sinlio-portal--hf02 .sinlio-portal__panel { width: 100%; max-width: none; }

.sinlio-service-row {

  display: grid;

  grid-template-columns: minmax(0, 1.4fr) minmax(160px, 0.6fr) auto;

  gap: 16px;

  align-items: center;

  padding: 18px 8px;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-service-row:last-child { border-bottom: 0; }



/* Payments canvas */

.sinlio-payments-canvas { width: 100%; }

.sinlio-payments-canvas .sinlio-tabs,

.sinlio-payments-canvas .sinlio-portal__tabs {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  padding: 0 20px;

  border-bottom: 1px solid var(--sinlio-border);

  background: #f7fbfb;

}

.sinlio-payment-method-card {

  display: flex;

  align-items: center;

  gap: 14px;

  padding: 16px;

  border: 1px solid var(--sinlio-border);

  border-radius: 14px;

  background: var(--sinlio-brand-deep);

  color: #fff;

  min-height: 88px;

}

.sinlio-payment-method-card strong { display: block; font-size: 16px; }

.sinlio-payment-method-card span { opacity: 0.85; font-size: 13px; }



/* Support canvas */

.sinlio-portal--hf02 .sinlio-support--split {

  min-height: 560px;

  display: grid;

  grid-template-columns: 340px minmax(0, 1fr);

  gap: 0;

  width: 100%;

  border: 0;

  border-radius: 0;

}

.sinlio-portal--hf02 .sinlio-support__list {

  width: 340px;

  max-width: 360px;

  min-width: 320px;

  border-right: 1px solid var(--sinlio-border);

  background: #f8fbfb;

}

.sinlio-portal--hf02 .sinlio-support__thread {

  display: flex;

  flex-direction: column;

  min-width: 0;

  min-height: 560px;

}

.sinlio-portal--hf02 .sinlio-support__composer {

  margin-top: auto;

  border-top: 1px solid var(--sinlio-border);

  padding: 12px;

  background: #fff;

}

.sinlio-portal--hf02 .sinlio-app__pagehead { display: none; }



/* Settings layout */

.sinlio-settings {

  display: grid;

  grid-template-columns: 240px minmax(0, 1fr);

  min-height: 480px;

  width: 100%;

}

.sinlio-settings__nav {

  border-right: 1px solid var(--sinlio-border);

  padding: 18px 12px;

  background: #f8fbfb;

}

.sinlio-settings__nav a {

  display: flex;

  align-items: center;

  min-height: 44px;

  padding: 8px 12px;

  border-radius: 10px;

  color: var(--sinlio-text) !important;

  text-decoration: none !important;

  font-weight: 600;

}

.sinlio-settings__nav a.is-active,

.sinlio-settings__nav a:hover {

  background: #fff;

  color: var(--sinlio-brand-deep) !important;

  box-shadow: var(--sinlio-shadow);

}

.sinlio-settings__content { padding: 8px 8px 24px; min-width: 0; }



@media (max-width: 1023px) {

  .sinlio-portal--hf02 .sinlio-ops { grid-template-columns: 1fr; }

  .sinlio-portal--hf02 .sinlio-ops > * { border-right: 0; border-bottom: 1px solid var(--sinlio-border); }

  .sinlio-portal--hf02 .sinlio-support--split { grid-template-columns: 1fr; min-height: 0; }

  .sinlio-portal--hf02 .sinlio-support__list { width: 100%; max-width: none; min-width: 0; border-right: 0; border-bottom: 1px solid var(--sinlio-border); }

  .sinlio-settings { grid-template-columns: 1fr; }

  .sinlio-settings__nav {

    display: flex;

    gap: 6px;

    overflow-x: auto;

    border-right: 0;

    border-bottom: 1px solid var(--sinlio-border);

  }

  .sinlio-empty-state,

  .sinlio-portal--hf02 .sinlio-empty-premium,

  .sinlio-portal--hf02 .sinlio-invite-editorial {

    grid-template-columns: 1fr;

  }

  .sinlio-service-row { grid-template-columns: 1fr; }

}

@media (min-width: 1280px) {

  .sinlio-portal--hf02 .sinlio-canvas { min-width: min(100%, var(--sinlio-canvas-min)); }

}

@media (min-width: 1440px) {

  .sinlio-portal--hf02 .sinlio-app__content { width: min(100%, 1200px); }

  .sinlio-portal--hf02 .sinlio-canvas { width: 100%; }

}



/* ============================================================

   HF03 ? Mobile nav, support canvas, flat padding (COMPROBAR-00C)

   Marker: SINLIO_PORTAL_CLIENTE_001_HF03_MOBILE_SUPPORT_FLAT

   ============================================================ */

.sinlio-portal--hf03 {

  --sinlio-canvas-pad-d: 28px;

  --sinlio-canvas-pad-t: 24px;

  --sinlio-canvas-pad-m: 18px;

  --sinlio-footer-fs: 12.5px;

}

.sinlio-portal--hf03 .sinlio-canvas {

  --sinlio-canvas-min: 1080px;

}

.sinlio-portal--hf03 .sinlio-page-context {

  padding: 22px var(--sinlio-canvas-pad-d) 0;

  border-bottom: 0;

  background: var(--sinlio-brand-soft);

}

.sinlio-portal--hf03 .sinlio-page-context__tabs {

  margin: 0;

  padding: 0 var(--sinlio-canvas-pad-d) 0;

  gap: 6px;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf03 .sinlio-page-context__tab {

  margin-bottom: -1px;

}

.sinlio-portal--hf03 .sinlio-surface,

.sinlio-portal--hf03 .sinlio-canvas__body > .sinlio-portal__panel,

.sinlio-portal--hf03 .sinlio-services-canvas,

.sinlio-portal--hf03 .sinlio-payments-canvas,

.sinlio-portal--hf03 .sinlio-docs-canvas {

  padding-left: var(--sinlio-canvas-pad-d);

  padding-right: var(--sinlio-canvas-pad-d);

}

.sinlio-portal--hf03 .sinlio-hero {

  padding: var(--sinlio-canvas-pad-d);

  margin: 0;

  border-radius: 0;

  border: 0;

  border-bottom: 1px solid var(--sinlio-border);

  background: var(--sinlio-brand-soft);

}

.sinlio-portal--hf03 .sinlio-surface + .sinlio-surface {

  border-top: 0;

  margin-top: 8px;

}

.sinlio-portal--hf03 .sinlio-surface__section {

  border-top: 0;

  padding-top: 16px;

  padding-bottom: 16px;

}

.sinlio-portal--hf03 .sinlio-ops > * {

  border-right: 0;

  padding: var(--sinlio-canvas-pad-d);

}

.sinlio-portal--hf03 .sinlio-ops > *:first-child {

  border-right: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf03 .sinlio-app__footer {

  margin-top: 24px;

  padding-top: 20px;

}

.sinlio-portal--hf03 .sinlio-app__footer-text {

  font-size: var(--sinlio-footer-fs);

  color: var(--sinlio-muted);

}



/* Payments empty compact */

.sinlio-portal--hf03 .sinlio-payments-canvas .sinlio-empty-premium {

  max-height: 180px;

  grid-template-columns: 48px minmax(0, 1fr);

  gap: 14px;

  padding: 18px 0;

  align-items: center;

}

.sinlio-portal--hf03 .sinlio-payments-canvas .sinlio-empty-premium__icon {

  order: 0;

  width: 48px;

  min-height: 48px;

  border-radius: 12px;

}

.sinlio-portal--hf03 .sinlio-payments-canvas .sinlio-empty-premium h2 { font-size: 18px; margin: 0 0 4px; }

.sinlio-portal--hf03 .sinlio-payments-canvas .sinlio-empty-premium p { margin: 0; }

.sinlio-portal--hf03 .sinlio-payment-method-card .sinlio-btn,

.sinlio-portal--hf03 .sinlio-payments-method .sinlio-btn {

  min-height: 42px;

}



/* Services section */

.sinlio-portal--hf03 .sinlio-service-row {

  padding: 20px 0;

  border-bottom: 1px solid var(--sinlio-border);

  margin: 0;

}

.sinlio-portal--hf03 .sinlio-services-canvas {

  padding-top: 8px;

  padding-bottom: 28px;

}



/* Composer heights */

.sinlio-portal--hf03 .sinlio-composer__surface,

.sinlio-portal--hf03 .sinlio-composer__fallback,

.sinlio-portal--hf03 .sinlio-editor__surface {

  min-height: 220px;

}

.sinlio-portal--hf03 .sinlio-composer {

  border: 1px solid var(--sinlio-border);

  border-radius: 14px;

  overflow: hidden;

  background: #fff;

}

.sinlio-portal--hf03 .sinlio-composer__toolbar {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  padding: 8px 10px;

  border-bottom: 1px solid var(--sinlio-border);

  background: #f8fbfb;

}

.sinlio-portal--hf03 .sinlio-uploader {

  margin-top: 12px;

}

.sinlio-portal--hf03 .sinlio-uploader__title { font-size: 15px; }

.sinlio-portal--hf03 .sinlio-uploader__hint { font-size: 13.5px; }



/* Support rebuild */

.sinlio-portal--hf03 .sinlio-support--split {

  min-height: 600px;

  display: grid;

  grid-template-columns: 340px minmax(0, 1fr);

  gap: 0;

  width: 100%;

  border: 0;

}

.sinlio-portal--hf03 .sinlio-support__list {

  width: 340px;

  max-width: 360px;

  min-width: 320px;

  border-right: 1px solid var(--sinlio-border);

  background: #f8fbfb;

  display: flex;

  flex-direction: column;

  min-height: 600px;

  max-height: min(78vh, 820px);

  overflow: hidden;

}

.sinlio-portal--hf03 .sinlio-support__list-scroll {

  flex: 1;

  overflow: auto;

  min-height: 0;

}

.sinlio-portal--hf03 .sinlio-support__tools {

  padding: 16px 16px 10px;

  border-bottom: 1px solid var(--sinlio-border);

  display: grid;

  gap: 10px;

}

.sinlio-portal--hf03 .sinlio-support__item {

  display: block;

  padding: 12px 16px;

  border-bottom: 1px solid var(--sinlio-border);

  text-decoration: none !important;

  color: inherit !important;

  border-radius: 0;

}

.sinlio-portal--hf03 .sinlio-support__item.is-active {

  background: #fff;

  box-shadow: inset 3px 0 0 var(--sinlio-brand);

}

.sinlio-portal--hf03 .sinlio-support__thread {

  display: flex;

  flex-direction: column;

  min-height: 600px;

  max-height: min(78vh, 820px);

  min-width: 0;

  background: #fff;

}

.sinlio-portal--hf03 .sinlio-support__thread-head {

  padding: 18px 28px 14px;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf03 .sinlio-support__thread-body {

  flex: 1;

  overflow: auto;

  padding: 16px 28px;

  min-height: 0;

}

.sinlio-portal--hf03 .sinlio-support__composer {

  margin-top: auto;

  border-top: 1px solid var(--sinlio-border);

  padding: 14px 28px 18px;

  background: #fff;

}

.sinlio-portal--hf03 .sinlio-support__empty-pane {

  flex: 1;

  display: grid;

  place-items: center;

  padding: 28px;

  text-align: center;

}

.sinlio-portal--hf03 .sinlio-support__empty-pane h2 { margin: 0 0 8px; color: var(--sinlio-ink); }

.sinlio-portal--hf03 .sinlio-support__empty-pane p { margin: 0 0 16px; color: var(--sinlio-muted); max-width: 28rem; }



/* New request form */

.sinlio-support-new {

  padding: 8px var(--sinlio-canvas-pad-d) 28px;

  max-width: 100%;

}

.sinlio-support-new__actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

  justify-content: flex-end;

  margin-top: 18px;

  padding-top: 16px;

  border-top: 1px solid var(--sinlio-border);

}

.sinlio-form-stack { display: grid; gap: 16px; }

.sinlio-form-stack .sinlio-form-row { margin: 0; }

.sinlio-form-row--2 {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 14px;

}



/* Mobile more sheet */

.sinlio-more-sheet[hidden] { display: none !important; }

.sinlio-more-sheet {

  position: fixed;

  inset: 0;

  z-index: 60;

}

.sinlio-more-sheet__backdrop {

  position: absolute;

  inset: 0;

  background: rgba(23, 53, 54, 0.42);

}

.sinlio-more-sheet__panel {

  position: absolute;

  left: 0;

  right: 0;

  bottom: 0;

  max-height: min(78vh, 560px);

  overflow: auto;

  background: #fff;

  border-radius: 18px 18px 0 0;

  padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px));

  box-shadow: 0 -8px 28px rgba(23, 53, 54, 0.12);

}

.sinlio-more-sheet__head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  padding: 6px 2px 12px;

}

.sinlio-more-sheet__head h2 {

  margin: 0;

  font-size: 1.05rem;

  color: var(--sinlio-ink);

}

.sinlio-more-sheet__close {

  min-width: 44px;

  min-height: 44px;

  border: 1px solid var(--sinlio-border);

  border-radius: 10px;

  background: #fff;

  cursor: pointer;

  font: inherit;

}

.sinlio-more-sheet__nav a,

.sinlio-more-sheet__nav button {

  display: flex;

  align-items: center;

  min-height: 48px;

  width: 100%;

  padding: 10px 12px;

  border: 0;

  border-radius: 10px;

  background: transparent;

  text-align: left;

  font: inherit;

  font-weight: 600;

  color: var(--sinlio-text) !important;

  text-decoration: none !important;

  cursor: pointer;

}

.sinlio-more-sheet__nav a:hover,

.sinlio-more-sheet__nav a:focus-visible,

.sinlio-more-sheet__nav button:hover,

.sinlio-more-sheet__nav button:focus-visible {

  background: var(--sinlio-brand-soft);

  outline: none;

}

body.sinlio-more-open { overflow: hidden; }



@media (max-width: 1023px) {

  .sinlio-portal--hf03 .sinlio-app__nav { display: none !important; }

  .sinlio-portal--hf03 .sinlio-page-context,

  .sinlio-portal--hf03 .sinlio-surface,

  .sinlio-portal--hf03 .sinlio-hero,

  .sinlio-portal--hf03 .sinlio-services-canvas,

  .sinlio-portal--hf03 .sinlio-payments-canvas,

  .sinlio-portal--hf03 .sinlio-docs-canvas,

  .sinlio-portal--hf03 .sinlio-support-new,

  .sinlio-portal--hf03 .sinlio-ops > * {

    padding-left: var(--sinlio-canvas-pad-t);

    padding-right: var(--sinlio-canvas-pad-t);

  }

  .sinlio-portal--hf03 .sinlio-ops > *:first-child { border-right: 0; }

  .sinlio-portal--hf03 .sinlio-support--split {

    grid-template-columns: 1fr;

    min-height: 0;

  }

  .sinlio-portal--hf03 .sinlio-support__list {

    width: 100%;

    max-width: none;

    min-width: 0;

    min-height: 0;

    max-height: none;

    border-right: 0;

  }

  .sinlio-portal--hf03 .sinlio-support__thread {

    min-height: 420px;

    max-height: none;

  }

  .sinlio-portal--hf03 .sinlio-composer__surface,

  .sinlio-portal--hf03 .sinlio-composer__fallback {

    min-height: 180px;

  }

  .sinlio-form-row--2 { grid-template-columns: 1fr; }

  .sinlio-portal--hf03 .sinlio-app__footer {

    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));

  }

  .sinlio-app__mobile-nav {

    display: flex !important;

  }

  .sinlio-app__mobile-link {

    min-width: 44px;

    min-height: 44px;

  }

  .sinlio-app__mobile-link span {

    font-size: 11px;

    line-height: 1.15;

  }

}

@media (max-width: 767px) {

  .sinlio-portal--hf03 .sinlio-page-context,

  .sinlio-portal--hf03 .sinlio-surface,

  .sinlio-portal--hf03 .sinlio-hero,

  .sinlio-portal--hf03 .sinlio-services-canvas,

  .sinlio-portal--hf03 .sinlio-payments-canvas,

  .sinlio-portal--hf03 .sinlio-docs-canvas,

  .sinlio-portal--hf03 .sinlio-support-new,

  .sinlio-portal--hf03 .sinlio-ops > * {

    padding-left: var(--sinlio-canvas-pad-m);

    padding-right: var(--sinlio-canvas-pad-m);

  }

}

@media (min-width: 1024px) {

  .sinlio-app__mobile-nav,

  .sinlio-more-sheet { display: none !important; }

}

@media (min-width: 1440px) {

  .sinlio-portal--hf03 .sinlio-canvas { min-width: min(100%, 1080px); }

}



/* ============================================================

   HF04 ? Motion, support redesign, nav presence, visual cohesion

   Marker: SINLIO_PORTAL_CLIENTE_001_HF04_MOTION_SUPPORT_COHESION

   ============================================================ */

.sinlio-portal--hf04 {

  --sinlio-mobile-nav-h: 72px;

  --sinlio-surface-raised: #FFFFFF;

  --sinlio-nav-bar-bg: #FFFFFF;

}

.sinlio-portal--hf04 .sinlio-app__header {

  background: var(--sinlio-nav-bar-bg);

  border-bottom: 1px solid var(--sinlio-border);

  box-shadow: 0 1px 0 rgba(23, 53, 54, 0.04);

}

.sinlio-portal--hf04 .sinlio-app__nav-link.is-active {

  background: var(--sinlio-brand-soft);

  color: var(--sinlio-brand-deep) !important;

  box-shadow: inset 0 -2px 0 var(--sinlio-brand);

  font-weight: 650;

}

.sinlio-portal--hf04 .sinlio-canvas {

  background: var(--sinlio-surface);

  border: 1px solid var(--sinlio-border);

  box-shadow: 0 1px 2px rgba(23, 53, 54, 0.04);

}

.sinlio-portal--hf04 .sinlio-page-context {

  background: var(--sinlio-brand-soft);

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf04 .sinlio-section-title {

  font-size: 17px;

  letter-spacing: -0.01em;

  color: var(--sinlio-ink);

}



/* Microentrada inicio */

.sinlio-portal--hf04 .sinlio-hero--enter {

  animation: sinlio-hf04-enter 420ms ease both;

}

.sinlio-portal--hf04 .sinlio-hero__motion {

  margin: 0 0 10px;

}

.sinlio-portal--hf04 .sinlio-hero__aside {

  align-items: flex-start;

}

@keyframes sinlio-hf04-enter {

  from { opacity: 0; transform: translateY(6px); }

  to { opacity: 1; transform: none; }

}

@media (prefers-reduced-motion: reduce) {

  .sinlio-portal--hf04 .sinlio-hero--enter { animation: none; }

}



/* Mobile bottom nav ? presencia app */

.sinlio-portal--hf04 .sinlio-app__mobile-nav {

  display: flex;

  background: var(--sinlio-nav-bar-bg);

  border-top: 1px solid var(--sinlio-border);

  box-shadow: 0 -6px 24px rgba(23, 53, 54, 0.08);

  padding: 6px 6px calc(8px + env(safe-area-inset-bottom, 0px));

  min-height: var(--sinlio-mobile-nav-h);

}

.sinlio-portal--hf04 .sinlio-app__mobile-link {

  color: var(--sinlio-muted) !important;

  font-size: 11.5px;

  font-weight: 600;

  letter-spacing: 0.01em;

  gap: 4px;

  min-height: 56px;

  border-radius: 12px;

}

.sinlio-portal--hf04 .sinlio-app__mobile-link .sinlio-portal__nav-icon {

  width: 22px;

  height: 22px;

}

.sinlio-portal--hf04 .sinlio-app__mobile-link.is-active {

  color: var(--sinlio-brand-deep) !important;

  background: var(--sinlio-brand-soft);

}

.sinlio-portal--hf04 .sinlio-app__mobile-link.is-active .sinlio-portal__nav-icon {

  color: var(--sinlio-brand-strong);

  stroke: var(--sinlio-brand-strong);

}



/* Documentos vac�o */

.sinlio-portal--hf04 .sinlio-empty-state--docs {

  display: grid;

  grid-template-columns: minmax(0, 1fr);

  justify-items: center;

  text-align: center;

  gap: 20px;

  padding: 36px 24px 48px;

  background: var(--sinlio-brand-soft);

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf04 .sinlio-empty-state--docs .sinlio-empty-state__copy {

  max-width: 28rem;

}

.sinlio-portal--hf04 .sinlio-docs__motion {

  min-height: 140px;

}



/* Soporte ? filtros chip / segmented */

.sinlio-portal--hf04 .sinlio-support__filters {

  display: grid;

  gap: 10px;

}

.sinlio-portal--hf04 .sinlio-seg {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

}

.sinlio-portal--hf04 .sinlio-seg__item {

  display: inline-flex;

  align-items: center;

  min-height: 34px;

  padding: 0 12px;

  border-radius: 999px;

  border: 1px solid var(--sinlio-border);

  background: var(--sinlio-surface);

  color: var(--sinlio-text) !important;

  font-size: 12.5px;

  font-weight: 600;

  text-decoration: none !important;

}

.sinlio-portal--hf04 .sinlio-seg__item:hover {

  border-color: var(--sinlio-brand);

  color: var(--sinlio-brand-deep) !important;

}

.sinlio-portal--hf04 .sinlio-seg__item.is-active {

  background: var(--sinlio-brand-soft);

  border-color: var(--sinlio-brand);

  color: var(--sinlio-brand-deep) !important;

}

.sinlio-portal--hf04 .sinlio-support__list-empty {

  padding: 20px 16px;

  color: var(--sinlio-muted);

  font-size: 14px;

}

.sinlio-portal--hf04 .sinlio-support__empty-pane {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 16px;

  text-align: center;

  padding: 40px 28px;

  min-height: 360px;

  background: var(--sinlio-brand-soft);

}

.sinlio-portal--hf04 .sinlio-support__motion {

  min-height: 150px;

}

.sinlio-portal--hf04 .sinlio-support__empty-copy h2 {

  margin: 0 0 8px;

  font-size: 20px;

  color: var(--sinlio-ink);

}

.sinlio-portal--hf04 .sinlio-support__empty-copy p {

  margin: 0;

  max-width: 28rem;

  color: var(--sinlio-muted);

}

.sinlio-portal--hf04 .sinlio-support__thread-meta {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 10px;

  margin: 0 0 8px;

}

.sinlio-portal--hf04 .sinlio-portal__thread-msg {

  padding: 14px 0;

  border-bottom: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf04 .sinlio-portal__thread-msg header {

  display: flex;

  gap: 10px;

  align-items: baseline;

  margin-bottom: 6px;

}

.sinlio-portal--hf04 .sinlio-support__actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

  padding: 12px 28px 20px;

}



/* Nueva solicitud ? layout serio */

.sinlio-portal--hf04 .sinlio-support-new {

  padding: 8px var(--sinlio-canvas-pad-d, 28px) 32px;

  max-width: 820px;

}

.sinlio-portal--hf04 .sinlio-support-new__head {

  margin-bottom: 20px;

}

.sinlio-portal--hf04 .sinlio-support-new__back {

  display: inline-block;

  margin-bottom: 10px;

  font-size: 13.5px;

  font-weight: 600;

}

.sinlio-portal--hf04 .sinlio-support-new__lead {

  margin: 6px 0 0;

  max-width: 40rem;

}

.sinlio-portal--hf04 .sinlio-form-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 16px 18px;

}

.sinlio-portal--hf04 .sinlio-form-grid__full {

  grid-column: 1 / -1;

}

.sinlio-portal--hf04 .sinlio-field {

  display: grid;

  gap: 6px;

}

.sinlio-portal--hf04 .sinlio-field__label {

  font-size: 13px;

  font-weight: 650;

  color: var(--sinlio-ink);

}

.sinlio-portal--hf04 .sinlio-support-new__message .sinlio-composer__surface--tall,

.sinlio-portal--hf04 .sinlio-composer__surface--tall {

  min-height: 220px;

}

.sinlio-portal--hf04 .sinlio-support-new__actions {

  display: flex;

  justify-content: flex-end;

  gap: 10px;

  margin-top: 22px;

  padding-top: 18px;

  border-top: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf04 .sinlio-support-new__actions--inline {

  border-top: 0;

  padding-top: 12px;

  margin-top: 12px;

}



/* Editor + uploader presencia */

.sinlio-portal--hf04 .sinlio-composer {

  border: 1px solid var(--sinlio-border);

  border-radius: 14px;

  background: var(--sinlio-surface);

  overflow: hidden;

}

.sinlio-portal--hf04 .sinlio-composer__toolbar {

  background: #F7FAF9;

  border-bottom: 1px solid var(--sinlio-border);

  padding: 8px 10px;

  gap: 4px;

}

.sinlio-portal--hf04 .sinlio-composer__toolbar button {

  min-width: 34px;

  min-height: 34px;

  border-radius: 8px;

  font-size: 13px;

}

.sinlio-portal--hf04 .sinlio-composer__surface:focus {

  outline: none;

  box-shadow: inset 0 0 0 2px rgba(95, 171, 172, 0.35);

}

.sinlio-portal--hf04 .sinlio-uploader {

  border: 1.5px dashed var(--sinlio-border);

  border-radius: 14px;

  background: #F7FAF9;

  padding: 22px 18px;

  transition: border-color var(--sinlio-transition), background var(--sinlio-transition), box-shadow var(--sinlio-transition);

}

.sinlio-portal--hf04 .sinlio-uploader.is-dragover {

  border-color: var(--sinlio-brand);

  background: var(--sinlio-brand-soft);

  box-shadow: 0 0 0 3px rgba(95, 171, 172, 0.18);

}

.sinlio-portal--hf04 .sinlio-uploader__icon {

  width: 40px;

  height: 40px;

  margin: 0 auto 10px;

  border-radius: 12px;

  background: var(--sinlio-brand-soft);

  border: 1px solid var(--sinlio-border);

}

.sinlio-portal--hf04 .sinlio-motion-host {

  display: block;

}

.sinlio-portal--hf04 .sinlio-invite__motion {

  min-height: 160px;

}

.sinlio-portal--hf04 .sinlio-invite__motion--compact {

  min-height: 100px;

}

.sinlio-portal--hf04 .sinlio-invite-editorial__art {

  display: flex;

  align-items: center;

  justify-content: center;

  min-height: 180px;

  padding: 12px;

  background: var(--sinlio-brand-soft);

  border-radius: var(--sinlio-radius-card);

  border: 1px solid var(--sinlio-border);

}



@media (max-width: 767px) {

  .sinlio-portal--hf04 .sinlio-form-grid {

    grid-template-columns: 1fr;

  }

  .sinlio-portal--hf04 .sinlio-support-new {

    padding-left: var(--sinlio-canvas-pad-m, 18px);

    padding-right: var(--sinlio-canvas-pad-m, 18px);

  }

  .sinlio-portal--hf04 .sinlio-support-new__actions {

    flex-direction: column-reverse;

  }

  .sinlio-portal--hf04 .sinlio-support-new__actions .sinlio-btn {

    width: 100%;

  }

  .sinlio-portal--hf04 .sinlio-app {

    padding-bottom: calc(var(--sinlio-mobile-nav-h) + 12px);

  }

}

@media (min-width: 1024px) {

  .sinlio-portal--hf04 .sinlio-app__mobile-nav { display: none !important; }

}





/* ============================================================

   MOTION-03 � Real inline SVG motion integration (Cuenta-owned)

   Marker: SINLIO_MOTION_CUENTA_001_DIMENSIONS

   ============================================================ */

.sinlio-portal--motion03 .sinlio-motion-host--editorial {

  display: block;

  width: clamp(160px, 20vw, 280px);

  aspect-ratio: 14 / 9;

  max-width: 100%;

  margin: 0 auto;

  line-height: 0;

  min-height: 100px;

  box-sizing: border-box;

}

.sinlio-portal--motion03 .sinlio-motion-host--micro {

  display: block;

  width: clamp(72px, 12vw, 120px);

  aspect-ratio: 1 / 1;

  min-height: 72px;

  margin: 0 0 8px;

  line-height: 0;

}

.sinlio-portal--motion03 .sinlio-motion-host svg.sinlio-motion-scene,

.sinlio-portal--motion03 .sinlio-motion-host img.sinlio-motion-static-fallback {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: contain;

}

.sinlio-portal--motion03 .sinlio-motion-load-error {

  outline: 1px dashed var(--sinlio-border);

  opacity: 0.92;

}

.sinlio-portal--motion03 .sinlio-empty-premium--motion {

  display: grid;

  grid-template-columns: minmax(120px, 200px) minmax(0, 1fr);

  gap: 16px;

  align-items: center;

  padding: 18px 0;

}

.sinlio-portal--motion03 .sinlio-motion-debug {

  position: fixed;

  right: 12px;

  bottom: calc(var(--sinlio-mobile-nav-h, 72px) + 12px);

  z-index: 80;

  max-width: min(420px, 92vw);

  max-height: 40vh;

  overflow: auto;

  margin: 0;

  padding: 10px 12px;

  border-radius: 10px;

  border: 1px solid var(--sinlio-border);

  background: #0f1f20;

  color: #d7efef;

  font: 11px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  box-shadow: 0 8px 24px rgba(23, 53, 54, 0.2);

}

@media (max-width: 767px) {

  .sinlio-portal--motion03 .sinlio-motion-host--editorial {

    width: min(100%, 220px);

  }

  .sinlio-portal--motion03 .sinlio-empty-premium--motion {

    grid-template-columns: 1fr;

    justify-items: center;

    text-align: center;

  }

}





/* ============================================================

   HF05 � Visual authority, tabs, composer/uploader v2

   Marker: SINLIO_PORTAL_CLIENTE_001_HF05_VISUAL_AUTHORITY

   ============================================================ */

.sinlio-portal--hf05 {

  --sinlio-deep: #173F40;

  --sinlio-deep-secondary: #1F4A42;

  --sinlio-brand: #5FABAC;

  --sinlio-brand-light: #7AB6B7;

  --sinlio-brand-soft: #E3F0EE;

  --sinlio-accent: #D87455;

  --sinlio-accent-soft: #F8E8E2;

  --sinlio-ink: #173536;

  --sinlio-text: #344445;

  --sinlio-muted: #687879;

  --sinlio-border: #D7E3E1;

  --sinlio-background: #F3F6F5;

  --sinlio-surface: #FFFFFF;

  --sinlio-page-min-height: clamp(560px, calc(100dvh - 170px), 720px);

  --sinlio-operational-page-min-height: clamp(580px, calc(100dvh - 170px), 740px);

  --sinlio-support-page-min-height: clamp(640px, calc(100dvh - 150px), 820px);

  --sinlio-header-h: 64px;

  --sinlio-mobile-nav-h: 74px;

  font-size: 15.5px;

  line-height: 1.52;

  color: var(--sinlio-text);

  background: var(--sinlio-background);

}

.sinlio-portal--hf05 .sinlio-app__header {

  background: var(--sinlio-deep);

  border-bottom: 0;

  box-shadow: 0 1px 0 rgba(0,0,0,.12);

  color: #fff;

}

.sinlio-portal--hf05 .sinlio-app__header-inner { min-height: var(--sinlio-header-h); }

.sinlio-portal--hf05 .sinlio-app__logo { filter: none; height: 28px; width: auto; }

.sinlio-portal--hf05 .sinlio-app__brand-text { color: #fff; }

.sinlio-portal--hf05 .sinlio-app__studio { display: none !important; }

.sinlio-portal--hf05 .sinlio-app__nav-link {

  color: rgba(255,255,255,.78) !important;

  background: transparent !important;

  border-radius: 0;

  min-height: 44px;

  padding: 0 14px;

  font-size: 14px;

  font-weight: 500;

  box-shadow: none !important;

  border-bottom: 3px solid transparent;

}

.sinlio-portal--hf05 .sinlio-app__nav-link:hover {

  color: #fff !important;

  background: rgba(255,255,255,.06) !important;

}

.sinlio-portal--hf05 .sinlio-app__nav-link.is-active {

  color: #fff !important;

  font-weight: 700;

  background: rgba(255,255,255,.08) !important;

  border-bottom-color: var(--sinlio-brand-light);

  box-shadow: none !important;

}

.sinlio-portal--hf05 .sinlio-app__help { color: rgba(255,255,255,.8) !important; }

.sinlio-portal--hf05 .sinlio-app__avatar {

  background: rgba(255,255,255,.14);

  color: #fff;

  border: 1px solid rgba(255,255,255,.22);

}

.sinlio-portal--hf05 .sinlio-app__user-name { color: #fff; }

.sinlio-portal--hf05 .sinlio-app__user-toggle {

  border-color: rgba(255,255,255,.2);

  background: rgba(255,255,255,.06);

}

.sinlio-portal--hf05 .sinlio-app__mobile-nav {

  background: var(--sinlio-deep);

  border-top: 0;

  box-shadow: 0 -8px 24px rgba(23,53,54,.18);

  min-height: var(--sinlio-mobile-nav-h);

  padding: 6px 4px calc(8px + env(safe-area-inset-bottom, 0px));

}

.sinlio-portal--hf05 .sinlio-app__mobile-link {

  color: rgba(255,255,255,.72) !important;

  background: transparent !important;

  border-radius: 8px;

  font-size: 11.5px;

  font-weight: 600;

  min-height: 58px;

  position: relative;

}

.sinlio-portal--hf05 .sinlio-app__mobile-link.is-active {

  color: #fff !important;

  background: rgba(255,255,255,.08) !important;

  font-weight: 700;

}

.sinlio-portal--hf05 .sinlio-app__mobile-link.is-active::before {

  content: "";

  position: absolute;

  top: 4px;

  left: 50%;

  transform: translateX(-50%);

  width: 18px;

  height: 3px;

  border-radius: 2px;

  background: var(--sinlio-brand-light);

}

.sinlio-portal--hf05 .sinlio-more-sheet__panel {

  background: var(--sinlio-deep);

  color: #fff;

  border: 0;

}

.sinlio-portal--hf05 .sinlio-more-sheet__head h2 { color: #fff; }

.sinlio-portal--hf05 .sinlio-more-sheet__nav a,

.sinlio-portal--hf05 .sinlio-more-sheet__nav button {

  color: #fff !important;

  border-radius: 8px;

}

.sinlio-portal--hf05 .sinlio-more-sheet__nav a:hover,

.sinlio-portal--hf05 .sinlio-more-sheet__nav button:hover { background: rgba(255,255,255,.1); }

.sinlio-portal--hf05 .sinlio-canvas { min-height: var(--sinlio-page-min-height); }

.sinlio-portal--hf05.sinlio-portal--support .sinlio-canvas { min-height: var(--sinlio-support-page-min-height); }

.sinlio-portal--hf05.sinlio-portal--studio .sinlio-canvas,

.sinlio-portal--hf05.sinlio-portal--billing .sinlio-canvas,

.sinlio-portal--hf05.sinlio-portal--security .sinlio-canvas {

  min-height: var(--sinlio-operational-page-min-height);

}

.sinlio-portal--hf05 .sinlio-section-title { font-size: 20px; line-height: 1.2; color: var(--sinlio-ink); }

.sinlio-portal--hf05 .sinlio-page-context__title,

.sinlio-portal--hf05 h1 { font-size: clamp(25px, 2.2vw, 30px); line-height: 1.18; }

.sinlio-portal--hf05 .sinlio-muted,

.sinlio-portal--hf05 .sinlio-portal__muted { font-size: 14px; color: var(--sinlio-muted); }

.sinlio-portal--hf05 .sinlio-btn { font-size: 14.5px; min-height: 44px; }

.sinlio-portal--hf05 .sinlio-btn--primary {

  background: var(--sinlio-deep);

  border-color: var(--sinlio-deep);

}

.sinlio-portal--hf05 .sinlio-btn--primary:hover { background: var(--sinlio-deep-secondary); }

.sinlio-tabs { border-bottom: 1px solid var(--sinlio-border); background: var(--sinlio-surface); }

.sinlio-tabs__track {

  display: flex;

  gap: 0;

  overflow-x: auto;

  -webkit-overflow-scrolling: touch;

  scrollbar-width: thin;

}

.sinlio-tabs__item {

  flex: 0 0 auto;

  display: inline-flex;

  align-items: center;

  min-height: 46px;

  padding: 0 16px;

  color: var(--sinlio-muted) !important;

  text-decoration: none !important;

  font-size: 14px;

  font-weight: 600;

  border-bottom: 3px solid transparent;

  white-space: nowrap;

  border-radius: 0 !important;

  background: transparent !important;

}

.sinlio-tabs__item:hover { color: var(--sinlio-ink) !important; }

.sinlio-tabs__item.is-active {

  color: var(--sinlio-ink) !important;

  border-bottom-color: var(--sinlio-deep);

  font-weight: 700;

}

.sinlio-portal--hf05 .sinlio-hero {

  background: var(--sinlio-deep) !important;

  color: #fff;

  border-bottom: 0 !important;

}

.sinlio-portal--hf05 .sinlio-hero__kicker,

.sinlio-portal--hf05 .sinlio-hero__text,

.sinlio-portal--hf05 .sinlio-hero__aside-label { color: rgba(255,255,255,.78); }

.sinlio-portal--hf05 .sinlio-hero__title,

.sinlio-portal--hf05 .sinlio-hero__aside-value { color: #fff; }

.sinlio-portal--hf05 .sinlio-hero__motion {

  background: #fff;

  border-radius: 14px;

  padding: 10px;

  border: 1px solid rgba(255,255,255,.2);

}

.sinlio-portal--hf05 .sinlio-hero .sinlio-btn--primary,

.sinlio-portal--hf05 .sinlio-hero .sinlio-btn--accent {

  background: var(--sinlio-accent);

  border-color: var(--sinlio-accent);

  color: #fff;

}

.sinlio-payments-summary {

  display: grid;

  grid-template-columns: repeat(4, minmax(0,1fr));

  gap: 12px;

  padding: 20px 28px;

  background: var(--sinlio-deep);

  color: #fff;

}

.sinlio-payments-summary__item strong {

  display: block;

  font-size: 13px;

  font-weight: 600;

  color: rgba(255,255,255,.7);

  margin-bottom: 4px;

}

.sinlio-payments-summary__item span { font-size: 18px; font-weight: 700; }



/* COMPROBAR-10 annex � documentos de pago */

.sinlio-payments-summary__metrics {

  list-style: none;

  margin: 0;

  padding: 0;

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));

  gap: 12px;

}

.sinlio-payments-summary__metrics a {

  display: block;

  padding: 12px;

  border: 1px solid var(--sinlio-border, #ddd);

  border-radius: 8px;

  text-decoration: none;

  color: inherit;

}

.sinlio-payments-summary__metrics strong { display: block; font-size: 13px; margin-bottom: 4px; }

.sinlio-payment-document-list--desktop { display: none; }

.sinlio-payment-document-list--mobile { display: block; }

.sinlio-payment-document-list__head,

.sinlio-payment-document-list__row {

  display: grid;

  grid-template-columns: 1.4fr 0.9fr 0.7fr 0.7fr 0.7fr 0.8fr 0.8fr 1fr;

  gap: 8px;

  padding: 10px 0;

  border-bottom: 1px solid var(--sinlio-border, #e5e5e5);

  align-items: center;

}

.sinlio-payment-document-list__head { font-weight: 600; font-size: 12px; }

@media (min-width: 960px) {

  .sinlio-payment-document-list--desktop { display: block; }

  .sinlio-payment-document-list--mobile { display: none; }

}

.sinlio-payment-document__timeline ul { margin: 0.5rem 0 0; padding-left: 1.1rem; }



.sinlio-portal--hf05 .sinlio-invite-editorial {

  display: grid;

  grid-template-columns: minmax(0, 1.4fr) minmax(220px, .9fr);

  gap: 28px;

  align-items: center;

  padding: 28px;

  min-height: 360px;

  background: var(--sinlio-surface);

}

.sinlio-portal--hf05 .sinlio-invite__motion { width: min(100%, 280px); }

.sinlio-portal--hf05 .sinlio-support--split { min-height: var(--sinlio-support-page-min-height); }

.sinlio-portal--hf05 .sinlio-support-new { max-width: 880px; padding: 20px 28px 40px; }

.sinlio-portal--hf05 .sinlio-form-grid { grid-template-columns: 1fr 1fr; gap: 18px; }

.sinlio-portal--hf05 .sinlio-composer__surface--tall,

.sinlio-portal--hf05 .sinlio-composer-v2 .sinlio-composer__surface { min-height: 260px; }

.sinlio-portal--hf05 .sinlio-composer-v2 .sinlio-composer__toolbar {

  display: flex;

  flex-wrap: wrap;

  gap: 4px;

  padding: 10px;

  background: #F4F8F7;

}

.sinlio-portal--hf05 .sinlio-composer__count {

  margin: 8px 0 0;

  font-size: 13px;

  color: var(--sinlio-muted);

  text-align: right;

}

.sinlio-attach-grid {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));

  gap: 12px;

  margin-top: 14px;

}

.sinlio-attach-card {

  display: grid;

  grid-template-rows: 110px auto auto;

  border: 1px solid var(--sinlio-border);

  border-radius: 12px;

  overflow: hidden;

  background: var(--sinlio-surface);

}

.sinlio-attach-card__preview {

  background: var(--sinlio-brand-soft);

  display: flex;

  align-items: center;

  justify-content: center;

  overflow: hidden;

}

.sinlio-attach-card__preview img { width: 100%; height: 100%; object-fit: cover; }

.sinlio-attach-card__ext {

  font-size: 13px;

  font-weight: 800;

  letter-spacing: .04em;

  color: var(--sinlio-deep);

  padding: 8px 10px;

  border-radius: 8px;

  background: #fff;

  border: 1px solid var(--sinlio-border);

}

.sinlio-attach-card--pdf .sinlio-attach-card__ext { color: #A94442; }

.sinlio-attach-card--word .sinlio-attach-card__ext { color: #2F5B9A; }

.sinlio-attach-card--sheet .sinlio-attach-card__ext { color: #2F6B54; }

.sinlio-attach-card--zip .sinlio-attach-card__ext { color: #9A6B2F; }

.sinlio-attach-card__body { padding: 10px 12px 4px; }

.sinlio-attach-card__name {

  margin: 0;

  font-size: 13.5px;

  font-weight: 650;

  color: var(--sinlio-ink);

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

}

.sinlio-attach-card__meta { margin: 4px 0 0; font-size: 12.5px; color: var(--sinlio-muted); }

.sinlio-attach-card__remove {

  margin: 0 10px 10px;

  min-height: 36px;

  border: 1px solid var(--sinlio-border);

  background: #fff;

  border-radius: 8px;

  font: inherit;

  font-size: 13px;

  font-weight: 600;

  cursor: pointer;

}

.sinlio-portal--hf05 .sinlio-settings {

  display: grid;

  grid-template-columns: 240px minmax(0,1fr);

  gap: 0;

  min-height: var(--sinlio-operational-page-min-height);

  border: 1px solid var(--sinlio-border);

  background: var(--sinlio-surface);

}

.sinlio-portal--hf05 .sinlio-settings__nav {

  background: #F4F8F7;

  border-right: 1px solid var(--sinlio-border);

  padding: 16px 10px;

}

.sinlio-portal--hf05 .sinlio-settings__nav a {

  display: flex;

  align-items: center;

  gap: 10px;

  min-height: 44px;

  padding: 0 12px;

  border-radius: 8px;

  color: var(--sinlio-text) !important;

  text-decoration: none !important;

  font-weight: 600;

  font-size: 14px;

}

.sinlio-portal--hf05 .sinlio-settings__nav a.is-active {

  background: var(--sinlio-deep);

  color: #fff !important;

}

.sinlio-portal--hf05 .sinlio-settings__main { padding: 24px 28px; }

.sinlio-empty-value { color: var(--sinlio-muted); font-style: italic; }

.sinlio-services-head {

  display: flex;

  justify-content: space-between;

  gap: 16px;

  align-items: flex-end;

  padding: 8px 0 18px;

  border-bottom: 1px solid var(--sinlio-border);

  margin-bottom: 8px;

}

.sinlio-portal--hf05 .sinlio-service-row {

  display: grid;

  grid-template-columns: minmax(0,1.4fr) minmax(160px,.8fr) auto;

  gap: 18px;

  padding: 22px 0;

  border-bottom: 1px solid var(--sinlio-border);

}

@media (max-width: 1023px) {

  .sinlio-payments-summary { grid-template-columns: 1fr 1fr; }

  .sinlio-portal--hf05 .sinlio-invite-editorial { grid-template-columns: 1fr; min-height: 0; }

  .sinlio-portal--hf05 .sinlio-settings { grid-template-columns: 1fr; }

  .sinlio-portal--hf05 .sinlio-settings__nav {

    display: flex;

    overflow-x: auto;

    border-right: 0;

    border-bottom: 1px solid var(--sinlio-border);

  }

  .sinlio-portal--hf05 .sinlio-form-grid { grid-template-columns: 1fr; }

  .sinlio-portal--hf05 .sinlio-composer-v2 .sinlio-composer__surface { min-height: 210px; }

  .sinlio-portal--hf05 .sinlio-service-row { grid-template-columns: 1fr; }

  .sinlio-portal--hf05 .sinlio-canvas { min-height: 0; }

}

@media (max-width: 767px) {

  .sinlio-payments-summary { grid-template-columns: 1fr; }

  .sinlio-attach-grid { grid-template-columns: 1fr 1fr; }

}



/* COMPROBAR-10-HF02 � men� M�s escritorio */

.sinlio-app__nav-more {

  position: relative;

  display: inline-flex;

  align-items: stretch;

}

.sinlio-app__nav-more-toggle {

  cursor: pointer;

  border: 0;

  font: inherit;

}

.sinlio-app__nav-more-panel {

  position: absolute;

  top: calc(100% + 6px);

  right: 0;

  min-width: 220px;

  max-width: 320px;

  background: var(--sinlio-surface, #fff);

  border: 1px solid var(--sinlio-border, #dce7e5);

  border-radius: 10px;

  box-shadow: 0 12px 28px rgba(23, 53, 54, 0.14);

  padding: 0.35rem 0;

  z-index: 50;

}

.sinlio-app__nav-more-panel[hidden] { display: none !important; }

.sinlio-app__nav-more-link {

  display: block;

  padding: 0.65rem 1rem;

  color: inherit;

  text-decoration: none;

  white-space: nowrap;

}

.sinlio-app__nav-more-link:hover,

.sinlio-app__nav-more-link:focus-visible {

  background: var(--sinlio-brand-soft, #e7f3f2);

  outline: none;

}

.sinlio-app__nav-more-link.is-active,

.sinlio-app__nav-more.is-active .sinlio-app__nav-more-toggle {

  font-weight: 700;

  color: var(--sinlio-brand-strong, #356f70);

}

.sinlio-more-sheet__nav a.is-active { font-weight: 700; }



/* PORTAL-CLIENTE-HF02 � instalaciones app layout */

.sinlio-page-intro {

  margin: 0 0 1.25rem;

  max-width: 42rem;

}

.sinlio-page-intro .sinlio-section-title { margin-bottom: 0.35rem; }

.sinlio-installations__summary {

  margin: 0.75rem 0 0;

  font-size: 0.95rem;

  font-weight: 600;

  color: var(--sinlio-deep, #173F40);

}

.sinlio-installations__featured {

  padding: 1.35rem 1.5rem;

  max-width: 52rem;

}

.sinlio-installations__featured-head {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

  gap: 1rem;

  margin-bottom: 1rem;

}

.sinlio-installations__domain {

  margin: 0.15rem 0 0;

  font-size: 1.35rem;

  line-height: 1.25;

  color: var(--sinlio-deep, #173F40);

  word-break: break-word;

}

.sinlio-installations__actions { margin-top: 1.25rem; }

.sinlio-installations__grid {

  display: grid;

  gap: 1rem;

  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));

}

.sinlio-installations__meta {

  list-style: none;

  margin: 0;

  padding: 0;

  display: grid;

  gap: 0.65rem;

}

.sinlio-installations__meta li {

  display: flex;

  justify-content: space-between;

  gap: 0.75rem;

  font-size: 0.95rem;

}

.sinlio-installations__meta span { color: var(--sinlio-muted, #5a6b6a); }

.sinlio-badge--success {

  background: rgba(46, 125, 98, 0.12);

  color: #1f6b52;

}

.sinlio-badge--warning {

  background: rgba(196, 140, 40, 0.14);

  color: #8a5a10;

}

.sinlio-badge--danger {

  background: rgba(176, 60, 60, 0.12);

  color: #9b2c2c;

}

.sinlio-badge--info {

  background: rgba(95, 171, 172, 0.16);

  color: var(--sinlio-deep, #173F40);

}



/* PORTAL-CLIENTE-R1 */

.sinlio-area-subnav {

  display: flex;

  flex-wrap: wrap;

  gap: 0.5rem 0.85rem;

  margin: 0.85rem 0 0;

}

.sinlio-area-subnav a {

  display: inline-flex;

  align-items: center;

  min-height: 44px;

  padding: 0.35rem 0.85rem;

  border-radius: 999px;

  border: 1px solid var(--sinlio-border, #dce7e5);

  background: var(--sinlio-surface, #fff);

  color: var(--sinlio-deep, #173F40);

  text-decoration: none;

  font-size: 0.95rem;

  font-weight: 600;

}

.sinlio-area-subnav a.is-active,

.sinlio-area-subnav a:hover,

.sinlio-area-subnav a:focus-visible {

  border-color: var(--sinlio-brand, #5FABAC);

  background: var(--sinlio-brand-soft, #e7f3f2);

  outline: none;

}

.sinlio-summary-card {

  display: block;

  padding: 1.15rem 1.25rem;

  border: 1px solid var(--sinlio-border, #dce7e5);

  border-radius: 14px;

  background: var(--sinlio-surface, #fff);

  text-decoration: none;

  color: inherit;

  margin-bottom: 1rem;

}

.sinlio-summary-card:hover,

.sinlio-summary-card:focus-visible {

  border-color: var(--sinlio-brand, #5FABAC);

  outline: none;

}

.sinlio-ops--r1 {

  display: grid;

  gap: 1rem;

}

.sinlio-app__nav-more-panel--grouped {

  min-width: 260px;

  max-width: 340px;

  max-height: min(70vh, 480px);

  overflow: auto;

}

.sinlio-app__nav-more-heading,

.sinlio-more-sheet__heading {

  margin: 0.55rem 0 0.15rem;

  padding: 0.35rem 1rem 0.1rem;

  font-size: 0.75rem;

  font-weight: 700;

  letter-spacing: 0.04em;

  text-transform: uppercase;

  color: var(--sinlio-muted, #5a6b6a);

}

.sinlio-app__nav-more-heading:first-child,

.sinlio-more-sheet__heading:first-child { margin-top: 0.15rem; }

.sinlio-app__nav-more-logout { margin: 0; }

.sinlio-app__nav-more-logout .sinlio-app__nav-more-link {

  width: 100%;

  text-align: left;

  background: transparent;

  border: 0;

  cursor: pointer;

}

.sinlio-settings__nav--account {

  display: flex;

  flex-wrap: wrap;

  gap: 0.5rem;

  margin: 0 0 1.25rem;

}

.sinlio-settings__nav--account a {

  display: inline-flex;

  align-items: center;

  min-height: 44px;

  padding: 0.4rem 0.95rem;

  border-radius: 10px;

  border: 1px solid var(--sinlio-border, #dce7e5);

  background: #fff;

  color: var(--sinlio-deep, #173F40);

  text-decoration: none;

  font-weight: 600;

}

.sinlio-settings__nav--account a.is-active {

  background: var(--sinlio-deep, #173F40);

  border-color: var(--sinlio-deep, #173F40);

  color: #fff;

}

.sinlio-payments-billing-action { margin: 1rem 0 0; }

.sinlio-more-sheet__nav--grouped a {

  display: flex;

  align-items: center;

  min-height: 48px;

  padding: 0.65rem 1rem;

  font-size: 1rem;

  text-decoration: none;

  color: inherit;

  border-radius: 10px;

}

.sinlio-more-sheet__nav--grouped a.is-active {

  background: var(--sinlio-brand-soft, #e7f3f2);

  font-weight: 700;

}

@media (min-width: 900px) {

  .sinlio-ops--r1 {

    grid-template-columns: 1fr;

  }

}





/* ============================================================

   PORTAL-CLIENTE-R1-HF01 � active indicator + legal footer

   Marker: SINLIO_PORTAL_CLIENTE_R1_HF01_NAV_LEGAL

   ============================================================ */

.sinlio-portal--hf05 .sinlio-app__nav-link.is-active,

.sinlio-portal--hf04 .sinlio-app__nav-link.is-active,

.sinlio-app__nav-link.is-active {

  border-top: 0 !important;

  box-shadow: none !important;

  border-radius: 0 !important;

}

.sinlio-portal--hf05 .sinlio-app__nav-link.is-active::after,

.sinlio-portal--hf04 .sinlio-app__nav-link.is-active::after,

.sinlio-app__nav-link.is-active::after,

.sinlio-app__nav-link.is-active::before {

  content: none !important;

  display: none !important;

}

.sinlio-portal--hf05 .sinlio-app__nav-link {

  border-bottom: 2px solid transparent;

}

.sinlio-portal--hf05 .sinlio-app__nav-link.is-active {

  border-bottom: 2px solid var(--sinlio-brand-light) !important;

  background: transparent !important;

  color: #fff !important;

  font-weight: 700;

}

.sinlio-app__help { display: none !important; }



.sinlio-app__footer-legal {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  gap: 6px 10px;

  margin: 0 0 10px;

  padding: 0 16px;

  list-style: none;

  font-size: 13px;

  line-height: 1.4;

}

.sinlio-app__footer-legal a {

  color: var(--sinlio-muted, #687879) !important;

  text-decoration: none !important;

}

.sinlio-app__footer-legal a:hover,

.sinlio-app__footer-legal a:focus-visible {

  color: var(--sinlio-ink, #173536) !important;

  text-decoration: underline !important;

  outline: none;

}

.sinlio-app__footer-legal-sep {

  color: var(--sinlio-border, #D7E3E1);

  user-select: none;

}

.sinlio-front--access .sinlio-app__footer-brand { display: none !important; }

.sinlio-legal-doc {

  max-width: 720px;

  margin: 0 auto;

  padding: 32px 20px 64px;

  color: #173536;

  font-size: 15.5px;

  line-height: 1.55;

}

.sinlio-legal-doc h1 { font-size: 28px; margin: 0 0 8px; }

.sinlio-legal-doc .sinlio-legal-meta { color: #687879; font-size: 13px; margin: 0 0 24px; }

.sinlio-legal-doc h2 { font-size: 18px; margin: 28px 0 8px; }

@media print {

  .sinlio-legal-doc { max-width: none; }

}





/* SINLIO_SOPORTE_EDITOR_001 � SupportRichTextComposer */

.sinlio-src {

  display: flex;

  flex-direction: column;

  width: 100%;

  border: 1px solid #c9d4d4;

  border-radius: 10px;

  background: #fff;

  overflow: hidden;

}

.sinlio-src__label-row { padding: 12px 14px 0; }

.sinlio-src__label {

  display: block;

  font-size: 13px;

  font-weight: 600;

  color: #173536;

  margin: 0 0 8px;

}

.sinlio-src__toolbar {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 6px;

  padding: 8px 10px;

  border-top: 1px solid #e4ecec;

  border-bottom: 1px solid #e4ecec;

  background: #f7fafa;

}

.sinlio-src__toolbar-primary,

.sinlio-src__toolbar-more {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 6px;

}

.sinlio-src__btn,

.sinlio-src__block {

  min-width: 36px;

  min-height: 36px;

  padding: 0 10px;

  border: 1px solid #b7c6c6;

  border-radius: 8px;

  background: #fff;

  color: #173536;

  font-size: 14px;

  font-weight: 600;

  cursor: pointer;

  line-height: 1;

}

.sinlio-src__block { min-width: 120px; }

.sinlio-src__btn:hover,

.sinlio-src__btn.is-active,

.sinlio-src__btn[aria-pressed="true"] {

  background: var(--sinlio-brand-soft, #e6f3f0);

  border-color: var(--sinlio-brand, #1f6f63);

  color: var(--sinlio-brand-deep, #0f3f3a);

}

.sinlio-src__btn:focus-visible,

.sinlio-src__block:focus-visible,

.sinlio-src__surface:focus-visible {

  outline: 2px solid var(--sinlio-brand, #1f6f63);

  outline-offset: 2px;

}

.sinlio-src__u { text-decoration: underline; }

.sinlio-src__surface {

  min-height: 220px;

  max-height: 360px;

  overflow-y: auto;

  padding: 14px 16px;

  font-size: 15px;

  line-height: 1.55;

  color: #173536;

  outline: none;

}

.sinlio-src__surface:empty:before {

  content: attr(data-placeholder);

  color: #7a8c8c;

  pointer-events: none;

}

.sinlio-src__fallback {

  position: absolute !important;

  left: -9999px !important;

  width: 1px !important;

  height: 1px !important;

  opacity: 0 !important;

}

.sinlio-src__count {

  margin: 0;

  padding: 4px 14px 8px;

  font-size: 12px;

  color: #687879;

  text-align: right;

}

.sinlio-src__attachments {

  border-top: 1px solid #e4ecec;

  padding: 12px 14px 14px;

  background: #fbfcfc;

}

.sinlio-src__attachments-title {

  margin: 0 0 8px;

  font-size: 13px;

  font-weight: 600;

  color: #173536;

}

.sinlio-src__limits {

  margin: 8px 0 0;

  font-size: 12px;

  color: #687879;

}

.sinlio-src__actions {

  display: flex;

  justify-content: flex-end;

  gap: 10px;

  margin-top: 14px;

  flex-wrap: wrap;

}

.sinlio-src__actions .sinlio-btn--primary {

  min-height: 44px;

  background: var(--sinlio-brand-deep, #0f3f3a);

  border-color: var(--sinlio-brand-deep, #0f3f3a);

}

.sinlio-src__preview {

  position: fixed;

  inset: 0;

  z-index: 100000;

  background: rgba(15, 40, 40, 0.45);

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 20px;

}

.sinlio-src__preview[hidden] { display: none !important; }

.sinlio-src__preview-dialog {

  width: min(640px, 100%);

  max-height: 80vh;

  overflow: auto;

  background: #fff;

  border-radius: 12px;

  padding: 16px;

}

.sinlio-src__preview-head {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-bottom: 12px;

}

.sinlio-support__composer { width: 100%; max-width: none; }

.sinlio-support__reply-context { margin-bottom: 8px; }

@media (max-width: 767px) {

  .sinlio-src__surface { min-height: 180px; max-height: 280px; }

  .sinlio-src__toolbar-more[hidden] { display: none !important; }

  .sinlio-src__btn--more { display: inline-flex; }

}

@media (min-width: 768px) {

  .sinlio-src__btn--more { display: none; }

  .sinlio-src__toolbar-more { display: flex !important; }

}



/* SINLIO_PORTAL_CLIENTE_R2 � WordPress native editor shell */

.sinlio-src--wp {

  border: 1px solid #c9d4d4;

  border-radius: 10px;

  background: #fff;

  padding: 12px 14px 16px;

  width: 100%;

}

.sinlio-src__wp-shell {

  min-height: 220px;

  max-height: 320px;

  overflow: auto;

}

.sinlio-src__wp-shell .wp-editor-wrap,

.sinlio-src__wp-shell .mce-tinymce {

  width: 100% !important;

}

.sinlio-src__wp-shell .mce-edit-area iframe,

.sinlio-src__wp-shell textarea.wp-editor-area {

  min-height: 180px !important;

  font-size: 15px !important;

  line-height: 1.5 !important;

}

.sinlio-src__wp-shell .wp-media-buttons { display: none !important; }

.sinlio-src__attachments { margin-top: 14px; }

.sinlio-src__attachments-title { font-weight: 650; margin: 0 0 8px; }

@media (max-width: 720px) {

  .sinlio-src__wp-shell { min-height: 180px; }

}