﻿/* Estilos generales para el contenedor del módulo de edición/creación de portafolio */
.admin-portfolio-edit-container {
    padding: 25px; /* Un poco más de padding que el listado para un "respiro" */
    background-color: #ffffff; /* Fondo blanco */
    border-radius: 10px; /* Bordes ligeramente más redondeados */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Una sombra un poco más pronunciada */
    margin: 30px auto; /* Centrar el contenedor y darle más margen vertical */
    max-width: 900px; /* Ancho máximo para el formulario, ajusta según tu diseño */
    animation: fadeIn 0.5s ease-out; /* Animación sutil de entrada */
}

/* Animación de entrada para el contenedor */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Estilos para el encabezado h3 (título de la página) */
.admin-portfolio-edit-container h3 {
    color: #212529; /* Un color de texto más oscuro para el contraste */
    text-align: center; /* Centrar el título */
    margin-bottom: 30px; /* Más espacio debajo del título */
    font-weight: 600; /* Un poco más de negrita */
}

/* Estilos para los botones de acción */
.admin-portfolio-edit-container .btn {
    min-width: 120px; /* Asegura un ancho mínimo para los botones */
    padding: 10px 20px;
    font-size: 1rem;
    transition: all 0.3s ease; /* Transición suave para los estados hover/active */
}

.admin-portfolio-edit-container .btn-success {
    background-color: #28a745;
    border-color: #28a745;
}

    .admin-portfolio-edit-container .btn-success:hover {
        background-color: #218838;
        border-color: #1e7e34;
        transform: translateY(-2px); /* Pequeño efecto de elevación al hacer hover */
    }

.admin-portfolio-edit-container .btn-secondary {
    background-color: #6c757d;
    border-color: #6c757d;
}

    .admin-portfolio-edit-container .btn-secondary:hover {
        background-color: #5a6268;
        border-color: #545b62;
        transform: translateY(-2px); /* Pequeño efecto de elevación al hacer hover */
    }

/* Estilos para los mensajes de carga */
.admin-portfolio-edit-container p em {
    display: block;
    text-align: center;
    margin-top: 20px;
    color: #6c757d;
    font-style: normal;
}

/* Ajustes para el ValidationSummary si lo usas */
.validation-summary-valid, .validation-summary-errors {
    margin-bottom: 20px;
    padding: 15px;
    border-radius: 5px;
}

.validation-summary-errors {
    background-color: #f8d7da; /* Fondo suave para errores */
    color: #721c24; /* Texto rojo oscuro */
    border: 1px solid #f5c6cb;
}
