/*--- End Miscellaneous Tweaks ---*/
/* =Donation
========================================================================================*/
.donation-wrapper {margin: 0;padding: 0;font-size: 16px; line-height:24px;  color: rgb(99, 114, 129);font-weight: 400;}
.donation-wrapper a, .donation-wrapper input[type="button"],.donation-wrapper input[type="submit"],.donation-wrapper button {outline: 0 none;-moz-transition: background-color 0.2s ease-in, color 0.2s ease-in;-webkit-transition: background-color 0.2s ease-in, color 0.2s ease-in;-o-transition: background-color 0.2s ease-in, color 0.2s ease-in;-ms-transition: background-color 0.2s ease-in, color 0.2s ease-in;transition: background-color 0.2s ease-in, color 0.2s ease-in;}
.donation-wrapper a {color: #4290db;outline: 0 none;-moz-transition: background-color 0.2s ease-in, color 0.2s ease-in;-webkit-transition: background-color 0.2s ease-in, color 0.2s ease-in;-o-transition: background-color 0.2s ease-in, color 0.2s ease-in;-ms-transition: background-color 0.2s ease-in, color 0.2s ease-in;transition: background-color 0.2s ease-in, color 0.2s ease-in;}
.donation-wrapper a:hover {color: #4290db;text-decoration: none;outline: 0 none;}
.donation-wrapper a:active {outline: 0;}
@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none) {a:active {    background-color: transparent;}
}
.donation-wrapper p {margin: 0 0 15px 0;}
.donation-wrapper h1,.donation-wrapper h2,.donation-wrapper h3,.donation-wrapper h4,.donation-wrapper h5 {font-weight: 700;}
.donation-wrapper h1,.donation-wrapper h2,.donation-wrapper h3,.donation-wrapper h4,.donation-wrapper h5,.donation-wrapper h6 {line-height: 100%;margin-bottom: 15px;color: #1e57a6; font-weight: 700;}
.donation-wrapper h1 {font-size:54px !important;line-height:1.3;text-transform: none;color: #ffffff;position: relative;font-weight: 7600; }
.donation-wrapper h2 {font-size:30px !important;line-height:1.3;text-transform: none; color: #1e57a6; }
.donation-wrapper h3 {font-size: 24px !important;line-height: 1.3; text-transform: none;}
.donation-wrapper h4 {font-size: 20px !important;line-height: 1.3;text-transform: none;}
.donation-wrapper h5 {font-size: 18px !important;line-height: 1.3;text-transform: none;}
.donation-wrapper h6 {font-size: 16px !important;line-height: 1.3;text-transform: none;}
.donation-wrapper .btn { padding: 8px 20px; font-size: 16px !important; cursor: pointer;} 
.donation-wrapper{padding: 80px 0;}
.donation-wrapper input[type="text"],input[type="number"],.donation-wrapper input[type="email"], .donation-wrapperinput[type="password"], .donation-wrapper input[type="tel"], .donation-wrapper textarea, .donation-wrapper select {border: 1px solid #ccc; height: 48px; border-radius: 8px; padding: 10px; width: 100%; font-size: 16px;}
.donation-wrapper input[type="text"]:focus,.donation-wrapper input[type="number"]:focus, .donation-wrapper input[type="email"]:focus, .donation-wrapper input[type="tel"]:focus, .donation-wrapper input[type="password"]:focus, .donation-wrapper textarea:focus, .donation-wrapper select:focus{box-shadow: none !important; border: 1px solid rgba(0,0,0,0.35) !important; outline: 0 none !important;}
.donation-wrapper select :option {padding: 10px;}
.donation-wrapper .select2-container--default .select2-selection--single{border: 1px solid #ccc; height: 48px; border-radius: 8px; padding: 0 10px;}
.donation-wrapper .select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 48px; color: #637281;}
.donation-wrapper .select2-container--default .select2-selection--single .select2-selection__arrow{height: 48px;}
.donation-wrapper .donation-wrapper-outer > .row{margin: 0 -30px;}
.donation-wrapper .donation-wrapper-outer > .row > div{padding: 0 30px;}
.donation-item-card{background: #fff; opacity: 0; visibility: hidden; transition: all 1s ease-out; box-shadow: 0 0 15px rgba(0,0,0,0.15); border-radius: 16px; overflow: hidden; margin-bottom: 30px; display: none;}
.donation-item-img{position: relative; padding-top: 65%; overflow:hidden;}
.donation-item-img > img{object-fit: cover; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.donation-item-card.active{display: block; opacity: 1; visibility: visible; }
.donation-item-content{padding: 20px 20px 40px;}
.donation-item-content h3{margin-bottom: 15px;}
.donation-item-content p:last-child{margin-bottom: 0;}
.payment-item-wrapper h2{text-align: center; margin-bottom: 40px; position: relative; color: #1E1E1E;}
.payment-item-wrapper h2:before{background:#4290db; width: 85px; height:3px; position: absolute; left: 50%; transform: translateX(-50%); bottom: -15px; content: "";}
.payement-type-wrap .payment-types{display: flex;  gap: 10px; margin-top: 20px; list-style: none; padding: 0;}
.payement-type-wrap .payment-types li{flex: 1;}
.payement-type-wrap .payment-types li button{text-align: center; width: 100%;}
.btn.payment-select-btn{border: 1px solid #ccc; color: #637281; font-weight: 500;}
.btn.payment-select-btn:hover, .btn.payment-select-btn:focus{color: #1e57a6;}
.btn.payment-select-btn.active{background: #1e57a6; color: #fff; border-color: #1e57a6;}
.payement-type-wrap{margin-bottom: 20px;}
.amount-btns-wrap{display: flex; gap: 10px; margin-bottom: 20px;}
.amount-btns-wrap .amount-select-btn{flex: 1; text-align: center; padding: 10px 0; border: 1px solid #ccc; color: #637281; font-weight: 500;}
.amount-btns-wrap .amount-select-btn:hover, .amount-btns-wrap .amount-select-btn:focus{color: #1e57a6;}
.amount-btns-wrap .amount-select-btn.active{background: #1e57a6; color: #fff; border-color: #1e57a6;}
.custom-amount-wrap{margin-bottom: 20px;}
.custom-amount-wrap .custom-amount{position: relative;}
.custom-amount-wrap .prefix-amount{position: absolute; left: 1px; top: 1px; bottom: 1px;  border-right: 1px solid #ccc; padding: 6px 15px; line-height: 36px; color: #637281; font-size: 20px; border-radius: 8px 0 0 8px; background: #fff;}
.custom-amount-wrap input{padding-left: 55px; appearance: none;}
.show-monthly{display: none;}
.select-campaign-wrap label{display: block; margin-bottom: 8px; color: #1E1E1E; font-weight: 600;}
.select-campaign-wrap{margin-bottom: 20px;}
.monthly-hide{display: none;}
.one-time-hide{display: none;}
.one-time-show{display: block;}
.custom-amount-wrap{display: none;}
.donate-button-wrap .btn.donate-btn{background: #1e57a6; color: #fff; width: 100%; font-size: 18px; font-weight: 600;}
.payment-item-wrapper{margin: 0 auto; max-width: 500px;}
.round-up-text{margin-top: 20px; text-align: center;}
.how-round-up{display: none;}
.donation-wrapper-outer > .row > div:first-child {position: relative;}
.donation-wrapper-outer > .row > div:first-child:before{height: 100%; background: #ccc; width: 2px; position: absolute; top:0; }
.contact-information-wrap h2{text-align: center; margin-bottom: 30px;}
.contact-information-wrap .form-group{margin-bottom: 20px;}
.contact-information-wrap label{display: block; margin-bottom: 8px; color: #1E1E1E; font-weight: 600;}
.monty-payment-img{margin-bottom: 20px;}
.highlight-color{color: #1e57a6; font-weight: 600;}
.monthly-text h3{margin-bottom: 15px;}
.monthly-text p{margin-bottom: 4px;}
.monthly-text {margin-bottom: 20px;}
.monthly-payment-suggestion .amount-text{color: #1e57a6; font-weight: 600;}
.montly-suggestion-btn{flex-wrap: wrap;}
.montly-suggestion-btn button{width: 100%; text-align: center;}
.montly-suggestion-btn .payment-btn{background: #1e57a6; color: #fff; margin-bottom: 10px;}
.montly-suggestion-btn .payment-btn:hover{background: #1e57a6; color: #fff;}
.montly-suggestion-btn .donate-one-time-btn{border: 1px solid #1e57a6; color: #1e57a6;}
.montly-suggestion-btn .donate-one-time-btn:hover{background: #1e57a6; color: #fff;}
.montly-suggestion-btn .donate-one-time-btn:hover .amount-text{color: #fff;}
.payment-btn-wrap .payment-btn{background: #1e57a6; color: #fff; margin-bottom: 10px; width: 100%; text-align: center;}
.payment-btn-wrap .payment-btn:hover{background: #1e57a6; color: #fff;}
.monthly-payment-suggestion, .contact-information-wrap {position: relative;}
.monthly-payment-suggestion .back-btn, .contact-information-wrap .back-btn{position: absolute; left: 20px; top: 10px;}
.main-content-wrap{max-width: 500px; margin: 0 auto; position: relative; min-height: 700px;}
.progress-item{margin-bottom: 20px;}
.progress-text {
            font-size: 16px;
            color: #0066ff;
            font-weight: 600;
            margin-bottom: 6px;
            display: flex;
            align-items: center;
            gap:0 5px;
        }

        .progress-text span.amount {
            color: #0066ff;
            font-weight: 700;
        }

        .progress-text span.total {
            color: #666;
            font-weight: 400;
        }

        .progress-bar-container {
            width: 100%;
            height: 8px;
            background: #e8e8e8;
            border-radius: 4px;
            overflow: hidden;
            position: relative;
        }

        .progress-bar-fill {
            height: 100%;
            background: #0066ff;
            border-radius: 4px;
            transition: width 0.3s ease;
            width: 28.38%;
        }


        .form-section {
            margin-bottom: 30px;
        }

        /* Toggle Switch Styling */
        .toggle-group {
            display: flex !important;
            align-items: center !important;
            margin-bottom: 10px !important;
            cursor: pointer;
        }

        .toggle-switch {
            position: relative;
            width: 50px;
            height: 28px;
            margin-right: 15px;
            flex-shrink: 0;
        }

        .toggle-switch input {
            display: none;
			opacity:0;
        }

        .toggle-slider {
            position: absolute;
            cursor: pointer;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: #ccc;
            transition: 0.3s;
            border-radius: 28px;
        }

        .toggle-slider:before {
            position: absolute;
            content: "";
            height: 22px;
            width: 22px;
            left: 3px;
            bottom: 3px;
            background-color: white;
            transition: 0.3s;
            border-radius: 50%;
        }

        input:checked + .toggle-slider {
            background-color: #1e57a6;
        }

        input:checked + .toggle-slider:before {
            transform: translateX(22px);
        }

        .toggle-content {
            flex: 1;
        }

        .toggle-label {
            display: block;
            font-size: 15px;
            color: #333;
            cursor: pointer;
            font-weight: 500;
            margin-bottom: 0;
        }

        .link {
            color: #0066ff;
            text-decoration: none;
            cursor: pointer;
        }

        .link:hover {
            text-decoration: underline;
        }
.rounds-up-content{display: none;}
        /* Price Summary Section */
        .summary-section {
            background: #f9f9f9;
            border: 1px solid #e0e0e0;
            border-radius: 6px;
            padding: 20px;
            margin-top: 30px;
            margin-bottom: 30px;
        }

        .summary-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
            font-size: 15px;
        }

        .summary-row:last-child {
            margin-bottom: 0;
        }

        .summary-row.total {
            border-top: 1px solid #ddd;
            padding-top: 15px;
            font-weight: 600;
            font-size: 16px;
            color: #333;
        }

        .summary-label {
            color: #666 !important;
            display: flex !important;
            align-items: center !important;
            gap: 8px;
        }

        .summary-value {
            color: #333;
            font-weight: 500;
        }

        .edit-link {
            color: #0066ff;
            font-size: 13px;
            margin-left: auto;
            cursor: pointer;
        }

        .edit-link:hover {
            text-decoration: underline;
        }

        .title {
            font-size: 18px;
            font-weight: 600;
            margin-bottom: 20px;
            color: #333;
        }
    /***********************slider***********************/
     .slider-container {
            max-width: 100%;
            margin: 0 auto;
            background: white;
            padding: 0;
        }

        .slider-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 30px;
        }

        .slider-title {
            font-size: 16px;
            color: #333;
            font-weight: 600;
        }

        .slider-value {
            font-size: 18px;
            color: #666;
            font-weight: 600;
        }

        .slider-value span {
            color: #0066ff;
            font-weight: 700;
        }

        .slider-wrapper {
            position: relative;
            margin: 40px 0;
        }

        .slider-track {
            width: 100%;
            height: 6px;
            background: #e0e0e0;
            border-radius: 3px;
            position: relative;
        }

        /* jQuery UI slider customization */
        .ui-slider {
            background: #ccc !important;
            border: none !important;
            height: 6px !important;
            border-radius: 3px !important;
        }

        .ui-slider .ui-slider-range {
            background: #0066ff !important;
            border-radius: 3px !important;
        }

        .ui-slider .ui-slider-handle {
            width: 20px !important;
            height: 20px !important;
            background: white !important;
            border: 3px solid #0066ff !important;
            border-radius: 50% !important;
            top: -7px !important;
            cursor: pointer !important;
            box-shadow: 0 2px 4px rgba(0, 102, 255, 0.3) !important;
        }

        .ui-slider .ui-slider-handle:hover {
            box-shadow: 0 4px 8px rgba(0, 102, 255, 0.4) !important;
        }

        .ui-slider .ui-slider-handle:focus {
            outline: none !important;
            box-shadow: 0 0 0 4px rgba(0, 102, 255, 0.2) !important;
        }

        .slider-labels {
            display: flex;
            justify-content: space-between;
            position: relative;
            margin-top: 20px;
            padding: 0 5px;
        }

        .slider-label {
            font-size: 12px;
            color: #999;
            position: relative;
            flex: 0;
            text-align: center;
            font-weight: 500;
        }
.slider-labels .slider-label:first-child {
            margin-left: -10px;
        }
        .slider-labels .slider-label:last-child {
            margin-right: -14px;
        }
        .slider-label::before {
            content: '';
            position: absolute;
            width: 1px;
            height: 16px;
            background: #ddd;
            top: -18px;
            left: 50%;
            transform: translateX(-50%);
        }

       

        /* Small tick marks between labels */
        .slider-ticks {
            position: absolute;
            width: 100%;
            height: 8px;
            top: 8px;
            left: 0;
            display: flex;
            justify-content: space-between;
            pointer-events: none;
        }

        .tick-group {
            display: flex;
            flex-direction: column;
            align-items: center;
            flex: 0;
            position: relative;
        }

        .tick-marks {
            display: flex;
            width: 100%;
            justify-content: space-between;
            align-items: flex-start;
        }

        .small-tick {
            width: 1px;
            height: 4px;
            background: #ddd;
            flex-grow: 0;
            margin: 0 1px;
        }

        .small-tick:last-child {
            flex-grow: 0;
        }

        /* Value display moving with slider */
        .slider-value-display {
            position: absolute;
            top: -40px;
            transform: translateX(-50%);
            background: white;
            border: 1px solid #ddd;
            border-radius: 4px;
            padding: 4px 8px;
            font-size: 14px;
            color: #0066ff;
            font-weight: 600;
            white-space: nowrap;
            pointer-events: none;
            z-index: 10;
            transition: left 0.05s ease-out;
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        }

        .slider-value-display::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 50%;
            transform: translateX(-50%);
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 5px solid white;
        }

        .slider-value-display::before {
            content: '';
            position: absolute;
            bottom: -6px;
            left: 50%;
            transform: translateX(-50%);
            width: 0;
            height: 0;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
            border-top: 6px solid #ddd;
        }

        .donation-content-wrapper{box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); padding: 20px; border-radius: 16px; margin-bottom: 20px; display: none;}
        .donation-content-wrapper.active{display: block;}
         .donation-content-wrapper ul, .donation-content-wrapper ol{margin-left: 15px;}
         .donation-content-wrapper li{margin-bottom: 8px;}
.modal-header .header-title h5{font-size:24px !important; margin-bottom:0 !important; font-weight:900 !important;}
         .modal-header .header-title p{margin-bottom: 0;}
         .delivery-toggle{display: flex; margin-bottom: 15px;}
         .delivery-toggle button{flex: 1; padding: 10px 15px; text-align: center; background: #f2f2f2; border-radius: 8px; color: #545454; border: 0 none;}
          .delivery-toggle button.active{background: #1e57a6; color: #fff;}
          .popup-checkbox{display: flex; gap:0 20px; margin-bottom: 20px;}
          .modal-body textarea{height: 120px;}
.donation-wrapper .modal-header, .donation-wrapper .modal-body, .donation-wrapper .modal-footer{padding:20px !important;}
.donation-wrapper .form-check{display:flex !important; align-items:center !important; gap:0 8px;}
/*input[type="checkbox"]:checked::before{margin-top: 2px;  margin-left: 1px;}*/
.popup-checkbox .form-check label{margin-bottom:0;}
	.donation-card-wrap.monthly-payment-suggestion{border: 1px solid #ccc; border-radius: 24px; padding: 24px;}
.select2-container{width:100% !important;}
@media(max-width:1024px){
.donation-wrapper-outer h2{font-size:26px !important;}
	.donation-wrapper .donation-wrapper-outer > .row{margin:0 -15px;}
	.donation-wrapper .donation-wrapper-outer > .row > div{padding:0 15px;}
	.donation-wrapper .btn{padding:8px 12px;}
	.donation-wrapper .btn{font-size:14px !important;}
}
@media(min-width:768px){
.payment-item-wrapper .donation-card-wrap.monthly-payment-suggestion{display:none !important;}
}
@media(max-width:767px){
	.donation-wrapper-outer .donation-card-wrap{display:none;}	
	.monty-payment-img{display:none;}
	.donation-content-wrapper{display:none !important;}
	.payement-type-wrap .payment-types{flex-wrap:wrap; margin-left:0;}
	.payement-type-wrap .payment-types li button{white-space:no-wrap;}
	.amount-btns-wrap{flex-wrap:wrap;}
	.donation-card-wrap.monthly-payment-suggestion{padding:15px;}
	.donation-card-wrap.monthly-payment-suggestion h2{font-size:18px !important;}
}
.main-menu.dropdown-menu.sf-menu{display:block !important; position:relative !important;}

.suggestion-item { line-height: 30px; font-size: 14px; cursor: pointer;}
.payement-type-wrap .payment-types{margin-left:0 !important;}
.av-error.av-error-msg { font-size:13px; color:#dc3545;}
label.control.chk_box_label { font-size: 14px;}