/*
Theme Name: Themify Ultra Child
Description: A child theme of Themify Ultra
Template: themify-ultra
Author: j0vany001 (desarrollo@creandoweb.net)
*/

/* Woohoo! Let's customize! */

/* Menu */


/* Diseño para PC (pantallas anchas) */
@media (min-width: 1024px) {
	
	#main-nav-wrap {
	border-radius: 12px 12px 64px 12px !important;
    background:#e9e9e9 !important;
	padding: 0px;
	}

	#main-nav-wrap .pago {
		background: #121f52;
		color: #fff;
		border-radius: 25px 12px 64px 12px !important;
		padding-right: 15px !important;
	}
	
    #header {
        display: flex;
        align-items: center; /* Centra verticalmente */
        justify-content: space-between; /* Logo a la izquierda, menú al centro */
        height: 100px; /* Define una altura si es necesario */
    }

    .header-bar {
        flex: 1; /* Espaciado automático */
        display: flex;
        align-items: center;
    }

    #main-nav-wrap {
        flex: 2; /* Ocupa el espacio central */
        display: flex;
        justify-content: center; /* Centra horizontalmente */
        align-items: center; /* Centra verticalmente */
    }

    #main-nav {
        display: flex;
        list-style: none;
        padding: 0;
        margin: 0;
    }

    #main-nav li {
        display: flex;
        align-items: center;
    }

    .site-logo-image {
        max-height: 70px; /* Ajusta según sea necesario */
    }
}


/*  Formulario  */

		.form-container {
            background: white;
            padding: 2rem;
            border-radius: 20px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            width: 100%;
            max-width: 500px;
        }

        .form-group {
            margin-bottom: 1.5rem;
        }

        .form-group label {
            display: block;
            margin-bottom: 0.5rem;
            color: #121f52;
            font-weight: 500;
        }

        .form-group input {
            width: 100%;
            padding: 0.75rem;
            border: 1px solid #ddd;
            border-radius: 8px;
            font-size: 1rem;
            transition: border-color 0.3s ease;
        }

        .form-group input:focus {
            outline: none;
            border-color: #121f52;
        }

        .split-inputs {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }

        .form-container .wpcf7-submit, .cotizacion .wpcf7-submit {
            width: 100%;
            padding: 1rem;
            background-color: #ff7f50;
            color: white;
            border: none;
            border-radius: 8px;
            font-size: 1rem;
            font-weight: 600;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }

        .form-container .wpcf7-submit:hover {
            background-color: #ff6b3d;
        }

        @media (max-width: 480px) {
            .form-container {
                padding: 1.5rem;
            }

            .split-inputs {
                grid-template-columns: 1fr;
            }

            .form-group input {
                font-size: 16px; /* Previene el zoom en iOS */
            }
        }

/*  ---- */

.cotizacion {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
    border-radius: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	border:1px solid #ccc;
}

.cotizacion .form {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.cotizacion .form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.cotizacion .form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cotizacion label {
    font-weight: 500;
}

.cotizacion input[type="text"],
.cotizacion input[type="number"],
.cotizacion input[type="date"],
.cotizacion input[type="tel"],
.cotizacion input[type="email"] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

.cotizacion .radio-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cotizacion .radio-option {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cotizacion input[type="radio"] {
    width: 12px; /* Tamaño del círculo */
    height: 12px;
	padding:0px !important;
    accent-color: #007bff; /* Color principal para el radio */
    cursor: pointer;
}

.cotizacion input[type="radio"]:hover {
    outline: 2px solid #0056b3; /* Efecto al pasar el mouse */
    border-radius: 50%;
}

.cotizacion label {
    font-weight: 400;
    font-size: 14px;
    color: #333;
    cursor: pointer;
}


.cotizacion button[type="submit"] {
    padding: 10px 20px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s ease;
}

.cotizacion button[type="submit"]:hover {
    background-color: #0056b3;
}

@media (min-width: 768px) {
    .cotizacion .form-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .cotizacion button[type="submit"] {
        width: auto;
    }
}

@media (min-width: 1024px) {
    .cotizacion .form-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Tamaño de los checkboxes */
.wpcf7-list-item input[type="checkbox"] {
    width: 12px; /* Tamaño de la casilla */
    height: 12px;
    margin-right: 8px; /* Espacio entre la casilla y el texto */
    cursor: pointer; /* Cambiar cursor al pasar sobre la casilla */
	padding:0px;
}

.wpcf7-form-control.wpcf7-checkbox {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); /* Columnas automáticas */
    gap: 15px; /* Espaciado entre elementos */
    margin: 10px 0; /* Espaciado superior e inferior */
}

/* Estilo individual de cada checkbox */
.wpcf7-checkbox  .wpcf7-list-item {
    display: flex; /* Alinea checkbox y texto */
    align-items: center; /* Centrado vertical */
    box-sizing: border-box; /* Asegura que padding y borde se incluyan en el ancho */
}

.cotizacion img {
	width:170px;
	margin:-10% auto 0px auto;
	display:block;
}