:root {
  --red1: #F81050;
  --black1: #263238;
}
.dividercalc {
	width:100%;
	height:1px;
	background:#DBDBDB ;
	border-radius:5px;
	margin-top:70px;
	margin-bottom:40px;
}
.calculator-container {
       
        background-color: #ffffff;
        box-shadow: 0px 10px 10px #EE0E4B33;
border-radius: 20px;
        padding: 40px 10%;
        max-width: 1400px;
        width: 100%;
        margin:  0px auto; /* Center the calculator on the page */
        direction: rtl; /* Right-to-left for Hebrew text and overall layout */
        text-align: right;
  
    }
    .calculator-container h2 {
        font-size: 45px;
        font-weight: 700;
        color: var(--red1);
        margin-bottom: 60px;
        text-align: center;
    }
    .section-title {
        font-size: 28px;
        font-weight: 600;
        color: var(--black1);
        margin-bottom: 15px;
        padding-bottom: 30px;
		text-align:center;
    }
    .input-group {
        margin-bottom: 25px;
    }
    .slider-container {
        position: relative;
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        margin-top: 20px;
        margin-bottom: 30px;
        direction: ltr; /* Force LTR for slider mechanics */
        text-align: left; /* Force LTR for slider labels positioning */
    }
    .slider-track {
        position: absolute;
        width: 100%;
        height: 17px;
        background-color: #DBDBDB;
		border-radius: 9px;
		padding: 5px 5px;
    }
    .slider-fill {
		position: absolute;
		height: 8px;
		background-color: var(--red1); 
		border-radius: 9px;
		left: 4px;
	}
	.hours-slider-fill {
		position: absolute;
		height: 8px;
		background-color: var(--red1); 
		border-radius: 9px;
		left: 4px;
	}
    /* Single thumb for days slider */
    .slider-thumb {
        width: 20px;
        height: 20px;
        background-color: var(--red1) ;
        border-radius: 50%;
        position: absolute;
        cursor: grab;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        transform: translateX(-50%); /* Center thumb on its position */
        z-index: 2;
    }
    /* Two thumbs for hours slider */
    .hours-slider-thumb-start,
    .hours-slider-thumb-end {
        width: 20px;
        height: 20px;
        background-color: var(--red1);   /* Red accent */
        border-radius: 50%;
        position: absolute;
        cursor: grab;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
        transform: translateX(-50%); /* Center thumb on its position */
        z-index: 2;
    }
    .slider-thumb:active,
    .hours-slider-thumb-start:active,
    .hours-slider-thumb-end:active {
        cursor: grabbing;
    }
    .slider-labels {
        display: flex;
        justify-content: space-between;
        width: 100%;
        position: absolute;
        top: 10px; /* Adjust based on thumb size */
        z-index: 1;
    }
    .slider-labels span {
    font-size: 19px;
    margin-top: -25px;
    color: #263238;
    position: relative;
    transform: translateX(0%);
    line-height: 17px;
}
    .slider-labels span:first-child {
        transform: translateX(0%);
    }
    .slider-labels span:last-child {
        transform: translateX(0%);
    }

    .radio-group {
        display: flex;
        justify-content: space-around;
        flex-wrap: wrap;
        gap: 15px;
        margin-top: 20px;
    }
    .radio-option {
        flex-grow: 1;
        text-align: center;
        border-radius: 10px;
        padding: 15px 10px 10px; /* Adjusted padding for the circle */
        cursor: pointer;
        transition: all 0.2s ease-in-out;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-width: 90px;
        position: relative; /* Needed for absolute positioning of circle */
    }
    .radio-option:hover {

    }
    .radio-option.selected {
 
    }
    .radio-option input[type="radio"] {
        display: none;
    }
    .radio-option label {
    font-size: 22px;
    color: #444;
    font-weight: 500;
    cursor: pointer;
    margin-top: 3px;
    margin-bottom: 38px;
}
    .radio-option img {
         
    }
    .radio-option .icon {
    font-size: 2.2rem;
    color: #777;
    margin-bottom: 5px;
    display: block;
    width: 100%;
    text-align: center;
	padding-bottom:30px;
}
.radio-option .icon img {
	display: block;
	margin: 0 auto ;
}
    .radio-option.selected .icon {
        color: #ff5a5f;
    }

    /* Styles for the circle indicator */
    .radio-circle {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 6px solid #ccc;
        background-color: #fff;
        position: absolute;
        bottom: 8px; /* Position at the bottom */
        left: 50%;
        transform: translateX(-50%);
        transition: all 0.2s ease-in-out;
    }

    .radio-option.selected .radio-circle {
        background-color:  var(--red1); 

    }


    .result-box {
        color: #263238;
        border-radius: 15px;
        margin-top: 40px;
        text-align: center;
        font-size: 28px;
        font-weight: 600;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .result-box .butres {
        font-size: 74px;
        font-weight: 700;
        margin-top: 10px;
        display: block;
		display: flex;  
		    justify-content: center;
		max-width:671px;
		width:100%;
		color:#EE0E4B;
		box-shadow: 0px 3px 6px #00000029;
border: 10px solid #EE0E4B;
border-radius: 66px;
    }
    .result-box small {
        font-size: 28px;
        font-weight: 700;
        margin-bottom: 35px;
		
    }
    .disclaimer {
        font-size: 28px;
        color: #263238;
        margin-top: 20px;
        text-align: center;
        line-height: 1.4;
    }

    /* Debug section styles */
    .debug-section {
        background-color: #f0f0f0;
        border-radius: 10px;
        padding: 15px;
        margin-top: 30px;
        font-size: 0.9rem;
        color: #555;
        border: 1px dashed #ccc;
        text-align: left; /* Align debug text left */
        direction: ltr; /* Force LTR for debug info */
    }
    .debug-section h4 {
        font-weight: 600;
        margin-bottom: 10px;
        color: #333;
        text-align: center;
    }
    .debug-section p {
        margin-bottom: 5px;
        word-break: break-all; /* Break long lines */
    }

    /* Styles for select dropdowns on mobile */
    .mobile-select-group {
        display: none; /* Hidden by default */
        flex-direction: row;
        justify-content: center;
        align-items: center;
        gap: 10px;
        margin-top: 20px;
        margin-bottom: 30px;
        direction: rtl; /* Keep RTL for mobile selects as per screenshot */
    }

    .mobile-select-group select {
        width: 100%;
        max-width: 150px;
        padding: 1px 15px;
        border: 2px solid #e0e0e0;
        border-radius: 10px;
        background-color: #f9f9f9;
        font-size: 22px;
        color: #F81150;
        appearance: none; /* Remove default arrow */
        -webkit-appearance: none;
        -moz-appearance: none;
        background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23ff5a5f%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-6.5%200-12.3%203.2-16.1%208.1-3.9%204.9-4.8%2011.9-2.4%2017.4l139.3%20220.5c3.2%205.1%208.4%208.2%2014%208.2s10.8-3.1%2014-8.2L289.4%2090.8c2.4-5.5%201.5-12.5-2.4-17.4z%22%2F%3E%3C%2Fsvg%3E');
        background-repeat: no-repeat;
        background-position: left 15px center;
        background-size: 10px;
        cursor: pointer;
        transition: border-color 0.2s ease-in-out;
    }
    .mobile-select-group select:focus {
        outline: none;
        border-color: #ff5a5f;
        box-shadow: 0 0 0 3px rgba(255, 90, 95, 0.3);
    }

    /* Responsive adjustments */
    @media (max-width: 767px) { /* Adjust breakpoint as needed for mobile */
        .slider-container {
            display: none; /* Hide sliders on mobile */
        }
        .mobile-select-group {
            display: flex; /* Show selects on mobile */
        }
        .calculator-container {
            padding: 20px;
        }
        .calculator-container h2 {
            font-size: 22px;
            margin-bottom: 20px;
        }
        .section-title {
            font-size: 20px;
			    padding-bottom: 11px;
        }
        .radio-group {
            gap: 10px;
			flex-direction: row;
        }
        .radio-option {
            width: 45%;
            min-width: unset;
        }
        .result-box {
            font-size: 50px;
            padding: 5px;
        }
        .result-box span {
            font-size: 50px;
        }
		.dividercalc {
			margin-top: 40px; 
		}
		.result-box small {
			font-size:22px;
			margin-bottom: 15px;
		}
		.disclaimer {
			font-size:20px;
		}
		.result-box .butres {
    font-size: 37px;
    border: 5px solid #EE0E4B;
    border-radius: 66px;
}
    }
	
/* slider couiers*/
/* --- CSS for the Couers Testimonials Slider (No Logo) --- */

/* Main container for the slider */
.couers-slider-wrapper {
 
    direction: ltr;
}
/* --- Couers Slider Container & Track Styling --- */
.couers-slider-wrapper {
    position: relative;
}

.couers-slider-viewport {
    overflow: visible;  
    width: 100%;
	padding:  0px  0px;
}
 .couers-slider-wrapper {
    position: relative;
    overflow: hidden;
    max-width: 100%;
    padding: 20px 0;
}

.couers-slider-track {
    display: flex;
    transition: transform 0.5s ease;
    gap: 20px;
}
 
.couers-slideout {
    flex: 0 0 48%;
    box-sizing: border-box;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.couers-slide {
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
	width:calc(100% - 20px);
	margin:0 10px;
	background:#FCFCFC ;
	box-shadow: 0px 10px 10px #EE0E4B3E;
	border-radius: 20px;
}
.couers-slide-inner {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 20px;
}

.couers-slide-right {
    flex: 1;
    text-align: right;
}

.couers-quote-text {
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}

.couers-highlight {
    color: #e6005c;
    font-weight: bold;
}

.couers-face-image {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    object-fit: cover;
}

.couers-nav-controls {
    text-align: center;
    margin-top: 20px;
}

.couers-nav-btn {
    display: inline-block;
    margin: 0 10px;
    cursor: pointer;
    font-size: 24px;
    color: #e6005c;
}
/* Inner container for slide content (face image on left, text on right) */
.couers-slide-inner {
    display: flex;
        flex-direction: row-reverse;
    align-items: center;
    width: 100%;
    gap: 18px;
}

/* Left side of the slide: Contains the face image */
.couers-slide-left {
    flex: 0 0 30%;
    max-width: 30%;
    display: flex;
    justify-content: center;
    align-items: center;
	    flex-direction: column;
		gap: 10px;
}

/* Wrapper for the face image to create a circular shape */
.couers-face-image-wrapper {
    width: 130px;
    height: 130px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    border:4px solid #fff;
	box-shadow: 0px 3px 6px #00000029;
}

/* The actual face image */
.couers-face-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Right side of the slide: Contains the testimonial text */
.couers-slide-right {
    flex: 0 0 70%;
    max-width: 65%;
    text-align: right;
    position: relative;
    padding: 10px 0;
}

/* Styling for the main quote text */
.couers-quote-text {
        font-size: 20px;
    line-height: 1.3;
    color:  var(--black1); 
    margin: 0;
}

/* Styling for the highlighted (red) text within the quote */
.couers-highlight {
    color: #FF0077;
    font-weight: bold;
    display: inline;
}

/* Quote icons (using pseudo-elements for visual flair) */
.couers-quote-text::before {
    content: '\201C';
    font-size: 3em;
    color: #F81050;
    position: absolute;
    top: -15px;
    right: 0;
    line-height: 1;
    z-index: 1;
    opacity: 1;
}

.couers-quote-text::after {
    content: '\201D';
    font-size: 3em;
    color: #F81050;
    position: absolute;
    bottom: -48px;
    left: 0;
    line-height: 1;
    z-index: 1;
    opacity: 1;
}
@media (max-width: 768px) {
    .couers-slideout{
        flex: 0 0 100%;
    }
.couers-slide-right {
    flex: 0 0 90%;
    max-width: 90%;
    text-align: right;
    position: relative;
    padding: 18px 0;
}
.couers-slider-track {
    gap: 10px;
}
.couers-slide {
    padding: 15px;
    align-items: center;
    justify-content: center;
    min-height: 420px;
    width: calc(100% - 10px);
	margin: 0;
}
    .couers-slide-inner {
        flex-direction: column-reverse;
        text-align: center;
    }

    .couers-slide-right {
        text-align: center;
    }
	.couers-highlight {
    color: #FF0077;
    font-weight: bold;
    display: block;
    white-space: nowrap;
    font-size: 20px;
}
}