/* -------------------------------------------------------------------------
   GestFel demo · 90-gestfel-demo-overrides.css
   Ajustes mínimos propios de la demo multi-protectora.
   Mantener este fichero pequeño: las reglas generales viven en los módulos
   numerados 00-60 procedentes de la rama base.
   ------------------------------------------------------------------------- */

@layer overrides {

/* Layout fluido */
.app-main,
.app-content,
.page-content,
.module-list-panel,
.list-dominant-grid,
.list-dominant,
.list-panel,
.table-panel {
  max-width: none;
}

.app-main .table-wrap {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto;
}

.app-main .table-wrap > table.table,
.app-main table.table {
  width: 100%;
}

@media (min-width: 1101px) {
  body.sidebar-collapsed .app-shell,
  body.sidebar-collapsed .app-main,
  body.sidebar-collapsed .app-content,
  body.sidebar-collapsed .page-content {
    width: 100% !important;
    max-width: none !important;
  }

  body.sidebar-collapsed .app-main {
    margin-left: 0 !important;
  }
}

/* Estado crónico: gris tenue y visible. */
.badge.cronico,
.badge.crónico,
.badge[data-status="cronico"],
.badge[data-status="crónico"],
.status-badge.cronico,
.status-badge.crónico,
.health-badge.cronico,
.health-badge.crónico,
.cat-badge.cronico,
.cat-badge.crónico {
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #475569;
}

/* Refuerzo responsive: acciones dentro de celdas pueden expandirse. */
@media (max-width: 720px) {
  .app-main table.table.responsive-list-table td.actions > *,
  .app-main table.table.responsive-list-table td.actions a,
  .app-main table.table.responsive-list-table td.actions button,
  .app-main table.table.responsive-list-table td.actions details,
  .app-main table.table.responsive-list-table td.actions select {
    max-width: none !important;
  }
}

/* Módulo de personalización */
.brand-preview img {
  object-fit: contain;
}

.grid.five {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: .85rem;
}

.brand-theme-preview {
  background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent));
}

/* Panel de personalización */
.branding-page {
  overflow: visible;
}

.branding-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 360px);
  gap: 1.25rem;
  align-items: stretch;
  margin-bottom: 1.25rem;
}

.branding-hero h1 {
  margin: .45rem 0 .35rem;
  font-size: clamp(2rem, 3vw, 3rem);
  letter-spacing: -.04em;
}

.branding-hero-preview,
.branding-card,
.upload-card {
  border: 1px solid var(--gf-line, rgba(15, 36, 55, .10));
  border-radius: 22px;
  background: var(--gf-panel, #fff);
  box-shadow: var(--gf-shadow, 0 16px 42px rgba(15, 36, 55, .06));
}

.branding-hero-preview {
  padding: 1rem;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: .45rem;
  background: linear-gradient(135deg, var(--gf-panel, #ffffff) 0%, var(--gf-panel-soft, var(--brand-soft, #e6f4f1)) 100%);
}

.branding-hero-preview img {
  max-width: 220px;
  max-height: 70px;
  object-fit: contain;
}

.branding-hero-preview strong {
  font-size: 1.25rem;
  color: var(--gf-text, var(--dark));
}

.branding-hero-preview small {
  color: var(--gf-muted, var(--muted));
  line-height: 1.35;
}

.branding-form,
.branding-form label,
.branding-form .field {
  font-size: 1rem;
}

.branding-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 380px);
  gap: 1.25rem;
  align-items: start;
}

.branding-main,
.branding-side {
  min-width: 0;
}

.branding-main {
  display: grid;
  gap: 1rem;
}

.branding-card {
  padding: clamp(1rem, 1.8vw, 1.45rem);
}

.branding-card.sticky {
  position: sticky;
  top: 1rem;
}

.branding-section-title {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.branding-section-title h2 {
  margin: 0 0 .25rem;
  font-size: 1.28rem;
  letter-spacing: -.025em;
}

.branding-section-title p {
  margin: 0;
  color: var(--gf-muted, var(--muted));
  line-height: 1.4;
}

.branding-grid {
  display: grid;
  gap: .9rem;
  margin-bottom: .9rem;
}

.branding-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.branding-form .field,
.branding-form .upload-card,
.branding-form .color-field {
  display: grid;
  gap: .4rem;
  font-weight: 850;
  color: var(--gf-text, var(--dark));
}

.branding-form input[type="text"],
.branding-form input[type="email"],
.branding-form input:not([type]),
.branding-form textarea {
  width: 100%;
  max-width: none;
  min-height: 44px;
  padding: .72rem .85rem;
  border-radius: 14px;
  border: 1px solid var(--gf-line, rgba(15, 36, 55, .16));
  background: var(--gf-panel, #fff);
  font: inherit;
  color: var(--gf-text, var(--dark));
  box-sizing: border-box;
}

.branding-form textarea {
  min-height: 120px;
  resize: vertical;
}

.color-list {
  display: grid;
  gap: .75rem;
  margin-bottom: 1rem;
}

.color-field {
  grid-template-columns: minmax(0, 1fr) 64px;
  align-items: center;
  padding: .55rem .65rem;
  border: 1px solid var(--gf-line, rgba(15, 36, 55, .09));
  border-radius: 16px;
  background: var(--gf-panel-soft, #f8fafc);
}

.color-field input[type="color"] {
  width: 58px;
  height: 38px;
  padding: 0;
  border: 0;
  background: transparent;
  justify-self: end;
}

.branding-upload-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}

.upload-card {
  padding: 1rem;
  box-shadow: none;
  background: var(--gf-panel-soft, #fbfefd);
}

.upload-card span {
  font-weight: 900;
}

.upload-card small {
  color: var(--gf-muted, var(--muted));
  line-height: 1.35;
}

.upload-preview {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 96px;
  margin-top: .75rem;
  padding: .75rem;
  border: 1px solid var(--gf-line, var(--line));
  border-radius: 14px;
  background: var(--gf-panel, #fff);
  overflow: hidden;
}

.upload-preview img {
  display: block;
  max-width: 100%;
  max-height: 112px;
  object-fit: contain;
}

.upload-preview em {
  color: var(--gf-muted, var(--muted));
  font-size: .9rem;
  font-style: normal;
}

.upload-preview--dark {
  background: linear-gradient(135deg, var(--brand-primary), var(--brand-dark));
}

.upload-preview--square {
  aspect-ratio: 1 / 1;
  min-height: 116px;
}

.upload-preview--wide {
  aspect-ratio: 16 / 7;
  min-height: 116px;
}

.upload-preview--wide img {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  border-radius: 10px;
}

.upload-card input[type="file"] {
  width: 100%;
  max-width: 100%;
  min-height: 42px;
  margin-top: .35rem;
  color: var(--gf-muted, var(--muted));
}

.brand-theme-preview {
  border-radius: 20px;
  padding: 1.1rem;
  color: white;
  background: linear-gradient(135deg, var(--brand-primary), var(--brand-accent));
  box-shadow: 0 18px 38px rgba(15, 36, 55, .16);
}

.brand-theme-preview img {
  max-width: 210px;
  max-height: 58px;
  object-fit: contain;
  background: rgba(255,255,255,.15);
  padding: .5rem;
  border-radius: 12px;
}

.brand-theme-preview h3 {
  margin: .85rem 0 .25rem;
  color: #fff;
}

.brand-theme-preview p {
  margin: 0;
  color: rgba(255,255,255,.88);
  line-height: 1.4;
}

.branding-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: .65rem;
  margin-top: 1rem;
}

.branding-actions .btn,
.branding-actions .btn-primary {
  width: 100%;
  justify-content: center;
  min-height: 46px;
}

@media (max-width: 1100px) {
  .branding-hero,
  .branding-layout {
    grid-template-columns: 1fr;
  }
  .branding-card.sticky {
    position: static;
  }
}

@media (max-width: 720px) {
  .branding-grid.two,
  .branding-upload-grid {
    grid-template-columns: 1fr;
  }
  .branding-page {
    padding: 1rem;
  }
  .branding-hero-preview img,
  .brand-theme-preview img {
    max-width: 100%;
  }
}



/* GestFel · aplicación real de branding en portada y login */
.public-nav .brand img,
.login-card img,
.app-brand img,
.sidebar-brand img {
  object-fit: contain;
}

.login-page .login-card {
  border-top: 5px solid var(--brand-primary);
}

.login-page .login-card h1 {
  color: var(--brand-dark);
}

html[data-gestfel-theme="dark"] .login-page .login-card h1 {
  color: var(--gf-text);
}

.login-page .login-card .btn-primary,
.login-page .login-card button[type="submit"] {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
}

.public-hero h1 span,
.public-summary-card-accent strong,
.public-insight-card strong {
  color: var(--brand-primary);
}

.public-hero .btn-primary,
.public-nav .btn-primary {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
}

.public-hero .btn-outline,
.public-nav .btn-outline {
  color: var(--brand-primary);
  border-color: var(--brand-primary);
}

.public-preview .preview-sidebar strong {
  color: var(--brand-primary);
}












/* Footer: las reglas visuales viven en /branding/theme.php (app_settings). */




/* Botón de cierre de modales: centrado garantizado como fallback */
.project-info-modal__close,
.modal-close,
.gallery-modal__close,
.photo-modal__close,
.story-modal__close,
.dialog-close {
  display: inline-grid;
  place-items: center;
}
} /* end @layer overrides */