/* ===================== CRM Alavia · estilos compartidos ===================== */
/* Base (idéntico en todas las pantallas del CRM) */
body{
  margin:0;
  color:#0C4650;
  font-family:"Encode Sans",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  background:
    radial-gradient(1000px 480px at 88% -10%, rgba(66,183,166,0.16), transparent 62%),
    radial-gradient(820px 460px at -10% 8%, rgba(244,165,0,0.08), transparent 58%),
    radial-gradient(760px 520px at 50% 115%, rgba(27,115,104,0.07), transparent 62%),
    linear-gradient(180deg,#D2E4E0 0%,#E2ECEA 52%,#D9E7E4 100%);
  background-attachment:fixed;
}
a{color:#1B7368;text-decoration:none}
a:hover{color:#42B7A6}
input:focus,select:focus,button:focus,textarea:focus{outline:3px solid #42B7A6;outline-offset:2px}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- Layout básico ---------- */
.sec-1400{max-width:1400px;margin:0 auto;padding:26px 24px 90px}
.sec-1360{max-width:1360px;margin:0 auto;padding:26px 24px 90px}
.sec-1100{max-width:1100px;margin:0 auto;padding:26px 24px 90px}
.sec-900{max-width:900px;margin:0 auto;padding:26px 24px 90px}
.sec-760{max-width:760px;margin:0 auto;padding:26px 24px 90px}

.fx{display:flex}
.fcol{display:flex;flex-direction:column}
.ac{align-items:center}
.aiend{align-items:flex-end}
.jb{justify-content:space-between}
.jfe{justify-content:flex-end}
.jc{justify-content:center}
.wrap{flex-wrap:wrap}
.f1{flex:1}
.fnone{flex:none}
.gap2{gap:2px}
.gap3{gap:3px}
.gap4{gap:4px}
.gap5{gap:5px}
.gap6{gap:6px}
.gap7{gap:7px}
.gap8{gap:8px}
.gap9{gap:9px}
.gap10{gap:10px}
.gap12{gap:12px}
.gap14{gap:14px}
.gap16{gap:16px}
.mwidth0{min-width:0}
.mb16{margin-bottom:16px}
.mb18{margin-bottom:18px}

.fadeUp{animation:fadeUp .35s ease both}
.fadeUp04{animation:fadeUp .35s .04s ease both}
.fadeUp05{animation:fadeUp .35s .05s ease both}
.fadeUp05{animation:fadeUp .35s .05s ease both}
.fadeUp08{animation:fadeUp .35s .08s ease both}
.fadeUp10{animation:fadeUp .35s .1s ease both}
.fadeUp15{animation:fadeUp .35s .15s ease both}
.fadeUp40{animation:fadeUp .4s ease both}

/* ---------- Barra superior ---------- */
.topbar{
  background:linear-gradient(180deg,#105765 0%,#0B424C 100%);
  box-shadow:0 10px 24px -16px rgba(8,40,46,0.55);
  position:sticky;top:0;z-index:30;
}
.topbar-in{max-width:1400px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.topbar-in-sm{max-width:1360px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:9px;flex:none}
.brand-logo{height:30px;width:auto;display:block}
.brand-name{font-family:'Encode Sans',sans-serif;font-weight:800;font-size:21px;letter-spacing:-0.045em;color:#FFFFFF}
.brand-crm{font-family:'Encode Sans',sans-serif;font-size:11px;letter-spacing:0.2em;text-transform:uppercase;color:#F4A500;border:1px solid rgba(244,165,0,0.4);border-radius:100px;padding:3px 10px}
.topnav{display:flex;align-items:center;gap:4px}
.nav-link{font-weight:500;font-size:14px;color:#B9CDCB;padding:7px 16px;border-radius:100px}
.nav-link-admin{font-weight:500;font-size:14px;color:#F4A500;padding:7px 16px;border-radius:100px}
.nav-active{font-weight:700;font-size:14px;color:#FFFFFF;background:rgba(66,183,166,0.18);border-radius:100px;padding:7px 16px}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.perfil-chip{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.06);border:1px solid rgba(185,205,203,0.2);border-radius:100px;padding:5px 14px 5px 6px}
.avatar{width:26px;height:26px;border-radius:50%;background:#F4A500;color:#0C4650;font-family:'Encode Sans',sans-serif;font-size:12px;font-weight:500;display:flex;align-items:center;justify-content:center}
.perfil-nombre{font-size:13.5px;color:#FFFFFF;font-weight:500}
.btn-salir{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:13px;color:#B9CDCB;background:transparent;border:1px solid rgba(185,205,203,0.3);border-radius:100px;padding:7px 16px;cursor:pointer}

/* ---------- Tipografía ---------- */
.h1{font-family:'Encode Sans',sans-serif;font-weight:800;font-size:30px;letter-spacing:-0.03em;margin:0 0 4px}
.sub{margin:0;color:#35494D;font-size:14.5px}
.sub2{margin:0 0 6px;color:#35494D;font-size:14.5px}
.muted{margin:0;font-size:15px;color:#6E8488}
.p-dim{font-size:13px;color:#35494D}
.etic{font-family:'Encode Sans',sans-serif;font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:#6E8488}
.etic2{font-family:'Encode Sans',sans-serif;font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:#6E8488}
.etic-teal{font-family:'Encode Sans',sans-serif;font-size:10px;letter-spacing:0.18em;text-transform:uppercase;color:#1B7368}
.etic-rol{font-family:'Encode Sans',sans-serif;font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:#B9CDCB}
.etic-rol-2{font-family:'Encode Sans',sans-serif;font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:#6E8488}
.grup-titulo{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;color:#6E8488;margin:14px 0 0}

/* ---------- Formularios ---------- */
.input{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:10px;padding:10px 12px}
.input-sm{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:10px;padding:9px 12px}
.select{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:10px;padding:10px 10px}
.select-cp{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:10px;padding:10px 10px;cursor:pointer}
.input-bl{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:10px;padding:10px 10px;cursor:pointer}
.input-r11{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:11px;padding:11px 12px}
.input-bl-r11{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:11px;padding:11px 12px}
.input-r11-cp{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:11px;padding:11px 10px;cursor:pointer}
.input-bl-r11-cp{font-family:'Encode Sans',sans-serif;font-size:14px;color:#0C4650;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:11px;padding:11px 10px;cursor:pointer}
.input-15{font-family:'Encode Sans',sans-serif;font-size:15px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:11px;padding:12px 13px}
.checkbox{width:16px;height:16px;accent-color:#1B7368;cursor:pointer}

/* ---------- Botones ---------- */
.btn{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:13px;color:#35494D;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;padding:9px 16px;cursor:pointer}
.btn-actual{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:13px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:100px;padding:9px 16px}
.btn-xs{font-family:'Encode Sans',sans-serif;font-size:13px;color:#0C4650;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;padding:8px 10px;cursor:pointer}
.btn-tomar{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:12.5px;color:#1B7368;background:transparent;border:1.5px solid #1B7368;border-radius:100px;padding:7px 12px;cursor:pointer}
.btn-limpiar{flex:none;font-family:'Encode Sans',sans-serif;font-weight:700;font-size:13px;color:#1B7368;background:transparent;border:1px solid #DDE8E7;border-radius:100px;padding:11px 16px;cursor:pointer}

/* ---------- Tarjetas / paneles ---------- */
.panel{box-shadow:0 10px 24px -18px rgba(12,70,80,0.28);background:#FFFFFF;border:1px solid #DDE8E7;border-radius:16px;padding:14px 16px;display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:22px;animation:fadeUp .35s .05s ease both}
.panel-table{box-shadow:0 10px 24px -18px rgba(12,70,80,0.28);background:#FFFFFF;border:1px solid #DDE8E7;border-radius:16px;overflow-x:auto;animation:fadeUp .35s .1s ease both}
.card-tarea{box-shadow:0 10px 24px -18px rgba(12,70,80,0.28);display:flex;align-items:center;gap:14px;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:16px;padding:14px 18px;flex-wrap:wrap}
.vacio-card{box-shadow:0 10px 24px -18px rgba(12,70,80,0.28);background:#FFFFFF;border:1px dashed #DDE8E7;border-radius:16px;padding:40px 18px;text-align:center}
.pag-bar{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:16px;animation:fadeUp .35s .15s ease both}
.chip-pill{display:inline-flex;align-items:center;gap:7px;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;padding:7px 14px;font-size:13px;font-weight:500;color:#35494D;white-space:nowrap}

/* ---------- Agenda ---------- */
.fcol-filtro{display:flex;flex-direction:column;gap:4px;flex:1;min-width:150px}
.fcol2-m0{display:flex;flex-direction:column;gap:2px;min-width:0}
.seg{flex:none;display:flex;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;padding:4px}
.tab{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:12.5px;border:0;border-radius:100px;padding:8px 16px;cursor:pointer}
.chk-hecha{flex:none;width:18px;height:18px;accent-color:#1B7368;cursor:pointer}
.chip-asesor{flex:none;display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:500;color:#35494D}
.avatar-sm{width:22px;height:22px;border-radius:50%;background:#E1F0F1;color:#1B7368;font-family:'Encode Sans',sans-serif;font-size:10.5px;display:flex;align-items:center;justify-content:center}
.btn-verde{flex:none;font-weight:700;font-size:12.5px;color:#FFFFFF;background:#1B7368;border:1px solid #1B7368;border-radius:100px;padding:9px 16px}
.btn-borde{flex:none;font-weight:700;font-size:12.5px;color:#1B7368;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;padding:9px 16px}
.btn-ambar{flex:none;font-family:'Encode Sans',sans-serif;font-weight:700;font-size:12.5px;color:#0C4650;background:#F4A500;border:0;border-radius:100px;padding:9px 16px;cursor:pointer}
.pill-ok{flex:none;font-weight:700;font-size:11.5px;color:#2E9E62;background:#E3F3EA;border-radius:100px;padding:5px 11px}
.btn-nav{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:14px;color:#0C4650;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;width:32px;height:32px;cursor:pointer}
.rango-txt{font-weight:700;font-size:14px;color:#0C4650;min-width:150px;text-align:center;text-transform:capitalize}
.btn-hoy{font-family:'Encode Sans',sans-serif;font-weight:700;font-size:12px;color:#1B7368;background:transparent;border:1px solid #DDE8E7;border-radius:100px;padding:7px 13px;cursor:pointer}
.chk-show{flex:none;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:#35494D;background:#FFFFFF;border:1px solid #DDE8E7;border-radius:100px;padding:8px 14px;cursor:pointer}

/* ---------- Refinamiento (2ª pasada) ---------- */
.vacia{padding:44px 18px;text-align:center}
.error-txt{margin:0;font-size:13.5px;color:#B4433A}
.txt-dim{font-size:13px;color:#6E8488}
.txt-dim2{font-size:12.5px;color:#6E8488}
.ellipsis{font-size:13.5px;color:#0C4650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.small-dim{font-family:'Encode Sans',sans-serif;font-size:10.5px;color:#6E8488}
.xs-dim{font-family:'Encode Sans',sans-serif;font-size:11.5px;color:#6E8488}
.xxs-dim{font-family:'Encode Sans',sans-serif;font-size:11px;color:#6E8488}
.panel-card{box-shadow:0 10px 24px -18px rgba(12,70,80,0.28);background:#FFFFFF;border:1px solid #DDE8E7;border-radius:18px;padding:20px 22px;display:flex;flex-direction:column;gap:14px;margin-bottom:18px;animation:fadeUp .35s .05s ease both}
.txt{font-size:12.5px;color:#35494D}
.txt-mid{font-size:12.5px;font-weight:500;color:#35494D}
.txt-mid2{font-size:13px;font-weight:500;color:#35494D}
.fcol4-180{display:flex;flex-direction:column;gap:4px;flex:none;width:180px}
.mw1100{min-width:1100px}
.link-prosp{font-weight:700;font-size:14.5px;color:#1B7368;text-decoration:underline;text-decoration-color:rgba(14,109,121,0.3);text-underline-offset:3px}
.overlay{position:fixed;inset:0;z-index:60}
.overlay-bg{position:absolute;inset:0;background:rgba(8,40,46,0.6)}
.input-r11-cp2{font-family:'Encode Sans',sans-serif;font-size:13.5px;color:#0C4650;background:#F2F7F6;border:1px solid #DDE8E7;border-radius:11px;padding:11px 10px;cursor:pointer}
.pointer{cursor:pointer}

/* ---------- Responsive esencial ---------- */
@media (max-width:1024px){
  .sec-1400,.sec-1360,.sec-1100,.sec-900,.sec-760{padding:20px 16px 70px}
  .topbar-in,.topbar-in-sm{padding:10px 16px;gap:10px}
  .h1{font-size:25px}
  .nav-link,.nav-link-admin,.nav-active{padding:6px 12px;font-size:13px}
  .brand-name{font-size:19px}
}
@media (max-width:768px){
  .topbar-in,.topbar-in-sm{padding:9px 12px;gap:8px}
  .topbar-in nav,.topbar-in-sm nav{flex-wrap:wrap;gap:2px}
  .topbar-right{margin-left:auto}
  .perfil-nombre{display:none}
  .btn-salir{padding:6px 12px;font-size:12px}
  .h1{font-size:23px}
  .sub,.sub2{font-size:13.5px}
  .panel{padding:12px 12px}
  .fcol-filtro{flex:1 1 100%;min-width:0}
  .fcol4-180{width:100%}
  .panel-table{overflow-x:auto}
  .seg{flex-wrap:wrap;max-width:100%}
  .rango-txt{min-width:110px;font-size:13px}
}
@media (max-width:480px){
  .sec-1400,.sec-1360,.sec-1100,.sec-900,.sec-760{padding:14px 10px 56px}
  .topbar-in,.topbar-in-sm{padding:8px 10px;gap:6px}
  .brand-logo{height:26px}
  .brand-crm{font-size:10px;padding:2px 8px}
  .h1{font-size:21px}
  .perfil-chip{padding:4px 10px 4px 4px}
  .avatar{width:24px;height:24px;font-size:11px}
  .chip-pill{font-size:12px;padding:6px 11px}
}

/* ---------- Loaders & Spinners CRM ---------- */
@keyframes crmSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.crm-spinner {
  width: 32px;
  height: 32px;
  border: 3.5px solid rgba(27,115,104,0.15);
  border-top-color: #1B7368;
  border-right-color: #42B7A6;
  border-radius: 50%;
  animation: crmSpin 0.75s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
  display: inline-block;
  vertical-align: middle;
}

.crm-spinner-lg {
  width: 44px;
  height: 44px;
  border-width: 4px;
}

.crm-spinner-sm {
  width: 18px;
  height: 18px;
  border-width: 2.5px;
}

.crm-loader-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 60px 20px;
  background: #FFFFFF;
  border: 1px solid #DDE8E7;
  border-radius: 16px;
  box-shadow: 0 10px 24px -18px rgba(12,70,80,0.28);
  animation: fadeUp .3s ease both;
  margin-bottom: 22px;
}

.crm-loader-inline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 30px 16px;
  color: #1B7368;
  font-family: 'Encode Sans', sans-serif;
  font-size: 14px;
  font-weight: 600;
}

.crm-loader-text {
  font-family: 'Encode Sans', sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #0C4650;
  letter-spacing: -0.01em;
}

.crm-loader-subtext {
  font-family: 'Encode Sans', sans-serif;
  font-size: 13px;
  color: #6E8488;
  margin: 0;
}