/**
 * CoketoCloud — capa visual Coketo Coco (rediseño 2026-10)
 * Se carga después de coketocloud-theme.css. Solo estilos: no cambia
 * estructura, IDs ni comportamiento de modales, menús o filtros.
 * Para revertir: quitar el <link> de este archivo en base.html y login.html.
 */

:root {
  /* Identidad Coketo */
  --ck-green: #2D5F5D;
  --ck-green-dark: #244E4C;
  --ck-green-deep: #1C3F3D;
  --ck-green-soft: #E3EEED;
  --ck-lime: #9AAD0F;
  --ck-lime-bright: #C9DB3A;
  --ck-lime-ink: #5F6B06;
  --ck-lime-soft: #EEF3D2;
  --ck-bg: #F2F5F4;
  --ck-surface: #FFFFFF;
  --ck-surface-2: #F5F7F6;
  --ck-line: #DDE5E3;
  --ck-line-strong: #C5D1CE;
  --ck-text: #1E2B2A;
  --ck-muted: #5D6D6B;
  --ck-text-2: #3E4E4C;
  --ck-neutral-soft: #E8ECEB;
  --ck-ok: #2F7D4E;   --ck-ok-soft: #E2F1E8;
  --ck-warn: #9A6400; --ck-warn-soft: #FBEFD8;
  --ck-crit: #B23A2E; --ck-crit-soft: #F8E3E0;
  --ck-info: #2D6F8F; --ck-info-soft: #E2EEF4;
  --ck-radius: 8px;
  --ck-radius-lg: 12px;
  --ck-shadow: 0 1px 2px rgba(30, 43, 42, .05), 0 2px 10px rgba(30, 43, 42, .05);
  --ck-shadow-md: 0 4px 24px rgba(30, 43, 42, .12);
  --ck-font: "Nunito Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --ck-font-display: "Nunito", "Nunito Sans", "Segoe UI", system-ui, sans-serif;

  /* Re-mapeo del tema existente a la paleta Coketo */
  --cc-navy: var(--ck-green);
  --cc-navy-dark: var(--ck-green-dark);
  --cc-navy-light: var(--ck-green);
  --cc-accent: var(--ck-lime);
  --cc-accent-hover: var(--ck-lime-ink);
  --cc-bg: var(--ck-bg);
  --cc-surface: var(--ck-surface);
  --cc-border: var(--ck-line);
  --cc-border-strong: var(--ck-line-strong);
  --cc-text: var(--ck-text);
  --cc-text-secondary: var(--ck-text-2);
  --cc-muted: var(--ck-muted);
  --cc-sidebar: var(--ck-green);
  --cc-sidebar-text: #D6E6E4;
  --cc-radius: var(--ck-radius);
  --cc-font: var(--ck-font);
  --cc-shadow: var(--ck-shadow);
  --cc-shadow-md: var(--ck-shadow-md);

  --primary: var(--ck-green);
  --blue: var(--ck-green);
  --success: var(--ck-ok);
  --warning: #D08A0A;
  --danger: var(--ck-crit);
  --info: var(--ck-info);
}

html { font-size: 14px; }
body {
  font-family: var(--ck-font);
  color: var(--ck-text);
  background-color: var(--ck-bg);
  font-feature-settings: "tnum" 1;
}
#wrapper #content-wrapper { background-color: var(--ck-bg); }
#content > .container-fluid { max-width: 1480px; padding-top: 1.5rem; }

::selection { background: var(--ck-lime-soft); color: var(--ck-text); }
:focus-visible { outline: 2px solid var(--ck-lime); outline-offset: 2px; }

/* —— Tipografía —— */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--ck-font-display);
  color: var(--ck-text);
  font-weight: 800;
  letter-spacing: -.01em;
}
.cc-page-header {
  border-bottom: 0;
  padding-bottom: .25rem;
  margin-bottom: 1.25rem !important;
}
.cc-page-header h1, .cc-page-header .h3 {
  font-size: 1.75rem;
  font-weight: 900;
  color: var(--ck-text) !important;
}
.cc-page-subtitle { color: var(--ck-muted); font-size: .875rem; }
.text-xs { letter-spacing: .06em; }
.text-gray-800, .text-dark { color: var(--ck-text) !important; }
.text-gray-700 { color: var(--ck-text-2) !important; }
.text-gray-600, .text-muted, .text-secondary { color: var(--ck-muted) !important; }
.text-primary { color: var(--ck-green) !important; }
.text-success { color: var(--ck-ok) !important; }
.text-warning { color: var(--ck-warn) !important; }
.text-danger { color: var(--ck-crit) !important; }
.text-info { color: var(--ck-info) !important; }
.bg-primary, .bg-gradient-primary { background-color: var(--ck-green) !important; background-image: none !important; }
.bg-light { background-color: var(--ck-surface-2) !important; }
.border-left-primary { border-left: 4px solid var(--ck-green) !important; }
.border-left-success { border-left: 4px solid var(--ck-lime) !important; }
.border-left-info { border-left: 4px solid var(--ck-info) !important; }
.border-left-warning { border-left: 4px solid #D08A0A !important; }

a { color: var(--ck-green); }
a:hover { color: var(--ck-green-deep); }

/* —— Sidebar —— */
.sidebar {
  background-color: var(--ck-green) !important;
  background-image: none !important;
  border-right: 0;
}
.sidebar .sidebar-brand {
  height: auto;
  min-height: 4.5rem;
  padding: 1rem .75rem;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  justify-content: flex-start !important;
}
.sidebar.toggled .sidebar-brand { justify-content: center !important; }
.sidebar .sidebar-brand-icon { flex: none; }
.ck-brand-mono {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  background: var(--ck-surface);
  padding: 2px;
  display: block;
  box-shadow: 0 0 0 2px rgba(201, 219, 58, .35);
}
.sidebar .sidebar-brand-text.ck-wordmark {
  font-family: var(--ck-font-display);
  font-weight: 900;
  font-size: 1.25rem;
  line-height: .95;
  letter-spacing: .03em;
  text-align: left;
  color: #fff;
  margin-left: .75rem !important;
  margin-right: 0 !important;
}
.ck-wordmark .ck-coco { display: block; color: var(--ck-lime-bright); }
.ck-wordmark small {
  display: block;
  font-family: var(--ck-font);
  font-weight: 700;
  font-size: .625rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
  margin-top: .35rem;
}
.sidebar .sidebar-heading {
  color: rgba(255, 255, 255, .55) !important;
  font-size: .6875rem;
  letter-spacing: .14em;
  padding-left: 1.25rem;
}
.sidebar hr.sidebar-divider { border-top-color: rgba(255, 255, 255, .1); margin: .5rem 1rem; }
.sidebar .nav-item .nav-link {
  margin: 1px .625rem;
  padding: .625rem .75rem;
  border-radius: var(--ck-radius);
  border-left: 0;
  color: #D6E6E4;
  font-weight: 600;
  font-size: .9rem;
  position: relative;
}
.sidebar .nav-item .nav-link i { color: rgba(255, 255, 255, .6); }
.sidebar .nav-item .nav-link:hover { background-color: rgba(255, 255, 255, .08); color: #fff; }
.sidebar .nav-item .nav-link:hover i { color: #fff; }
.sidebar .nav-item.active > .nav-link {
  background-color: rgba(255, 255, 255, .12);
  color: #fff;
  font-weight: 700;
}
.sidebar .nav-item.active > .nav-link i { color: var(--ck-lime-bright); }
.sidebar .nav-item.active > .nav-link::before {
  content: "";
  position: absolute;
  left: -.625rem;
  top: .5rem;
  bottom: .5rem;
  width: 4px;
  border-radius: 0 4px 4px 0;
  background: var(--ck-lime-bright);
}
.sidebar .collapse-inner {
  background: rgba(0, 0, 0, .14) !important;
  border-radius: var(--ck-radius) !important;
  margin: .25rem .625rem .375rem !important;
  padding: .25rem 0 !important;
}
.sidebar .collapse-header { color: rgba(255, 255, 255, .55) !important; }
.sidebar .collapse-item {
  color: #D6E6E4;
  border-radius: 6px;
  margin: 1px .375rem;
  padding: .5rem .75rem .5rem 1.25rem;
  font-size: .85rem;
  font-weight: 600;
}
.sidebar .collapse-item i { color: rgba(255, 255, 255, .55); }
.sidebar .collapse-item:hover { background-color: rgba(255, 255, 255, .08); color: #fff; }
.sidebar .collapse-item.active {
  background-color: rgba(201, 219, 58, .16);
  color: #fff;
  font-weight: 700;
}
.sidebar .collapse-item.active i { color: var(--ck-lime-bright); }
#sidebarToggle { background-color: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .15); }
#sidebarToggle:hover { background-color: rgba(255, 255, 255, .2); }
/* Sidebar contraído (escritorio): menú emergente con el mismo verde */
@media (min-width: 768px) {
  .sidebar.toggled .nav-item .nav-link { margin: 1px .375rem; text-align: center; }
  .sidebar.toggled .nav-item.active > .nav-link::before { left: -.375rem; }
  .sidebar.toggled .nav-item .collapse .collapse-inner,
  .sidebar.toggled .nav-item .collapsing .collapse-inner {
    background: var(--ck-green-deep) !important;
    box-shadow: var(--ck-shadow-md) !important;
    margin: 0 !important;
  }
}

/* —— Topbar —— */
.topbar {
  height: 3.75rem;
  background: var(--ck-surface) !important;
  border-bottom: 1px solid var(--ck-line);
  position: sticky;
  top: 0;
  z-index: 1020;
}
.cc-topbar-brand { font-family: var(--ck-font-display); font-weight: 900; color: var(--ck-green); }
.cc-topbar-brand img { width: 1.75rem; height: 1.75rem; border-radius: 50%; }
.cc-topbar-meta { font-size: .8125rem; color: var(--ck-muted); }
.cc-topbar-meta .cc-org { font-weight: 800; color: var(--ck-green); font-family: var(--ck-font-display); }
.cc-topbar-meta .ck-date { text-transform: capitalize; }
.topbar .nav-link { color: var(--ck-text-2) !important; font-weight: 600; }
.ck-avatar {
  width: 2.125rem;
  height: 2.125rem;
  border-radius: 50%;
  background: var(--ck-lime-bright);
  color: var(--ck-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ck-font-display);
  font-weight: 900;
  font-size: .8125rem;
  letter-spacing: .02em;
  flex: none;
}
.topbar .ck-user-name { color: var(--ck-text) !important; font-weight: 700; }

/* —— Cards / paneles —— */
.card {
  border: 1px solid var(--ck-line);
  border-radius: var(--ck-radius-lg);
  box-shadow: var(--ck-shadow) !important;
}
.card .card-header {
  background: var(--ck-surface);
  border-bottom: 1px solid var(--ck-line);
  padding: .875rem 1.125rem;
  border-radius: var(--ck-radius-lg) var(--ck-radius-lg) 0 0 !important;
}
.card .card-header h6, .card .card-header .text-primary {
  font-family: var(--ck-font-display);
  color: var(--ck-text) !important;
  font-weight: 800;
  font-size: .95rem;
}
.card .card-header h6 i, .card .card-header .text-primary i { color: var(--ck-green); }
.card .card-body { padding: 1.125rem; }
.card-footer { background: var(--ck-surface-2); border-top: 1px solid var(--ck-line); }

/* KPIs y accesos */
.cc-kpi-card .h5 { font-family: var(--ck-font-display); font-size: 1.75rem; font-weight: 900; }
.cc-kpi-card .fa-2x { color: var(--ck-green) !important; opacity: .25; }
.cc-shortcut-card { border-radius: var(--ck-radius-lg); transition: border-color .15s, box-shadow .15s, transform .15s; }
.cc-shortcut-card:hover { border-color: var(--ck-green); box-shadow: var(--ck-shadow-md) !important; transform: translateY(-1px); }
.cc-shortcut-icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  background: var(--ck-green-soft);
  border: 0;
  color: var(--ck-green);
  font-size: 1.05rem;
}
.cc-shortcut-card:hover .cc-shortcut-icon { background: var(--ck-green); color: #fff; }
.cc-page-intro {
  background: var(--ck-green);
  border: 0;
  border-radius: var(--ck-radius-lg);
  padding: 1.25rem 1.5rem;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.cc-page-intro::after {
  content: "";
  position: absolute;
  right: -2.5rem;
  top: -2.5rem;
  width: 9rem;
  height: 9rem;
  border-radius: 50%;
  background: rgba(201, 219, 58, .18);
}
.cc-page-intro h2 { color: #fff; font-size: 1.25rem; font-weight: 900; }
.cc-page-intro p { color: rgba(255, 255, 255, .8); }

/* —— Botones —— */
.btn {
  border-radius: var(--ck-radius);
  font-weight: 700;
  font-size: .875rem;
  padding: .5rem 1rem;
  transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
}
.btn-sm { padding: .3125rem .7rem; font-size: .8125rem; }
.btn.shadow-sm, .btn.shadow { box-shadow: none !important; }
.btn-primary { background-color: var(--ck-green); border-color: var(--ck-green); color: #fff; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active {
  background-color: var(--ck-green-dark); border-color: var(--ck-green-dark); color: #fff;
}
.btn-primary:focus, .btn-primary.focus { box-shadow: 0 0 0 3px rgba(45, 95, 93, .25) !important; }
.btn-success { background-color: var(--ck-lime); border-color: var(--ck-lime); color: #1E2B2A; }
.btn-success:hover, .btn-success:focus, .btn-success:not(:disabled):not(.disabled):active {
  background-color: #899A0C; border-color: #899A0C; color: #1E2B2A;
}
.btn-secondary { background: var(--ck-surface); border-color: var(--ck-line-strong); color: var(--ck-text); }
.btn-secondary:hover, .btn-secondary:focus { background: var(--ck-surface-2); border-color: var(--ck-line-strong); color: var(--ck-text); }
.btn-outline-primary { color: var(--ck-green); border-color: var(--ck-line-strong); background: var(--ck-surface); }
.btn-outline-primary:hover, .btn-outline-primary:not(:disabled):not(.disabled):active {
  background: var(--ck-green-soft); border-color: var(--ck-green); color: var(--ck-green);
}
.btn-outline-secondary { color: var(--ck-text-2); border-color: var(--ck-line-strong); background: var(--ck-surface); }
.btn-outline-secondary:hover { background: var(--ck-surface-2); color: var(--ck-text); border-color: var(--ck-line-strong); }
.btn-outline-danger { color: var(--ck-crit); border-color: #E6B8B2; background: var(--ck-surface); }
.btn-outline-danger:hover { background: var(--ck-crit-soft); color: var(--ck-crit); border-color: var(--ck-crit); }
.btn-danger { background: var(--ck-crit); border-color: var(--ck-crit); }
.btn-danger:hover { background: #9A3127; border-color: #9A3127; }
.btn-warning { background: #F2C14E; border-color: #F2C14E; color: #3A2A00; }
.btn-warning:hover { background: #E5B03A; border-color: #E5B03A; color: #3A2A00; }
.btn-info { background: var(--ck-info); border-color: var(--ck-info); }
.btn-link { color: var(--ck-green); font-weight: 700; }
.btn:disabled, .btn.disabled { opacity: .55; }

/* —— Tablas —— */
.table { color: var(--ck-text); font-size: .875rem; }
.table thead th, .thead-light th {
  background-color: var(--ck-surface-2) !important;
  color: var(--ck-muted) !important;
  border-color: var(--ck-line) !important;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .06em;
  padding: .7rem .75rem;
}
.table td { border-color: var(--ck-line); vertical-align: middle; }
.table-bordered { border: 1px solid var(--ck-line); border-radius: var(--ck-radius); }
.table-bordered td, .table-bordered th { border-left: 0; border-right: 0; }
.table-hover tbody tr:hover { background-color: var(--ck-green-soft); }
.table-striped tbody tr:nth-of-type(odd) { background-color: var(--ck-surface-2); }
.table .text-right { font-variant-numeric: tabular-nums; }
.table-responsive { border-radius: var(--ck-radius); }

/* Folios clicables */
a.folio-detalle-link {
  color: var(--ck-green) !important;
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px dashed rgba(45, 95, 93, .45);
}
a.folio-detalle-link:hover, a.folio-detalle-link:focus {
  color: var(--ck-green-deep) !important;
  border-bottom-style: solid;
  text-decoration: none;
}
a.folio-prestamo-link {
  color: var(--ck-lime-ink) !important;
  font-weight: 800;
  text-decoration: none;
  background: var(--ck-lime-soft);
  padding: .1rem .45rem;
  border-radius: 5px;
}
a.folio-prestamo-link:hover, a.folio-prestamo-link:focus {
  color: var(--ck-text) !important;
  background: #E2EBB5;
  text-decoration: none;
}

/* —— Badges (pastilla con color semántico) —— */
.badge {
  font-weight: 700;
  font-size: .72rem;
  border-radius: 999px;
  padding: .3em .7em;
  letter-spacing: .01em;
}
.badge-primary { background: var(--ck-green-soft); color: var(--ck-green); }
.badge-success { background: var(--ck-ok-soft); color: var(--ck-ok); }
.badge-warning { background: var(--ck-warn-soft); color: var(--ck-warn) !important; }
.badge-danger { background: var(--ck-crit-soft); color: var(--ck-crit); }
.badge-info { background: var(--ck-info-soft); color: var(--ck-info); }
.badge-secondary { background: var(--ck-neutral-soft); color: var(--ck-text-2); }
.badge-light { background: var(--ck-surface-2); color: var(--ck-text-2); border: 1px solid var(--ck-line); }
.badge-dark { background: var(--ck-text); color: #fff; }

/* —— Alertas —— */
.alert {
  border-radius: var(--ck-radius);
  border: 0;
  border-left: 4px solid transparent;
  font-size: .875rem;
}
.alert-info { background: var(--ck-green-soft); border-left-color: var(--ck-green); color: #1F4442; }
.alert-success { background: var(--ck-ok-soft); border-left-color: var(--ck-ok); color: #1D5234; }
.alert-warning { background: var(--ck-warn-soft); border-left-color: #D08A0A; color: #5E3D00; }
.alert-danger { background: var(--ck-crit-soft); border-left-color: var(--ck-crit); color: #7A2219; }
.alert-secondary { background: var(--ck-surface-2); border-left-color: var(--ck-line-strong); color: var(--ck-text-2); }
.alert .close { opacity: .5; }

/* —— Formularios —— */
.form-control, .custom-select {
  border-color: var(--ck-line-strong);
  border-radius: var(--ck-radius);
  color: var(--ck-text);
  font-size: .875rem;
  height: calc(1.5em + .875rem + 2px);
}
textarea.form-control { height: auto; }
.form-control-sm { height: calc(1.5em + .5rem + 2px); border-radius: 6px; }
.form-control:focus, .custom-select:focus {
  border-color: var(--ck-green);
  box-shadow: 0 0 0 3px rgba(45, 95, 93, .15);
}
.form-control[readonly] { background-color: var(--ck-surface-2); }
label.small.font-weight-bold, label.font-weight-bold { color: var(--ck-text-2) !important; font-weight: 700 !important; }
.input-group-text { background: var(--ck-surface-2); border-color: var(--ck-line-strong); color: var(--ck-muted); }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--ck-green); border-color: var(--ck-green); }
.custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 3px rgba(45, 95, 93, .15); }

/* —— Modales —— */
.modal-backdrop.show { opacity: .45; background: #102220; }
.modal-content {
  border: 0;
  border-radius: var(--ck-radius-lg);
  box-shadow: 0 12px 48px rgba(16, 34, 32, .25);
}
.modal-content > .modal-header:first-child { border-radius: var(--ck-radius-lg) var(--ck-radius-lg) 0 0; }
.modal-content > .modal-footer:last-child { border-radius: 0 0 var(--ck-radius-lg) var(--ck-radius-lg); }
.modal-header {
  background: var(--ck-surface);
  border-bottom: 1px solid var(--ck-line);
  padding: 1rem 1.25rem;
}
.modal-header .modal-title { font-family: var(--ck-font-display); font-weight: 900; font-size: 1.125rem; }
.modal-header .close { opacity: .45; }
.modal-header .close:hover { opacity: .8; }
.modal-header.bg-primary, .modal-header.bg-gradient-primary { background: var(--ck-green) !important; }
.modal-header.bg-primary .modal-title, .modal-header.bg-gradient-primary .modal-title { color: #fff; }
.modal-body { padding: 1.25rem; }
.modal-footer { background: var(--ck-surface-2); border-top: 1px solid var(--ck-line); padding: .875rem 1.25rem; }

/* Cabecera de venta / jabas dentro de modales */
.venta-cabecera .bg-gradient-primary, .venta-cabecera .card-header.bg-gradient-primary { background-color: var(--ck-green) !important; }
.venta-cabecera .bg-gradient-warning { background-color: var(--ck-lime-soft) !important; }
#jabasDetalleModal .border-left-warning { border-left: 4px solid #D08A0A !important; }
#jabasDetalleModal .border-left-info { border-left: 4px solid var(--ck-info) !important; }

/* Pestañas */
.nav-tabs { border-bottom: 1px solid var(--ck-line); }
.nav-tabs .nav-link {
  border: 0;
  border-bottom: 3px solid transparent;
  color: var(--ck-muted);
  font-weight: 700;
  margin-bottom: -1px;
}
.nav-tabs .nav-link:hover { color: var(--ck-text); border-bottom-color: var(--ck-line-strong); }
.nav-tabs .nav-link.active {
  color: var(--ck-green);
  background: transparent;
  border: 0;
  border-bottom: 3px solid var(--ck-lime);
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background: var(--ck-green); }

/* Listas */
.list-group-item { border-color: var(--ck-line); }
.list-group-item-action:hover, .list-group-item-action:focus { background: var(--ck-green-soft); }
.list-group-item.active { background: var(--ck-green); border-color: var(--ck-green); }

/* Dropdown */
.dropdown-menu { border: 1px solid var(--ck-line); border-radius: 10px; box-shadow: var(--ck-shadow-md); padding: .375rem; }
.dropdown-item { border-radius: 6px; font-weight: 600; }
.dropdown-item:hover, .dropdown-item:focus { background: var(--ck-green-soft); color: var(--ck-text); }
.dropdown-item.active, .dropdown-item:active { background: var(--ck-green); color: #fff; }

/* Progreso / spinners */
.progress { background: var(--ck-surface-2); border-radius: 999px; }
.progress-bar { background-color: var(--ck-green); }
.spinner-border.text-primary { color: var(--ck-green) !important; }

/* Paginación y DataTables */
.page-item.active .page-link { background: var(--ck-green); border-color: var(--ck-green); }
.page-link { color: var(--ck-green); border-color: var(--ck-line); }
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .page-item.active .page-link {
  background: var(--ck-green) !important;
  border-color: var(--ck-green) !important;
  color: #fff !important;
}
.dataTables_wrapper .dataTables_filter input {
  border: 1px solid var(--ck-line-strong);
  border-radius: var(--ck-radius);
  padding: .3rem .6rem;
}
.dataTables_wrapper .dataTables_filter input:focus { outline: none; border-color: var(--ck-green); box-shadow: 0 0 0 3px rgba(45, 95, 93, .15); }

/* Footer y utilidades */
.sticky-footer { background: transparent !important; border-top: 1px solid var(--ck-line); }
.scroll-to-top { background: var(--ck-green); border-radius: 50%; }
.scroll-to-top:hover { background: var(--ck-green-dark); }
.shadow, .shadow-sm { box-shadow: var(--ck-shadow) !important; }
.shadow-lg { box-shadow: var(--ck-shadow-md) !important; }
hr { border-top-color: var(--ck-line); }

/* —— Login —— */
body.cc-login {
  background:
    radial-gradient(circle at 12% 18%, rgba(201, 219, 58, .18) 0, transparent 32%),
    radial-gradient(circle at 88% 85%, rgba(45, 95, 93, .14) 0, transparent 38%),
    var(--ck-bg);
}
body.cc-login .cc-login-card { border: 0; border-radius: 16px; box-shadow: 0 20px 60px rgba(30, 43, 42, .14); }
body.cc-login .cc-login-panel {
  background: var(--ck-green);
  padding: 3rem 2.5rem;
  position: relative;
  overflow: hidden;
}
body.cc-login .cc-login-panel::after {
  content: "";
  position: absolute;
  right: -4rem;
  bottom: -4rem;
  width: 14rem;
  height: 14rem;
  border-radius: 50%;
  background: rgba(201, 219, 58, .16);
}
body.cc-login .cc-login-mark {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background: var(--ck-surface);
  border: 0;
  padding: 3px;
  box-shadow: 0 0 0 4px rgba(201, 219, 58, .35);
}
body.cc-login .cc-login-mark img { width: 100%; height: 100%; border-radius: 50%; }
body.cc-login .cc-login-panel h2 {
  font-family: var(--ck-font-display);
  font-weight: 900;
  font-size: 2rem;
  line-height: .95;
  letter-spacing: .03em;
}
body.cc-login .cc-login-panel h2 .ck-coco { display: block; color: var(--ck-lime-bright); }
body.cc-login .cc-login-panel .ck-app {
  display: inline-block;
  margin: .5rem 0 1rem;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
}
body.cc-login .cc-login-form-side { padding: 3rem 2.5rem; }
body.cc-login .cc-login-form-side h1 { font-size: 1.5rem; font-weight: 900; }
body.cc-login .ck-login-mobile-brand { display: none; }
@media (max-width: 991.98px) {
  body.cc-login .ck-login-mobile-brand { display: flex; align-items: center; gap: .625rem; margin-bottom: 1.25rem; }
  body.cc-login .ck-login-mobile-brand img { width: 2.75rem; height: 2.75rem; border-radius: 50%; }
  body.cc-login .ck-login-mobile-brand b { font-family: var(--ck-font-display); font-weight: 900; font-size: 1.125rem; color: var(--ck-green); line-height: 1; }
  body.cc-login .ck-login-mobile-brand b span { color: var(--ck-lime); }
}

/* —— Móvil —— */
@media (max-width: 767.98px) {
  #content > .container-fluid { padding-top: 1rem; }
  .topbar { height: 3.25rem; }
  .cc-page-header h1, .cc-page-header .h3 { font-size: 1.35rem; }
  .sidebar .sidebar-brand { min-height: 3.75rem; padding: .625rem; justify-content: center !important; }
  .ck-brand-mono { width: 2.25rem; height: 2.25rem; }
  .sidebar .nav-item .nav-link { margin: 1px .375rem; }
  .sidebar .nav-item.active > .nav-link::before { left: -.375rem; }
  .form-control { height: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .cc-shortcut-card, .btn { transition: none; }
  .cc-shortcut-card:hover { transform: none; }
}

/* —— Inicio (dashboard) —— */
.ck-scope {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-left: .5rem;
  padding: .1rem .6rem;
  border-radius: 999px;
  background: var(--ck-green-soft);
  color: var(--ck-green);
  font-weight: 700;
  font-size: .75rem;
}
.ck-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.ck-kpi {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  min-width: 0;
  background: var(--ck-surface);
  border: 1px solid var(--ck-line);
  border-radius: var(--ck-radius-lg);
  padding: 1rem 1.125rem .75rem;
  color: var(--ck-text);
  box-shadow: var(--ck-shadow);
  transition: border-color .15s, box-shadow .15s;
}
.ck-kpi:hover { border-color: var(--ck-green); box-shadow: var(--ck-shadow-md); text-decoration: none; color: var(--ck-text); }
.ck-kpi-lbl { font-size: .72rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--ck-muted); }
.ck-kpi-val {
  font-family: var(--ck-font-display);
  font-size: 1.85rem;
  font-weight: 900;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ck-kpi-warn .ck-kpi-val { color: var(--ck-warn); }
.ck-kpi-crit .ck-kpi-val { color: var(--ck-crit); }
.ck-kpi-na { color: var(--ck-muted); }
.ck-kpi-sub { font-size: .8rem; color: var(--ck-muted); }
.ck-kpi-sub b { color: var(--ck-text); }
.ck-spark { width: 100%; height: 36px; margin-top: .35rem; display: block; }
.ck-spark-area { fill: var(--ck-green); opacity: .1; }
.ck-spark-line { fill: none; stroke: var(--ck-green); stroke-width: 2; vector-effect: non-scaling-stroke; }
.ck-spark-dot { fill: var(--ck-lime); }
.ck-meter { display: block; height: 6px; border-radius: 999px; background: var(--ck-crit-soft); margin-top: .65rem; overflow: hidden; }
.ck-meter span { display: block; height: 100%; background: var(--ck-crit); border-radius: 999px; }

.ck-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.ck-side { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.ck-panel { margin-bottom: 0; min-width: 0; }
.ck-panel .table { margin: 0; }
.ck-panel .table thead th { border-top: 0; }
.ck-recientes td { padding: .55rem .75rem; }
.ck-cli { font-weight: 700; line-height: 1.25; }
.ck-sub { font-size: .75rem; color: var(--ck-muted); }
.ck-mov {
  display: inline-block;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: .15rem .45rem;
  border-radius: 5px;
  background: var(--ck-green-soft);
  color: var(--ck-green);
}
.ck-mov-factura { background: var(--ck-lime-soft); color: var(--ck-lime-ink); }
.ck-mov-remision { background: var(--ck-info-soft); color: var(--ck-info); }

.ck-pend-i {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .7rem 1.125rem;
  border-bottom: 1px solid var(--ck-line);
}
.ck-pend-i:last-child { border-bottom: 0; }
.ck-pend-ic {
  width: 2rem;
  height: 2rem;
  flex: none;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ck-warn-soft);
  color: var(--ck-warn);
  font-size: .8rem;
}
.ck-pend-txt { min-width: 0; flex: 1; }
.ck-pend-txt .ck-cli { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-pend-i .btn { flex: none; }
.ck-pend-more { padding: .5rem 1.125rem .75rem; }

.ck-bar-row {
  display: grid;
  grid-template-columns: minmax(0, 7rem) 1fr auto;
  gap: .75rem;
  align-items: center;
  font-size: .82rem;
  margin-bottom: .7rem;
}
.ck-bar-row:last-child { margin-bottom: 0; }
.ck-bar-lbl { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-bar-track { height: 10px; border-radius: 999px; background: var(--ck-surface-2); overflow: hidden; }
.ck-bar-fill { display: block; height: 100%; border-radius: 999px; background: var(--ck-green); }
.ck-bar-fill.ck-bar-top { background: var(--ck-lime); }
.ck-bar-val { font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }

@media (max-width: 1199.98px) {
  .ck-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
  .ck-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
  .ck-kpi { padding: .75rem .875rem .625rem; }
  .ck-kpi-val { font-size: 1.35rem; }
  .ck-scope { margin: .35rem 0 0; }
}
@media (max-width: 479.98px) {
  .ck-kpis { grid-template-columns: minmax(0, 1fr); }
}

/* —— Menú lateral plano (estilo maqueta) —— */
.ck-sidebar .sidebar-heading {
  padding: 1.1rem 1.25rem .4rem;
  margin: 0;
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .16em;
  color: rgba(255, 255, 255, .5) !important;
}
.ck-sidebar .nav-item { margin: 0; }
.ck-sidebar .nav-item .nav-link {
  display: flex;
  align-items: center;
  gap: .7rem;
  width: auto !important;
  margin: 1px .625rem;
  padding: .55rem .75rem;
  font-size: .9rem;
  line-height: 1.25;
}
.ck-sidebar .nav-item .nav-link i { margin: 0 !important; width: 1.1rem; text-align: center; flex: none; font-size: .9rem; }
.ck-sidebar .nav-item .nav-link span { font-size: inherit; }
.ck-sidebar .nav-item .nav-link[target="_blank"] span::after {
  content: "\f35d";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: .6rem;
  margin-left: .4rem;
  opacity: .5;
}
.ck-nav-count {
  margin-left: auto;
  min-width: 1.4rem;
  padding: 0 .45rem;
  border-radius: 999px;
  background: var(--ck-lime-bright);
  color: var(--ck-text);
  font-size: .72rem;
  font-weight: 800;
  line-height: 1.4rem;
  text-align: center;
}
.ck-side-user {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: 1rem 1.25rem;
  margin-left: 0;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.ck-side-user .ck-avatar { width: 2.25rem; height: 2.25rem; }
.ck-side-user-txt { min-width: 0; line-height: 1.25; }
.ck-side-user-txt b { display: block; color: #fff; font-size: .82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-side-user-txt small { display: block; color: rgba(255, 255, 255, .65); font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-sidebar #sidebarToggle { margin: .75rem auto 1rem; }
.ck-sidebar.sidebar { padding-bottom: 0; }

/* Contraído (escritorio): solo íconos */
.ck-sidebar.toggled .sidebar-heading { font-size: 0; padding: .5rem 0 0; }
.ck-sidebar.toggled .sidebar-heading::before {
  content: "";
  display: block;
  height: 1px;
  margin: 0 1rem;
  background: rgba(255, 255, 255, .12);
}
.ck-sidebar.toggled .nav-item .nav-link {
  flex-direction: column;
  gap: .25rem;
  margin: 1px .375rem;
  padding: .6rem .25rem;
  text-align: center;
  font-size: .65rem;
  position: relative;
}
.ck-sidebar.toggled .nav-item .nav-link i { font-size: 1rem; width: auto; }
.ck-sidebar.toggled .nav-item .nav-link span { display: block; font-size: .65rem; }
.ck-sidebar.toggled .nav-item .nav-link[target="_blank"] span::after { display: none; }
.ck-sidebar.toggled .ck-nav-count { position: absolute; top: .3rem; right: .5rem; min-width: 1.1rem; line-height: 1.1rem; font-size: .62rem; padding: 0 .3rem; }
.ck-sidebar.toggled .ck-side-user { justify-content: center; padding: .875rem .25rem; }
.ck-sidebar.toggled .ck-side-user-txt { display: none; }

@media (max-width: 767.98px) {
  .ck-sidebar .sidebar-heading { padding: .8rem .875rem .3rem; }
  .ck-sidebar .nav-item .nav-link { margin: 1px .375rem; padding: .5rem .625rem; min-height: 42px; font-size: .85rem; }
  .ck-side-user { padding: .75rem .875rem; }
}

/* —— Listado comercial: tabla, chips y pie —— */
.ck-filterbar .card-body { padding: .875rem 1.125rem !important; }
.ck-filterbar label { font-size: .72rem !important; letter-spacing: .04em; text-transform: uppercase; }
.ck-listado-head { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; }
.ck-listado-title { display: flex; flex-direction: column; min-width: 0; }
.ck-listado-title .ck-sub { margin-top: .1rem; }
.ck-chips { display: flex; flex-wrap: wrap; gap: .5rem .9rem; margin-left: auto; }
.ck-chip-group { display: flex; flex-wrap: wrap; gap: .35rem; }
.ck-chip {
  border: 1px solid var(--ck-line-strong);
  background: var(--ck-surface);
  color: var(--ck-text-2);
  border-radius: 999px;
  padding: .25rem .75rem;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  transition: background-color .15s, border-color .15s, color .15s;
}
.ck-chip:hover { border-color: var(--ck-green); color: var(--ck-green); }
.ck-chip b { font-weight: 800; opacity: .65; font-variant-numeric: tabular-nums; }
.ck-chip b:empty { display: none; }
.ck-chip[aria-pressed="true"] { background: var(--ck-green); border-color: var(--ck-green); color: #fff; }
.ck-chip[aria-pressed="true"] b { opacity: .85; }
.ck-chip-warn:not([aria-pressed="true"]) { border-color: #E9C98A; background: var(--ck-warn-soft); color: var(--ck-warn); }
.ck-chip-empty:not([aria-pressed="true"]) { display: none; }

.ck-listado .table-responsive { border-radius: 0; }
.ck-listado .dataTables_wrapper { padding: .75rem 1rem 0; }
.ck-listado .dataTables_wrapper .row:last-child { padding-bottom: .75rem; }
.ck-table { border: 0; }
.ck-table thead th { border-top: 0 !important; border-bottom: 1px solid var(--ck-line) !important; }
.ck-table td { padding: .6rem .75rem !important; border-top: 1px solid var(--ck-line); }
.ck-table td .ck-cli { max-width: 22rem; }
.ck-table .ck-obs { max-width: 22rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-table a.folio-detalle-link.ck-link-sub { font-weight: 700; border-bottom-width: 0; }

.ck-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .18rem .6rem;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 800;
  white-space: nowrap;
}
.ck-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ck-pill-ok { background: var(--ck-ok-soft); color: var(--ck-ok); }
.ck-pill-info { background: var(--ck-info-soft); color: var(--ck-info); }
.ck-pill-warn { background: var(--ck-warn-soft); color: var(--ck-warn); }
.ck-pill-cobrar { background: var(--ck-lime-soft); color: var(--ck-lime-ink); }
.ck-pill-crit { background: var(--ck-crit-soft); color: var(--ck-crit); }
.ck-pill-mute { background: var(--ck-neutral-soft); color: var(--ck-muted); }

.ck-row-act { display: inline-flex; align-items: center; gap: .25rem; }
.ck-row-act .ck-act,
.ck-row-act a.folio-detalle-link.ck-act {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  color: var(--ck-muted) !important;
  border: 0;
  border-bottom: 0;
  text-decoration: none;
}
.ck-row-act .ck-act:hover { background: var(--ck-green-soft); color: var(--ck-green) !important; }
@media (hover: hover) and (min-width: 992px) {
  .ck-table tbody tr .ck-row-act .ck-act { opacity: .35; transition: opacity .15s; }
  .ck-table tbody tr:hover .ck-row-act .ck-act,
  .ck-table tbody tr:focus-within .ck-row-act .ck-act { opacity: 1; }
}
.ck-listado-foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .5rem 1rem;
  font-size: .85rem;
  color: var(--ck-muted);
  padding: .75rem 1.125rem;
  border-radius: 0 0 var(--ck-radius-lg) var(--ck-radius-lg) !important;
}
.ck-listado-foot b { color: var(--ck-text); font-variant-numeric: tabular-nums; }

/* —— Panel lateral de detalle (modales de venta y jabas) —— */
.modal.ck-drawer { padding-right: 0 !important; }
.modal.ck-drawer .modal-dialog {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  margin: 0 !important;
  width: 920px;
  max-width: 100% !important;
  height: 100%;
  transform: translateX(100%);
  transition: transform .25s ease-out;
}
.modal.ck-drawer.show .modal-dialog { transform: none; }
.modal.ck-drawer .modal-content {
  height: 100%;
  border-radius: 0;
  border: 0;
  display: flex;
  flex-direction: column;
  box-shadow: -12px 0 48px rgba(16, 34, 32, .22);
}
.modal.ck-drawer .modal-content > .modal-header:first-child,
.modal.ck-drawer .modal-content > .modal-footer:last-child { border-radius: 0; }
.modal.ck-drawer .modal-header {
  padding: 1.1rem 1.5rem;
  border-bottom: 1px solid var(--ck-line);
  position: relative;
}
.modal.ck-drawer .modal-header::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--ck-green);
}
.modal.ck-drawer .ck-drawer-head-jabas::before { background: var(--ck-lime); }
.modal.ck-drawer .modal-title { font-size: 1.2rem; }
.modal.ck-drawer .modal-title small { font-family: var(--ck-font); font-weight: 600; font-size: .8rem; }
.modal.ck-drawer .modal-body {
  flex: 1 1 auto;
  overflow-y: auto;
  max-height: none !important;
  padding: 1.25rem 1.5rem;
}
.modal.ck-drawer .modal-footer { padding: .875rem 1.5rem; justify-content: flex-end; }
.modal.ck-drawer .venta-cabecera > .card { border: 1px solid var(--ck-line) !important; border-radius: var(--ck-radius-lg); box-shadow: none !important; }
.modal.ck-drawer .venta-cabecera .card-header { border-radius: var(--ck-radius-lg) var(--ck-radius-lg) 0 0 !important; }
.modal.ck-drawer .venta-cabecera .card-header.bg-gradient-primary { background: var(--ck-green) !important; }
.modal.ck-drawer .venta-cabecera .card-header.bg-gradient-warning { background: var(--ck-lime-soft) !important; }
.modal.ck-drawer .venta-cabecera .border-left-primary { border-left: 4px solid var(--ck-green) !important; }
.modal.ck-drawer .venta-cabecera .border-left-info { border-left: 4px solid var(--ck-info) !important; }
.modal.ck-drawer .venta-cabecera .border-left-warning { border-left: 4px solid #D08A0A !important; }
.modal.ck-drawer .venta-cabecera .border-left-success { border-left: 4px solid var(--ck-lime) !important; }
.modal.ck-drawer .venta-cabecera .bg-light { background: var(--ck-surface-2) !important; }
.modal.ck-drawer .venta-cabecera .rounded.border { border-color: var(--ck-line) !important; border-radius: var(--ck-radius) !important; }
.modal.ck-drawer h6.text-primary, .modal.ck-drawer h6.text-warning { color: var(--ck-text) !important; font-weight: 800; }
.modal.ck-drawer h6.text-primary i, .modal.ck-drawer h6.text-warning i { color: var(--ck-green); }
@media (max-width: 767.98px) {
  .modal.ck-drawer .modal-dialog { width: 100%; }
  .modal.ck-drawer .modal-header, .modal.ck-drawer .modal-body, .modal.ck-drawer .modal-footer { padding-left: 1rem; padding-right: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .modal.ck-drawer .modal-dialog { transition: none; }
}

/* —— Confirmación dentro del panel —— */
.ck-confirm {
  margin: .75rem 0;
  padding: 1rem 1.125rem;
  border-radius: var(--ck-radius);
  background: var(--ck-surface-2);
  border: 1px solid var(--ck-line);
  border-left: 4px solid var(--ck-crit);
}
.ck-confirm-title { font-family: var(--ck-font-display); font-weight: 900; font-size: 1rem; margin-bottom: .25rem; }
.ck-confirm-text { font-size: .875rem; color: var(--ck-muted); }
.ck-confirm-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .75rem; }

/* —— Avisos flotantes —— */
.ck-toasts {
  position: fixed;
  right: 1.25rem;
  bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
  z-index: 2000;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  max-width: calc(100% - 2.5rem);
}
.ck-toast {
  display: flex;
  align-items: center;
  gap: .65rem;
  max-width: 380px;
  padding: .75rem 1rem;
  border-radius: 10px;
  background: var(--ck-text);
  color: #fff;
  font-weight: 700;
  font-size: .875rem;
  box-shadow: var(--ck-shadow-md);
  animation: ckToastIn .2s ease-out;
  transition: opacity .4s, transform .4s;
}
.ck-toast i { width: 9px; height: 9px; border-radius: 50%; background: var(--ck-lime-bright); flex: none; }
.ck-toast-ok i { background: #5CC08A; }
.ck-toast-warn i { background: #F2C14E; }
.ck-toast-crit i { background: #EF7D70; }
.ck-toast-out { opacity: 0; transform: translateY(6px); }
@keyframes ckToastIn { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) { .ck-toast { animation: none; transition: none; } }

/* —— Barra superior: búsqueda, almacén y avisos —— */
.ck-search { position: relative; flex: 1 1 auto; max-width: 34rem; margin-left: .25rem; }
.ck-search .form-control {
  height: 2.375rem;
  padding-left: 2.25rem;
  padding-right: 2rem;
  background: var(--ck-surface-2);
  border-color: var(--ck-line);
  border-radius: 9px;
}
.ck-search .form-control:focus { background: var(--ck-surface); }
.ck-search .form-control::-webkit-search-cancel-button { display: none; }
.ck-search-ic { position: absolute; left: .8rem; top: 50%; transform: translateY(-50%); color: var(--ck-muted); font-size: .85rem; pointer-events: none; }
.ck-search-kbd {
  position: absolute;
  right: .55rem;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--ck-font);
  font-size: .7rem;
  color: var(--ck-muted);
  background: var(--ck-surface);
  border: 1px solid var(--ck-line);
  border-radius: 4px;
  padding: 0 .35rem;
  box-shadow: none;
}
.ck-search .form-control:focus ~ .ck-search-kbd { display: none; }
.ck-search-list {
  position: absolute;
  top: calc(100% + .375rem);
  left: 0;
  right: 0;
  z-index: 1050;
  max-height: 70vh;
  overflow-y: auto;
  background: var(--ck-surface);
  border: 1px solid var(--ck-line);
  border-radius: 12px;
  box-shadow: var(--ck-shadow-md);
  padding: .375rem;
}
.ck-search-sec { font-size: .66rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ck-muted); padding: .6rem .6rem .25rem; }
.ck-search-empty { font-size: .82rem; color: var(--ck-muted); padding: .5rem .6rem .6rem; }
.ck-search-row { display: flex; align-items: stretch; gap: .25rem; }
.ck-search-row .ck-search-item { flex: 1 1 auto; min-width: 0; }
.ck-search-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .5rem .6rem;
  border-radius: 8px;
  color: var(--ck-text);
  text-decoration: none;
}
.ck-search-item:hover, .ck-search-item.is-hl { background: var(--ck-green-soft); color: var(--ck-text); text-decoration: none; }
.ck-search-ico {
  width: 2rem;
  height: 2rem;
  flex: none;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ck-green-soft);
  color: var(--ck-green);
  font-size: .8rem;
}
.ck-search-ico-cli { background: var(--ck-lime-soft); color: var(--ck-lime-ink); }
.ck-search-txt { min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.ck-search-txt b { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-search-txt .ck-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-search-go { margin-left: auto; font-size: .7rem; font-weight: 800; color: var(--ck-green); opacity: 0; white-space: nowrap; }
.ck-search-item:hover .ck-search-go, .ck-search-item.is-hl .ck-search-go { opacity: 1; }
.ck-search-alt {
  flex: none;
  align-self: center;
  font-size: .72rem;
  font-weight: 800;
  color: var(--ck-crit);
  background: var(--ck-crit-soft);
  border-radius: 6px;
  padding: .3rem .5rem;
  text-decoration: none;
}
.ck-search-alt:hover { color: #fff; background: var(--ck-crit); text-decoration: none; }

.ck-alm {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  height: 2.375rem;
  padding: 0 .4rem 0 .75rem;
  border: 1px solid var(--ck-line);
  border-radius: 9px;
  background: var(--ck-surface);
  font-size: .82rem;
  font-weight: 700;
  color: var(--ck-text);
  cursor: pointer;
}
.ck-alm i { color: var(--ck-green); }
.ck-alm-lbl { color: var(--ck-muted); font-weight: 700; }
.ck-alm select {
  border: 0;
  background: transparent;
  font-weight: 800;
  color: var(--ck-green);
  padding: 0 .25rem;
  cursor: pointer;
  max-width: 10rem;
}
.ck-alm select:focus { outline: none; }
.ck-alm:focus-within { border-color: var(--ck-green); box-shadow: 0 0 0 3px rgba(45, 95, 93, .15); }
.ck-alm-fijo { cursor: default; padding-right: .75rem; color: var(--ck-green); }

.ck-bell { position: relative; }
.topbar .ck-bell i { font-size: 1.05rem; color: var(--ck-muted); }
.ck-bell-count {
  position: absolute;
  top: .55rem;
  right: .2rem;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 .3rem;
  border-radius: 999px;
  background: var(--ck-crit);
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
  line-height: 1.1rem;
  text-align: center;
}
.ck-bell-menu { width: 20rem; max-width: 90vw; }
.ck-bell-menu .dropdown-header { font-size: .66rem; letter-spacing: .12em; color: var(--ck-muted); }
.ck-bell-item { display: flex !important; gap: .65rem; align-items: flex-start; white-space: normal; }
.topbar .topbar-divider { border-right-color: var(--ck-line); height: 2rem; margin: auto .75rem; }

/* —— CxC: antigüedad de saldos —— */
.cxc-page { --cxc-teal: var(--ck-green); --cxc-teal-soft: var(--ck-green-soft); }
.ck-aging .card-body { padding: 1.125rem 1.25rem; }
.ck-aging-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .5rem 1.5rem; margin-bottom: .75rem; }
.ck-aging-total { font-family: var(--ck-font-display); font-size: 1.6rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.ck-aging-venc { text-align: right; font-size: .85rem; color: var(--ck-muted); }
.ck-aging-venc b { color: var(--ck-crit); font-size: 1rem; }
.ck-aging-bar { display: flex; gap: 2px; height: 14px; border-radius: 999px; overflow: hidden; background: var(--ck-surface-2); }
.ck-aging-bar span { display: block; height: 100%; min-width: 3px; }
.ck-ag-corriente { background: var(--ck-ok); }
.ck-ag-d30 { background: var(--ck-lime); }
.ck-ag-d45 { background: #E0B23A; }
.ck-ag-d90 { background: #D9822B; }
.ck-ag-d90mas { background: var(--ck-crit); }
.ck-aging-legend { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem 1rem; margin-top: .9rem; }
.ck-aging-item { display: grid; grid-template-columns: auto 1fr; column-gap: .45rem; align-items: center; font-size: .82rem; }
.ck-aging-item .ck-ag-dot { width: 10px; height: 10px; border-radius: 3px; }
.ck-aging-item .ck-aging-lbl { color: var(--ck-muted); font-weight: 700; }
.ck-aging-item b, .ck-aging-item .ck-sub { grid-column: 2; font-variant-numeric: tabular-nums; }
@media (max-width: 575.98px) { .ck-aging-venc { text-align: left; } }

/* —— Generar venta —— */
.ck-venta { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 1rem; align-items: start; }
.ck-venta-main { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.ck-venta-main .card { margin-bottom: 0; }
.ck-step-head { display: flex; align-items: center; gap: .65rem; flex-wrap: wrap; }
.ck-step-head h6 { font-size: 1rem !important; }
.ck-step-n {
  width: 1.75rem;
  height: 1.75rem;
  flex: none;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ck-green);
  color: #fff;
  font-weight: 800;
  font-size: .8rem;
}
.ck-step-n.is-done { background: var(--ck-lime); color: var(--ck-text); }
.ck-cli-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-bottom: .9rem; }
.ck-cli-name { font-family: var(--ck-font-display); font-weight: 900; font-size: 1.3rem; line-height: 1.2; }
.ck-cli-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.ck-tag {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .75rem;
  font-weight: 700;
  padding: .2rem .55rem;
  border-radius: 6px;
  background: var(--ck-green-soft);
  color: var(--ck-green);
}
.ck-tag i { font-size: .65rem; opacity: .75; }
.ck-cli-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: .75rem 1rem;
  padding: .85rem 1rem;
  border-radius: var(--ck-radius);
  background: var(--ck-surface-2);
}
.ck-cli-grid span { display: block; font-size: .68rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--ck-muted); }
.ck-cli-grid b { font-weight: 700; word-break: break-word; }
.ck-lines td { vertical-align: middle !important; padding: .55rem .75rem !important; }
.ck-lines .input-cantidad-linea { max-width: 110px; margin-left: auto; }
.ck-lines-foot td { background: var(--ck-surface-2); font-weight: 700; color: var(--ck-text-2); font-variant-numeric: tabular-nums; border-top: 1px solid var(--ck-line); }
.ck-lines-total td { font-family: var(--ck-font-display); font-weight: 900; font-size: 1rem; color: var(--ck-text); }
.ck-jabas-empty { padding: .9rem 1.125rem !important; }
#jabasResumenCard .card-footer { border-radius: 0 0 var(--ck-radius-lg) var(--ck-radius-lg) !important; }

.ck-venta-side { position: sticky; top: 4.75rem; min-width: 0; }
.ck-resumen { overflow: hidden; }
.ck-resumen-head {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  padding: 1rem 1.125rem;
  background: var(--ck-green);
  color: #fff;
}
.ck-resumen-head .ck-kpi-lbl { color: rgba(255, 255, 255, .7); }
.ck-resumen-head .ck-sub { color: #fff; font-weight: 700; }
.ck-sum-row { display: flex; justify-content: space-between; gap: .75rem; padding: .35rem 0; font-size: .875rem; color: var(--ck-muted); }
.ck-sum-row b { color: var(--ck-text); font-variant-numeric: tabular-nums; text-align: right; }
.ck-sum-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: .5rem;
  padding-top: .75rem;
  border-top: 1px solid var(--ck-line);
  font-family: var(--ck-font-display);
  font-weight: 900;
}
.ck-sum-total b { font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.ck-resumen-actions { display: flex; flex-direction: column; gap: .5rem; margin-top: 1rem; }
.ck-resumen-actions .btn { margin: 0 !important; }
.ck-resumen-actions #btnGuardarCotizacion { padding: .7rem 1rem; font-size: .95rem; }
.ck-note {
  margin-top: .9rem;
  padding: .6rem .75rem;
  font-size: .78rem;
  color: var(--ck-muted);
  background: var(--ck-surface-2);
  border-left: 3px solid var(--ck-lime);
  border-radius: 0 6px 6px 0;
}
.ck-confirm-ok { border-left-color: var(--ck-green); margin-bottom: 0; }
.ck-warn-inline { color: var(--ck-crit); background: var(--ck-crit-soft); border-radius: 6px; padding: .5rem .65rem; font-weight: 600; }
.ck-modal-head-jabas { border-left: 4px solid var(--ck-lime); }
#modalBuscarCliente .modal-content, #modalBuscarArticulo .modal-content, #modalPrestamoJabas .modal-content { border-radius: var(--ck-radius-lg); }
.search-modal-results { border-color: var(--ck-line) !important; border-radius: var(--ck-radius) !important; }

@media (max-width: 1199.98px) {
  .ck-venta { grid-template-columns: minmax(0, 1fr); }
  .ck-venta-side { position: static; }
}

/* ================================================================
   Modo oscuro (se activa con html[data-theme="dark"] desde la barra)
   ================================================================ */
html[data-theme="dark"] {
  color-scheme: dark;
  --ck-green: #4F928E;
  --ck-green-dark: #5FA39F;
  --ck-green-deep: #8CCBC6;
  --ck-green-soft: #1F3533;
  --ck-lime: #B5CA1E;
  --ck-lime-bright: #C9DB3A;
  --ck-lime-ink: #C6D94A;
  --ck-lime-soft: #2A3110;
  --ck-bg: #0F1817;
  --ck-surface: #162220;
  --ck-surface-2: #1B2927;
  --ck-line: #2A3A38;
  --ck-line-strong: #3A4C4A;
  --ck-text: #E3ECEA;
  --ck-text-2: #C2D0CD;
  --ck-muted: #97A8A5;
  --ck-neutral-soft: #24312F;
  --ck-ok: #5CC08A;   --ck-ok-soft: #173226;
  --ck-warn: #E3A84A; --ck-warn-soft: #33270F;
  --ck-crit: #EF7D70; --ck-crit-soft: #3A1E1B;
  --ck-info: #7FB8D6; --ck-info-soft: #1C2E38;
  --ck-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 2px 10px rgba(0, 0, 0, .25);
  --ck-shadow-md: 0 6px 28px rgba(0, 0, 0, .45);
  --cc-text-secondary: var(--ck-text-2);
  --warning: #E3A84A;
}
html[data-theme="dark"] body,
html[data-theme="dark"] #wrapper #content-wrapper { background-color: var(--ck-bg); color: var(--ck-text); }
html[data-theme="dark"] .sidebar { background-color: #112826 !important; }
html[data-theme="dark"] .ck-brand-mono,
html[data-theme="dark"] body.cc-login .cc-login-mark { background: #fff; }
html[data-theme="dark"] a.folio-detalle-link { border-bottom-color: rgba(140, 203, 198, .45); }

/* Superficies y textos de Bootstrap / SB Admin */
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card .card-header:not([class*="bg-"]),
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .modal-header:not([class*="bg-"]),
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .topbar,
html[data-theme="dark"] .ck-search-list,
html[data-theme="dark"] .page-link { background-color: var(--ck-surface) !important; color: var(--ck-text); }
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] .table-secondary,
html[data-theme="dark"] .table-secondary > td,
html[data-theme="dark"] .table-secondary > th,
html[data-theme="dark"] .table-light,
html[data-theme="dark"] .table-light > td { background-color: var(--ck-surface-2) !important; color: var(--ck-text); }
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-gray-800,
html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .text-body { color: var(--ck-text) !important; }
html[data-theme="dark"] .text-gray-700 { color: var(--ck-text-2) !important; }
html[data-theme="dark"] .text-gray-600,
html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-gray-400,
html[data-theme="dark"] .text-gray-300,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .text-secondary { color: var(--ck-muted) !important; }
html[data-theme="dark"] .text-white-50 { color: rgba(255, 255, 255, .65) !important; }
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-left,
html[data-theme="dark"] .border-right,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] .dropdown-divider,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] hr { border-color: var(--ck-line) !important; }
html[data-theme="dark"] .close { color: var(--ck-text); text-shadow: none; }
html[data-theme="dark"] .dropdown-item { color: var(--ck-text); }
html[data-theme="dark"] .dropdown-header { color: var(--ck-muted); }
html[data-theme="dark"] .modal-backdrop.show { background: #000; opacity: .6; }
html[data-theme="dark"] .shadow, html[data-theme="dark"] .shadow-sm { box-shadow: var(--ck-shadow) !important; }

/* Tablas */
html[data-theme="dark"] .table { color: var(--ck-text); }
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th,
html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered td,
html[data-theme="dark"] .table-bordered th { border-color: var(--ck-line) !important; }
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .thead-light th { background-color: var(--ck-surface-2) !important; color: var(--ck-muted) !important; }
html[data-theme="dark"] .table-hover tbody tr:hover { background-color: var(--ck-green-soft); color: var(--ck-text); }
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, .02); }

/* Formularios */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .custom-select,
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter input,
html[data-theme="dark"] .dataTables_wrapper select {
  background-color: #111C1B;
  border-color: var(--ck-line-strong);
  color: var(--ck-text);
}
html[data-theme="dark"] .form-control::placeholder { color: #6E807D; }
html[data-theme="dark"] .form-control:focus { background-color: #111C1B; color: var(--ck-text); }
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly] { background-color: var(--ck-surface-2); color: var(--ck-muted); }
html[data-theme="dark"] .input-group-text { background: var(--ck-surface-2); border-color: var(--ck-line-strong); color: var(--ck-muted); }
html[data-theme="dark"] select option { background: var(--ck-surface); color: var(--ck-text); }
html[data-theme="dark"] .custom-control-label::before { background-color: #111C1B; border-color: var(--ck-line-strong); }
html[data-theme="dark"] .dataTables_wrapper .dataTables_info,
html[data-theme="dark"] .dataTables_wrapper .dataTables_length,
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter { color: var(--ck-muted); }
html[data-theme="dark"] .page-item.disabled .page-link { color: var(--ck-muted); }

/* Alertas, badges y botones */
html[data-theme="dark"] .alert-info { color: #CFE5E2; }
html[data-theme="dark"] .alert-success { color: #BFE8D0; }
html[data-theme="dark"] .alert-warning { color: #F2D9A8; }
html[data-theme="dark"] .alert-danger { color: #F6C5BF; }
html[data-theme="dark"] .alert-secondary,
html[data-theme="dark"] .alert-light { background: var(--ck-surface-2); color: var(--ck-text-2); border-color: var(--ck-line); }
html[data-theme="dark"] .badge-light { background: var(--ck-surface-2); color: var(--ck-text); border-color: var(--ck-line); }
html[data-theme="dark"] .badge-dark { background: #E3ECEA; color: #0F1817; }
html[data-theme="dark"] .badge-warning.text-dark { color: var(--ck-warn) !important; }
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-outline-primary,
html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .btn-outline-danger,
html[data-theme="dark"] .btn-light { background: var(--ck-surface); border-color: var(--ck-line-strong); color: var(--ck-text-2); }
html[data-theme="dark"] .btn-outline-primary { color: var(--ck-green-deep); }
html[data-theme="dark"] .btn-outline-danger { color: var(--ck-crit); }
html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-outline-secondary:hover { background: var(--ck-surface-2); color: var(--ck-text); }
html[data-theme="dark"] .btn-success,
html[data-theme="dark"] .btn-success:hover { color: #11201E; }
html[data-theme="dark"] .ck-toast { background: #E3ECEA; color: #0F1817; }
html[data-theme="dark"] .ck-search-kbd { background: var(--ck-surface-2); }
html[data-theme="dark"] .ck-chip-warn:not([aria-pressed="true"]) { border-color: #5A4418; }

/* CxC (estilos propios de la pantalla) */
html[data-theme="dark"] .cxc-list-card > .card-header,
html[data-theme="dark"] .cxc-client-footer { background: var(--ck-surface) !important; }
html[data-theme="dark"] .cxc-toolbar,
html[data-theme="dark"] .cxc-kpi,
html[data-theme="dark"] .cxc-sucursal-header,
html[data-theme="dark"] .cxc-detail-table tfoot td { background: var(--ck-surface-2); }
html[data-theme="dark"] .cxc-client-header { background: var(--ck-surface); }
html[data-theme="dark"] .cxc-client-header:hover,
html[data-theme="dark"] .cxc-client-header[aria-expanded="true"] { background: var(--ck-surface-2); }
html[data-theme="dark"] .cxc-meta-pill { background: var(--ck-surface-2); color: var(--ck-text-2); border-color: var(--ck-line); }
html[data-theme="dark"] .cxc-meta-pill.danger { background: var(--ck-crit-soft); color: var(--ck-crit); border-color: #5A2A25; }
html[data-theme="dark"] .cxc-meta-pill.warn { background: var(--ck-warn-soft); color: var(--ck-warn); border-color: #5A4418; }
html[data-theme="dark"] .cxc-meta-pill.favor { background: var(--ck-ok-soft); color: var(--ck-ok); border-color: #24503A; }
html[data-theme="dark"] .cxc-detail-table thead th { background: #23413F; }
html[data-theme="dark"] .cxc-detail-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, .02); }
html[data-theme="dark"] .cxc-folio { background: var(--ck-surface-2); }
html[data-theme="dark"] .cxc-dias-favor { color: var(--ck-ok); }
html[data-theme="dark"] .cxc-dias-vencido { color: var(--ck-crit); }
html[data-theme="dark"] .cxc-sucursal-title { color: var(--ck-green-deep); }

/* Reporte de jabas */
html[data-theme="dark"] .reporte-jabas-cliente-item { background: var(--ck-surface); border-color: var(--ck-line); }
html[data-theme="dark"] .reporte-jabas-cliente-item:hover,
html[data-theme="dark"] .reporte-jabas-cliente-item.active { background: var(--ck-green-soft); border-color: var(--ck-green); box-shadow: none; }
html[data-theme="dark"] .reporte-jabas-cliente-label { color: var(--ck-text); }
html[data-theme="dark"] .reporte-jabas-placeholder { background: var(--ck-surface); border-color: var(--ck-line-strong); color: var(--ck-muted); }
html[data-theme="dark"] .reporte-jabas-cliente-search { background: var(--ck-surface-2); border-color: var(--ck-line); }

/* Soporte IT y Configuración */
html[data-theme="dark"] .error-comentario-dev { background: var(--ck-surface-2); }
html[data-theme="dark"] tr.cursor-pointer:hover { background-color: var(--ck-green-soft); }
html[data-theme="dark"] a.config-detalle-link { color: var(--ck-green-deep); }

/* Botón de tema */
.ck-theme-btn { color: var(--ck-muted) !important; }
.ck-theme-btn:hover { color: var(--ck-text) !important; }
.ck-theme-btn .ck-ic-sun { display: none; }
html[data-theme="dark"] .ck-theme-btn .ck-ic-sun { display: inline-block; }
html[data-theme="dark"] .ck-theme-btn .ck-ic-moon { display: none; }

/* Rellenos verdes con texto blanco: tono más profundo para mantener contraste en oscuro */
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .ck-chip[aria-pressed="true"],
html[data-theme="dark"] .page-item.active .page-link,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
html[data-theme="dark"] .ck-step-n:not(.is-done),
html[data-theme="dark"] .ck-resumen-head,
html[data-theme="dark"] .cc-page-intro,
html[data-theme="dark"] .modal-header.bg-primary,
html[data-theme="dark"] .modal.ck-drawer .venta-cabecera .card-header.bg-gradient-primary,
html[data-theme="dark"] .list-group-item.active { background-color: #34706C !important; border-color: #34706C !important; color: #fff !important; }
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary:focus { background-color: #3E807B !important; border-color: #3E807B !important; }
html[data-theme="dark"] body.cc-login .cc-login-panel { background: #1C3F3D; }
html[data-theme="dark"] body.cc-login {
  background:
    radial-gradient(circle at 12% 18%, rgba(201, 219, 58, .08) 0, transparent 32%),
    radial-gradient(circle at 88% 85%, rgba(79, 146, 142, .12) 0, transparent 38%),
    var(--ck-bg);
}