/* --- Estilos para placeholders --- */
::placeholder {
    color: #6c757d !important;
    opacity: 1 !important;
}

/* Estilos para placeholders en modo oscuro */
[data-theme="dark"] ::placeholder,
body.dark-mode ::placeholder {
    color: #9e9e9e !important;
}

/* --- Fix textos oscuros en modo oscuro --- */
[data-theme="dark"],
body.dark-mode {
    color: #e4e4e4;
}

/* Mejora de legibilidad para tablas */
[data-theme="dark"] table,
[data-theme="dark"] th,
[data-theme="dark"] td,
body.dark-mode table,
body.dark-mode th,
body.dark-mode td {
	color: #ffffff !important;
	background-color: #2d2d2d;
}

[data-theme="dark"] th,
body.dark-mode th {
	background-color: #3a3a3a !important;
	font-weight: 600;
}

/* Mejora de legibilidad para pestañas */
[data-theme="dark"] .nav-tabs .nav-link,
body.dark-mode .nav-tabs .nav-link {
	color: #e4e4e4;
	border-color: #404040;
}

[data-theme="dark"] .nav-tabs .nav-link.active,
body.dark-mode .nav-tabs .nav-link.active {
	color: #ffffff;
	background-color: #3a3a3a;
	border-color: #404040;
	border-bottom-color: transparent;
	font-weight: 600;
}

/* Mejora de legibilidad para títulos */
[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3,
[data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6,
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3,
body.dark-mode h4, body.dark-mode h5, body.dark-mode h6 {
	color: #ffffff;
	font-weight: 600;
}

/* Mejora de legibilidad para campos de formulario */
[data-theme="dark"] .form-control,
body.dark-mode .form-control {
	color: #ffffff !important;
	background-color: #2d2d2d !important;
	border-color: #404040;
}

[data-theme="dark"] .form-control:focus,
body.dark-mode .form-control:focus {
    color: #ffffff;
    background-color: #2d2d2d;
    border-color: #4a90e2;
    box-shadow: 0 0 0 0.2rem rgba(74, 144, 226, 0.25);
}

/* Estilos para placeholders en campos deshabilitados */
.form-control:disabled::placeholder {
    color: #adb5bd !important;
}

[data-theme="dark"] .form-control:disabled::placeholder,
body.dark-mode .form-control:disabled::placeholder {
    color: #6c757d !important;
}

/* Mejora de legibilidad para etiquetas */
[data-theme="dark"] label,
body.dark-mode label {
	color: #ffffff !important;
	font-weight: 500;
}

/* Navbar Styles */
.navbar {
	padding: 0.5rem 1rem;
}

.navbar-brand {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.logo-img {
	width: 40px;
	height: 40px;
	object-fit: contain;
}

.nav-link {
	display: flex;
	align-items: center;
	padding: 0.5rem;
	color: var(--bs-navbar-color);
	margin: 0 0.25rem;
	position: relative;
}

.nav-link:hover {
	color: var(--bs-navbar-hover-color);
}

.nav-link.active {
	color: var(--bs-navbar-active-color);
}

.nav-link i {
	font-size: 1.2rem;
}

/* Notification Dots */
.notification-dot {
	position: absolute;
	top: 0.25rem;
	right: 0.25rem;
	width: 8px;
	height: 8px;
	background-color: #dc3545;
	border-radius: 50%;
	border: 2px solid var(--bs-primary);
}

.notification-count {
	position: absolute;
	top: -5px;
	right: -5px;
	background-color: #dc3545;
	color: white;
	border-radius: 50%;
	padding: 0.25rem 0.5rem;
	font-size: 0.75rem;
	min-width: 1rem;
	text-align: center;
	line-height: 1;
}

/* Dark Mode Toggle */
#darkModeToggle {
	padding: 0.5rem;
	cursor: pointer;
	transition: all 0.3s ease;
}

#darkModeToggle:hover {
	color: var(--bs-navbar-hover-color);
	transform: rotate(15deg) scale(1.1);
}

#darkModeToggle i {
	transition: transform 0.5s ease;
}

[data-bs-theme="dark"] #darkModeToggle i {
	color: #ffc107;
	transform: rotate(180deg);
}

/* Dropdown styles */
.dropdown-menu {
	padding: 0.5rem 0;
	margin-top: 0.5rem;
	border: 1px solid rgba(0, 0, 0, 0.1);
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.dropdown-header {
	padding: 0.5rem 1rem;
	font-size: 0.875rem;
	background-color: rgba(0, 0, 0, 0.05);
}

.dropdown-item {
	padding: 0.5rem 1rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.dropdown-item:hover {
	background-color: rgba(0, 0, 0, 0.05);
}

.dropdown-divider {
	margin: 0.25rem 0;
}

/* Dark mode styles */
[data-theme="dark"] {
	--bs-body-bg: #1a1a1a;
	--bs-body-color: #e4e4e4;
	--bs-primary: #0d6efd;
	--bs-secondary: #6c757d;
	--bs-card-bg: #2d2d2d;
	--bs-card-border-color: #404040;
	--bs-navbar-color: rgba(255, 255, 255, 0.75);
	--bs-navbar-hover-color: rgba(255, 255, 255, 0.9);
	--bs-navbar-active-color: #fff;
	--bs-input-bg: #2d2d2d;
	--bs-input-color: #e4e4e4;
	--bs-input-border-color: #404040;
	--bs-table-color: #e4e4e4;
	--bs-table-bg: #2d2d2d;
	--bs-table-border-color: #404040;
	--bs-modal-bg: #2d2d2d;
	--bs-modal-border-color: #404040;
	color-scheme: dark;
}

[data-theme="dark"] .navbar {
	background-color: #343a40 !important;
}

[data-theme="dark"] .card {
	background-color: var(--bs-card-bg);
	border-color: var(--bs-card-border-color);
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select,
[data-theme="dark"] select,
[data-theme="dark"] .select2-container--default .select2-selection--multiple,
[data-theme="dark"] .select2-container--default .select2-selection--single {
	background-color: var(--bs-input-bg) !important;
	border-color: var(--bs-input-border-color) !important;
	color: var(--bs-input-color) !important;
}

[data-theme="dark"]
	.select2-container--default
	.select2-selection--multiple
	.select2-selection__choice {
	background-color: #404040;
	border-color: #505050;
	color: var(--bs-body-color);
}

[data-theme="dark"]
	.select2-container--default
	.select2-results__option[aria-selected="true"] {
	background-color: #404040;
}

[data-theme="dark"]
	.select2-container--default
	.select2-results__option--highlighted[aria-selected] {
	background-color: var(--bs-primary);
	color: white;
}

[data-theme="dark"] .select2-dropdown {
	background-color: var(--bs-input-bg);
	border-color: var(--bs-input-border-color);
	color: var(--bs-input-color);
}

[data-theme="dark"] .select2-search__field {
	background-color: var(--bs-input-bg) !important;
	color: var(--bs-input-color) !important;
}

[data-theme="dark"]
	.select2-container--default
	.select2-search--dropdown
	.select2-search__field {
	background-color: var(--bs-input-bg);
	border-color: var(--bs-input-border-color);
	color: var(--bs-input-color);
}

[data-theme="dark"]
	.select2-container--default
	.select2-selection--single
	.select2-selection__rendered {
	color: var(--bs-input-color);
}

[data-theme="dark"] .modal-content {
	background-color: var(--bs-body-bg);
	border-color: var(--bs-card-border-color);
}

[data-theme="dark"] .dropdown-menu {
	background-color: var(--bs-card-bg);
	border-color: var(--bs-card-border-color);
	color: var(--bs-body-color);
}

[data-theme="dark"] .dropdown-header {
	background-color: rgba(255, 255, 255, 0.05);
}

[data-theme="dark"] .dropdown-item {
	color: var(--bs-body-color);
}

[data-theme="dark"] .dropdown-item:hover {
	background-color: rgba(255, 255, 255, 0.1);
	color: white;
}

[data-theme="dark"] .dropdown-divider {
	border-color: var(--bs-card-border-color);
}

/* Profile Section */
.profile-link {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.25rem 0.5rem;
	border-radius: 20px;
	transition: background-color 0.2s;
	text-decoration: none;
	color: rgba(255, 255, 255, 0.85) !important;
}

.profile-link:hover {
	background-color: rgba(255, 255, 255, 0.1);
	color: #ffffff !important;
}

.profile-link img {
	border: 2px solid rgba(255, 255, 255, 0.2);
	transition: border-color 0.2s;
}

.profile-link:hover img {
	border-color: rgba(255, 255, 255, 0.4);
}

.profile-link span {
	color: inherit;
}

/* Notification Dropdown */
.notification-dropdown {
	min-width: 300px;
	max-width: 400px;
	padding: 0;
	border: none;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	background-color: #ffffff;
}

.notification-list {
	max-height: 400px;
	overflow-y: auto;
}

.notification-item {
	padding: 0.75rem 1rem;
	border-left: 3px solid transparent;
	transition: background-color 0.2s, border-left-color 0.2s;
	color: #212529;
	text-decoration: none;
}

.notification-item:hover {
	background-color: rgba(0, 0, 0, 0.05);
	text-decoration: none;
}

.notification-item.unread {
	border-left-color: #0d6efd;
	background-color: rgba(13, 110, 253, 0.05);
}

.notification-icon {
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(13, 110, 253, 0.1);
	border-radius: 50%;
	color: #0d6efd;
}

.notification-title {
	font-weight: 500;
	margin-bottom: 0.25rem;
	color: #212529;
}

.notification-text {
	font-size: 0.875rem;
	color: #6c757d;
}

.notification-time {
	font-size: 0.75rem;
	color: #adb5bd;
	margin-top: 0.25rem;
}

.mark-all-read {
	color: #0d6efd;
	font-size: 0.875rem;
	transition: color 0.2s;
	text-decoration: none;
}

.mark-all-read:hover {
	color: #0a58ca;
	text-decoration: underline !important;
}

/* Legacy Dark Mode Styles - Mantenido para compatibilidad */
body.dark-mode {
	background-color: #1a1a1a;
	color: #e1e1e1;
}

body.dark-mode .navbar {
	background-color: #292929 !important;
	border-bottom: 1px solid #333;
}

body.dark-mode .card {
	background-color: #292929;
	border: 1px solid #333;
}

body.dark-mode .card-header {
	background-color: #333;
	border-bottom: 1px solid #404040;
}

body.dark-mode .table {
	color: #e1e1e1;
}

body.dark-mode .table thead th {
	background-color: #333;
	border-bottom: 2px solid #404040;
}

body.dark-mode .table td {
	border-color: #404040;
}

body.dark-mode .table-hover tbody tr:hover {
	background-color: #5c5b5b;
}

body.dark-mode .list-group-item {
	background-color: #292929;
	border: 1px solid #404040;
	color: #e1e1e1;
}

body.dark-mode .form-control {
	background-color: #333;
	border: 1px solid #404040;
	color: #e1e1e1;
}

body.dark-mode .form-control:focus {
	background-color: #333;
	border-color: #0d6efd;
	color: #e1e1e1;
	box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

body.dark-mode .btn-primary {
	background-color: #0d6efd;
	border-color: #0d6efd;
}

body.dark-mode .dropdown-menu {
	background-color: #292929;
	border: 1px solid #404040;
}

body.dark-mode .dropdown-item {
	color: #e1e1e1;
}

body.dark-mode .dropdown-item:hover {
	background-color: #333;
	color: #ffffff;
}

body.dark-mode .notification-dropdown {
	background-color: #292929;
}

body.dark-mode .notification-item {
	color: #e1e1e1;
}

body.dark-mode .notification-item:hover {
	background-color: #333;
}

body.dark-mode .notification-title {
	color: #e1e1e1;
}

body.dark-mode .notification-text {
	color: #b0b0b0;
}

body.dark-mode .notification-time {
	color: #888;
}

body.dark-mode .mark-all-read {
	color: #0d6efd;
}

body.dark-mode .mark-all-read:hover {
	color: #0a58ca;
}

/* Estilos para el Footer en modo oscuro */
body.dark-mode .footer {
	background-color: #212529 !important; /* Un fondo oscuro para el footer */
	border-top: 1px solid #333; /* Una línea de separación sutil */
}

body.dark-mode .footer .text-muted {
	color: #b0b0b0 !important; /* Color de texto más claro para el modo oscuro */
}

@media (prefers-color-scheme: dark) {
	.modal-dark {
		background-color: #212529;
		color: #fff;
	}

	.modal-dark .modal-header {
		border-bottom-color: #373b3e;
	}

	.modal-dark .modal-body {
		background-color: #212529;
		color: #fff;
	}

	.modal-dark .text-muted {
		color: #adb5bd !important;
	}

	.modal-dark .btn-close {
		filter: invert(1) grayscale(100%) brightness(200%);
	}
}

.hover-shadow-lg {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-shadow-lg:hover {
	transform: translateY(-5px);
	box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
	background-color: rgba(245, 245, 245, 0.8);
}

[data-theme="dark"] .hover-shadow-lg:hover {
	background-color: rgba(60, 60, 60, 0.8);
	box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.5) !important;
}

.hover-scale {
	transition: transform 0.2s ease;
}

.hover-scale:hover {
	transform: scale(1.02);
	background-color: rgba(245, 245, 245, 0.8);
}

[data-theme="dark"] .hover-scale:hover {
	background-color: rgba(60, 60, 60, 0.8);
}

.list-group-item-hover {
	transition: all 0.2s ease;
}

.list-group-item-hover:hover {
	background-color: rgba(0, 123, 255, 0.1); /* Color azul muy suave */
	transform: translateX(5px); /* Ligero movimiento hacia la derecha */
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Sombra sutil */
}

[data-theme="dark"] .list-group-item-hover:hover {
	background-color: rgba(
		13,
		110,
		253,
		0.2
	); /* Color azul más oscuro para modo oscuro */
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

/* Estilos adicionales para tablas */
[data-theme="dark"] .table,
body.dark-mode .table {
    color: #ffffff;
    border-color: #404040;
}

[data-theme="dark"] .table-hover tbody tr:hover,
body.dark-mode .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.075);
    color: #ffffff;
}

[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd),
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Mejora de legibilidad para enlaces en tablas */
[data-theme="dark"] .table a,
body.dark-mode .table a {
    color: #66b0ff;
    text-decoration: none;
}

[data-theme="dark"] .table a:hover,
body.dark-mode .table a:hover {
    color: #99ccff;
    text-decoration: underline;
}

/* Mejora de contraste para texto pequeño */
[data-theme="dark"] small,
[data-theme="dark"] .small,
body.dark-mode small,
body.dark-mode .small {
    color: #b0b0b0;
}

/* --- Tooltip Dark Mode Fix --- */
[data-theme="dark"] .tooltip .tooltip-inner,
body.dark-mode .tooltip .tooltip-inner {
    background-color: #f8f9fa; /* Light background (Bootstrap's 'light' color) */
    color: #212529;         /* Dark text (Bootstrap's 'dark' color) */
    border: 1px solid #dee2e6; /* Optional: adds a subtle border */
}

/* Adjust arrow color for dark mode tooltip */
[data-theme="dark"] .tooltip.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before,
[data-theme="dark"] .tooltip.bs-tooltip-top .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #f8f9fa;
}

[data-theme="dark"] .tooltip.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before,
[data-theme="dark"] .tooltip.bs-tooltip-bottom .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: #f8f9fa;
}

[data-theme="dark"] .tooltip.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before,
[data-theme="dark"] .tooltip.bs-tooltip-start .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-start .tooltip-arrow::before {
    border-left-color: #f8f9fa;
}

[data-theme="dark"] .tooltip.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before,
[data-theme="dark"] .tooltip.bs-tooltip-end .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before,
body.dark-mode .tooltip.bs-tooltip-end .tooltip-arrow::before {
    border-right-color: #f8f9fa;
}

@media print {
    body {
        font-size: 12pt; /* Ajusta el tamaño de fuente base para impresión */
        color: #000 !important; /* Asegura que todo el texto sea negro */
        background-color: #fff !important; /* Fondo blanco */
    }

    /* Ocultar la barra de navegación principal y el pie de página */
    nav.navbar, footer, .breadcrumb-container {
        display: none !important;
    }

    /* Ocultar los botones de acción en el encabezado de la tarjeta del perfil */
    .card-header .btn {
        display: none !important;
    }
    
    /* Ajustar el título del perfil para que no tenga los botones al lado */
    .card-header h2 {
        width: 100%; /* Ocupa todo el ancho */
        text-align: center; /* Centra el título */
    }

    /* Ajustar el diseño de la tarjeta para impresión */
    .card {
        border: 1px solid #ccc !important; /* Borde simple para la tarjeta */
        box-shadow: none !important; /* Sin sombra */
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .container, .row, .col-md-10, .offset-md-1, .col-md-3, .col-md-9, .col-md-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin: 0 !important;
        padding: 5px !important; /* Un poco de padding para que no esté pegado a los bordes */
    }
    
    /* Asegurar que las columnas dentro de la info del perfil se apilen */
    .card-body .row > .col-md-6 {
        width: 50% !important; /* Dos columnas para info personal y contacto */
        float: left;
    }
    .card-body .row::after { /* Clearfix para los floats */
        content: "";
        clear: both;
        display: table;
    }


    /* Foto de perfil */
    .card-body img.rounded-circle {
        max-width: 150px !important; /* Tamaño más pequeño para impresión */
        max-height: 150px !important;
        border: 1px solid #eee; /* Borde sutil */
    }
    .text-center.mb-3 { /* Contenedor de la imagen */
        text-align: left !important; /* Alinear a la izquierda para que fluya con el texto */
    }


    /* Títulos de secciones */
    h4.border-bottom {
        border-bottom: 1px solid #666 !important;
        padding-bottom: 5px !important;
        margin-top: 15px !important;
        font-size: 14pt !important;
    }
    h4.border-bottom i {
        display: none; /* Ocultar iconos en títulos para impresión */
    }

    /* Tablas (como la de cursos inscripto) */
    table.table {
        width: 100% !important;
        border-collapse: collapse !important;
    }
    table.table th, table.table td {
        border: 1px solid #ddd !important;
        padding: 4px !important;
        font-size: 10pt !important;
    }
    table.table .badge { /* Estilo de badges en tablas */
        background-color: #eee !important;
        color: #000 !important;
        border: 1px solid #ccc !important;
        padding: 2px 4px !important;
        font-weight: normal !important;
    }

    /* Enlaces */
    a {
        color: #000 !important;
        text-decoration: none !important; /* Opcional: quitar subrayado */
    }
    /* Opcional: mostrar URL de enlaces (puede ser útil o ruidoso) */
    /*
    a[href]:after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
        color: #555;
    }
    */

    /* Ocultar elementos específicos que no se quieran imprimir */
    .no-print {
        display: none !important;
    }

    /* Evitar saltos de página dentro de elementos */
    .card-body, .card-body .row > div {
        page-break-inside: avoid;
    }
    ul, li {
        page-break-inside: avoid;
    }
}

/* Responsive reCAPTCHA */
/* The reCAPTCHA widget is 304px wide. This media query targets screens smaller than that. */
@media screen and (max-width: 340px) { /* Slightly wider than reCAPTCHA to give some space */
    .recaptcha-wrapper .g-recaptcha {
        transform: scale(0.85); /* Scale down the reCAPTCHA box */
        transform-origin: 0 0;   /* Scale from the top-left corner */
    }
}

/* For very small screens, you might want to scale it down even more if needed */
/*
@media screen and (max-width: 300px) { // Even smaller screens
    .recaptcha-wrapper .g-recaptcha {
        transform: scale(0.77); 
        transform-origin: 0 0;
    }
}
*/

/* Custom styles for file input button in dark mode */
[data-theme="dark"] input[type="file"]::file-selector-button,
body.dark-mode input[type="file"]::file-selector-button {
    background-color: #4a4a4a !important; /* Un gris oscuro que contraste */
    color: #ffffff !important; /* Texto blanco */
    border-color: #666666 !important; /* Borde visible */
}

[data-theme="dark"] input[type="file"],
body.dark-mode input[type="file"] {
    color: #ffffff !important; /* Asegurar que el texto del input sea blanco */
    background-color: #2d2d2d !important; /* Asegurar el fondo del input */
    border-color: #404040 !important; /* Borde del input */
}