:root{--brand:#2454ff;--ink:#14213d;--muted:#6c757d;--soft:#f5f7fb}body{background:var(--soft);color:var(--ink)}.navbar{box-shadow:0 6px 20px rgba(20,33,61,.08)}.hero{padding:64px 0;background:linear-gradient(135deg,#fff,#edf3ff)}.card{border:0;border-radius:18px;box-shadow:0 10px 28px rgba(20,33,61,.08)}.btn{border-radius:12px}.form-control,.form-select{border-radius:12px}.badge-soft{background:#edf3ff;color:#2454ff}.sidebar-card a{text-decoration:none}.table td,.table th{vertical-align:middle}.small-muted{font-size:.88rem;color:var(--muted)}pre{background:#111827;color:#f8fafc;border-radius:14px;padding:16px}.login-shell{min-height:70vh;display:flex;align-items:center}.login-card{max-width:460px;margin:auto}.module-tile{transition:.2s}.module-tile:hover{transform:translateY(-2px)}

/* v0.1.25.5 - Corrección de legibilidad en Módulos
   Bootstrap .bg-light podía pisar el fondo oscuro global de <pre> y dejar código blanco sobre fondo claro. */
.code-readable-light,
pre.code-readable-light,
.modal pre.code-readable-light {
  background: #f8f9fa !important;
  color: #212529 !important;
  border: 1px solid rgba(20,33,61,.12);
  white-space: pre;
  overflow-x: auto;
}
.code-readable-light code,
pre.code-readable-light code,
.modal pre.code-readable-light code {
  color: #212529 !important;
  background: transparent !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.modal .modal-body code:not(pre code) {
  color: #842029;
  background: rgba(132,32,41,.06);
  padding: .12rem .28rem;
  border-radius: .35rem;
}


/* v0.1.26.1 - Mejora visual general */
.nav-brand-icon{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,#2454ff,#7c3aed);color:#fff;box-shadow:0 8px 18px rgba(36,84,255,.25)}
.suite-hero-card{background:linear-gradient(135deg,#ffffff,#eef4ff);border:1px solid rgba(36,84,255,.08);border-radius:24px;padding:24px;box-shadow:0 14px 34px rgba(20,33,61,.08)}
.admin-tile{position:relative;overflow:hidden}.admin-tile:after{content:"";position:absolute;right:-28px;bottom:-28px;width:88px;height:88px;border-radius:50%;background:rgba(36,84,255,.06)}
.tile-icon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;font-size:1.35rem;box-shadow:0 10px 22px rgba(20,33,61,.10)}
.module-logo{width:56px;height:56px;object-fit:contain;border-radius:16px;background:#f8f9fa;border:1px solid rgba(0,0,0,.08);padding:8px}.permission-box{display:flex;gap:.55rem;align-items:flex-start;border:1px solid rgba(20,33,61,.12);border-radius:14px;padding:.75rem;height:100%;background:#fff;transition:.15s}.permission-box:hover{border-color:rgba(36,84,255,.45);box-shadow:0 8px 20px rgba(20,33,61,.06)}
.doc-content h1,.doc-content h2,.doc-content h3{scroll-margin-top:100px}.doc-content{font-size:1rem}.doc-content pre{max-height:560px}

/* v0.1.26.2 - Fix logos de módulos visibles
   Evita que SVG/PNG de módulos con dimensiones internas grandes rompan la grilla. */
.module-card-link {
  overflow: hidden;
}
.module-card-head {
  min-width: 0;
}
.module-logo-box {
  width: 58px;
  height: 58px;
  min-width: 58px;
  max-width: 58px;
  flex: 0 0 58px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: #f8f9fa;
  border: 1px solid rgba(0,0,0,.08);
  overflow: hidden;
}
.module-logo-box img,
img.module-logo {
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  object-fit: contain !important;
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
}
.module-card-title {
  min-width: 0;
}
.module-card-title h5,
.module-card-title small {
  overflow-wrap: anywhere;
}
@media (max-width: 575.98px) {
  .module-logo-box {
    width: 52px;
    height: 52px;
    min-width: 52px;
    max-width: 52px;
    flex-basis: 52px;
  }
  .module-logo-box img,
  img.module-logo {
    width: 38px !important;
    height: 38px !important;
    max-width: 38px !important;
    max-height: 38px !important;
  }
}


/* v0.1.26.3 - Fix definitivo logos de módulos visibles
   Evita que imágenes SVG/PNG con tamaños grandes se rendericen fuera de su tarjeta.
   Se usa fondo CSS controlado + cache bust en app.css. */
.module-card-link,
.module-card-link.card {
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 100% !important;
}
.module-card-link .module-card-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: .75rem !important;
  min-width: 0 !important;
}
.module-card-link .module-logo-box {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  max-width: 58px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  flex: 0 0 58px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 16px !important;
  background: #f8f9fa !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  overflow: hidden !important;
}
.module-card-link .module-logo-bg {
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  display: block !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}
.module-card-link .module-card-title {
  min-width: 0 !important;
  overflow: hidden !important;
}
.module-card-link .module-card-title h5 {
  line-height: 1.2 !important;
}
.module-card-link .badge {
  flex: 0 0 auto !important;
}
