﻿/* Ocultar el estilo predeterminado del input */




input[type="file"] {
    opacity: 0; /* Hace que sea completamente transparente */
    position: absolute; /* Retira el botón del flujo visual sin quitarlo del documento */
    z-index: -1; /* Lo envía detrás del contenido visible */
}

/* Estilo personalizado para el label */
.custom-file-upload {
    display: inline-block;
    padding: 6px 6px;
    cursor: pointer;  
    background-color: #007BFF;
    color: white;
    border-radius: 5px;
    font-size: 14px;
    text-align: center;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}



    /* Efecto al pasar el mouse por encima */
    .custom-file-upload:hover {
        background-color: #0056b3;
        border-color: #004080;
    }

/* Estilo del nombre de archivo */
.file-name-display {
    font-size: 16px;
    color: #333;
}



/* Estilo para las pestañas */
.tabs {
    display: flex;
    cursor: pointer;
    background-color: #f7f7f7;
    border-bottom: 2px solid #ccc;
    border-bottom-style: none;
    gap: 2px;
}

.tab {
    padding: 8px 14px;
    margin: 0;
    border: 1px solid gainsboro;
    background-color: #f1f1f1;
    border-top-left-radius:4px; 
    border-top-right-radius: 4px; 
}

.back {
    background-color: #f7f7f7;
    width: 100%;
    border-bottom-style:solid;
    border-bottom-width:1px;
    border-bottom-color:gainsboro;  
}

    .tab.active {
        background-color: white;
        border-bottom: 2px solid white;
        border-bottom-style: none;  
    }

/* Estilo para el contenido */
.tab-content {
    display: none;
    padding: 20px;
    border: 1px solid gainsboro;
    background-color: white;
    padding: 30px;
    box-shadow: var(--msys-main-box-shadow);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-top-style:none;  
}

    .tab-content.active {
        display: block;
    }


.preview object {
    width: 100%; 
}

.preview .textarea {
    padding: 8px;
    background-color: #f0f0f0;
    border-style: solid;
    border-width: 1px;
    border-color: gainsboro;
    border-radius: 4px;
    resize: none;
    height: 200px;
    width: 480px;
    line-height: 1.4em;
    font-family: Calibri;
}

.preview .textarea:focus {
    border-color:gray;
    outline: none;
}