.tokwtycust_widget-container {
	/* right:10px; */
	/* top:650px; */
	/* position: absolute; */
	display: flex;
	justify-content: center;
	margin: 0px;
	padding: 0px;
	background-color: white;
	border-radius: 8px;
	/* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);*/
	max-width: 800px;
	margin-left: -35px;
	margin-right: -35px;
}

.tokwtycust_widget {
	width: 100%;
	margin-left: 30px;
	border-radius: 4px;
	/*border:1px solid whitesmoke;*/
	padding-left: 10px;
	padding-right: 10px;
}

.tokwtycust_widget p{
	margin-left: 0px;
	padding-top: 0px;
	margin-bottom: 10px;
	font-size: 17px;
	font-family: 'DM Sans';
}

.tokwtycust_plans {
	display: flex;
	gap: 10px;
	margin-top: -5px;
	justify-content: center;
	margin-bottom: 16px;
}

.tokwtycust_plan-button {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	border-radius: 4px;
	border:1px solid black;
	text-align:left;
	background-color: white;
	color: rgb(63, 63, 63);
	position: relative;
	transition: background-color 0.3s;
	cursor: pointer;
	width:200px;
	margin-top: 10px;
}


#ID_TOK_WTY_PROTECTION_IMAGE{
	width:30px;
	height: auto;
	margin-bottom:-10px;
	margin-left: -4px;
	vertical-align: baseline;
}

#ID_TOK_WTY_GUARDIAN_IMAGE{
	width:110px;
	height: auto;
	margin-bottom:-17px;
	margin-left:-15px;
	vertical-align: baseline;
}

.tokwtycust_plan-content {
	display: flex;
	flex-direction: row;
	width:100%;
	height:100%;
	border-radius: 4px;
	justify-content: center;
	padding: 10px;
}

#ID_TOK_WTY_CUST_PLAN1_MODAL .tokwtycust_plan-content {
	display: flex;
	flex-direction: column;
	width:100%;
	height:100%;
	border-radius: 4px;
	align-items: center;
}

.tokwtycust_plan-button input[type="radio"]:checked ~ .tokwtycust_plan-content {
	background-color: #199abe;
	color: white;
	border: none;

}

/* Keep your existing hover rules if desired */
.tokwtycust_plan-button:hover .tokwtycust_plan-content {
	/* e.g. highlight on hover */
	background-color:#199abe;
	color: white;
	border: none;
}

/* Badge styles */
.tokwtycust_plan-badge {
	display:none;
	position: absolute;
	top: 0;
	right: 0;
	background-color: transparent;
	color: #fff;
	font-size: 10px;
	font-weight: bold;
	padding: 2px 6px;
	border-radius: 0 8px 0 8px;
}

.best-seller {
	background-color: #d9730d; /* Orange */
}

.best-value {
	background-color: #007BFF; /* Blue */
}

/* Plan term and price */
.tokwtycust_plan-term {
	font-size: 17px;
	margin-top: 0px;
	font-weight: 700;
	padding-left: 10px;
	margin-bottom: 0px;

}

.tokwtycust_plan-term-text {
	font-size: 10px;
	font-weight: 300;
	padding-left: 10px;

}

#ID_TOK_WTY_CUST_WIDGET_PRICE,
#ID_TOK_WTY_CUST_WIDGET_TERM {
	font-weight: 700;
	align-self: center;
}

.tokwtycust_plan-price {
	font-size: 17px;
	margin-top: 0px;
	font-weight: 700;
	padding-left: 10px;
	margin-bottom: 0px;
}

.tokwtycust_social-proof {
	display: none;
	margin-top: 30px;
	font-size: 16px;
	color: #555;
	width: 300px;
	margin-left: -20px;
}

.tokwtycust_social-proof p {
	transition: opacity 0.5s ease-in-out; /* Smooth transition for opacity */
	opacity: 1; /* Fully visible by default */
}

#ID_TOK_WTY_CUST_MODAL_PROOF {
	display: none;
	margin-top: 40px;
	width: 700px;
	margin-left: 0px;
}

/* Modal Styles */
.tokwtycust_modal {
	display: none;
	position: fixed;
	z-index: 1000;
	max-width: 600px;
	overflow: auto;
	top: 50%;
	/* Position in the middle of the viewport */
	left: 50%;
	/* Center horizontally */
	transform: translate(-50%, -50%);
	padding-left: 10px;
	border-radius: 10px;
}

#ID_TOK_WTY_CUST_MODAL_COVERAGE{
	display: none;
	position: fixed;
	z-index: 1000;
	max-width: 600px;
	overflow: auto;
	top: 50%;
	/* Position in the middle of the viewport */
	left: 50%;
	/* Center horizontally */
	transform: translate(-50%, -50%);
	padding-left: 10px;
	border-radius: 10px;
}

.tokwtycust_modal-content {
	display: flex;
	flex-direction: row;
	background-color: #fff;
	border-radius: 8px;
}

.tokwtycust_close {
	position: absolute;
	top:5px;
	/* left:50px; */			/* Fix for positioning close X in ID_TOK_WTY_CUST_MODAL and ID_TOK_WTY_CUST_MODAL_COVERAGE */
	/* margin-left: 50px; */	/* Fix for positioning close X in ID_TOK_WTY_CUST_MODAL and ID_TOK_WTY_CUST_MODAL_COVERAGE */
	color: rgb(69, 69, 69);
	float: right;
	font-size: 40px;
	font-weight: 300;
	cursor: pointer;
	z-index: 20;
	width: 40px;
	right: 10px;
}

.tokwtycust_close:hover,
.tokwtycust_close:focus {
	color: #000;
	text-decoration: none;
	cursor: pointer;
}

.tokwtycust_modal-header {
	position: relative;
	margin-left: 15px;
}

.tokwtycust_modal-header img {
	height: 530px;
	/* margin-left: 20px; */ /* Disable to avoid scrollbar appearing in coverage modal (ID_TOK_WTY_CUST_MODAL_COVERAGE) */
	width: auto;
}

.tokwtycust_modal-header h2 {
	margin-top: 10px;
	font-size: 20px;
}

.tokwtycust_modal-body  {
	margin-left: 10px;
	margin-right: 10px;
	width:400px;
}

.tokwtycust_modal-body ul {
	list-style-type: disc;
	margin: 10px 0;
	padding-left: 20px;
}

.tokwtycust_modal-body ul li {
	margin: 5px 0;
	font-size: 14px;
}

.tokwtycust_pricing {
	margin-top: 15px;
	display: flex;
	gap: 15px;
	justify-content: center;
	margin-left: 10px;
}

/* Logo Container */
.tokwtycust_logo-container {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 15px 0; /* Space between logo and body content */
	gap: 10px; /* Space between the logos and "+" */
}

/* Logo Styles */
.tokwtycust_logo-guardian {
	height: 90px; /* Adjust size to fit the design */
	object-fit: contain;
}

/* Logo Styles */

.tokwtycust_logo-store {
	margin-left: 15px;
	height: 50px; /* Adjust size to fit the design */
	object-fit: contain;
}

/* "+" Symbol */
.tokwtycust_logo-plus {
	font-size: 48px;
	font-weight: 300;
	color: #000; /* Adjust color for visibility */
}

.tokwtycust_overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7); /* 30% opacity */
	display:none;
	z-index: 998; /* Behind the modal */
}

#ID_TOK_WTY_CUST_DESCRIPTION_CONTAINER,
#ID_TOK_WTY_CUST_DESCRIPTION_CONTAINER2 {
	margin-top: 15px;
	margin-bottom: 30px;
	margin-left: 20px;
}

#ID_TOK_WTY_CUST_DESCRIPTION_TEXT {
	font-size: 18px;
	color: #333;
	margin-bottom: 10px;
	margin-top: 0px;
}

#ID_TOK_WTY_CUST_FEATURE_LIST,
#ID_TOK_WTY_CUST_FEATURE_LIST2 {
	padding-left: 20px;
	margin: 15px 0;
	font-weight: 700;
	margin-bottom: 10px;
}

#ID_TOK_WTY_CUST_FEATURE_1,
#ID_TOK_WTY_CUST_FEATURE_2,
#ID_TOK_WTY_CUST_FEATURE_3,
#ID_TOK_WTY_CUST_FEATURE2_1,
#ID_TOK_WTY_CUST_FEATURE2_2,
#ID_TOK_WTY_CUST_FEATURE2_3 {
	font-size: 14px;
	color: #555;
	font-weight: 300;
	line-height: 24px;
	margin-left: 20px;
}

.tokwtycust_coverage-benefits {
	margin-left: 20px;
	display: flex;
	gap:20px;
}
.tokwtycust_why-guardian {
	margin-top: 40px;
	margin-left: 20px;
	font-weight: 700;
}

#ID_TOK_WTY_CUST_FAQ_LINK a {
	font-size: 14px;
	text-decoration: none;
	color:grey;
}

#ID_TOK_WTY_CUST_FAQ_LINK a:hover {
	text-decoration: underline;
}

/* Default link appearance */
a {
	color: rgb(77, 77, 77); /* Grey color */
	text-decoration: none; /* Removes underline by default */
}

/* Hover state */
a:hover {
	color: #5a6268; /* Slightly darker grey for hover */
	text-decoration: underline; /* Optional underline on hover */
}

/* Active state (when clicked) */
a:active {
	color: rgb(77, 77, 77); /* Darker grey when active */
}

/* Visited state */
a:visited {
	color: rgb(77, 77, 77);
}

#ID_TOK_WTY_CUST_FAQ_CONTAINER,
#ID_TOK_WTY_CUST_FAQ_CONTAINER2 {
	display: flex;
	margin-top: 15px;
	margin-left: 20px;
	width: 100%;
	justify-content:space-between;
}

#ID_TOK_WTY_CUST_FAQ_CONTAINER2 a {
	color: #024185;
	font-size: 16px;
}

/* Action container */
#ID_TOK_WTY_CUST_ACTION_CONTAINER {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
	padding: 10px 0;
}

/* Decline text */
#ID_TOK_WTY_CUST_DECLINE_TEXT {
	color: #6c757d; /* Grey color */
	font-size: 14px;
	cursor: pointer;
	margin-left: 20px;
}

/* Protect button */
#ID_TOK_WTY_CUST_PROTECT_BUTTON {
	background-color: black;
	color: white;
	border: none;
	padding: 15px 20px;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

/* Protect button hover state */
#ID_TOK_WTY_CUST_PROTECT_BUTTON:hover {
	background-color: #b55c0b; /* Darker orange */
}

#ID_TOK_WTY_CUST_WHATS_COVERED {
	margin-bottom: -3px;
}

/* Style for the clickable image */
#ID_TOK_WTY_CUST_WHATS_COVERED_IMAGE {
	width: 25px; /* Adjust the size as needed */
	height: 25px; /* Ensure consistent dimensions */
	cursor: pointer;
	transition: transform 0.3s ease; /* Add a hover effect */
	margin-bottom: -3px;
}

/* Hover effect */
#ID_TOK_WTY_CUST_WHATS_COVERED_IMAGE:hover {
	transform: scale(1.1); /* Slight zoom on hover */
}

#ID_TOK_WTY_CUST_POWERED_BY a {
	font-size: 14px;
	color:grey;
}

.tokwtycust_horizontal-line {
	width: 100%;
	border-top: 1px solid #ccc;	/* or another color you prefer */
	margin: 10px 0;					/* spacing above/below the line */
}


@media (max-aspect-ratio: 3/5) {
	.tokwtycust_widget-container {
		margin: 10px 5px; /* Reduced horizontal margin */
		padding: 5px;
		margin-left: 0; /* Ensure it doesn't go off-screen due to negative margins */
		margin-right: 0;
		max-width: 100%;
	}

	.tokwtycust_widget {
		padding-left: 5px;
		padding-right: 5px;
		margin-left: 0px;
	}

	.tokwtycust_widget p {
		font-size: 15px; /* Slightly smaller */
		font-family: 'DM Sans';
	}

	.tokwtycust_plans {
		flex-direction: column;
		align-items: center;
		gap: 10px; /* Slightly reduced gap */
	}

	.tokwtycust_plan-button {
		width: 95%; /* Take more width on narrow screens */
		max-width: 320px; /* Ensure some minimal padding on 350px screen */
	}

    #ID_TOK_WTY_GUARDIAN_IMAGE{
        width:80px;
        margin-bottom:-10px;
        margin-left:-8px;
    }

    #ID_TOK_WTY_PROTECTION_IMAGE{
        width:22px;
        margin-bottom:-7px;
    }

	.tokwtycust_plan-term,
	.tokwtycust_plan-price {
		font-size: 16px; /* Smaller */
		padding-left: 6px;
	}

	.tokwtycust_plan-term-text {
		font-size: 12px; /* Smaller */
		padding-left: 6px;
	}

	.tokwtycust_social-proof {
		width: 95%;
		margin-left: auto;
        margin-right: auto;
		font-size: 12px; /* Smaller */
        margin-top: 10px;
	}

	/* Modal Fullscreen Adjustments for tall, narrow screens */


    #ID_TOK_WTY_CUST_MODAL {
		width: 100%;
		max-width: 100%;
        height: 100%; /* Full viewport height */
        top: 0;
		left: 0;
		transform: none; /* Remove transform for fullscreen */
		padding: 0;
        border-radius: 0; /* No border radius for fullscreen */
		overflow-y: auto; /* Ensure modal content itself can scroll */
        display: none; /* Override flex if it was causing issues with fullscreen */
	}

    #ID_TOK_WTY_CUST_MODAL_COVERAGE {
		width: 100%;
		max-width: 100%;
        height: 100%; /* Full viewport height */
        top: 0;
		left: 0;
		transform: none; /* Remove transform for fullscreen */
		padding: 0;
        border-radius: 0; /* No border radius for fullscreen */
		overflow-y: auto; /* Ensure modal content itself can scroll */
        display: none; /* Override flex if it was causing issues with fullscreen */
	}

	.tokwtycust_modal-content {
		flex-direction: column-reverse; /* Image below content */
        width: 100%;
        min-height: 100%; /* Ensure content area tries to fill */
        box-sizing: border-box;
        border-radius: 0; /* No border radius for content */
	}

	.tokwtycust_modal-header {
		margin-left: 0;
        padding: 10px 10px 0 10px; /* Padding around image */
        box-sizing: border-box;
	}

	.tokwtycust_modal-header img {
		width: 100%;
		height: auto;
		max-height: 200px; /* Further limit image height on tall/narrow screens */
		margin-left: 0;
        margin-top: 10px; /* Space from content if reversed */
        display: none; /* Ensure it behaves as a block */
        object-fit: contain; /* Ensure image scales nicely within bounds */
	}

	.tokwtycust_modal-header h2 { /* This might not be visible if image is the only content in header */
		font-size: 16px; /* Smaller */
        text-align: center;
        margin-top: 5px;
        padding: 0 10px;
	}

	.tokwtycust_modal-body {
		width: auto;
		margin: 0; /* Remove margins */
        padding: 15px; /* Consistent padding */
        box-sizing: border-box;
        flex-grow: 1; /* Allow body to grow and push footer (image) down */
	}

    .tokwtycust_modal-body ul {
        padding-left: 15px;
    }

    .tokwtycust_modal-body ul li {
        font-size: 12px; /* Smaller */
    }

    .tokwtycust_close {
        font-size: 30px;
        top: 15px; /* Position for fullscreen modal */
        right: 15px;
		margin-left: 0px;
		left: 0px;
        z-index: 1001; /* Above overlay and content */
        color: #333; /* Ensure visibility on white background */
    }

	.tokwtycust_logo-container {
		gap: 10px; /* Reduce gap */
        margin: 10px 0;
        flex-wrap: wrap;
        padding: 0 10px; /* Padding if container is edge-to-edge */
	}

	.tokwtycust_modal-header{
		display:flex;
	}

	.tokwtycust_logo-guardian {
		height: 60px; /* Smaller logos */
	}

	.tokwtycust_logo-store {
		height: 35px;
		margin-left: 0;
	}

	.tokwtycust_logo-plus {
		font-size: 30px; /* Smaller plus */
	}

	#ID_TOK_WTY_CUST_DESCRIPTION_CONTAINER,
	#ID_TOK_WTY_CUST_DESCRIPTION_CONTAINER2 {
		margin-left: 0; /* Full width within modal body padding */
        margin-right: 0;
		margin-bottom: 10px;
        padding: 0; /* Handled by modal-body padding */
	}

	#ID_TOK_WTY_CUST_DESCRIPTION_TEXT,
    #ID_TOK_WTY_CUST_DESCRIPTION_TEXT2 {
		font-size: 14px; /* Smaller */
	}

	#ID_TOK_WTY_CUST_FEATURE_LIST,
	#ID_TOK_WTY_CUST_FEATURE_LIST2 {
		padding-left: 0; /* Indentation handled by li margin or body padding */
		font-size: 13px;
        margin: 10px 0 5px 0;
	}

	#ID_TOK_WTY_CUST_FEATURE_1,
	#ID_TOK_WTY_CUST_FEATURE_2,
	#ID_TOK_WTY_CUST_FEATURE_3,
	#ID_TOK_WTY_CUST_FEATURE2_1,
	#ID_TOK_WTY_CUST_FEATURE2_2,
	#ID_TOK_WTY_CUST_FEATURE2_3 {
		font-size: 12px; /* Smaller */
		margin-left: 15px; /* Indent list items */
        line-height: 1.6;
	}

	.tokwtycust_coverage-benefits {
		flex-direction: column;
		align-items: flex-start;
		gap: 5px;
		margin-left: 0; /* Full width within modal body padding */
        font-size: 12px; /* Smaller */
	}

    .tokwtycust_why-guardian {
        margin-left: 0; /* Full width within modal body padding */
        margin-top: 15px;
        font-size: 14px; /* Smaller */
    }

	#ID_TOK_WTY_CUST_FAQ_CONTAINER,
	#ID_TOK_WTY_CUST_FAQ_CONTAINER2 {
		flex-direction: column;
		align-items: flex-start;
		margin-left: 0; /* Full width within modal body padding */
        margin-right: 0;
		gap: 8px;
        width: auto;
	}

    #ID_TOK_WTY_CUST_FAQ_LINK a,
    #ID_TOK_WTY_CUST_FAQ_LINK2 a,
    #ID_TOK_WTY_CUST_POWERED_BY a {
        font-size: 12px; /* Smaller */
    }
    #ID_TOK_WTY_CUST_FAQ_CONTAINER2 a { /* Re-apply specific color if needed for this link */
        color: #024185;
        font-size: 13px; /* Ensure it's readable */
    }


	#ID_TOK_WTY_CUST_ACTION_CONTAINER {
		flex-direction: column;
		gap: 10px; /* Reduced gap */
        align-items: stretch;
        margin-top: 15px;
        padding: 0; /* Handled by modal-body padding */
	}

	#ID_TOK_WTY_CUST_DECLINE_TEXT {
		font-size: 12px; /* Smaller */
		margin-left: 0;
        text-align: center;
        padding: 8px 0; /* Add some padding for touch */
	}

	#ID_TOK_WTY_CUST_PROTECT_BUTTON {
		font-size: 13px; /* Slightly smaller */
		padding: 12px 10px; /* Adjust padding */
        width: 100%;
        box-sizing: border-box;
	}

    #ID_TOK_WTY_CUST_WHATS_COVERED_IMAGE {
        width: 16px; /* Smaller */
        height: 16px;
    }

    .tokwtycust_horizontal-line {
        margin: 15px 0;
    }

    #ID_TOK_WTY_CUST_MODAL_PROOF,
    #ID_TOK_WTY_CUST_MODAL_COVERAGE_CONTENT_PROOF {
       margin-top: 15px;
       width: auto; /* Take available width within padding */
       margin-left: 0;
       margin-right: 0;
       font-size: 11px; /* Smaller */
   }
}