:root {
    /* Colores TIMED */
    --timed-primary: #00c9a7;
    --timed-primary-hover: #00a089;
    --timed-primary-soft: #e6fffa;
  
    /* Danger (ej. Dispositivos / acciones críticas) */
    --timed-danger: #ff5c75;
    --timed-danger-hover: #e34b63;
    --timed-danger-soft: #ffe9ed;
  }
  
  /* BOTÓN PRINCIPAL TIMED PACIENTE */
  .btn-timed-primary {
      border: 1px solid #00949b;              /* borde ligeramente más oscuro */
      border-radius: 999px;
      padding: 10px 16px;
  
      /* mismo turquesa del header/login */
      background-color: #00b7bd;              /* si prefieres: #01c0c8 */
      color: #ffffff !important;
  
      font-weight: 600;
      font-size: 14px;
      letter-spacing: 0.04em;
      text-transform: uppercase;
  
      box-shadow: 0 8px 18px rgba(0, 183, 189, 0.45);
      transition: transform .15s ease,
                  box-shadow .15s ease,
                  background-color .15s ease,
                  filter .15s ease;
  }
  
  .btn-timed-primary:hover {
      background-color: #00949b;              /* un poco más oscuro al pasar el mouse */
      box-shadow: 0 12px 24px rgba(0, 148, 155, 0.55);
      filter: brightness(1.02);
      transform: translateY(-1px);
  }
  
  .btn-timed-primary:active {
      background-color: #007c85;              /* aún más oscuro al hacer clic */
      box-shadow: 0 6px 14px rgba(0, 124, 133, 0.55);
      transform: translateY(1px);
  }
  
  /* Botón contorno / secundario */
  .btn-timed-outline {
    background-color: #ffffff;
    color: var(--timed-primary);
    border-radius: 999px;
    padding: .55rem 1.6rem;
    border: 1px solid var(--timed-primary);
    font-weight: 600;
  }
  .btn-timed-outline:hover,
  .btn-timed-outline:focus {
    background-color: var(--timed-primary-soft);
    color: var(--timed-primary-hover);
    border-color: var(--timed-primary-hover);
  }
  
  /* Botón TIMED DANGER (llamativo, acciones críticas) */
  .btn-timed-danger {
    background-color: var(--timed-danger);
    border-color: var(--timed-danger);
    color: #ffffff;
    font-weight: 600;
    border-radius: 999px;
    padding: .55rem 1.6rem;
    box-shadow: 0 10px 20px rgba(255, 92, 117, .25);
  }
  .btn-timed-danger:hover,
  .btn-timed-danger:focus {
    background-color: var(--timed-danger-hover);
    border-color: var(--timed-danger-hover);
    color: #ffffff;
  }
  
  /* Versión outline de danger (opcional) */
  .btn-timed-danger-outline {
    background-color: #ffffff;
    color: var(--timed-danger);
    border-radius: 999px;
    padding: .55rem 1.6rem;
    border: 1px solid var(--timed-danger);
    font-weight: 600;
  }
  .btn-timed-danger-outline:hover,
  .btn-timed-danger-outline:focus {
    background-color: var(--timed-danger-soft);
    color: var(--timed-danger-hover);
    border-color: var(--timed-danger-hover);
  }
  
  /* Botones pequeños en tarjetas (Abrir en Maps, etc.) */
  .btn-timed-primary.btn-sm,
  .btn-timed-danger.btn-sm,
  .btn-timed-outline.btn-sm,
  .btn-timed-danger-outline.btn-sm {
    padding: .3rem .85rem;
    border-radius: 999px;
    font-size: .8rem;
  }
  
  .cardParametro {
      position: relative;
      display: flex;
      flex-direction: column;
      min-width: 0;
      word-wrap: break-word;
      background-color: #ffffff;
      background-clip: border-box;
      border: 0 solid transparent;
      border-radius: 40px;
  }
  
  /* Ajustar el tamaño del checkbox */
  .custom-checkbox {
      width: 12px;
      height: 12px;
      margin: 14px;
      vertical-align: middle;
      background-color: #fff;
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
      border: 1px solid rgba(0, 0, 0, 0.25);
  }
  
  /* Alinear el checkbox con el input */
  .input-group-text {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
  }
  
  /* Asegurar que el input-group tenga la misma altura */
  .input-group {
      align-items: center;
  }
  
  .rounded-lg {
      border-radius: 0.85rem !important;
  }
  
  .card.card-custom {
      -webkit-box-shadow: 0px 0px 30px 0px rgb(208 208 208 / 41%);
      box-shadow: 0px 0px 30px 0px rgb(208 208 208 / 41%);
      border: 0;
  }
  
  .bgi-no-repeat {
      background-repeat: no-repeat;
  }
  
  /* ===== Tarjetas médicos ===== */
  .doctor-card{
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
    border: 1px solid rgba(0,0,0,.04);
    margin-bottom: 1.5rem;
  }
  .doctor-card:hover{
      transform: translateY(-2px);
      box-shadow: 0 10px 28px rgba(0,0,0,.08);
      border-color: rgba(13,110,253,.12);
  }
  
  .doctor-card .card-body{
    padding: 1.1rem 1.4rem;
  }
  
  .doctor-avatar{
      width: 56px;
      height: 56px;
      border-radius: 50%;
      background:#e9f5ff;
      color:#0d6efd;
      font-weight:700;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1.15rem;
      flex-shrink:0;
  }
  
  .badge-soft{
      background:#eef2ff;
      color:#3b5bfd;
      font-weight:600;
      border-radius: 999px;
      padding:.35rem .6rem;
      font-size:.8rem;
  }
  
  .info-item{
    display:flex;
    gap:.5rem;
    align-items:flex-start;
    padding:.25rem 0;             /* antes .35rem */
    border-bottom:1px dashed rgba(0,0,0,.06);
  }
  .info-item:last-child{
      border-bottom:none;
  }
  
  .info-item .label{
      color:#6c757d;
      font-size:.85rem;
      min-width:88px;
  }
  .info-item .value{
      font-weight:500;
      color:#212529;
      line-height:1.25rem;
  }
  
  .badge-distancia{
      background:#e9f7ef;
      color:#198754;
      font-weight:600;
      border-radius:999px;
      font-size:.75rem;
      padding:.25rem .5rem;
      white-space:nowrap;
  }
  
  /* CONTENEDOR DEL MAPA EN LA TARJETA (COMPACTO EN DESKTOP) */
  .doctor-map-embed{
      max-width: 220px;
      min-width: 180px;
  }
  .doctor-map-embed iframe{
      min-height: 140px;
  }
  
  /* Botones full ancho en móvil */
  @media (max-width: 575.98px){
      .doctor-actions .btn{ width:100%; }
  }
  
  /* ===== Filtros ===== */
  .filters-card{
      border-radius: 20px;
      background: linear-gradient(135deg, #ffffff 0%, #f6f9ff 100%);
      border: 1px solid rgba(15, 23, 42, 0.04);
      box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
      position: relative;
      overflow: hidden;
  }
  .filters-card::after{
      content:'';
      position:absolute;
      right:-60px;
      top:-60px;
      width:200px;
      height:200px;
      background: radial-gradient(circle at center, rgba(56,189,248,0.18), transparent 60%);
      opacity:.7;
      pointer-events:none;
  }
  
  .filters-header-title{
      font-size:1.25rem;
      font-weight:600;
      color:#111827;
  }
  .filters-header-subtitle{
      font-size:.9rem;
      color:#6b7280;
  }
  
  .filter-label{
      font-size:.85rem;
      font-weight:600;
      color:#4b5563;
      margin-bottom: .2rem;
  }
  
  .btn-search-main{
      border-radius:999px;
      padding:.55rem 1.6rem;
      font-weight:600;
      box-shadow:0 10px 20px rgba(16,185,129,.25);
      border:none;
  }
  .btn-search-main i{
      margin-right:.35rem;
  }
  
  .results-summary{
      font-size:.85rem;
      color:#6b7280;
  }
  
  .badge-orden-cercania{
      background:#ecfdf3;
      color:#166534;
      border-radius:999px;
      border:1px solid #bbf7d0;
      font-size:.75rem;
      padding:.2rem .6rem;
      margin-left:.4rem;
      font-weight:600;
      white-space:nowrap;
  }
  
  /* Top 3 por cercanía */
  .doctor-card-top-0{
      border-color:#16a34a !important;
      box-shadow:0 0 0 1px rgba(22,163,74,.25), 0 10px 28px rgba(22,163,74,.15);
  }
  .doctor-card-top-1{
      border-color:#22c55e !important;
      box-shadow:0 0 0 1px rgba(34,197,94,.25), 0 10px 24px rgba(34,197,94,.12);
  }
  .doctor-card-top-2{
      border-color:#4ade80 !important;
      box-shadow:0 0 0 1px rgba(74,222,128,.25), 0 8px 20px rgba(74,222,128,.12);
  }
  
  .badge-top-ranking{
      border-radius:999px;
      font-size:.7rem;
      padding:.15rem .55rem;
      font-weight:600;
      margin-right:.35rem;
      white-space:nowrap;
  }
  .badge-top-0{
      background:#ecfdf3;
      color:#166534;
      border:1px solid #bbf7d0;
  }
  .badge-top-1{
      background:#f0fdf4;
      color:#15803d;
      border:1px solid #bbf7d0;
  }
  .badge-top-2{
      background:#f7fee7;
      color:#4d7c0f;
      border:1px solid #d9f99d;
  }
  
  /* ESTILOS VACUNAS */
  
  table { border: 1px solid #ddd; background: #fff; }
  table.table tr, table.table tr th, table.table tr td { border: none; }
  table.table tr td{ border: 1px solid #000; }
  .form-control{
      background: #fff;
  }
  
  .input-group-addon{
      margin:5px;
  }
  
  input {
      padding: 8px 12px;
      border: none;             /* Sin borde */
      border-radius: 4px;
      background-color: #fff;
      box-shadow: 0 0 0 1px #ddd; /* Sombra que simula borde */
      font-size: 16px;
  }
  
  input:focus {
      box-shadow: 0 0 0 2px #007bff; /* Borde azul al enfocar */
  }
  
  /* Estilo base del datepicker */
  input.datepicker {
      padding: 8px 12px;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 16px;
      background-color: #fff;
      color: #333;
      cursor: pointer;
      transition: all 0.3s ease;
  }
  
  /* Estilo cuando está DESHABILITADO */
  input.datepicker:disabled {
      background-color: #f5f5f5; /* Fondo gris claro */
      color: #999;              /* Texto gris */
      border-color: #e0e0e0;    /* Borde más claro */
      cursor: not-allowed;      /* Cursor de "no permitido" */
  }
  
  /* Estilo cuando está HABILITADO */
  input.datepicker:not(:disabled) {
      background-color: #e8f4ff; /* Fondo azul claro */
      border-color: #4a90e2;     /* Borde azul */
  }
  
  /* Estilo al enfocar (opcional) */
  input.datepicker:not(:disabled):focus {
      outline: none;
      box-shadow: 0 0 0 2px rgba(74, 144, 226, 0.3);
  }
  
  /* ESTILO MAPA DE LA SALUD */
  .health-map-section-title{
      font-weight:600;
      font-size:0.9rem;
      display:flex;
      align-items:center;
      margin-top:.75rem;
      margin-bottom:.35rem;
  }
  .health-map-section-title i{
      margin-right:.35rem;
  }
  
  /* separación vertical pequeña entre filas de pastillas */
  .health-map .row.g-2{
      row-gap:.4rem;
  }
  
  /* PASTILLAS DEL MAPA DE LA SALUD */
  .health-map-pill{
      border-radius:12px;
      border:1px solid transparent;
      padding:.4rem .35rem;          /* menos padding para que quepan más */
      text-align:center;
      height:100%;
      cursor:pointer;
      transition:box-shadow .15s ease, transform .1s ease;
      font-size:.75rem;              /* texto base más pequeño */
  }
  .health-map-pill small{
      display:block;
      font-size:.65rem;              /* etiqueta más pequeña */
      text-transform:uppercase;
      line-height:1.1;
  }
  .health-map-pill .health-value{
      font-size:1rem;                /* valor más compacto */
      font-weight:700;
      line-height:1.1;
  }
  .health-map-pill:hover{
      box-shadow:0 0 0 2px rgba(0,0,0,.04);
      transform:translateY(-1px);
  }
  .health-map-pill.critico{
      border-color:#f44336;
      background:rgba(244,67,54,.06);
      color:#d32f2f;
  }
  .health-map-pill.alerta{
      border-color:#ff9800;
      background:rgba(255,152,0,.06);
      color:#ef6c00;
  }
  .health-map-pill.normal{
      border-color:#4caf50;
      background:rgba(76,175,80,.06);
      color:#388e3c;
  }
  
  /* VISTA VACÍA */
  .health-map-empty h6{
      font-weight:600;
      margin-bottom:.25rem;
  }
  .health-map-empty p{
      font-size:.9rem;
      color:#757575;
  }
  .health-map-empty .circle-icon{
      width:60px;
      height:60px;
      border-radius:50%;
      border:1px solid #e0e0e0;
      display:inline-flex;
      align-items:center;
      justify-content:center;
  }
  
  /* TARJETAS DEL MODAL DE CONFIGURACIÓN */
  .health-config-card{
      border-radius:16px;
      border:1px solid #eeeeee;
      padding:.75rem .9rem;
      margin-bottom:.55rem;
      background:#ffffff;
      display:flex;
      align-items:center;
      justify-content:space-between;
      box-shadow:0 1px 3px rgba(0,0,0,.04);
  }
  .health-config-info{
      display:flex;
      align-items:center;
      gap:.7rem;
  }
  .health-config-icon{
      width:34px;
      height:34px;
      border-radius:12px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1rem;
      color:#ffffff;
  }
  
  /* Iconos del modal CONFIGURAR MAPA DE SALUD */
  .health-config-icon{
      width:34px;
      height:34px;
      border-radius:12px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1rem;
      color:#ffffff;           /* color del ícono */
  }
  
  /* --- Estudios de laboratorio --- */
  .config-glucosa        { background:#42a5f5; }  /* azul */
  .config-colesterol     { background:#ffb74d; }  /* ámbar */
  .config-trigliceridos  { background:#90a4ae; }  /* gris azulado */
  .config-hemoglobina    { background:#ef9a9a; }  /* rojo suave */
  .config-creatinina     { background:#bcaaa4; }  /* café claro */
  .config-acidourico     { background:#ffcc80; }  /* naranja suave */
  
  .config-colesterol-hdl { background:#81c784; }  /* verde suave */
  .config-colesterol-ldl { background:#ffb74d; }  /* ámbar (igual que col.) */
  .config-hba1c          { background:#ba68c8; }  /* morado */
  
  /* --- Signos vitales --- */
  .config-presion-arterial   { background:#ff8a80; } /* rojo claro */
  .config-frecuencia-cardiaca{ background:#f06292; } /* rosa */
  .config-sato2              { background:#4dd0e1; } /* cian */
  .config-temperatura        { background:#ffb74d; } /* naranja/termómetro */
  .config-presion-sistolica  { background:#ef5350; } /* rojo */
  .config-presion-diastolica { background:#ce93d8; } /* lila */
  
  /* --- Mediciones --- */
  .config-peso           { background:#9575cd; }  /* morado */
  .config-imc            { background:#66bb6a; }  /* verde */
  .config-pasos          { background:#a5d6a7; }  /* verde muy claro */
  .config-suenho         { background:#5c6bc0; }  /* azul/morado noche */
  .config-calorias       { background:#ff7043; }  /* naranja fuego */
  
  
  
  
  .health-config-name{
      font-weight:600;
      font-size:.9rem;
  }
  .health-config-unit{
      font-size:.8rem;
      color:#757575;
  }
  
  /* Ajustes por tamaño de pantalla */
  
  @media (max-width: 575.98px){
      .health-map-pill{
          padding:.35rem .3rem;
          font-size:.72rem;
      }
      .health-map-pill .health-value{
          font-size:.95rem;
      }
  }
  
  /* En pantallas medianas y grandes las hacemos aún más densas */
  @media (min-width: 768px){
      .health-map-pill{
          padding:.3rem .3rem;
          font-size:.7rem;
      }
      .health-map-pill .health-value{
          font-size:.9rem;
      }
  }
  @media (min-width: 1200px){
      .health-map-pill{
          padding:.25rem .25rem;
      }
  }
  
  
  .modal {
      z-index: 1060 !important;
  }
  .modal-backdrop {
      z-index: 1050 !important;
  }