body {
      font-family: system-ui, sans-serif;
      font-weight: 200;
      font-size: 13px;
    }

    input, select, textarea, .form-control {
  font-family: inherit;
   font-weight: inherit;
      font-size: inherit;
}

/* Estilo uniforme para títulos y texto general */
h1, h2, h3, h4, h5, h6,
.card-title, .card-body, .content, .topbar,
p, span, small, strong {
  font-family: inherit;
  font-weight: 300 !important;
  font-size: 13px !important;
  color: #333;
}
a {
    color: #0d6efd; /* azul bootstrap */
    text-decoration: none;
}

a:hover {
    color: #0a58ca;
    text-decoration: none;
}

/* Saludo: Bienvenido, Marcelino Bravo */
.topbar h5, .topbar h4, .topbar p {
  font-size: 13px;
  font-weight: 300;
}

/* Títulos grandes como "Dashboard" */
.content h4 {
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 1rem;
}

/* Títulos dentro de tarjetas */
.card-title {
  font-size: 14px;
  font-weight: 400;
}

    .sidebar {
      height: 100vh;
      position: fixed;
      left: 0;
      top: 0;
      padding-top: 0;
      background-color: #f8f9fa;
      width: 250px;
      border-right: 1px solid #dee2e6;
      overflow-y: auto;
      scroll-behavior: smooth;
    }
    .sidebar .logo {
      text-align: center;
    }
    .sidebar .logo img {
      max-width: 190px;
      height: auto;
    }
    .content {
      margin-left: 250px;
      padding: 20px;
      padding-top: 50px;
    }
    .topbar {
      height: 60px;
      background-color: #fff;
      border-bottom: 1px solid #dee2e6;
      padding: 0 20px;
      position: fixed;
      left: 250px;
      right: 0;
      top: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      z-index: 1000;
    }
    :root {
      --inmo-orange: #ff5b00;
      --inmo-blue: #007bff;
    }
    .navbar-inmo {
      background-color: var(--inmo-blue);
      color: white;
      height: 60px;
      display: flex;
      align-items: center;
      padding: 0 20px;
      justify-content: space-between;
    }
    .navbar-left {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .sidebar a {
      display: flex;
      align-items: center;
      color: #333;
      border-radius: 10px;
      margin-bottom: 8px;
      text-decoration: none;
      font-weight: 200;
      font-size: 13px;
    }
    
    .sidebar a:hover, .sidebar a.active {
      background-color: var(--inmo-blue);
  color: #fff !important;
  stroke: #fff !important;
    }
    .sidebar a i {
      color: var(--inmo-blue);
    }
    .sidebar a:hover i, .sidebar a.active i {
  color: #fff !important;
  stroke: #fff !important;
    }
    .icon-sm {
      width: 25px;
      height: 25px;
      padding-right: 6px;
    }
    @media (max-width: 768px) {
      .sidebar {
        display: none;
      }
      .topbar {
        left: 0;
      }
      .content {
        margin-left: 0;
        padding-top: 70px;
      }
    }
    /* Estilo más elegante para los botones del menú móvil */
#menuMobile .offcanvas-body {
  padding: 10px;
  background-color: #f8f9fa;
}

#menuMobile .offcanvas-body ul li a {
  display: block;
  padding: 12px 14px;
  background-color: #e9f2ff;
  border-radius: 8px;
  color: var(--inmo-blue);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  border: 1px solid #ddd;
  transition: background-color 0.2s ease-in-out;
}

#menuMobile .offcanvas-body ul li a:hover {
  background-color: #d6e8ff;
}

#menuMobile .offcanvas-body ul li a.text-danger {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}

#menuMobile .offcanvas-body ul li a.text-danger:hover {
  background-color: #f1b0b7;
}

#menuMobile .menu-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background-color: #e9f2ff;
  border-radius: 8px;
  color: var(--inmo-blue);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  border: 1px solid #ddd;
  transition: background-color 0.2s ease-in-out;
}

#menuMobile .menu-link:hover {
  background-color: #d6e8ff;
}

#menuMobile .menu-link.text-danger {
  background-color: #f8d7da;
  color: #721c24;
  border: 1px solid #f5c6cb;
}

#menuMobile .menu-link.text-danger:hover {
  background-color: #f1b0b7;
}

.table th,
.table td {
  font-family: inherit;
  font-weight: 300;
  font-size: 0.8rem;
  color: #333;
}

/* Estilo global coherente para inputs, selects, textarea y placeholders */
input, select, textarea, .form-control {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
}

input::placeholder, textarea::placeholder {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  color: #888; /* opcional para que el placeholder no se vea tan apagado */
}

label {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
}

/* Aplica color blanco al texto y al ícono cuando esté activo */
.sidebar .nav-link.active,
.sidebar .nav-link:hover {
  color: #fff !important;
  background-color: #b7cdee; /* azul Bootstrap o el que tú uses */
  border-radius: 11px;
}

/* Aplica stroke blanco al ícono Feather dentro del enlace activo */
.sidebar .nav-link.active i,
.sidebar .nav-link:hover i {
  stroke: #fff !important;
}

.logo {
  text-align: center;
}
.logo a {
  display: inline-block;
}

/* Estado expandido (por defecto) */
#sidebarMenu {
  width: 250px; /* o el ancho que tengas actualmente */
  transition: width 0.3s;
}

/* Estado colapsado */
#sidebarMenu.sidebar-collapsed {
  width: 60px;
}

/* En estado colapsado, ocultar el texto de los items y el logo (o ajustar) */
#sidebarMenu.sidebar-collapsed .logo,
#sidebarMenu.sidebar-collapsed .nav-link span,
#sidebarMenu.sidebar-collapsed .nav-item .collapse {
  display: none;
}

/* Ajustar los iconos para que estén centrados en estado colapsado */
#sidebarMenu.sidebar-collapsed .nav-link {
  justify-content: center;
}

#sidebarMenu.sidebar-collapsed .nav-link i {
  margin-right: 0;
}

/* Ajustar el botón de colapsar/expandir para que se vea bien en ambos estados */