/* ==========================================================================
   ESTILOS GESTIÓN PROFESORADO (CLON UHU)
   Namespace: #uhu-app-wrapper
   ========================================================================== */

/* Reset básico de seguridad dentro del módulo */
#uhu-app-wrapper * {
  box-sizing: border-box;
}
#uhu-app-wrapper {
  display: flow-root;
}
/* ==========================================================================
   1. GRID SYSTEM (Listado de Tarjetas)
   ========================================================================== */

/* Contenedor flexible principal */
#uhu-app-wrapper .c-content-directory .views-rows,
#uhu-app-wrapper .c-content-directory.views-rows { /* Soporte ambas variantes */
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
  width: auto;
}

/* Columna individual (Wrapper de tarjeta) */
#uhu-app-wrapper .views-row {
  width: 100%; /* Móvil: 1 columna (100%) */
  padding: 0 15px;
  margin-bottom: 30px;
  display: flex; /* Para igualar alturas de tarjetas en la misma fila */
  box-sizing: border-box;
}

/* Responsive: Escritorio (>992px / 62rem) -> 2 Columnas */
@media only screen and (min-width: 62rem) { 
  #uhu-app-wrapper .views-row {
    width: 50%;
  }
}


/* ==========================================================================
   2. TARJETA DE PROFESOR (Estilo Clonado)
   ========================================================================== */

/* Contenedor de la tarjeta */
#uhu-app-wrapper .c-search-list-container__item {
  margin-bottom: 0; /* El margen lo da el padre .views-row */
  padding: 16px !important;
  overflow: hidden;
  text-align: left;
  height: 100%;
  width: 100%;
  background: #fff;
  display: flex;
  flex-direction: column;
}

/* Estilo de caja (Sombra y Borde) */
#uhu-app-wrapper .u-box-shadow {
  background: #fff;
  border-radius: 3px;
  box-shadow: 0 5px 15px 0 rgba(0,0,0,0.07);
  border: solid 1px rgba(217,217,217,0.3);
  transition: all 0.3s ease;
}


/* Contenedor interno */
#uhu-app-wrapper .c-search-list-container__content {
  width: 100%;
  padding-left: 5px !important;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}


/* ==========================================================================
   3. TIPOGRAFÍA Y CAMPOS
   ========================================================================== */

/* Nombre del Profesor */
#uhu-app-wrapper .staff-name {
  padding: 0;
  margin: 0 0 16px;
  display: block;
  font-size: 1.1rem;
  line-height: 1.2rem;
  font-weight: 600;
  color: #333;
}

#uhu-app-wrapper .staff-name div {
  display: inline; /* Para que nombre y apellidos salgan seguidos */
}

#uhu-app-wrapper .staff-name a {
  color: #333;
  text-decoration: none;
}

#uhu-app-wrapper .staff-name a:hover {
  color: #a80a2e;
}

/* Cargo y Descripción */
#uhu-app-wrapper .field--name-field-position-description,
#uhu-app-wrapper .c-personal-pas-categorization {
  line-height: 1.5rem;
  font-size: 0.875rem;
  color: #333;
}

/* Área / Servicio (con bolita decorativa) */
#uhu-app-wrapper .c-personal-pas-categorization .field {
  display: inline-block;
  padding-left: 10px;
  position: relative;
  margin-right: 10px !important;
}

#uhu-app-wrapper .c-personal-pas-categorization .field:before {
  position: absolute;
  left: 0;
  top: 9px;
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  background: #000;
  border-radius: 50%;
}


/* ==========================================================================
   4. ICONOS DE CONTACTO (o-icon-txt)
   ========================================================================== */

#uhu-app-wrapper .o-icon-txt {
  position: relative;
  padding-left: 30px;
  min-height: 20px;
  display: flex;
  align-items: flex-start; /* Alineación superior */
  line-height: 1.4;
  font-size: 0.9em;
  color: #666666;
  margin-bottom: 10px;
  margin-right: 17px;
  margin-left: -3px;
}

/* Icono (Rojo Burdeos) */
#uhu-app-wrapper .o-icon-txt__icon {
  color: #a80a2e;
  position: absolute;
  top: 0;
  left: 0;
  font-size: 20px;
  width: 30px;
  text-align: left;
}

/* Enlaces (Email, Web) */
#uhu-app-wrapper .o-icon-txt a {
  color: #016ca2; /* Azul corporativo enlaces */
  text-decoration: none;
}

#uhu-app-wrapper .o-icon-txt a:hover {
  color: #016ca2;
  opacity: 0.8;
  text-decoration: underline;
}


/* ==========================================================================
   5. BOTÓN "VER FICHA" (Estilo .o-btn-more-link-txt-primary)
   ========================================================================== */

#uhu-app-wrapper .o-btn-more-link-txt-primary {
  display: block;
  padding: 0;
  margin-top: auto; /* Empujar al fondo de la tarjeta */
  margin-bottom: 0;
  clear: both;
}

#uhu-app-wrapper .o-btn-more-link-txt-primary .wp-block-button__link {
  display: inline-block !important;
  position: relative;
  padding: 8px 20px 8px 25px; /* Espacio extra a la izquierda para la flecha */
  font-size: 0.875rem !important;
  font-weight: 700;
  color: #005165;
  background: transparent;
  text-align: left;
  transition: 0.3s;
  text-decoration: none;
  cursor: pointer;
}

/* Flechita decorativa */
#uhu-app-wrapper .o-btn-more-link-txt-primary .wp-block-button__link:before {
  content: "\f105"; /* Código arrow-right */
  font-family: 'Line Awesome Free';
  font-weight: 900;
  font-size: 16px;
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
  color: #005165;
}

#uhu-app-wrapper .o-btn-more-link-txt-primary .wp-block-button__link:hover {
  text-decoration: underline;
  opacity: 0.8;
}


/* ==========================================================================
   6. COMPONENTES EXTRA (Buscador, Calendario, Ficha Detalle)
   ========================================================================== */

/* --- Buscador Lateral --- */
#uhu-app-wrapper .uhu-search-wrapper {
  background: #f9f9f9; padding: 20px; border: 1px solid #eee; border-radius: 4px; margin-bottom: 20px;
}
#uhu-app-wrapper .uhu-search-wrapper label {
  font-weight: bold; color: #a80a2e; display: block; margin-bottom: 8px;
}
#uhu-app-wrapper .uhu-search-wrapper input {
  width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 3px; margin-bottom: 15px;
}
#uhu-app-wrapper .uhu-search-wrapper .uhu-search-btn {
  background: #005165; color: #fff; border: none; padding: 10px; width: 100%; cursor: pointer; border-radius: 3px;
}

/* --- Filtros Áreas --- */
#uhu-app-wrapper .uhu-areas-filter-container {
  display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px;
}
#uhu-app-wrapper .uhu-filter-btn {
  padding: 5px 12px; background: #fff; border: 1px solid #ccc; border-radius: 20px; color: #555; font-size: 0.85rem; cursor: pointer;
}
#uhu-app-wrapper .uhu-filter-btn.active {
  background: #005165; color: #fff; border-color: #005165;
}

/* --- Calendario Tutorías --- */
#uhu-app-wrapper .uhu-tutoria-container {
  background: #fff; margin-top: 20px;  margin-bottom: 120px; border-radius: 4px; overflow: hidden;
}
#uhu-app-wrapper .uhu-tutoria-header {
  background: #a80a2e; color: #fff; padding: 20px;
}
#uhu-app-wrapper .uhu-tutoria-name a {
  color: #fff; font-size: 1.5rem; font-weight: bold; text-decoration: none;
}
#uhu-app-wrapper .uhu-tabs {
  display: flex; border-bottom: 1px solid #ccc;
}
#uhu-app-wrapper .uhu-tab-btn {
  background: none; border: none; padding: 15px; flex-grow: 1; cursor: pointer; font-weight: 600; color: #555;
}
#uhu-app-wrapper .uhu-tab-btn.active {
  background: #fff; color: #a80a2e; border-bottom: 3px solid #a80a2e;
}
#uhu-app-wrapper .uhu-calendar-wrapper {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; padding-top: 15px; padding-bottom: 50px;
}
#uhu-app-wrapper .calendar-header {
  background: #005165; color: #fff; text-align: center; padding: 5px; font-weight: bold; font-size: 0.9rem;
}
#uhu-app-wrapper .calendar-column {
  border: 1px solid #eee; min-height: 150px; background: #fdfdfd;
}

/* --- AIRE / LECTURA (añadir o ajustar) --- */
#uhu-app-wrapper .uhu-tab-content {
  line-height: 1.6;
}

#uhu-app-wrapper .calendar-event {
  background: #fff;
  padding: 12px 12px;           /* antes 8px */
  margin: 10px 8px;             /* antes 5px */
  border-left: 3px solid #a80a2e;
  font-size: 0.9rem;            /* antes 0.85rem */
  line-height: 1.55;            /* interlineado dentro del evento */
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

#uhu-app-wrapper .event-details {
  margin-top: 8px;              /* antes 5px */
  line-height: 1.7;             /* más aire en detalles */
}

#uhu-app-wrapper .event-location {
  margin-top: 6px;              /* separa "Despacho/Edificio" */
}

#uhu-app-wrapper .uhu-tutoria-weeks {
  margin-top: 8px;
}

#uhu-app-wrapper .uhu-week-dates-panel {
  margin-top: 22px;
  padding: 16px;
  border: 1px solid #e6e6e6;
  border-radius: 8px;
  background: #fafafa;
}

#uhu-app-wrapper .uhu-week-dates-title {
  font-weight: 700;
  color: #005165;
  margin-bottom: 12px;
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 8px;
}

#uhu-app-wrapper .uhu-week-dates-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

#uhu-app-wrapper .uhu-week-dates-list {
  margin: 0;
  padding-left: 18px;
}

#uhu-app-wrapper .uhu-week-dates-list li {
  margin-bottom: 6px;
}

@media (max-width: 900px) {
  #uhu-app-wrapper .uhu-calendar-wrapper { grid-template-columns: 1fr; }
  #uhu-app-wrapper .uhu-week-dates-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  #uhu-app-wrapper .uhu-week-dates-grid { grid-template-columns: 1fr; }
}

/* --- Ficha Detalle (Básicos) --- */
#uhu-app-wrapper .uhu-detail-container {
  background: #fff; padding: 30px; border: 1px solid #eee; border-radius: 4px;
}
#uhu-app-wrapper .uhu-detail-header h1 { color: #a80a2e; margin-bottom: 5px; }
#uhu-app-wrapper .uhu-detail-grid {
  display: grid; grid-template-columns: 1fr; gap: 30px; margin-top: 20px;
}
@media (min-width: 768px) {
  #uhu-app-wrapper .uhu-detail-grid { grid-template-columns: 1fr 1fr; }
}
#uhu-app-wrapper .detail-column h3 {
  color: #005165; border-bottom: 1px solid #eee; padding-bottom: 10px; font-size: 1.2rem; margin-bottom: 15px;
}