/* Roboto */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../../fonts/roboto/roboto-400.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../../fonts/roboto/roboto-500.woff2") format("woff2");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../../fonts/roboto/roboto-700.woff2") format("woff2");
}

:root {
  --primary-ui-color: #5b3a8c;
  --primary-ui-color-hover: #6f4aa6;
  --primary-ui-color-glow: #8a63c4;
  --bs-body-font-family: "Roboto", sans-serif;
  --bs-font-sans-serif: "Roboto", sans-serif;
  --bs-border-radius: 0.26rem;
  --bs-border-radius-sm: 0.175rem;
  --bs-border-radius-lg: 0.35rem;
  --bs-border-radius-xl: 0.7rem;
  --bs-border-radius-2xl: 1.4rem;
}

.modal-content { --bs-modal-border-radius: 0.35rem; }
.btn { --bs-btn-border-radius: 0.26rem; }
.btn-lg, .btn-group-lg > .btn { --bs-btn-border-radius: 0.35rem; }
.btn-sm, .btn-group-sm > .btn { --bs-btn-border-radius: 0.175rem; }
.card { --bs-card-border-radius: 0.26rem; --bs-card-inner-border-radius: calc(0.26rem - 1px); }
.alert { --bs-alert-border-radius: 0.26rem; }
.badge { --bs-badge-border-radius: 0.26rem; }
.dropdown-menu { --bs-dropdown-border-radius: 0.26rem; --bs-dropdown-inner-border-radius: calc(0.26rem - 1px); }
.list-group { --bs-list-group-border-radius: 0.26rem; }
.navbar-toggler { --bs-navbar-toggler-border-radius: 0.26rem; }
.nav-pills { --bs-nav-pills-border-radius: 0.26rem; }
.nav-tabs { --bs-nav-tabs-border-radius: 0.26rem; }
.accordion { --bs-accordion-border-radius: 0.26rem; --bs-accordion-inner-border-radius: calc(0.26rem - 1px); }
.toast { --bs-toast-border-radius: 0.26rem; }
.tooltip { --bs-tooltip-border-radius: 0.26rem; }
.popover { --bs-popover-border-radius: 0.35rem; --bs-popover-inner-border-radius: calc(0.35rem - 1px); }
.progress, .progress-stacked { --bs-progress-border-radius: 0.26rem; }
.pagination { --bs-pagination-border-radius: 0.26rem; }
.pagination-lg { --bs-pagination-border-radius: 0.35rem; }
.pagination-sm { --bs-pagination-border-radius: 0.175rem; }

.form-control, .form-select { border-radius: 0.26rem; }
.input-group-lg > .form-control, .input-group-lg > .form-select { border-radius: 0.35rem; }
.input-group-sm > .form-control, .input-group-sm > .form-select { border-radius: 0.175rem; }

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--primary-ui-color);
  --bs-btn-border-color: none;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primary-ui-color-hover);
  --bs-btn-hover-border-color: none;
  --bs-btn-focus-shadow-rgb: none;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary-ui-color);
  --bs-btn-active-border-color: none;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #404040;
  --bs-btn-disabled-border-color: none;
}

* {
  font-family: "Roboto", sans-serif;
  font-size: 0.95rem;
}

/* LOGIN/REG */
#login-container {
  background: #f6f3fa;
  color: #241636 !important;
  min-height: calc(100vh - 27px);
  box-sizing: border-box;
  width: 100%;
}

#login-container-child {
  width: 100%;
    color: #241636 !important;
  max-width: 400px;
  background: rgba(255, 255, 255, 1);
  padding: 2.5rem;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}

@media (max-width: 576px) {
  #login-container-child {
    padding: 1.5rem;
  }
}

#login-container-child .input-group-text {
  background: white;
  border: 1px solid #d6d6d6;
  border-right: none;
  color: #666;
  height: 40px;
  display: flex;
  align-items: center;
}

#login-container-child .form-control {
  height: 40px;
  border-left: none;
  color: #212529;
}

#login-container-child .form-control:focus {
  box-shadow: none;
  border-color: #d6d6d6;
}

.flex-copy_footer {
  color: #999;
}


/* TABLAS */
.table-compact * { font-size: 0.85rem; }
.table-compact .badge { font-size: 0.72rem; }
.dataTables_wrapper { max-width: 100%; overflow-x: auto; }
.badge { display: inline-flex; align-items: center; justify-content: center; text-align: center; }

/* NOTIFICACIONES */
.notyf__toast { border-left: 4px solid transparent; }
.notyf__toast--info { border-left-color: #2f82a3; }
.notyf__toast--warning { border-left-color: #b96f00; }
.notyf__toast--success { border-left-color: #5b3a8c; }
.notyf__toast--error { border-left-color: #9c1d2a; }
.notyf__toast--info .notyf__message { color: #123f4f; }
.notyf__toast--warning .notyf__message { color: #4d3300; }
.notyf__toast--success .notyf__message { color: #2a1647; }
.notyf__toast--error .notyf__message { color: #5c1119; }

/* BOTONES PRIMARIOS */
.btn-outline-primary {
  --bs-btn-color: #5b3a8c;
  --bs-btn-border-color: #5b3a8c;
  --bs-btn-hover-bg: #5b3a8c;
  --bs-btn-hover-border-color: #5b3a8c;
  --bs-btn-active-bg: #5b3a8c;
  --bs-btn-active-border-color: #5b3a8c;
}
.text-bg-primary { background-color: #5b3a8c !important; }
.link-primary { color: #5b3a8c !important; }
.form-control:focus, .form-select:focus { border-color: #8a63c4; box-shadow: 0 0 0 .2rem rgba(91, 58, 140, .18); }
.form-check-input:checked { background-color: #5b3a8c; border-color: #5b3a8c; }

/* TARJETAS RESUMEN */
.stat-card { background: #fff; border: 1px solid #e3dcee; border-radius: 4px; padding: .7rem 1rem; height: 100%; }
.stat-card .stat-num { font-size: 1.6rem; font-weight: 700; line-height: 1.1; color: #5b3a8c; }
.stat-card .stat-lbl { font-size: .72rem; text-transform: uppercase; color: #6c757d; font-weight: 600; }

/* BARRA DE FILTROS */
.filter-bar { background: #ffffff; border: 1px solid #e0e0e0; border-radius: 3px; padding: 1rem 1.25rem; }
.filter-bar .form-label { font-size: 0.72rem; font-weight: 600; text-transform: uppercase; color: #4a5157; margin-bottom: 4px; display: block; }

/* EDITOR DE DISEÑO */
.codigo-editor { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important; font-size: .8rem !important; white-space: pre; tab-size: 2; }
.vista-previa-marco { border: 1px solid #d6d6d6; border-radius: 4px; background: #fff; max-height: 70vh; overflow: auto; }
.portada-mini { height: 54px; width: 96px; object-fit: cover; border-radius: 3px; border: 1px solid #d6d6d6; }
.copy-link { max-width: 320px; }
.flatpickr-calendar { z-index: 20000 !important; }
.input-group-btn-stack.ig-btn-stack-narrow > .btn {
  flex: 1 1 100% !important;
  margin-left: 0 !important;
  margin-top: 0.5rem;
  border-radius: var(--bs-btn-border-radius, 0.26rem) !important;
}
@media (max-width: 575.98px) {
  .input-group-btn-stack > .btn {
    flex: 1 1 100% !important;
    margin-left: 0 !important;
    margin-top: 0.5rem;
    border-radius: var(--bs-btn-border-radius, 0.26rem) !important;
  }
}

@media (min-width: 576px) {
  .modal-dialog-ig-wide { --bs-modal-width: 600px; }
}

.tipo-documento-select {
  max-width: 150px;
}
@media (max-width: 575px) {
  .tipo-documento-select {
    max-width: 95px;
  }
}
/* INPUTS NUMÉRICOS */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
}

.fs-wrap { display: flex; align-items: center; gap: .5rem; flex: 1 1 auto; min-width: 0; }
.fs-wrap .input-group { flex: 1 1 0; min-width: 0; }
.fs-wrap .fs-hora { flex: 0 0 38%; }
.fs-wrap .input-group-text { background: #fff; }
.fs-fila { display: flex; align-items: center; gap: .5rem; }
.fs-fila > label { width: 70px; flex-shrink: 0; margin-bottom: 0; }
@media (max-width: 479.98px) { .fs-fila > label { width: 54px; font-size: .7rem; } .fs-wrap .fs-hora { flex: 0 0 40%; } }

.fs-wrap .input-group { flex-wrap: nowrap; }
.fs-wrap .flatpickr-wrapper { display: block; flex: 1 1 auto; width: 1%; min-width: 0; position: relative; }
.fs-wrap .flatpickr-wrapper > .form-control { width: 100%; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.fs-wrap .input-group > .input-group-text + .flatpickr-wrapper > .form-control { margin-left: -1px; }
.fs-wrap .flatpickr-calendar.static { top: 100%; margin-top: 2px; }
.fs-wrap > .fs-fecha:only-child { max-width: 260px; }
/* Selectores de fecha y hora */
.flatpickr-calendar { z-index: 20000 !important; }
@media (max-width: 575.98px) {
  .flatpickr-calendar.open {
    position: fixed !important; top: 50% !important; left: 50% !important; right: auto !important; bottom: auto !important;
    transform: translate(-50%, -50%); margin: 0 !important; max-width: calc(100vw - 1.5rem);
    box-shadow: 0 10px 40px rgba(0, 0, 0, .35);
  }
  .flatpickr-calendar.open:before, .flatpickr-calendar.open:after { display: none !important; }
  body.fs-abierto::after { content: ''; position: fixed; inset: 0; background: rgba(0, 0, 0, .5); z-index: 19999; }
}

/* SPINNER */
.spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  display: none;
  z-index: 1 !important;
  background: rgba(1, 1, 1, 0.8);
  width: 100vw;
  height: 100vh;
}

/* FOOTER */
.pb-footer {
  padding-bottom: 27px;
}

.app-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 27px;
  background: #212529;
  color: rgba(255, 255, 255, 0.6);
  padding: 0 25px;
  z-index: 1030;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}

#app-footer-clock {
  font-size: 0.8rem;
}

/* DASHBOARD */
.stat-hero { padding: 1rem 1.2rem; }
.stat-hero-num { font-size: 3.2rem; font-weight: 700; line-height: 1; color: #5b3a8c; }
.stat-card .stat-lbl i { color: #7d7a86; }
.viz-card { background: #fff; border: 1px solid #e3dcee; border-radius: 4px; padding: 1rem 1.1rem 1rem; height: 100%; }
.viz-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; margin-bottom: .6rem; }
.viz-titulo { margin: 0; font-weight: 600; color: #2b2b2b; }
.viz-sub { font-size: .8rem; color: #6c757d; }
.viz-wrap { position: relative; width: 100%; }
.viz-vacio { text-align: center; color: #6c757d; padding: 4rem 0; }
.viz-tabla { margin-top: .8rem; overflow-x: auto; }
.viz-tabla table { font-size: .85rem; margin: 0; }
.viz-tabla-btn { padding: 0 .25rem; text-decoration: none; font-size: .8rem; white-space: nowrap; }
.viz-tabla-btn { color: #5b3a8c; }

/* MENSAJES */
.msg-preview { background: #f8f6fb; border: 1px solid #e3dcee; border-radius: 4px; padding: .8rem 1rem; white-space: pre-wrap; word-break: break-word; font-size: .95rem; }