/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
 
 	@font-face {
		font-family: Poppins;
		src: url('fonts/Poppins-Regular.ttf');
	}

	* {
		margin: 0;
		font-family: "Poppins", Sans-serif;
	}

	.aw-wrapper {
		max-width: 100%;
		margin: 60px auto;
		padding-right: 30px;
		padding-left: 30px;

	}

	.aw-wrapper>h2 {
		color: #141414;
		font-size: 20px;
		font-weight: 600
	}

	.aw-wrapper>h2>span {
		color: #e96f00;
		font-size: 22px
	}

	.price-wrapper {
		background: #fff;
		padding: 20px;
	}

	.aw-table {
		width: 100%;
		/*border-collapse: collapse;  se comenta para que el alto de los extras sea igual */
		min-width: 768px;
	}

	.price-wrapper>h2 {
		font-size: 18px;
		font-weight: 500;
		color: #e96f00;
		text-align:center;
	}
	.price-wrapper>h2>a {
    color: #e96f00;
    text-decoration:none;
}

	.price-wrapper>h1 {
		font-size: 60px;
		text-align: center;
		color: #000;
		font-weight: 600;
	}
	.price-wrapper>h1>span {
		font-size: 22px;
		font-weight: 400;
	}
	.price-wrapper>h3 {
		text-align: center;
		color: #000;
	}
	.price-wrapper>h3>span {
		font-size: 22px;
		font-weight: 400;
	}


	.aw-table-responsive {
		background: #fff;
		padding: 0px;
		margin: 50px 0;
	
		border: 1px solid #ddd;
	}
    .aw-table{border:none !important;}
	.aw-table td {
		padding: 10px;
		color: #000;
		border: none !important;
		background: #fff !important;
	}

	.aw-table tbody tr {
		border-bottom: 1px solid #f1f1f1;
	    height: 75px !important;
		
		
	}
    .aw-table>thead>tr>td{border-radius:10px 10px 0 0;padding: 0;}
   
	.aw-table>tbody>tr>td {
		text-align: center;
		font-weight: 400;
		position:relative;
	}

	.aw-table>tbody>tr>td:nth-child(1) {
		text-align: left;
	}

	/* .aw-table>tbody>tr:nth-child(odd) {background-color: #f5f5f5;}
.aw-table>tbody>tr:nth-child(even) {background-color: #fff;} */
	.fa-times {
		text-align: center;
		color: #d24242;
	}

	.fa-check {
		text-align: center;
		color: #42d286;
	}
    tr>.aw-section{color:#fff !important;font-weight:600 !important;}
	tr>.aw-section,
	tr>.aw-section:hover {
		background: #e96f00 !important;
		text-align: center !important;
		box-shadow:inset 0 3px 5px #e07514 !important;
	}

	button.aw-btn {
		background: #e96f00 !important;
		width: 100% !important;
		border: none !important;
		color: #fff !important;
		font-size: 16px !important;
		outline: none !important;
		height: 40px !important;
		border-radius: 5px !important;
		box-shadow: 0 5px 10px #ddd !important;
		cursor: pointer !important;
		padding: 0 !important;
		transition:all 1s;
	}
button.aw-btn:hover{
	background:#000 !important;
	color:#fff !important;
}

	.mb {
		display: none
	}


	@media screen and (max-width: 768px) {
		.aw-table-wrapper{flex-wrap:wrap;}
		.aw-table-responsive{width:100% !important;margin:20px 0;}
		
	}



	#expiry {
		background: #e96f00;
		padding: 5px;
		color: #fff;
		border-radius: 5px;
		width: fit-content;
	}
	button.finance {
    background: #f1f1f1 !important;
    color: #333 !important;
    padding: 5px 10px !important;
    border-radius: 20px !important;
    margin: 10px auto !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    border: 1px solid #ddd !important;
    cursor:pointer !important;
    outline:none !important;
}

.aw-dropdown{display:none;}
.aw-dropdown>table{border:1px solid #ddd !important;width:100%;max-width:250px;}
.aw-dropdown td {
    padding: 5px !important;
    font-size: 14px;
    border-bottom: 1px solid #f1f1f1 !important;
}

.tab-wrap {
    width: auto;
    max-width:300px;
    background: #fff;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 40px;
    margin: 25px auto;
    display: flex;
    justify-content: start;
    align-items: center;
	font-weight: 600;
}

.aw-diff-toggle-wrap {
    margin: 20px 0 10px;
    display: flex;
    justify-content: flex-end;
}

.aw-diff-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid #ddd;
    border-radius: 12px;
    background: #fff;
    font-weight: 600;
}

.aw-diff-toggle input {
    width: 18px;
    height: 18px;
}

.aw-cta-banner {
    margin: 14px 0;
    padding: 14px 16px;
    border: 1px solid rgba(16, 185, 129, .35);
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(16,185,129,.14), rgba(34,197,94,.08));
    box-shadow: 0 10px 25px rgba(0,0,0,.06);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.aw-cta-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.aw-cta-title {
    font-weight: 800;
    color: #064e3b;
}

.aw-cta-subtitle {
    font-weight: 600;
    color: #065f46;
}

.aw-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 12px;
    background: #16a34a;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 800;
    border: 1px solid rgba(255,255,255,.25);
    box-shadow: 0 10px 20px rgba(0,0,0,.10);
    white-space: nowrap;
}

.aw-cta-btn:hover {
    filter: brightness(0.95);
}

.aw-cta-popup {
    display: none;
}

.aw-cta-popup.is-open {
    display: block;
}

.aw-cta-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 99998;
}

.aw-cta-popup-card {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 99999;
    width: min(520px, calc(100% - 28px));
    background: #fff;
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 25px 60px rgba(0,0,0,.22);
    border: 1px solid rgba(0,0,0,.06);
}

.aw-offer-popup .aw-cta-popup-card {
    width: min(940px, calc(100% - 28px));
    padding: 26px;
    border-radius: 20px;
}

.aw-cta-popup-title {
    font-weight: 900;
    font-size: 18px;
    margin-bottom: 6px;
}

.aw-offer-popup .aw-cta-popup-title {
    font-size: 22px;
    text-align: center !important;
    color: #e96f00;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.aw-offer-popup .aw-cta-popup-title i,
.aw-offer-popup .aw-offer-countdown-title i,
.aw-offer-popup .aw-offer-savings i,
.aw-offer-popup .aw-offer-cta-text i {
    margin-right: 8px;
    color: #e96f00;
}

.aw-offer-popup .aw-offer-countdown-title {
    text-align: center !important;
    color: #e96f00;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.aw-offer-popup .aw-cta-popup-title i,
.aw-offer-popup .aw-offer-countdown-title i {
    margin-right: 0;
}

.aw-offer-popup .aw-offer-savings i {
    color: #16a34a;
}

.aw-cta-popup-text {
    font-weight: 600;
    margin-bottom: 14px;
    color: #111827;
}

.aw-cta-popup-close {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.12);
    background: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.aw-offer-discounts {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 12px 0 16px;
}

.aw-offer-countdown-title {
    font-weight: 900;
    margin-bottom: 10px;
}

.aw-offer-counter-grid {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.aw-offer-counter-grid > div {
    background: #e96f00;
    width: 90px;
    text-align: center;
    font-size: 35px;
    font-weight: 600;
    padding: 10px;
    border-radius: 5px;
    color: #fff;
}

.aw-offer-counter-grid > div > small {
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    margin-top: -15px;
}

.aw-offer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.08);
    background: linear-gradient(135deg, rgba(245,158,11,.14), rgba(249,115,22,.10));
    font-weight: 800;
}

.aw-offer-row-left {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.aw-offer-product-name {
    font-weight: 900;
    color: #111827;
}

.aw-offer-prices {
    display: flex;
    gap: 10px;
    align-items: baseline;
    flex-wrap: wrap;
}

.aw-offer-price-old {
    color: #6b7280;
    font-weight: 800;
}

.aw-offer-price-new {
    color: #111827;
    font-weight: 900;
}

.aw-offer-savings {
    color: #111827;
    font-weight: 800;
}

.aw-offer-savings strong {
    color: #9a3412;
}

.aw-offer-discount-pill {
    background: #e96f00;
    color: #fff;
    padding: 7px 12px;
    border-radius: 999px;
    font-weight: 900;
    white-space: nowrap;
}

.aw-offer-row strong {
    font-weight: 900;
}

.aw-offer-counter {
    font-variant-numeric: tabular-nums;
}

.aw-offer-close-btn {
    width: 100%;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.12);
    background: #111827;
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

.aw-offer-close-btn:hover {
    filter: brightness(0.95);
}

.aw-offer-cta {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(0,0,0,.08);
}

.aw-offer-cta-text {
    font-weight: 800;
    color: #111827;
    margin-bottom: 10px;
}

.aw-offer-cta-form {
    margin: 0;
}

.aw-offer-cta-btn {
    width: 100%;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.25);
    background: #e96f00;
    color: #fff;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

.aw-offer-cta-btn:hover {
    filter: brightness(0.95);
}

@media screen and (max-width: 680px) {
    .aw-cta-banner {
        flex-direction: column;
        align-items: stretch;
    }
    .aw-cta-btn {
        width: 100%;
    }
}

.aw-rotate-hint {
    display: none;
    margin: 10px 0 18px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.08);
    background: #fff7ed;
    color: #9a3412;
    font-weight: 700;
    text-align: center;
}

@media screen and (max-width: 768px) and (orientation: portrait) {
    .aw-rotate-hint {
        display: block;
    }
}

.aw-summary-block {
    margin: 26px 0 14px;
}

.aw-summary-title {
    font-weight: 900;
    font-size: 18px;
    color: #111827;
    margin-bottom: 12px;
}

.aw-summary-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.aw-summary-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 12px 30px rgba(0,0,0,.06);
}

.aw-summary-card-title {
    font-weight: 900;
    font-size: 16px;
    color: #111827;
    margin-bottom: 6px;
}

.aw-product-desc {
    font-weight: 600;
    font-size: 13px;
    line-height: 1.35;
    color: #4b5563;
    margin: 2px 0 10px;
}

.aw-summary-card-price {
    font-weight: 900;
    font-size: 34px;
    line-height: 1.1;
    color: #000;
    margin-bottom: 4px;
}

.aw-summary-card-price span {
    font-size: 16px;
    font-weight: 700;
    color: #111827;
}

.aw-summary-card-subtitle {
    font-weight: 700;
    color: #374151;
    margin: 10px 0 10px;
}

.aw-summary-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.aw-summary-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #111827;
    font-weight: 600;
}

.aw-summary-list li .fa-check {
    margin-top: 2px;
}

.aw-summary-list li span {
    display: inline-block;
}

.aw-summary-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
    color: #2563eb;
    text-decoration: underline;
    font-weight: 800;
}

.aw-summary-link:hover {
    color: #1d4ed8;
}

.aw-product-badges {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 10px;
    justify-content: flex-start;
    align-items: center;
}

.aw-badge {
    display: inline-block;
    padding: 7px 12px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 12px;
    letter-spacing: 0.2px;
    line-height: 1;
    color: #fff;
    text-transform: uppercase;
    background: linear-gradient(135deg, #f59e0b, #f97316);
    border: 1px solid rgba(255, 255, 255, .35);
    box-shadow: 0 10px 22px rgba(0, 0, 0, .10);
}

.aw-badge-recommended {
    background: linear-gradient(135deg, #f59e0b, #f97316);
}

.aw-badge-best-price {
    background: linear-gradient(135deg, #f59e0b, #f97316);
}

.aw-badge-best-insulation {
    background: linear-gradient(135deg, #f59e0b, #f97316);
}

.aw-badge-best-efficiency {
    background: linear-gradient(135deg, #f59e0b, #f97316);
}

.aw-badge-best-acoustic {
    background: linear-gradient(135deg, #f59e0b, #f97316);
}

@media screen and (max-width: 980px) {
    .aw-summary-cards {
        grid-template-columns: 1fr;
    }
}

.tab-wrap>li {
    list-style: none;
    cursor: pointer;
    height: 50px;
    line-height: 50px;
    width: 49%;
    text-align: center;
    font-size: 18px;
    border-radius: 3px;
    transition:all 1s;
}
 .tab-active{
    background: #e96f00;
    color: #fff;
    box-shadow: 0 5px 10px #ddd;
}
.aw-table-wrapper {
    display: flex;
    gap: 15px;
    justify-content: space-between;
}
.aw-table-wrapper>.aw-table-responsive{width:calc(100% / 3);}

/* Reservar espacio fijo para las badges (MEJOR OPCION / DESCUENTO) y mantener alineación entre columnas */
.aw-table-badges {
    min-height: 64px;
}

.bestSale {
	 position: static;
    width: auto;
    max-width: 100%;
    text-align: center;
    background: #e96f00;
    color: #fff;
}
.special_discount {
	position: static;
    width: auto;
    max-width: 100%;
    text-align: center;
    background: #e96f00;
    color: #fff;
}

/* Fix: evitar recortes/solapes cuando solo hay una badge (el template usa .aw-table-badges en flex) */
.aw-table-badges .bestSale,
.aw-table-badges .special_discount {
    position: static !important;
    width: auto !important;
    max-width: 100% !important;
    white-space: nowrap;
}
.financeWrap {
    background: #fff;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    display: none;
    display: none;
    flex-wrap: wrap;
    justify-content:space-between;
    margin-bottom:40px;
}
select#financeMonth,input#downpayment {
    width: calc(50% - 60px);
    background: #f8f8f8;
    color: #000;
    outline:none !important;
}
button#calculate {
    width: 100px;
    padding: 10px;
    height: 50px;
    background: #e96f00;
}
p.downPayment {
    text-align: center;
    margin: 0;
    color: #666;
    display:none;
}

#switchWrap{margin-right:10px;}
#switchWrap input {
	display : none;
}
#switchWrap label {
	position: relative;
	cursor: pointer;
	display :block;
	width: 50px;
	height: 30px;
	background: #cccccc;
	border-radius: 50px;
	transition: 300ms linear;
}

#switchWrap label:before {
	position: absolute;
	top: 50%;
	left: 2px;
	transform: translateY(-50%);
	content: "";
	display: block;
	width: 25px;
	height: 25px;
	background: #ffffff;
	border-radius: 50%;
	transition: left 300ms linear;
}

#switchWrap input:checked + label {
	background: #e96f00;
}

#switchWrap input:checked + label:before {
	left: 23px;
}
i.fa.fa-info {
    background: #e96f00b8;
    width: 18px;
    border-radius: 10px;
    text-align: center;
    color: #fff;
    font-size: 12px;
    line-height: 18px;
    cursor:pointer;
}

.tootlipContent {
    font-size: 12px;
    line-height: 16px;
    width: 150px;
    padding: 5px;
    border-radius: 5px;
    background: rgba(0,0,0,0.8);
    color: #fff;
    position: absolute;
    left: 10px;
    box-shadow: 0 4px 10px #666;
    z-index:999;
    display:none;
}
/*tachamos los precios con la oferta caducada */
.tachado {
    position: relative;

}

.tachado::before {
    content: '';
    position: absolute;
    top: 50%; /* Mueve la línea hacia abajo o ajusta según sea necesario */
    left: 0;
    width: 100%;
    height: 10px;
    background-color: rgb(0, 0, 0);
    transform: rotate(10deg); 
    transform-origin: center;
    z-index: 1;
}

/* Estilo del contenedor del switch */
.switch {
    position: relative;
    display: inline-block;
    width:40px; /* Ancho del switch (ajustado) */
    height: 20px; /* Alto del switch (ajustado) */
}

/* Ocultar el checkbox */
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* Estilo del slider (el área del switch) */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #413a2c; /* Color de fondo naranja */
    transition: .4s; /* Transición suave */
    border-radius: 14px; /* Bordes redondeados */
}

/* El círculo deslizante */
.slider:before {
    position: absolute;
    content: "";
    height: 16px; /* Alto del círculo (ajustado) */
    width: 16px; /* Ancho del círculo (ajustado) */
    left: 2px; /* Espacio desde la izquierda (ajustado) */
    bottom: 2px; /* Espacio desde el fondo (ajustado) */
    background-color: white; /* Color del círculo */
    transition: .4s; /* Transición suave */
    border-radius: 50%; /* Círculo perfecto */
}

/* Estilo cuando el checkbox está marcado */
.switch input:checked + .slider {
    background-color: #e96f00; /* Color de fondo cuando está activado (naranja) */
}

/* Mover el círculo deslizante cuando el checkbox está marcado */
.switch input:checked + .slider:before {
    transform: translateX(22px); /* Mueve el círculo a la derecha (ajustado) */
}
/*hace la cabecera de la tabla sticky */
thead {
	position: sticky;
	top: 30px; /* Margen superior */
	background-color: white; /* Asegura que el fondo sea sólido */
	z-index: 100; /* Asegura que esté por encima de otros elementos */
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1); /* Sombra para darle más separación visual */
  }
  
  .tr {
    height: 75px !important;
}

/* Extras: alineación y estado desactivado */
.aw-table tr.extra td,
.aw-table tr.extra-disabled td {
    min-height: 48px;
    height: 48px;
}

/* Alinear contenido sin romper el layout de tabla: flex en wrapper interno */
.aw-table .extra-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.aw-table .extra-row > span {
    flex: 1 1 auto;
}

.aw-table .extra-row .switch {
    flex: 0 0 auto;
    margin-left: auto;
}

/* Atenuación: solo el texto y el switch un poco (evitar opacidades acumuladas) */
.aw-table tr.extra-disabled .extra-row > span {
    color: #777 !important;
    opacity: 0.65;
}

.aw-table tr.extra-disabled .extra-row .switch {
    opacity: 0.85;
    filter: grayscale(1);
}

.aw-table tr.extra-disabled .switch input,
.aw-table tr.extra-disabled .switch .slider {
    cursor: not-allowed;
}

.aw-table tr.extra-disabled .slider {
    background-color: #cfcfcf !important;
    opacity: 1 !important;
}

.aw-table tr.extra-disabled .slider:before {
    background-color: #f7f7f7;
}

/* Fallback: si el HTML no lleva la clase extra-disabled, atenuar por input disabled */
.aw-table .switch input:disabled + .slider {
    background-color: #cfcfcf !important;
    opacity: 0.75 !important;
    filter: grayscale(1) !important;
    cursor: not-allowed !important;
}

.aw-table .switch input:disabled + .slider:before {
    background-color: #f7f7f7 !important;
}
