/* Variables */
:root {
  --logo-size: 48px; /* Cambia a 72px si quieres tamaño mayor */
  --gutter: 10px;
}

/* Forzar box sizing */
.farmacias-widget, .farmacias-widget * {
  box-sizing: border-box;
  font-family: 'Roboto', sans-serif;
}

/* Contenedor */
.farmacias-widget {
  max-width: 320px;
}

/* --- FECHA: hacerla inline y pegada --- */
.farmacia-fecha {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 3px;
  font-size: 15px;
}

/* Si tu marca 'Fecha:' viene en <strong>, esto la respeta */
.farmacia-fecha strong {
  font-weight: 600;
  margin-right: 2px;
}

/* --- LISTA --- */
.farmacias-lista {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Cada item: reserva espacio fijo para logo y evita que salte */
.farmacia-item {
  padding: 8px 0;
  border-bottom: 1px solid #e9e9e9;
}

/* Contenido en fila: texto a la izquierda, logo fijo a la derecha */
.farmacia-contenido {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: var(--gutter) !important;
  flex-wrap: nowrap !important;  /* important: no permitir que el logo baje */
}

/* Texto ocupa todo lo que quede, pero puede reducirse (min-width:0) */
.farmacia-texto {
  flex: 1 1 auto;
  min-width: 0;                /* crucial para que ellipsis funcione en flex */
}

/* Nombre / detalle */
.farmacia-nombre {
  font-weight: 600;
  margin-bottom: 4px;
  color: #006400;
  font-size: 15px;
}
.farmacia-direccion,
.farmacia-telefono {
  font-size: 14px;
  margin: 2px 0;
  color: #333;
}

/* Limitar la dirección para que no empuje el logo:
   - mostramos hasta 3 líneas y luego '...' (webkit multiline ellipsis) */
.farmacia-direccion {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

/* --- LOGO: tamaño fijo, no se mueve --- */
.farmacia-logo {
  flex: 0 0 var(--logo-size) !important; /* reserva exacta */
  width: var(--logo-size);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 6px;
}
.farmacia-logo img {
  width: auto !important;
  height: var(--logo-size) !important;
  max-height: var(--logo-size) !important;
  display: block;
}

/* Último item sin border */
.farmacia-item:last-child {
  border-bottom: none;
}

/* Separador y enlace final */
.farmacias-separador {
  margin-top: 10px;
  border-bottom: 1px solid #ccc;
  height: 1px;
}
.farmacias-ver-todas {
  margin-top: 8px;
}
.farmacias-ver-todas a {
  color: #007d00;
  text-decoration: none;
  font-weight: 500;
}
.farmacias-ver-todas a:hover { text-decoration: underline; }