:root {
  --navy: #0f1829;
  --blue: #2d9cdb;
  --blue2: #1a7ab5;
  --cyan: #5bc8f0;
  --text: #1a2a3a;
  --muted: #6b8499;
  --border: #d0e4f0;
  --bg: #f0f6fc;
  --card: #fff;
  --danger: #e53935;
  --success: #2e7d32;
  --warning: #e65100
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0
}

body {
  font-family: "Outfit", sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 13px
}

#loginScreen {
  position: fixed;
  inset: 0;
  background: var(--navy);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000
}

.lcard {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 20px;
  padding: 2.5rem;
  width: 100%;
  max-width: 400px
}

.llogo {
  text-align: center;
  margin-bottom: 2rem
}

.ltit {
  color: rgba(255, 255, 255, .4);
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 1.5rem
}

.lf {
  margin-bottom: 1rem
}

.lf label {
  display: block;
  font-size: 10px;
  color: rgba(255, 255, 255, .5);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 5px
}

.lf input {
  width: 100%;
  padding: 11px 15px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 10px;
  color: #fff;
  font-family: "Outfit", sans-serif;
  font-size: 14px
}

.lf input:focus {
  outline: none;
  border-color: var(--blue)
}

.lerr {
  background: rgba(229, 57, 53, .15);
  border: 1px solid rgba(229, 57, 53, .3);
  border-radius: 8px;
  padding: 9px 13px;
  font-size: 12px;
  color: #ff8a80;
  margin-bottom: 1rem;
  display: none
}

.lbtn {
  width: 100%;
  padding: 13px;
  background: linear-gradient(135deg, var(--blue), var(--blue2));
  border: none;
  border-radius: 10px;
  color: #fff;
  font-family: "Outfit", sans-serif;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer
}

#appScreen {
  display: none
}

.nav {
  background: var(--navy);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.25rem;
  height: 52px;
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(255, 255, 255, .06)
}

.nav-left {
  display: flex;
  align-items: center;
  gap: 6px
}

.nav-logo-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 12px;
  border-right: 1px solid rgba(255, 255, 255, .1);
  padding-right: 14px
}

.nav-brand {
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.03em;
}

.nav-brand span {
  display: block;
  font-size: 8.5px;
  font-weight: 600;
  color: var(--cyan);
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-top: 2px;
}

.nbtn {
  padding: 6px 13px;
  font-size: 11px;
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, .5);
  cursor: pointer;
  border-radius: 7px;
  font-family: "Outfit", sans-serif;
  font-weight: 500
}

.nbtn:hover {
  background: rgba(255, 255, 255, .08);
  color: #fff
}

.nbtn.active {
  background: rgba(45, 156, 219, .2);
  color: var(--cyan)
}

.nbtn.gold {
  color: #f0a500
}

.nav-right {
  display: flex;
  align-items: center;
  gap: 10px
}

/* Notificaciones en nav */
.nav-notif-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.nav-notif-btn {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .12);
  color: rgba(255, 255, 255, .85);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
  transition: background .15s ease, transform .1s ease;
}

.nav-notif-btn:hover {
  background: rgba(255, 255, 255, .16);
  color: #fff;
}

.nav-notif-btn:active {
  transform: scale(.95);
}

.nav-notif-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  background: #e74c3c;
  color: #fff;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 700;
  padding: 2px 6px;
  min-width: 16px;
  text-align: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.3);
  border: 2px solid #0a121e;
  line-height: 1;
}

.nav-notif-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 380px;
  max-height: 520px;
  background: #fff;
  color: #222;
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .3);
  z-index: 400;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font-family: Outfit, sans-serif;
}

.nav-notif-panel.open {
  display: flex !important;
}

.nav-notif-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #f7fafc 0%, #fff 100%);
}

.nav-notif-head h4 {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  color: #222;
}

.nav-notif-mark {
  background: none;
  border: none;
  color: var(--blue);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  font-family: Outfit, sans-serif;
}

.nav-notif-mark:hover {
  background: rgba(33, 150, 243, .08);
}

.nav-notif-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  background: #f9fafb;
}

.nav-notif-tab {
  flex: 1;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 9px 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  font-family: Outfit, sans-serif;
  transition: color .12s ease, border-color .12s ease;
}

.nav-notif-tab.active {
  color: var(--blue);
  border-bottom-color: var(--blue);
  background: #fff;
}

.nav-notif-list {
  overflow-y: auto;
  max-height: 340px;
  background: #fff;
}

.nav-notif-item {
  display: flex;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid #f2f4f7;
  cursor: pointer;
  transition: background .12s ease;
  align-items: flex-start;
}

.nav-notif-item:hover {
  background: #f7fafc;
}

.nav-notif-item.unread {
  background: #eff6ff;
}

.nav-notif-item.unread:hover {
  background: #dbeafe;
}

.nav-notif-item.unread::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2563eb;
  margin-top: 6px;
  flex-shrink: 0;
}

.nav-notif-item:not(.unread)::before {
  content: "";
  width: 6px;
  flex-shrink: 0;
}

.nav-notif-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}

.nav-notif-body {
  flex: 1;
  min-width: 0;
}

.nav-notif-title {
  font-size: 12px;
  font-weight: 700;
  color: #222;
  margin-bottom: 2px;
  line-height: 1.3;
}

.nav-notif-sub {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.3;
  word-break: break-word;
}

.nav-notif-time {
  font-size: 10px;
  color: #9ca3af;
  margin-top: 4px;
  display: block;
}

.nav-notif-empty {
  padding: 32px 16px;
  text-align: center;
  color: var(--muted);
  font-size: 12px;
}

.nav-notif-foot {
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  background: #f9fafb;
  text-align: center;
}

.avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--cyan));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #fff
}

.nav-logout {
  background: none;
  border: none;
  color: rgba(255, 255, 255, .3);
  cursor: pointer;
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 6px;
  font-family: "Outfit", sans-serif
}

.nav-logout:hover {
  color: #fff;
  background: rgba(255, 255, 255, .08)
}

.page {
  display: none;
  padding: 1.25rem;
  max-width: 1560px;
  margin: 0 auto
}

.page.active {
  display: block;
  animation: fadeIn .2s ease
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(5px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

.ph {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
  gap: 8px
}

.ph h1 {
  font-size: 18px;
  font-weight: 700;
  color: var(--navy)
}

.ph p {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px
}

.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
  margin-bottom: 1.25rem
}

.stat {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 16px
}

.stat.alert-stat {
  border-color: #ffcdd2;
  background: #fff8f8
}

.stat .lbl {
  font-size: 10px;
  color: var(--muted);
  margin-bottom: 5px;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 600
}

.stat .val {
  font-size: 22px;
  font-weight: 700;
  color: var(--navy);
  line-height: 1
}

.stat.alert-stat .val {
  color: var(--danger)
}

.stat .sub {
  font-size: 10px;
  color: var(--muted);
  margin-top: 3px
}

.tabs {
  display: flex;
  gap: 2px;
  border-bottom: 2px solid var(--border);
  margin-bottom: 1rem;
  flex-wrap: wrap
}

.tab {
  padding: 8px 16px;
  font-size: 11px;
  cursor: pointer;
  border: none;
  background: none;
  color: var(--muted);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  white-space: nowrap;
  font-family: "Outfit", sans-serif;
  font-weight: 500
}

.tab:hover {
  color: var(--blue)
}

.tab.active {
  color: var(--blue);
  border-bottom-color: var(--blue);
  font-weight: 700
}

.tab.atab.active {
  color: var(--danger);
  border-bottom-color: var(--danger)
}

.filters {
  display: flex;
  gap: 8px;
  margin-bottom: 1rem;
  flex-wrap: wrap;
  align-items: center
}

.filters select,
.filters input {
  font-size: 11px;
  padding: 6px 10px;
  height: 32px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.table-wrap {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow-x: auto;
  box-shadow: 0 1px 4px rgba(15, 24, 41, .06)
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px
}

th {
  font-weight: 700;
  font-size: 10px;
  color: var(--muted);
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  background: #fafcff;
  text-transform: uppercase;
  letter-spacing: .05em
}

td {
  padding: 9px 12px;
  border-bottom: 1px solid #f0f4f8;
  vertical-align: middle
}

tr:last-child td {
  border-bottom: none
}

tr:hover td {
  background: #f5f9ff
}

tr.fuera td {
  background: #fff8f8
}

tr.fuera td:first-child {
  border-left: 3px solid var(--danger)
}

.btn {
  padding: 7px 14px;
  font-size: 12px;
  cursor: pointer;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font-family: "Outfit", sans-serif;
  font-weight: 500;
  transition: all .15s
}

.btn:hover {
  background: var(--bg);
  border-color: var(--blue)
}

.btn-primary {
  background: linear-gradient(135deg, var(--blue), var(--blue2));
  color: #fff;
  border: none
}

.btn-primary:hover {
  opacity: .9
}

.btn-sm {
  padding: 5px 10px;
  font-size: 11px
}

.btn-icon {
  background: none;
  border: none;
  cursor: pointer;
  padding: 3px 6px;
  color: var(--muted);
  font-size: 13px;
  border-radius: 4px
}

.btn-icon:hover {
  background: var(--bg)
}

.link-btn {
  background: none;
  border: none;
  color: var(--blue);
  font-size: 11px;
  cursor: pointer;
  padding: 0;
  font-weight: 600;
  font-family: "Outfit", sans-serif;
  text-align: left;
  white-space: normal;
  word-break: break-word;
  line-height: 1.3;
  display: inline-block;
  max-width: 100%
}

.link-btn:hover {
  text-decoration: underline
}

.btn-now {
  background: none;
  border: 1px solid var(--blue);
  border-radius: 5px;
  padding: 2px 7px;
  font-size: 10px;
  color: var(--blue);
  cursor: pointer;
  font-family: "Outfit", sans-serif;
  white-space: nowrap;
  margin-left: 4px
}

.btn-now:hover {
  background: var(--blue);
  color: #fff
}

.badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 20px;
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap
}

.b-nueva {
  background: #e3f2fd;
  color: #1565c0
}

.b-proceso {
  background: #fff8e1;
  color: #e65100
}

.b-enviada {
  background: #e8f5e9;
  color: #2e7d32
}

.b-ganada {
  background: #e8f5e9;
  color: #1b5e20
}

.b-perdida {
  background: #ffebee;
  color: #b71c1c
}

.b-fuera {
  background: #ffebee;
  color: #b71c1c;
  font-weight: 700
}

.b-pend {
  background: #f5f5f5;
  color: #424242
}

.b-rec {
  background: #e8f5e9;
  color: #2e7d32
}

.b-np {
  background: #fbe9e7;
  color: #bf360c
}

.b-desc {
  background: #263238;
  color: #cfd8dc
}

.b-ia {
  background: #fff8e1;
  color: #e65100
}

.b-revire {
  background: #ede7f6;
  color: #4527a0
}

.b-gray {
  background: #f5f5f5;
  color: #424242
}

/* Bloque 5/7: clases de badge neutras usadas por comisiones y endosos */
.b-gris {
  background: #f5f5f5;
  color: #424242
}

.b-azul {
  background: #e3f2fd;
  color: #1565c0
}

.b-verde {
  background: #e8f5e9;
  color: #1b5e20
}

.b-rojo {
  background: #ffebee;
  color: #b71c1c
}

.badge-green {
  background: #e8f5e9;
  color: #2e7d32
}

.badge-blue {
  background: #e3f2fd;
  color: #1565c0
}

.cli-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 0 0 8px 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
  max-height: 200px;
  overflow-y: auto;
  z-index: 100
}

.cli-dropdown.open {
  display: block
}

.cli-dd-item {
  padding: 8px 12px;
  cursor: pointer;
  font-size: 12px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center
}

.cli-dd-item:last-child {
  border-bottom: none
}

.cli-dd-item:hover {
  background: #e3f2fd
}

.cli-dd-item .cli-dd-name {
  font-weight: 600;
  color: var(--navy)
}

.cli-dd-item .cli-dd-meta {
  font-size: 10px;
  color: var(--muted)
}

/* ─── MODAL TABS ───────────────────────────────── */
.pol-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--border);
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.pol-tab {
  padding: 7px 14px;
  font-size: 11px;
  cursor: pointer;
  border: none;
  background: none;
  color: var(--muted);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  white-space: nowrap;
  font-family: "Outfit", sans-serif;
  font-weight: 500;
  transition: all .15s;
}
.pol-tab:hover { color: var(--blue); }
.pol-tab.active { color: var(--blue); border-bottom-color: var(--blue); font-weight: 700; }
.pol-sec { display: none; }
.pol-sec.active { display: block; }

/* ─── RECIBO WORKFLOW CARDS ────────────────────── */
.rec-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 6px;
}
.rec-card.rec-vencido { border-color: var(--danger); background: #fff5f5; }
.rec-steps {
  display: flex;
  gap: 3px;
  margin-top: 6px;
}
.rec-step {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border);
}
.rec-step.done { background: var(--success); }
.rec-step.current { background: var(--blue); }

.b-sinenv {
  background: #eceff1;
  color: #546e7a
}

.b-fisica {
  background: #e8f5e9;
  color: #1b5e20
}

.b-moral {
  background: #e3f2fd;
  color: #1565c0
}

.b-socio {
  background: #e3f2fd;
  color: #0d47a1
}

.b-empl {
  background: #e8f5e9;
  color: #2e7d32
}

.b-ejec {
  background: #e0f4fc;
  color: #1a7ab5
}

.b-portal {
  background: #f3e5f5;
  color: #6a1b9a
}

.b-nuevo {
  background: #fff3e0;
  color: #e65100
}

.b-existente {
  background: #e8f5e9;
  color: #2e7d32
}

.b-fianza {
  background: #0f1829;
  color: #5bc8f0
}

.b-seg {
  background: #e3f2fd;
  color: #0d47a1
}

.tb {
  font-size: 10px;
  padding: 3px 8px;
  border-radius: 20px;
  display: inline-flex;
  align-items: center;
  font-weight: 600
}

.tb-ok {
  background: #e8f5e9;
  color: #2e7d32
}

.tb-warn {
  background: #fff8e1;
  color: #f57f17
}

.tb-over {
  background: #ffebee;
  color: #c62828
}

.overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(10, 18, 30, .72);
  z-index: 200;
  align-items: flex-start;
  justify-content: center;
  padding: 1rem;
  overflow-y: auto;
  backdrop-filter: blur(3px)
}

.overlay.open {
  display: flex
}

.overlay.z300 {
  z-index: 300
}

.tmodal {
  background: var(--bg);
  border-radius: 16px;
  width: 100%;
  max-width: 1440px;
  margin: auto;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(10, 18, 30, .4);
  border-top: 4px solid transparent
}

/* Acento de color por módulo — se aplica al borde superior del modal */
.tmodal.mod-cot    { border-top-color: #3b82f6 } /* Cotización — azul */
.tmodal.mod-em     { border-top-color: #f59e0b } /* Emisión — ámbar */
.tmodal.mod-pol    { border-top-color: #10b981 } /* Póliza — verde */
.tmodal.mod-cli    { border-top-color: #8b5cf6 } /* Cliente — morado */

.tmodal-nav {
  background: var(--navy);
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 52px;
  gap: 10px
}

/* Pill identificador de módulo en el header */
.tm-modbadge {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .6px;
  text-transform: uppercase;
  padding: 4px 9px;
  border-radius: 6px;
  color: #fff;
  margin-right: 10px;
  flex-shrink: 0;
  font-family: "Outfit", sans-serif
}
.tm-modbadge.mod-cot { background: #3b82f6 }
.tm-modbadge.mod-em  { background: #f59e0b }
.tm-modbadge.mod-pol { background: #10b981 }
.tm-modbadge.mod-cli { background: #8b5cf6 }

.tmodal-nav h2 {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.tmnr {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0
}

.tm-est-sel {
  font-size: 11px;
  padding: 5px 9px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 7px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  font-family: "Outfit", sans-serif
}

.tmodal-body {
  padding: 1.25rem;
  max-height: 88vh;
  overflow: hidden
}

.tmodal-layout {
  display: grid;
  grid-template-columns: 280px 340px 1fr;
  gap: 12px;
  align-items: start
}

.dcard {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 10px
}

.dcard-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px
}

.dcard h3 {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em
}

.bita-title-link {
  font-size: 10px;
  font-weight: 700;
  color: var(--blue);
  text-transform: uppercase;
  letter-spacing: .07em;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  font-family: "Outfit", sans-serif;
  text-decoration: underline;
  text-underline-offset: 2px;
  margin-bottom: 8px;
  display: inline-block
}

.irow {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 5px 0;
  font-size: 11px;
  border-bottom: 1px solid #f0f4f8;
  gap: 8px
}

.irow:last-child {
  border-bottom: none
}

.irow .il {
  color: var(--muted);
  flex-shrink: 0;
  font-size: 10px
}

.irow .iv {
  font-weight: 600;
  text-align: right;
  word-break: break-word;
  max-width: 160px;
  font-size: 11px
}

.edit-field {
  margin-bottom: 7px
}

.edit-field label {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  display: block;
  margin-bottom: 3px;
  font-weight: 600
}

.edit-field input,
.edit-field select,
.edit-field textarea {
  font-size: 11px;
  padding: 6px 9px;
  border: 1px solid var(--border);
  border-radius: 7px;
  width: 100%;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.edit-field input:focus,
.edit-field select:focus,
.edit-field textarea:focus {
  outline: none;
  border-color: var(--blue)
}

.edit-actions {
  display: flex;
  gap: 6px;
  margin-top: 10px
}

.bita-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 8px
}

.bita-tab {
  padding: 4px 10px;
  font-size: 10px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--card);
  color: var(--muted);
  cursor: pointer;
  font-family: "Outfit", sans-serif
}

.bita-tab.active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy)
}

.bita-list {
  max-height: 155px;
  overflow-y: auto
}

.bitem {
  border-left: 2px solid var(--border);
  padding: 4px 10px;
  margin-bottom: 6px
}

.bitem.aseg {
  border-left-color: var(--blue)
}

.bitem.cliente {
  border-left-color: #4caf50
}

.bitem.sistema {
  border-left-color: #e0e0e0
}

.bitem .bf {
  font-size: 10px;
  color: var(--muted);
  display: flex;
  gap: 8px;
  flex-wrap: wrap
}

.bitem .bf .bu {
  font-weight: 600;
  color: var(--blue)
}

.bitem .bn {
  font-size: 11px;
  color: var(--text)
}

.add-nota {
  display: flex;
  gap: 5px;
  margin-top: 8px
}

.add-nota select,
.add-nota input {
  font-size: 11px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.add-nota select {
  width: 100px
}

.add-nota input {
  flex: 1
}

.bc-section {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .65rem;
  margin-bottom: 10px
}

.bc-section h3 {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 10px
}

.bc-list {
  max-height: 110px;
  overflow-y: auto;
  margin-bottom: 8px
}

.bc-item {
  padding: 8px 10px;
  border-bottom: 1px solid #f0f4f8;
  font-size: 11px
}

.bc-item:last-child {
  border-bottom: none
}

.bc-item:hover {
  background: #f5f9ff
}

.bc-item .bc-meta {
  display: flex;
  gap: 5px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 2px
}

.bc-tipo {
  font-size: 10px;
  font-weight: 700;
  color: var(--blue)
}

.bc-medio {
  font-size: 10px;
  color: var(--muted);
  background: #f5f5f5;
  padding: 1px 6px;
  border-radius: 10px
}

.bc-contacto {
  font-size: 10px;
  color: var(--muted);
  font-style: italic
}

.bc-fecha {
  font-size: 10px;
  color: var(--muted)
}

.bc-texto {
  color: var(--text);
  line-height: 1.5;
  font-size: 11px
}

.bc-form {
  background: #f8fcff;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px
}

.bc-form-grid {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 6px
}

.bc-form-grid .fg {
  display: flex;
  flex-direction: column;
  gap: 3px
}

.bc-form-grid label {
  font-size: 10px;
  color: var(--muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em
}

.bc-form-grid input,
.bc-form-grid select {
  font-size: 11px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.bc-form-grid input:focus,
.bc-form-grid select:focus {
  outline: none;
  border-color: var(--blue)
}

.bc-txt-row {
  display: flex;
  gap: 6px;
  margin-top: 4px
}

.bc-txt-row input {
  flex: 1;
  font-size: 11px;
  padding: 6px 9px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-family: "Outfit", sans-serif
}

.bc-txt-row input:focus {
  outline: none;
  border-color: var(--blue)
}

.aseg-section {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem
}

.aseg-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 6px
}

.aseg-top h3 {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em
}

.aseg-add-row {
  display: flex;
  gap: 6px;
  align-items: center
}

.aseg-add-row select {
  font-size: 11px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.aseg-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 7px;
  margin-bottom: 10px
}

.aseg-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 9px 11px;
  cursor: pointer;
  transition: all .2s;
  position: relative
}

.aseg-card:hover {
  border-color: var(--blue);
  transform: translateY(-1px)
}

.aseg-card.active-card {
  border-color: var(--navy);
  border-width: 2px;
  background: #f0f6fc
}

.aseg-card .badge {
  white-space: normal;
  line-height: 1.25;
  display: inline-block;
  max-width: 100%;
  word-break: break-word
}

.aseg-card .ac-name {
  font-size: 11px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  padding-right: 16px
}

.aseg-card .ac-motivo {
  font-size: 9px;
  color: #b71c1c;
  font-style: italic;
  margin-top: 4px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden
}

.aseg-card .ac-last {
  font-size: 9px;
  color: var(--muted);
  margin-top: 4px;
  line-height: 1.4
}

.ac-del {
  position: absolute;
  top: 5px;
  right: 5px;
  opacity: 0;
  font-size: 12px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--muted);
  padding: 1px 3px;
  border-radius: 3px
}

.aseg-card:hover .ac-del {
  opacity: 1
}

.ac-del:hover {
  color: var(--danger);
  background: #ffebee
}

.sl-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff9800;
  display: inline-block;
  margin-left: 3px;
  vertical-align: middle
}

.aseg-modulo {
  background: var(--card);
  border: 2px solid var(--navy);
  border-radius: 12px;
  overflow: hidden;
  margin-top: 8px
}

.aseg-mod-hdr {
  background: var(--navy);
  padding: 10px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px
}

.amh-name {
  color: #fff;
  font-size: 13px;
  font-weight: 700
}

.amh-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0
}

.sl-toggle {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  cursor: pointer;
  color: rgba(255, 255, 255, .7);
  font-family: "Outfit", sans-serif
}

.sl-toggle input {
  width: 12px;
  height: 12px;
  accent-color: #ff9800
}

.aseg-mod-body {
  padding: 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px
}

.accion-form {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px
}

.accion-form h4 {
  font-size: 10px;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .06em
}

.af-field {
  margin-bottom: 8px
}

.af-field label {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  display: block;
  margin-bottom: 3px;
  font-weight: 600
}

.af-field input,
.af-field select,
.af-field textarea {
  font-size: 12px;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  width: 100%;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.af-field input:focus,
.af-field select:focus,
.af-field textarea:focus {
  outline: none;
  border-color: var(--blue)
}

.af-field textarea {
  resize: vertical;
  min-height: 55px
}

.accion-btns {
  display: flex;
  gap: 6px;
  margin-top: 10px;
  flex-wrap: wrap
}

.aseg-bita-mod {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px
}

.aseg-bita-mod h4 {
  font-size: 10px;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .06em
}

.ab-list {
  max-height: 280px;
  overflow-y: auto
}

.ab-item {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  font-size: 11px
}

.ab-item:last-child {
  border-bottom: none
}

.ab-item:hover {
  background: #f5f9ff
}

.ab-item .ab-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 3px;
  gap: 6px;
  flex-wrap: wrap
}

.ab-item .ab-accion {
  font-weight: 700;
  color: var(--navy)
}

.ab-item .ab-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap
}

.ab-item .ab-fecha {
  font-size: 10px;
  color: var(--muted)
}

.ab-item .ab-user {
  font-size: 10px;
  color: var(--blue);
  font-weight: 600
}

.ab-item .ab-nota {
  color: var(--text);
  line-height: 1.5
}

.ab-empty {
  text-align: center;
  padding: 1.5rem;
  color: var(--muted);
  font-size: 12px
}

.fz-section {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem
}

.fz-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 8px
}

.fz-section-header h3 {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em
}

.fz-btn-row {
  display: flex;
  gap: 7px;
  flex-wrap: wrap
}

.fz-resumen {
  margin-bottom: 10px
}

.fz-afianz-section {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border)
}

.fz-afianz-title {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center
}

.fz-afianz-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 7px;
  margin-bottom: 8px
}

.fz-afianz-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 9px 11px;
  cursor: pointer;
  transition: all .2s;
  position: relative
}

.fz-afianz-card:hover {
  border-color: var(--blue);
  transform: translateY(-1px)
}

.fz-afianz-card.active-card {
  border-color: var(--navy);
  border-width: 2px;
  background: #f0f6fc
}

.fz-afianz-card .fac-name {
  font-size: 11px;
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 4px;
  padding-right: 14px
}

.fz-afianz-card .fac-last {
  font-size: 9px;
  color: var(--muted);
  margin-top: 3px
}

.fac-del {
  position: absolute;
  top: 5px;
  right: 5px;
  opacity: 0;
  font-size: 12px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--muted);
  padding: 1px 3px;
  border-radius: 3px
}

.fz-afianz-card:hover .fac-del {
  opacity: 1
}

.fac-del:hover {
  color: var(--danger);
  background: #ffebee
}

.sub-modal {
  background: var(--bg);
  border-radius: 16px;
  width: 100%;
  max-width: 900px;
  margin: auto;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(10, 18, 30, .4)
}

.sub-modal-nav {
  background: var(--navy);
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 48px
}

.sub-modal-nav h3 {
  color: #fff;
  font-size: 14px;
  font-weight: 700
}

.sub-modal-body {
  padding: 1.25rem;
  max-height: 85vh;
  overflow-y: auto
}

.exp-track {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 16px
}

.exp-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--card);
  cursor: pointer;
  transition: all .15s
}

.exp-step:hover {
  border-color: var(--blue);
  background: #f0f8ff
}

.exp-step.completado {
  background: #e8f5e9;
  border-color: #a5d6a7
}

.exp-step .es-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  flex-shrink: 0;
  background: var(--card)
}

.exp-step.completado .es-icon {
  background: #2e7d32;
  border-color: #2e7d32;
  color: #fff
}

.exp-step .es-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  flex: 1
}

.exp-step.completado .es-label {
  color: #2e7d32
}

.exp-step .es-fecha {
  font-size: 10px;
  color: var(--muted);
  flex-shrink: 0
}

.doc-progress {
  background: #e3f2fd;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 12px;
  color: #1565c0;
  margin-bottom: 14px
}

.doc-progress-bar {
  height: 6px;
  background: #e0e0e0;
  border-radius: 3px;
  margin-top: 6px;
  overflow: hidden
}

.doc-progress-fill {
  height: 100%;
  background: var(--blue);
  border-radius: 3px;
  transition: width .3s
}

.doc-check-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  margin-bottom: 4px;
  border: 1px solid transparent
}

.doc-check-item:hover {
  background: #f0f8ff;
  border-color: var(--border)
}

.doc-check-item.checked {
  background: #e8f5e9;
  border-color: #a5d6a7
}

.doc-check-item.omitido {
  background: #fff8f0;
  border-color: #ffcc80
}

.doc-check-item input[type=checkbox] {
  width: 15px;
  height: 15px;
  accent-color: var(--blue);
  flex-shrink: 0;
  cursor: pointer;
  margin-top: 1px
}

.doc-check-item label {
  font-size: 12px;
  color: var(--text);
  cursor: pointer;
  flex: 1;
  line-height: 1.5
}

.doc-check-item.checked label {
  text-decoration: line-through;
  color: var(--muted)
}

.bita-exp-body {
  padding: 1.25rem;
  max-height: 85vh;
  overflow-y: auto
}

.bitem-exp {
  border-left: 3px solid var(--border);
  padding: 8px 14px;
  margin-bottom: 8px;
  background: var(--card);
  border-radius: 0 8px 8px 0
}

.bitem-exp.aseg {
  border-left-color: var(--blue)
}

.bitem-exp.cliente {
  border-left-color: #4caf50
}

.bitem-exp.sistema {
  border-left-color: #e0e0e0
}

.bitem-exp .bf {
  font-size: 11px;
  color: var(--muted);
  display: flex;
  gap: 10px;
  margin-bottom: 3px
}

.bitem-exp .bf .bu {
  font-weight: 600;
  color: var(--blue)
}

.bitem-exp .bn {
  font-size: 12px;
  color: var(--text);
  line-height: 1.6
}

.modal-bg {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(10, 18, 30, .72);
  z-index: 300;
  align-items: flex-start;
  justify-content: center;
  padding: 1.5rem 1rem;
  overflow-y: auto;
  backdrop-filter: blur(3px)
}

.modal-bg.open {
  display: flex
}

.modal {
  background: var(--card);
  border-radius: 16px;
  width: 100%;
  max-width: 940px;
  margin: auto;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(10, 18, 30, .3)
}

.modal-header {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--navy)
}

.modal-header h2 {
  font-size: 14px;
  font-weight: 700;
  color: #fff
}

.modal-body {
  padding: 1.25rem;
  max-height: 82vh;
  overflow-y: auto
}

.modal-footer {
  padding: .875rem 1.25rem;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  background: #fafcff
}

.close-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 20px;
  color: rgba(255, 255, 255, .5);
  line-height: 1
}

.close-btn:hover {
  color: #fff
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px
}

.fg {
  display: flex;
  flex-direction: column;
  gap: 3px
}

.fg.full {
  grid-column: 1/-1
}

.fg label {
  font-size: 10px;
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em
}

.fg input,
.fg select,
.fg textarea {
  font-size: 12px;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.fg input:focus,
.fg select:focus,
.fg textarea:focus {
  outline: none;
  border-color: var(--blue)
}

.fg textarea {
  resize: vertical;
  min-height: 55px
}

.section-sep {
  font-size: 10px;
  font-weight: 700;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 1.25rem 0 8px;
  padding-top: 1rem;
  border-top: 2px solid var(--border);
  display: flex;
  align-items: center;
  gap: 8px
}

.aseg-check-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 5px
}

.aseg-check-grid label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 20px;
  cursor: pointer;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.aseg-check-grid label.base {
  border-color: #4caf50;
  background: #e8f5e9;
  color: #1b5e20;
  font-weight: 600
}

.aseg-check-grid input[type=checkbox] {
  width: 11px;
  height: 11px;
  accent-color: var(--blue)
}

.autos-box {
  background: linear-gradient(135deg, #f0f8ff, #e8f4fb);
  border: 1px solid #b3d9f0;
  border-radius: 10px;
  padding: 1rem;
  margin-top: 8px
}

.autos-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px
}

.conductor-box {
  background: linear-gradient(135deg, #f3f0ff, #ede7f6);
  border: 1px solid #b39ddb;
  border-radius: 10px;
  padding: 1rem;
  margin-top: 8px
}

.uso-subfield {
  background: #fff8e1;
  border: 1px solid #ffcc02;
  border-radius: 8px;
  padding: 8px;
  margin-top: 6px
}

.fianza-box {
  background: linear-gradient(135deg, #f0f4f8, #e8eef4);
  border: 1px solid #b0c4d8;
  border-radius: 10px;
  padding: 1rem;
  margin-top: 8px
}

.fianza-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px
}

.fianza-box-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 10px
}

.ajustes-grid {
  display: grid;
  grid-template-columns: 210px 1fr;
  gap: 16px;
  min-height: 500px
}

.ajustes-menu {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden
}

.aj-item {
  padding: 11px 16px;
  font-size: 12px;
  cursor: pointer;
  border-bottom: 1px solid var(--border);
  transition: all .15s;
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 500
}

.aj-item:last-child {
  border-bottom: none
}

.aj-item:hover {
  background: #f5f9ff;
  color: var(--blue)
}

.aj-item.active {
  background: var(--navy);
  color: #fff
}

.aj-content {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.5rem
}

.aj-sec {
  display: none
}

.aj-sec.active {
  display: block
}

.aj-sec h3 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 4px;
  color: var(--navy)
}

.aj-desc {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 1.25rem
}

.cat-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
  margin-bottom: 1rem
}

.cat-tbl th {
  background: #fafcff;
  padding: 8px 12px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  border-bottom: 2px solid var(--border);
  text-transform: uppercase;
  letter-spacing: .04em
}

.cat-tbl td {
  padding: 8px 12px;
  border-bottom: 1px solid #f0f4f8;
  vertical-align: middle
}

.cat-tbl tr:last-child td {
  border-bottom: none
}

.cat-tbl tr:hover td {
  background: #f5f9ff
}

.cat-tbl input,
.cat-tbl select {
  font-size: 11px;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.add-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
  flex-wrap: wrap;
  padding: 10px;
  background: #fafcff;
  border-radius: 8px;
  border: 1px solid var(--border)
}

.add-row input,
.add-row select {
  font-size: 12px;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  font-family: "Outfit", sans-serif
}

.note-box {
  background: #e3f2fd;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 12px;
  color: #1565c0;
  margin-bottom: 1rem;
  border-left: 3px solid var(--blue)
}

.empty {
  text-align: center;
  padding: 3rem;
  color: var(--muted);
  font-size: 13px
}

.solo-lectura .dcard-header .btn {
  display: none !important
}

.solo-lectura .add-nota {
  display: none !important
}

.solo-lectura .bc-form {
  display: none !important
}

.solo-lectura .aseg-add-row {
  display: none !important
}

.solo-lectura .ac-del {
  display: none !important
}

.solo-lectura .fac-del {
  display: none !important
}

.solo-lectura .accion-form {
  display: none !important
}

.solo-lectura .sl-toggle {
  display: none !important
}

.solo-lectura .fz-btn-row {
  display: none !important
}

.solo-lectura #fzContratoCards button {
  display: none !important
}

.solo-lectura #seccionFianzas .btn-primary {
  display: none !important
}

.solo-lectura #addFzSel {
  display: none !important
}

.solo-lectura .aseg-top .btn-primary {
  display: none !important
}

.solo-lectura .edit-actions {
  display: none !important
}

/* Folio-link — clickable names */
.folio-link { color:var(--blue); cursor:pointer; border-bottom:1px dashed transparent; transition:border-color .15s, color .15s }
.folio-link:hover { border-bottom-color:var(--blue); color:#0d5a8e }

/* Reportes - sort indicators */
#repThead th { cursor:pointer; user-select:none; white-space:nowrap }
#repThead th:hover { color:var(--blue) }
#repThead th.sorted-asc::after { content:' \25B2'; font-size:9px }
#repThead th.sorted-desc::after { content:' \25BC'; font-size:9px }

/* ── Toast notifications ────────────────── */
.toast-container { position:fixed; top:20px; right:20px; z-index:9999; display:flex; flex-direction:column; gap:8px; pointer-events:none }
.toast { pointer-events:auto; display:flex; align-items:center; gap:10px; padding:10px 16px; border-radius:10px; font-size:12px; font-weight:500; color:#fff; min-width:240px; max-width:420px; box-shadow:0 4px 20px rgba(0,0,0,.3); animation:toastIn .3s ease; transition:opacity .3s, transform .3s }
.toast.hide { opacity:0; transform:translateX(40px) }
.toast-success { background:#1b8a3f }
.toast-error { background:#c0392b }
.toast-warning { background:#d68910 }
.toast-info { background:#2471a3 }
.toast-icon { font-size:16px; flex-shrink:0 }
.toast-msg { flex:1 }
.toast-close { background:none; border:none; color:rgba(255,255,255,.7); cursor:pointer; font-size:16px; padding:0 0 0 8px; line-height:1 }
.toast-close:hover { color:#fff }
@keyframes toastIn { from { opacity:0; transform:translateX(40px) } to { opacity:1; transform:translateX(0) } }

/* ── Coberturas grid (polizas) ────────────── */
.cob-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:6px }
.cob-item { display:flex; align-items:center; gap:6px; background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:7px 10px; transition:border-color .15s, background .15s }
.cob-item:has(input[type="checkbox"]:checked) { border-color:var(--blue); background:rgba(45,156,219,.06) }
.cob-item label { font-size:11px; cursor:pointer; flex:1; user-select:none; line-height:1.3 }
.cob-item input[type="checkbox"] { accent-color:var(--blue); width:14px; height:14px; cursor:pointer; flex-shrink:0 }
.cob-item .cob-ded { width:62px; font-size:10px; padding:3px 6px; border:1px solid var(--border); border-radius:5px; font-family:Outfit,sans-serif; text-align:center; background:#fff }
.cob-item .cob-val { width:90px; font-size:10px; padding:3px 6px; border:1px solid var(--border); border-radius:5px; font-family:Outfit,sans-serif; text-align:right; background:#fff }
.cob-section { font-size:10px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; margin:10px 0 4px; padding-bottom:3px; border-bottom:1px solid var(--border) }
.cob-grid.single-col { grid-template-columns:1fr }
@media(max-width:600px) { .cob-grid { grid-template-columns:1fr } }

/* ── Conversión visual a MAYÚSCULAS (módulos operativos) ─────
   Apariencia inmediata mientras se escribe. El valor real se
   convierte por JS (js/uppercase.js) excepto en textareas,
   notas, login, ajustes y reportes. */
#page-mesa input[type="text"]:not(.no-upper),
#page-clientes input[type="text"]:not(.no-upper),
#page-emisiones input[type="text"]:not(.no-upper),
#page-polizas input[type="text"]:not(.no-upper),
#ticketOverlay input[type="text"]:not(.no-upper),
#emisionOverlay input[type="text"]:not(.no-upper),
#polizaOverlay input[type="text"]:not(.no-upper),
#clienteOverlay input[type="text"]:not(.no-upper),
#modalBg input[type="text"]:not(.no-upper),
#emModalBg input[type="text"]:not(.no-upper),
#polModalBg input[type="text"]:not(.no-upper),
#polEmisionModalBg input[type="text"]:not(.no-upper),
#cliModalBg input[type="text"]:not(.no-upper),
#cliRapidoOverlay input[type="text"]:not(.no-upper),
#editPrimaOverlay input[type="text"]:not(.no-upper),
#modalFzContrato input[type="text"]:not(.no-upper),
#editEmAutosOverlay input[type="text"]:not(.no-upper),
#editEmGMMOverlay input[type="text"]:not(.no-upper),
#editEmVidaOverlay input[type="text"]:not(.no-upper),
#expOverlay input[type="text"]:not(.no-upper),
#checklistOverlay input[type="text"]:not(.no-upper),
#page-mesa select:not(.no-upper),
#page-clientes select:not(.no-upper),
#page-emisiones select:not(.no-upper),
#page-polizas select:not(.no-upper),
#ticketOverlay select:not(.no-upper),
#emisionOverlay select:not(.no-upper),
#polizaOverlay select:not(.no-upper),
#clienteOverlay select:not(.no-upper),
#modalBg select:not(.no-upper),
#emModalBg select:not(.no-upper),
#polModalBg select:not(.no-upper),
#polEmisionModalBg select:not(.no-upper),
#cliModalBg select:not(.no-upper),
#cliRapidoOverlay select:not(.no-upper),
#editPrimaOverlay select:not(.no-upper),
#editEmAutosOverlay select:not(.no-upper),
#editEmGMMOverlay select:not(.no-upper),
#editEmVidaOverlay select:not(.no-upper) {
  text-transform: uppercase;
}
/* Textareas NUNCA se convierten — son texto libre (notas/bitácoras) */
textarea { text-transform: none !important }
/* Placeholders se dejan tal cual (normalmente en minúsculas para legibilidad) */
input::placeholder, select::placeholder { text-transform: none }
/* Login, ajustes, reportes — sin conversión */
#loginScreen input, #loginScreen select,
#page-ajustes input, #page-ajustes select,
#page-reportes input, #page-reportes select,
#bcExpOverlay input, #bcExpOverlay select,
#bitaExpOverlay input, #bitaExpOverlay select {
  text-transform: none !important
}
/* Emails, contraseñas, fechas, números, teléfonos — sin conversión */
input[type="email"], input[type="password"], input[type="date"],
input[type="datetime-local"], input[type="number"], input[type="tel"],
input[type="url"], input[type="file"] {
  text-transform: none !important
}

/* ═══════════════════════════════════════════════════════════════
   CALENDARIO — Vista mes + agenda + chips + modales
═══════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════
   EMISIONES — Cuestionarios (Bloque E)
═══════════════════════════════════════════════════════════════ */

.em-cuest-progress-wrap {
  height: 6px;
  background: #f1f5f9;
  border-radius: 3px;
  overflow: hidden;
}

.em-cuest-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #22c55e, #16a34a);
  transition: width .3s ease;
}

.em-cuest-section {
  background: #fafafa;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 12px;
}

.em-cuest-section-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}

.em-cuest-preg {
  margin-bottom: 10px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: start;
}

.em-cuest-preg.full { grid-template-columns: 1fr; }

.em-cuest-lbl {
  font-size: 12px;
  color: #334155;
  font-weight: 500;
  line-height: 1.35;
  padding-top: 6px;
}

.em-cuest-lbl .em-req-mark {
  color: #dc2626;
  font-weight: 700;
  margin-left: 3px;
}

.em-cuest-input {
  width: 100%;
  padding: 6px 8px;
  font-size: 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-family: Outfit, sans-serif;
  background: #fff;
}

.em-cuest-input:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 2px rgba(33,150,243,.12);
}

.em-cuest-yesno {
  display: inline-flex;
  gap: 6px;
}

.em-cuest-yesno label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border: 1px solid var(--border);
  border-radius: 14px;
  font-size: 11px;
  cursor: pointer;
  user-select: none;
  background: #fff;
  transition: all .12s ease;
}

.em-cuest-yesno label:has(input:checked) {
  background: #e3f2fd;
  border-color: var(--blue);
  color: var(--blue);
  font-weight: 600;
}

.em-cuest-yesno input { display: none; }

textarea.em-cuest-input { min-height: 60px; resize: vertical; }

.em-cuest-hidden { display: none !important; }

/* ═══════════════════════════════════════════════════════════════
   EMISIONES — Editor de relaciones (Bloque D)
═══════════════════════════════════════════════════════════════ */

#editEmRelTable thead th {
  background: #f8fafc;
  color: #334155;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 5;
}

/* Columnas congeladas (frozen) para scroll horizontal con identificación siempre visible */
#editEmRelTable thead th.frozen,
#editEmRelTable tbody td.frozen {
  position: sticky;
  background: #fff;
  z-index: 3;
  box-shadow: 1px 0 0 var(--border);
}
#editEmRelTable thead th.frozen { background: #f8fafc; z-index: 6; }

/* Pestañas de vista dentro del editor */
.em-rel-vistas {
  display: flex;
  gap: 4px;
  margin-bottom: 10px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
  padding-bottom: 6px;
}
.em-rel-vistas button {
  background: transparent;
  border: 1px solid transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  padding: 5px 12px;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
  font-family: Outfit, sans-serif;
}
.em-rel-vistas button:hover {
  background: #f1f5f9;
  color: var(--text);
}
.em-rel-vistas button.active {
  background: #fff;
  color: var(--blue);
  border-color: var(--border);
  border-bottom-color: #fff;
  margin-bottom: -1px;
  z-index: 1;
}

/* Inputs tipo checkbox en celdas */
#editEmRelTable input[type="checkbox"] {
  width: auto;
  margin: 0 auto;
  display: block;
  cursor: pointer;
  transform: scale(1.1);
}

/* Picker de filial inline */
.em-rel-filial-cell {
  position: relative;
}
.em-rel-filial-dd {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
  max-height: 180px;
  overflow-y: auto;
  z-index: 40;
  display: none;
}
.em-rel-filial-dd.open { display: block; }
.em-rel-filial-dd-item {
  padding: 6px 10px;
  font-size: 11px;
  cursor: pointer;
  border-bottom: 1px solid #f1f5f9;
}
.em-rel-filial-dd-item:hover { background: #f0f9ff; }
.em-rel-filial-dd-item:last-child { border-bottom: none; }

#editEmRelTable tbody td {
  padding: 4px 6px;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: top;
}

#editEmRelTable tbody tr:last-child td { border-bottom: none; }

#editEmRelTable input,
#editEmRelTable select {
  width: 100%;
  padding: 6px 8px;
  font-size: 11px;
  border: 1px solid var(--border);
  border-radius: 5px;
  font-family: Outfit, sans-serif;
  background: #fff;
}

#editEmRelTable input:focus,
#editEmRelTable select:focus {
  outline: none;
  border-color: var(--blue);
  box-shadow: 0 0 0 2px rgba(33,150,243,.12);
}

#editEmRelTable .em-rel-del {
  background: #fee2e2;
  color: #991b1b;
  border: 1px solid #fecaca;
  border-radius: 5px;
  padding: 4px 8px;
  font-size: 11px;
  cursor: pointer;
  font-family: Outfit, sans-serif;
}

#editEmRelTable .em-rel-del:hover {
  background: #fecaca;
}

#editEmRelTable tbody tr.is-invalid {
  background: #fef2f2;
}

/* ═══════════════════════════════════════════════════════════════
   EMISIONES — Card de Requisitos (motor de validación)
═══════════════════════════════════════════════════════════════ */

.em-req-card {
  background: #fff;
  border-left: 4px solid #94a3b8;
  transition: border-color .2s ease;
}

.em-req-card.is-complete {
  border-left-color: #16a34a;
}

.em-req-card.is-warning {
  border-left-color: #f59e0b;
}

.em-req-card.is-critical {
  border-left-color: #dc2626;
}

.em-req-pct-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 10px;
  background: #f1f5f9;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: .05em;
  white-space: nowrap;
}

.em-req-progress-wrap {
  background: #f1f5f9;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
  margin: 4px 0 10px;
}

.em-req-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #22c55e, #16a34a);
  transition: width .3s ease, background .3s ease;
}

.em-req-progress-bar.warning {
  background: linear-gradient(90deg, #fbbf24, #f59e0b);
}

.em-req-progress-bar.critical {
  background: linear-gradient(90deg, #f87171, #dc2626);
}

.em-req-stats {
  font-size: 10px;
  color: var(--muted);
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.em-req-stat strong {
  color: #222;
  font-weight: 700;
}

.em-req-group {
  margin-top: 10px;
}

.em-req-group-title {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.em-req-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 7px 8px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 11px;
  transition: background .12s ease;
  border: 1px solid transparent;
}

.em-req-item:hover {
  background: #f8fafc;
  border-color: #e2e8f0;
}

.em-req-item.is-complete {
  color: #15803d;
}

.em-req-item.is-missing-req {
  color: #991b1b;
  background: #fef2f2;
}

.em-req-item.is-missing-opt {
  color: #92400e;
  background: #fffbeb;
}

.em-req-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 4px;
  box-shadow: 0 0 0 2px rgba(255,255,255,.9);
}

.em-req-dot.green  { background: #16a34a; }
.em-req-dot.red    { background: #dc2626; }
.em-req-dot.yellow { background: #f59e0b; }
.em-req-dot.gray   { background: #94a3b8; }

.em-req-lbl {
  flex: 1;
  line-height: 1.3;
  font-weight: 500;
}

.em-req-lbl .em-req-desc {
  display: block;
  font-size: 10px;
  color: var(--muted);
  font-weight: 400;
  margin-top: 1px;
}

.em-req-badge {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 8px;
  text-transform: uppercase;
  letter-spacing: .03em;
  flex-shrink: 0;
}

.em-req-badge.req { background: #fecaca; color: #991b1b; }
.em-req-badge.opt { background: #e2e8f0; color: #475569; }
.em-req-badge.ok  { background: #bbf7d0; color: #15803d; }

.em-req-arrow {
  color: #94a3b8;
  font-size: 14px;
  flex-shrink: 0;
  margin-top: 1px;
}

.em-req-item.is-complete .em-req-arrow { color: transparent; }

.em-req-empty {
  padding: 12px;
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  font-style: italic;
}

.em-req-action-row {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #e2e8f0;
  flex-wrap: wrap;
}

.em-req-action-row .btn { flex: 1; min-width: 140px; }

.em-req-warning-banner {
  background: #fef3c7;
  border: 1px solid #fde68a;
  color: #92400e;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 11px;
  margin-top: 8px;
  line-height: 1.35;
}

/* Badge en botón de nav */
.cal-nav-badge {
  position: absolute;
  top: 2px;
  right: 4px;
  background: #e74c3c;
  color: #fff;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 700;
  padding: 2px 6px;
  min-width: 16px;
  text-align: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.25);
}

/* Toolbar del calendario */
.cal-toolbar {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 14px 0 12px;
  flex-wrap: wrap;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
}

.cal-nav-mes {
  display: flex;
  align-items: center;
  gap: 4px;
}

.cal-nav-mes h3 {
  font-family: Outfit, sans-serif;
  font-weight: 700;
  color: #222;
}

.cal-tabs-sel {
  display: flex;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}

.cal-tab {
  background: #fff;
  border: none;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: Outfit, sans-serif;
  color: #666;
  transition: all .15s;
}

.cal-tab:hover { background: #f5f7fa; }

.cal-tab.active {
  background: #3498db;
  color: #fff;
}

.cal-filtros {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-left: auto;
  flex-wrap: wrap;
}

.cal-filtros select {
  font-size: 11px;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-family: Outfit, sans-serif;
  background: #fff;
}

/* ─── Selector de mes/año (popover sobre el título) ─── */
.cal-mes-picker {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .18);
  padding: 12px;
  z-index: 200;
  width: 240px;
  font-family: Outfit, sans-serif;
}

.cal-mes-picker .cmp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #f1f5f9;
}

.cal-mes-picker .cmp-nav {
  background: #f1f5f9;
  border: none;
  border-radius: 6px;
  width: 26px;
  height: 26px;
  font-size: 14px;
  font-weight: 700;
  color: #475569;
  cursor: pointer;
  transition: background .15s;
}

.cal-mes-picker .cmp-nav:hover {
  background: #e2e8f0;
}

.cal-mes-picker .cmp-anio {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  letter-spacing: -.01em;
}

.cal-mes-picker .cmp-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}

.cal-mes-picker .cmp-mes {
  background: #f8fafc;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 9px 0;
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
  font-family: Outfit, sans-serif;
}

.cal-mes-picker .cmp-mes:hover {
  background: #e0e7ff;
  color: #1d4ed8;
}

.cal-mes-picker .cmp-mes.cmp-activo {
  background: #1e293b;
  color: #fff;
  border-color: #1e293b;
}

/* Grid mensual */
/* ─── Layout de dos columnas: calendario + panel fijo ─── */
.cal-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 18px;
  align-items: flex-start;
}

.cal-main {
  min-width: 0;
}

/* ─── Grid mensual ─── */
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  background: #e7eaef;
  border: 1px solid #e7eaef;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 14px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}

.cal-dow {
  background: #1e293b;
  color: #e2e8f0;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 11px 6px;
  text-align: center;
  letter-spacing: .1em;
}

.cal-dia {
  background: #fff;
  min-height: 118px;
  padding: 8px 7px 6px;
  cursor: pointer;
  transition: background .18s ease;
  position: relative;
  overflow: hidden;
}

.cal-dia:hover {
  background: #f1f5f9;
}

.cal-dia-num {
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
  margin-bottom: 6px;
  letter-spacing: -.01em;
  display: inline-block;
  padding: 0 2px;
  transition: color .15s;
}

.cal-dia.cal-otro-mes {
  background: #fafbfc;
  cursor: default;
}

.cal-dia.cal-otro-mes:hover {
  background: #fafbfc;
}

.cal-dia.cal-otro-mes .cal-dia-num {
  color: #cbd5e1;
  font-weight: 400;
}

.cal-dia.cal-finde {
  background: #fcfcfd;
}

.cal-dia.cal-finde:hover {
  background: #f1f5f9;
}

/* Día actual: celda completa en azul del logo HIT, número blanco para contraste */
.cal-dia.cal-hoy {
  background: #2d9cdb;
}

.cal-dia.cal-hoy:hover {
  background: #2589bf;
}

.cal-dia.cal-hoy .cal-dia-num {
  color: #fff;
  font-weight: 800;
}

/* Chips dentro del día actual: fondo blanco traslúcido para destacarse sobre el azul */
.cal-dia.cal-hoy .cal-chip {
  background: rgba(255, 255, 255, .95) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}

.cal-dia.cal-hoy .cal-mas {
  color: #fff;
}

/* Día seleccionado: fondo tenue en la celda completa — sin círculo sobre el número */
.cal-dia.cal-sel {
  background: #e0f2fe;
}

.cal-dia.cal-sel:hover {
  background: #cfe8fa;
}

.cal-dia.cal-sel .cal-dia-num {
  color: #1e40af;
  font-weight: 700;
}

/* Si el día actual también está seleccionado, mantenemos el azul del logo (sin marco) */
.cal-dia.cal-hoy.cal-sel {
  background: #2589bf;
}

.cal-dia.cal-hoy.cal-sel .cal-dia-num {
  color: #fff;
  font-weight: 800;
}

/* ─── Vista SEMANA ─── */
.cal-semana {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 1px;
  background: #e2e8f0;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
}
.cal-sem-dia {
  background: #fff;
  min-width: 0;
  min-height: 480px;
  padding: 10px 9px 12px;
  cursor: pointer;
  transition: background .18s ease;
  display: flex;
  flex-direction: column;
}
.cal-sem-dia:hover { background: #f1f5f9; }
.cal-sem-dia.cal-finde { background: #fcfcfd; }
.cal-sem-dia.cal-finde:hover { background: #f1f5f9; }
.cal-sem-head {
  padding-bottom: 8px;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 10px;
}
.cal-sem-dow {
  font-size: 10px;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.cal-sem-head b {
  display: block;
  font-size: 22px;
  color: #1e293b;
  margin-top: 2px;
  line-height: 1;
  font-weight: 800;
}
.cal-sem-dia.cal-hoy { background: #2d9cdb; }
.cal-sem-dia.cal-hoy:hover { background: #2589bf; }
.cal-sem-dia.cal-hoy .cal-sem-dow,
.cal-sem-dia.cal-hoy .cal-sem-head b { color: #fff; }
.cal-sem-dia.cal-hoy .cal-sem-head { border-color: rgba(255, 255, 255, .3); }
.cal-sem-dia.cal-hoy .cal-chip {
  background: rgba(255, 255, 255, .95) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}
.cal-sem-dia.cal-sel { background: #e0f2fe; }
.cal-sem-dia.cal-sel:hover { background: #cfe8fa; }
.cal-sem-dia.cal-hoy.cal-sel {
  background: #2589bf;
}
.cal-sem-lista {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
  overflow: hidden;
}
.cal-sem-empty {
  font-size: 10px;
  color: #cbd5e1;
  font-style: italic;
  padding: 6px 2px;
}
.cal-sem-dia.cal-hoy .cal-sem-empty { color: rgba(255, 255, 255, .65); }

/* ─── Vista DÍA ─── */
.cal-dia-vista-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 20px 22px 24px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
}
.cal-dia-vista-head {
  display: flex;
  align-items: center;
  gap: 20px;
  padding-bottom: 16px;
  border-bottom: 2px solid #e2e8f0;
  margin-bottom: 18px;
}
.cal-dia-vista-head.esHoy {
  background: linear-gradient(90deg, #e6f4fb, transparent);
  border-color: #2d9cdb;
  margin: -20px -22px 18px;
  padding: 18px 22px 16px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  border-bottom-width: 3px;
}
.cal-dia-vista-num {
  font-size: 52px;
  font-weight: 800;
  color: #1e293b;
  line-height: 1;
  letter-spacing: -.02em;
}
.cal-dia-vista-head.esHoy .cal-dia-vista-num { color: #2d9cdb; }
.cal-dia-vista-dow {
  font-size: 14px;
  color: #334155;
  text-transform: capitalize;
  font-weight: 700;
}
.cal-dia-vista-mes {
  font-size: 12px;
  color: #94a3b8;
  text-transform: capitalize;
}
.cal-dia-vista-timeline {
  display: flex;
  flex-direction: column;
}
.cal-dvt-row {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 8px 0;
  border-top: 1px dashed #eef2f7;
  min-height: 38px;
}
.cal-dvt-row:first-child { border-top: none; }
.cal-dvt-row.cal-dvt-ocupada { background: #fafcff; }
.cal-dvt-hora {
  flex: 0 0 58px;
  font-size: 11px;
  font-weight: 700;
  color: #94a3b8;
  padding-top: 4px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.cal-dvt-evs {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.cal-dvt-ev {
  padding: 8px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  transition: transform .12s ease, box-shadow .12s ease;
}
.cal-dvt-ev:hover {
  transform: translateX(2px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
}
.cal-dia-vista-empty {
  text-align: center;
  padding: 40px 20px;
  color: #94a3b8;
  font-size: 13px;
}

/* ─── Chips de eventos en celdas ─── */
.cal-chip {
  display: block;
  font-size: 10.5px;
  line-height: 1.35;
  padding: 3px 7px 3px 8px;
  border-radius: 4px;
  margin-bottom: 3px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  font-weight: 600;
  letter-spacing: -.005em;
  border-left: 2px solid transparent;
  transition: transform .12s ease, box-shadow .12s ease;
}

.cal-chip:hover {
  transform: translateX(1px);
  box-shadow: 0 1px 4px rgba(15, 23, 42, .08);
}

.cal-chip-hecho {
  opacity: .55;
  text-decoration: line-through;
}

.cal-chip-cancelado {
  opacity: .4;
  text-decoration: line-through;
  filter: grayscale(.6);
}

.cal-chip-vencido {
  animation: cal-pulse 2.4s ease-in-out infinite;
  box-shadow: inset 0 0 0 1px #ef4444;
}

.cal-chip-virtual {
  background: #f0f7ff !important;
  color: #1d4ed8 !important;
  border-left-color: #3b82f6 !important;
}

@keyframes cal-pulse {
  0%, 100% { box-shadow: inset 0 0 0 1px rgba(239, 68, 68, .65); }
  50%      { box-shadow: inset 0 0 0 1px rgba(239, 68, 68, .25), 0 0 0 2px rgba(239, 68, 68, .15); }
}

.cal-mas {
  font-size: 10px;
  color: #3b82f6;
  font-weight: 700;
  padding: 3px 6px;
  cursor: pointer;
  border-radius: 3px;
  display: inline-block;
  margin-top: 2px;
}

.cal-mas:hover {
  background: #eff6ff;
}

/* ─── Leyenda ─── */
.cal-leyenda {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid #e7eaef;
  border-radius: 10px;
  align-items: center;
  margin-bottom: 0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .03);
}

.cal-ley-label {
  font-size: 10px;
  color: #64748b;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-right: 4px;
}

.cal-ley-chip {
  font-size: 10px;
  padding: 4px 9px;
  border-radius: 12px;
  font-weight: 600;
  letter-spacing: -.005em;
}

/* Tabla agenda */
.cal-tipo-badge {
  font-size: 10px;
  padding: 3px 8px;
  border-radius: 4px;
  font-weight: 700;
  white-space: nowrap;
}

/* Overlay detalle */
.cal-det-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 20px;
  border-radius: 10px;
  margin-bottom: 16px;
}

.cal-det-body {
  padding: 4px;
}

.cal-det-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid #f0f2f5;
}

.cal-det-row:last-child {
  border-bottom: none;
}

.cal-det-row.cal-det-col {
  flex-direction: column;
  gap: 6px;
}

.cal-det-lbl {
  min-width: 130px;
  font-size: 11px;
  color: #888;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.cal-det-val {
  flex: 1;
  font-size: 13px;
  color: #222;
}

.cal-det-multiline {
  white-space: pre-wrap;
  background: #f7f8fa;
  padding: 10px;
  border-radius: 6px;
  font-size: 12px;
  line-height: 1.5;
}

.cal-det-acciones {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding-top: 16px;
  border-top: 1px solid #e5e9ef;
  margin-top: 14px;
}

/* Form row helpers (si no existen ya) */
.form-row {
  margin-bottom: 14px;
}

.form-row label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: #555;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.form-row input[type="text"],
.form-row input[type="date"],
.form-row input[type="time"],
.form-row input[type="number"],
.form-row select,
.form-row textarea {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: 7px;
  font-size: 13px;
  font-family: Outfit, sans-serif;
  background: #fff;
  box-sizing: border-box;
}

.form-row textarea {
  resize: vertical;
  min-height: 60px;
}

.form-row-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* ─── Modal genérico ov-* (Nuevo evento, Detalle evento, Pérdida ticket) ─── */
.ov-box {
  background: #fff;
  border-radius: 14px;
  width: 100%;
  margin: auto;
  box-shadow: 0 24px 80px rgba(10, 18, 30, .4);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 2rem);
  border-top: 4px solid var(--blue, #3498db);
}

.ov-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid #eef1f5;
  flex-shrink: 0;
}

.ov-head h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: #1a2233;
  letter-spacing: -.2px;
}

.ov-close {
  background: transparent;
  border: 0;
  font-size: 26px;
  line-height: 1;
  color: #7c8798;
  cursor: pointer;
  padding: 4px 10px;
  border-radius: 8px;
  transition: background .15s, color .15s;
}

.ov-close:hover {
  background: #f3f5f8;
  color: #1a2233;
}

.ov-body {
  padding: 20px 22px;
  overflow-y: auto;
  flex: 1 1 auto;
}

.ov-body label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #5a6778;
  margin-bottom: 6px;
}

.ov-body input[type="text"],
.ov-body input[type="date"],
.ov-body input[type="time"],
.ov-body input[type="number"],
.ov-body input[type="email"],
.ov-body select,
.ov-body textarea {
  width: 100%;
  font-family: Outfit, sans-serif;
  font-size: 13px;
  padding: 9px 12px;
  border: 1px solid #d9dfe7;
  border-radius: 8px;
  background: #fff;
  color: #1a2233;
  box-sizing: border-box;
  transition: border-color .15s, box-shadow .15s;
}

.ov-body input:focus,
.ov-body select:focus,
.ov-body textarea:focus {
  outline: none;
  border-color: var(--blue, #3498db);
  box-shadow: 0 0 0 3px rgba(52, 152, 219, .15);
}

.ov-body textarea {
  resize: vertical;
  min-height: 60px;
  font-family: Outfit, sans-serif;
}

.ov-foot {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 22px 18px;
  border-top: 1px solid #eef1f5;
  background: #fafbfc;
  flex-shrink: 0;
}

/* ─── Panel lateral fijo del día ─── */
.cal-side {
  background: #fff;
  border: 1px solid #e7eaef;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 16px;
  max-height: calc(100vh - 32px);
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}

.cal-panel-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 20px 22px 18px;
  border-bottom: 1px solid #eef1f5;
  flex-shrink: 0;
}

.cal-panel-head-txt {
  flex: 1;
  min-width: 0;
}

.cal-panel-dow {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 2px;
}

.cal-panel-num {
  font-size: 32px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1;
  letter-spacing: -.02em;
}

.cal-panel-mes {
  font-size: 11px;
  color: #64748b;
  text-transform: capitalize;
  margin-top: 2px;
}

.cal-panel-pill {
  display: inline-block;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 10px;
  margin-left: 6px;
  vertical-align: middle;
  background: rgba(255, 255, 255, .6);
}

.cal-panel-count {
  padding: 10px 22px;
  background: #fafbfc;
  border-bottom: 1px solid #eef1f5;
  font-size: 11px;
  color: #64748b;
  flex-shrink: 0;
  letter-spacing: .01em;
}

.cal-panel-count b {
  color: #1e293b;
  font-weight: 700;
}

.cal-panel-list {
  flex: 1;
  overflow-y: auto;
  padding: 14px 16px;
  background: #fbfcfd;
}

.cal-panel-empty {
  text-align: center;
  padding: 40px 20px;
  color: #94a3b8;
}

.cal-panel-empty-ico {
  font-size: 40px;
  opacity: .25;
  margin-bottom: 10px;
}

.cal-panel-ev {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 13px 11px 14px;
  background: #fff;
  border: 1px solid #eef1f5;
  border-left: 4px solid #cbd5e1;
  border-radius: 8px;
  margin-bottom: 9px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}

.cal-panel-ev:hover {
  box-shadow: 0 2px 10px rgba(15, 23, 42, .08);
  border-color: #cbd5e1;
}

.cal-panel-ev-hecho {
  opacity: .6;
}

.cal-panel-ev-hecho .cal-panel-ev-titulo {
  text-decoration: line-through;
}

.cal-panel-ev-cancelado {
  opacity: .45;
  filter: grayscale(.6);
}

.cal-panel-ev-cancelado .cal-panel-ev-titulo {
  text-decoration: line-through;
}

.cal-panel-ev-vencido {
  background: #fef7f7;
  border-color: #fecaca;
}

.cal-panel-ev-creado {
  background: #fafcff;
}

.cal-panel-ev-creado .cal-panel-ev-titulo {
  color: #1d4ed8;
}

.cal-panel-ev-ico {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.cal-panel-ev-body {
  flex: 1;
  min-width: 0;
}

.cal-panel-ev-titulo {
  font-size: 13px;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 4px;
  line-height: 1.35;
  letter-spacing: -.005em;
  word-wrap: break-word;
}

.cal-panel-ev-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 10.5px;
  color: #64748b;
  flex-wrap: wrap;
}

.cal-panel-ev-meta-hora {
  font-weight: 700;
  color: #1e293b;
}

.cal-panel-ev-cli {
  font-size: 11px;
  color: #64748b;
  margin-top: 4px;
}

.cal-panel-badge {
  font-size: 9px;
  color: #fff;
  padding: 3px 7px;
  border-radius: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
  flex-shrink: 0;
}

.cal-panel-foot {
  padding: 12px 16px 14px;
  border-top: 1px solid #eef1f5;
  background: #fff;
  flex-shrink: 0;
}

.cal-panel-foot .btn {
  width: 100%;
}

/* Responsive: apilar panel debajo en pantallas pequeñas */
@media (max-width: 1100px) {
  .cal-layout {
    grid-template-columns: 1fr;
  }
  .cal-side {
    position: static;
    max-height: none;
  }
}

/* Responsive */
@media (max-width: 900px) {
  .cal-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  .cal-filtros {
    margin-left: 0;
  }
  .cal-dia {
    min-height: 80px;
  }
  .cal-chip {
    font-size: 9px;
  }
  .cal-panel-dia {
    width: 100vw;
  }
}

/* Lista de checkboxes para asignar participantes */
.cal-mod-asignados-list {
  max-height: 140px;
  overflow-y: auto;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 6px 8px;
  background: #fff;
}
.cal-mod-asignados-list .cal-asig-opt {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 4px;
  font-size: 12px;
  cursor: pointer;
  border-radius: 4px;
}
.cal-mod-asignados-list .cal-asig-opt:hover {
  background: #f1f5f9;
}
.cal-mod-asignados-list .cal-asig-opt input[type="checkbox"] {
  margin: 0;
  cursor: pointer;
}