/* ==========================================================================
   Estilos del Formato "Topics Activity Cards": Tarjetas de Actividad y Secciones
   ========================================================================== */

/* Estilo de las tarjetas de actividad (tareas, cuestionarios, lecciones, etc.) */
.format-topicsactivitycards .single-section li.activity-wrapper:not(.label) {
    border: 1px solid #ecedf1;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    background-color: #ffffff;
    border-radius: 7px;
    margin-bottom: 10px;
}

/* Quita linea divisoria entre actividades*/
body.format-topicsactivitycards .activity {
    border: none !important;
}

/* --------------------------------------------------------------------------
   Estilos Exclusivos para las Secciones Interiores (Vista de Sección Única)
   -------------------------------------------------------------------------- */

/* 1. Eliminar borde de las actividades (excepto etiquetas) solo en vista interna */
body.format-topicsactivitycards .single-section li.course-section:not(.section-summary) .activity-wrapper {
    border: none !important;
}

/* 2. Eliminar margen superior del contenedor de la sección solo en vista interna */
body.format-topicsactivitycards .single-section li.course-section:not(.section-summary) {
    margin-top: 0 !important;
}

/* 3. Eliminar margen y padding superior de la descripción solo en vista interna */
body.format-topicsactivitycards .single-section li.course-section:not(.section-summary) .description[data-for="sectioninfo"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 4. Eliminar el padding superior del contenedor de actividades solo en vista interna */
body.format-topicsactivitycards.path-course-view #page ul.topicsactivitycards li.course-section:not(.section-summary) .section-inner-wrapper .content {
    padding-top: 0 !important;
}

/* 5. Eliminar el padding superior de la cabecera de la sección solo en vista interna */
body.format-topicsactivitycards.path-course-view #page ul.topicsactivitycards li.course-section:not(.section-summary) .section-inner-wrapper .course-section-header {
    padding-top: 0 !important;
}

/* Ajusta el alto del menú secundario para heredar el borde inferior */
.moremenu {
    height: inherit;
}

/* Ajusta borde inferior y fondo de ítem de menú secundario al pasar el mouse por encima */
.moremenu .nav-link:hover, .moremenu .nav-link:focus {
    border-color: transparent;
    background-color: #64a4b814;
    border-bottom: solid 3px #007b99db;
}

/* --------------------------------------------------------------------------
   Formulario Google Meet: Modificaciones Visuales
   -------------------------------------------------------------------------- */

/* 1. Ocultar los contenedores especificados */
#page-mod-googlemeet-mod #fitem_id_maxupcomingevents,
#page-mod-googlemeet-mod #id_headeraddmultipleeventdates,
#page-mod-googlemeet-mod #id_headerholidayperiods,
#page-mod-googlemeet-mod #id_headercancelleddates {
    display: none !important;
}

/* 2. Renderizar fecha y horas en la misma fila (con ajuste para móviles) */
/* Ocultamos los saltos de línea forzados de Moodle para que el texto fluya libremente */
#page-mod-googlemeet-mod #fgroup_id_eventtime fieldset .d-flex > div:empty,
#page-mod-googlemeet-mod #fgroup_id_eventtime fieldset .d-flex > div[style*="width: 100%"] {
    display: none !important;
}

/* Permitimos que los elementos se mantengan en línea, pero que bajen si falta espacio (wrap) */
#page-mod-googlemeet-mod #fgroup_id_eventtime fieldset .d-flex {
    flex-wrap: wrap !important; /* Cambiado de nowrap a wrap para adaptabilidad móvil */
    align-items: center !important;
    gap: 10px;
}

/* Ajustamos los márgenes inferiores de los selectores para que la fila no quede asimétrica */
#page-mod-googlemeet-mod #fgroup_id_eventtime fieldset .d-flex .mb-3 {
    margin-bottom: 0 !important;
}

/* 3. Reemplazar las preposiciones de la hora ("de" por "Desde" y "a" por "hasta") */
/* Ocultamos el tamaño de fuente del texto original para que desaparezca visualmente */
#page-mod-googlemeet-mod #fgroup_id_eventtime .items-center {
    font-size: 0 !important;
}

/* El texto original "de" es el 3er div dentro del contenedor flex, lo cambiamos por "Desde" */
#page-mod-googlemeet-mod #fgroup_id_eventtime fieldset .d-flex > .items-center:nth-child(3)::after {
    content: "Desde";
    font-size: 1rem; /* Restaura el tamaño basado en la raíz */
}

/* El texto original "a" es el 6to div dentro del contenedor flex, lo cambiamos por "hasta" */
#page-mod-googlemeet-mod #fgroup_id_eventtime fieldset .d-flex > .items-center:nth-child(6)::after {
    content: "hasta";
    font-size: 1rem;
}

/* --------------------------------------------------------------------------
   Indicador de Estado de Finalización de Cada Actividad
   -------------------------------------------------------------------------- */

.activity-item .activity-completion button.btn-success, .activity-item .activity-completion a[role="button"].btn-success {
    background-color: #e5fbe3;
    border-color: #cfe0cd;
    color: #296426;
}