/* layout styles */
html {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Helvetica, Arial;
}

.content {
	margin: 0 auto;
	max-width: 1000px;
	width: 100%;
}


header {
	background: url('/img/top_bar-f1d8ea10f1717d012835e08b1bb16c0a.png') repeat-x;
	padding-top: 3px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 100%;
}

header h1 {
	background: url('/img/10minutemail_logo-515f60eeeda967c3f81b3e3005cefd17.png') no-repeat center;
	background-size: contain;
	width: 184px;
	height: 104px;
	display: inline-block;
	margin: 10px;
}

header h1 span {
	display: none;
}

header h2 {
	background: url('/img/tagline-5250ee47173429e1d837609fccb5a873.png') no-repeat center;
	background-size: contain;
	width: 528px;
	height: 36px;
	display: inline-block;
	margin-top: 64px;
	margin-left: 10px;
}

@media (max-width: 768px) {

	header h1,
	header h2 {
		width: 40%;

		margin: 10px 0;
	}

	header h2 {
		margin-top: 10px;
		margin-left: 0;
	}

	#main_content {
		margin-top: 60px;
	}
}


@media (max-width: 500px) {

	header h1,
	header h2 {
		width: 30%;

		margin: 10px 0;
	}

	header h2 {
		margin-top: 10px;
		margin-left: 0;
	}
}


header h2 span {
	display: none;
}

header .language {
	display: inline-block;
	vertical-align: top;
	height: 42px;
	margin-top: 60px;
	margin-left: 50px;
}

header .language #language_btn {
	display: inline-block;
	background: #50597b;
	width: 150px;
	height: 40px;
	color: #fff;
	font-size: 12px;
	line-height: 40px;
	padding: 0 20px;
	border-radius: 4px;
}

/* end header styles */

/* footer styles */
footer {
	background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
	color: #ecf0f1;
	padding: 60px 40px 30px;
	text-align: center;
}

footer .content {
	max-width: 1200px;
	margin: 0 auto;
}

footer p {
	margin: 0 0 15px 0;
	line-height: 1.6;
}

footer a,
footer a:visited {
	color: #3498db;
	text-decoration: none;
	transition: all 0.3s ease;
	font-weight: 500;
}

footer a:hover {
	color: #5dade2;
	text-decoration: underline;
}

.footer_blue {
	color: #3498db;
}

.btc_wallet_address {
	font-family: 'Courier New', monospace;
	background: rgba(255, 255, 255, 0.1);
	padding: 8px 12px;
	border-radius: 6px;
	display: inline-block;
	font-size: 13px;
	margin-top: 8px;
	letter-spacing: 0.5px;
	word-break: break-all;
}

/* Announcement section */
footer .content > p:first-child {
	font-size: 14px;
	margin-bottom: 35px;
	padding-bottom: 35px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Donate section */
footer .donate {
	margin-bottom: 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

footer .donate p {
	font-size: 13px;
	color: #bdc3c7;
}

footer .donate .paypal_form {
	display: inline-block;
	margin: 15px 0;
}

footer .donate .paypal_form input[type="image"] {
	transition: transform 0.3s ease, opacity 0.3s ease;
	opacity: 0.9;
}

footer .donate .paypal_form input[type="image"]:hover {
	transform: scale(1.05);
	opacity: 1;
}

/* Footer grid layout */
.footer-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	text-align: left;
	max-width: 600px;
	margin: 0 auto 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

footer .footer-links,
footer .footer-info {
	width: auto;
	display: block;
	padding: 0;
}

footer .footer-links p,
footer .footer-info p {
	margin: 0 0 6px 0;
	font-size: 13px;
	line-height: 1.5;
}

footer .footer-links h4,
footer .footer-info h4 {
	color: #3498db;
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 12px 0;
	text-transform: uppercase;
	letter-spacing: 1.2px;
}

footer .footer-links a {
	display: inline-block;
	padding: 2px 0;
	transition: all 0.3s ease;
}

footer .footer-links a:hover {
	transform: translateX(5px);
}

/* Remove dividers - using borders instead */
footer .divider {
	display: none;
}

/* Footer bottom */
.footer-bottom {
	font-size: 12px;
	color: #95a5a6;
	padding-top: 30px;
}

.footer-bottom p {
	margin: 5px 0;
}

/* end footer styles */


/* main content styles */
#main_content {
	background: url(/img/10minutemail_main_bg-e372de2dba3d3505fa736535ee175d0e.jpg) no-repeat;
	background-size: cover;
	color: #fff;

}

.mail_section {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.mail_top_row,
.mail_bottom_row {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
}

.mail_top_row>div,
.mail_bottom_row>div {
	margin: 5px 0;
}

@media (min-width: 865px) {
	.mail_top_row {
		flex-direction: row;
		justify-content: center;
	}

	.mail_bottom_row {
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}

	.mail_bottom_row>#countdown {
		display: flex;
		align-items: center;
	}

	.mail_bottom_row>#get_more_time {
		margin-left: 20px;
	}

	.mail_top_row>div,
	.mail_bottom_row>div {
		margin: 5px;
	}
}

#countdown .counter_number,
#countdown .counter_colon {
	display: inline-block;
	font-size: 2em;
	line-height: 1;
}

#countdown {
	display: flex;
	align-items: center;
}

.counter_colon span {
	display: inline-block;
}

#mail_address input {
	width: 200px;
}

#main_content #copy_address {
	width: 36px;
	height: 36px;
	cursor: pointer;
	background: #50597b;
	border-radius: 6px;
}

#main_content #copy_address .copy_icon {
	/* Inline SVG copy icon - two overlapping rectangles */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cpath fill='%23ffffff' d='M10 3h10c1.1 0 2 .9 2 2v10c0 1.1-.9 2-2 2h-10c-1.1 0-2-.9-2-2V5c0-1.1.9-2 2-2z'/%3E%3Cpath fill='%23ffffff' opacity='0.7' d='M7 8H5c-1.1 0-2 .9-2 2v13c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2v-2h-7c-1.1 0-2-.9-2-2V8z'/%3E%3C/svg%3E");
	display: inline-block;
	width: 30px;
	height: 30px;
	margin: 3px 0 0 3px;
}

#main_content .mail_section .mail_address {
	width: 360px;
	height: 72px;
	background: #50597b;
	border-radius: 6px;
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;
}

#main_content .mail_section #mail_address {
	display: inline-block;
	background: rgba(255, 255, 255, 0.95);
	color: #2c3e50;
	border: 2px solid rgba(80, 89, 123, 0.3);
	font-size: 17px;
	font-weight: 500;
	width: 274px;
	margin-top: 20px;
	padding: 8px 12px;
	text-align: center;
	text-align-last: center;
	border-radius: 6px;
	transition: all 0.3s ease;
}

#main_content .mail_section #mail_address:focus {
	outline: none;
	border-color: #6190d3;
	box-shadow: 0 0 0 3px rgba(97, 144, 211, 0.1);
}

#main_content .mail_section .counter_number {
	width: clamp(60px, 15vw, 100px);
	height: clamp(100px, 25vw, 166px);
	background: #fff;
	display: inline-block;
	color: #6190d3;
	margin-right: 12px;
	margin-top: 18px;
	border-radius: 12px;
	text-align: center;
}

.counter_colon {
	display: inline-block;
	height: clamp(100px, 25vw, 166px);
	margin-top: 18px;
}

.counter_colon span {
	line-height: clamp(100px, 25vw, 166px);
	font-size: clamp(40px, 12vw, 80px);
	font-weight: bold;
	/* match the line height */
	display: inline-block;
}

#countdown {
	display: inline-block;
}

#main_content .mail_section #counter_min_one,
#main_content .mail_section #counter_sec_one {
	margin-right: 8px;
}

#main_content .mail_section .counter_number span {
	line-height: clamp(100px, 25vw, 166px);
	font-size: clamp(40px, 12vw, 80px);
	font-weight: bold;
}

.inbox_count {
	width: 220px;
	height: 72px;
	background: #50597b;
	border-radius: 6px;
	float: left;
	margin-left: 24px;
}

#inbox_count {
	font-size: 25px;
	color: #fff;
	margin-top: 30px;
	margin-left: 30px;
	position: relative;
}

.inbox_count .mail_icon {
	width: 36px;
	height: 28px;
	display: inline-block;
	/* Inline SVG mail envelope icon */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='28' viewBox='0 0 36 28'%3E%3Cpath fill='%23ffffff' d='M32 2H4c-1.1 0-2 .9-2 2v20c0 1.1.9 2 2 2h28c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 6l-14 8L4 8V6l14 8 14-8v2z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	margin-right: 10px;
	vertical-align: top;
}

.inbox_count #inbox_count_number {
	font-size: 36px;
	vertical-align: top;
	margin-top: -8px;
	margin-left: 10px;
	position: absolute;
}

#get_more_time {
	margin-top: 20px;
	background: #50597b;
	border-radius: 6px;
	display: inline-block;
	width: 292px;
	font-size: 30px;
	line-height: 50px;
	padding-left: 12px;
	height: 50px;
	cursor: pointer;
	/* margin-left: 299px; */
}


#main_content .explanation {
	max-width: 800px;
	width: 90%;
	margin: 30px auto;
	padding: 40px 50px;
	box-sizing: border-box;
	background: rgba(255, 255, 255, 0.95);
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(10px);
}

#main_content .explanation h2 {
	margin: 0 0 10px 0;
	font-size: 32px;
	font-weight: 700;
	color: #2c3e50;
	letter-spacing: -0.5px;
	line-height: 1.2;
}

#main_content .explanation h3 {
	margin: 0 0 30px 0;
	font-size: 20px;
	font-weight: 400;
	color: #5a6c7d;
	line-height: 1.4;
}

#main_content .explanation p {
	padding: 0;
	margin: 0 0 20px 0;
	line-height: 1.8;
	font-size: 16px;
	color: #34495e;
}

#main_content .explanation p:last-child {
	margin-bottom: 0;
}

#main_content .explanation strong {
	font-weight: 700;
	color: #2c3e50;
	font-size: 18px;
	display: block;
	margin-bottom: 12px;
}

#main_content .explanation a {
	color: #3498db;
	font-weight: 600;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: all 0.3s ease;
}

#main_content .explanation a:hover {
	color: #2980b9;
	border-bottom-color: #3498db;
}

#main_content .explanation br {
	display: block;
	content: "";
	margin-top: 8px;
}

/* end main content styles */

/* ad styles */


/* Default min-height for desktop (or larger screens) */
.top_banner_ad {
	min-height: 300px;
	max-height: 300px;
}

/* Min-height for mobile devices */
@media (max-width: 767px) {
	.top_banner_ad {
		min-height: 260px;
		max-height: 260px;
	}
}

/* banner ad  */
#banner_ad {
	margin-top: 20px;
	margin-bottom: 20px;
}

/* end banner ad  */

/* secondary ad */
#secondary_ads {
	margin-top: 20px;
	margin-bottom: 20px;
}

.bottom-ad {
	width: 300px;
	height: 250px;
	margin: 20px auto;
}

/* end secondary ad */

/* end ad styles */

/* mail messages */

#mail_messages .mail_message:first-of-type {
	margin-top: 10px;
}

#mail_messages .mail_message {
	border: 1px solid #90d2c5;
	background: #E6F7FF;
	margin-bottom: 15px;
}

#mail_messages .message_top {
	margin: 10px;
	border-top: 1px solid #90d2c5;
	background: #fff;
	/* height: 52px; */
	cursor: pointer;
	color: black;
}

#mail_messages .mail_message .message_top .small_message_icon_box {
	width: 90px;
	display: inline-block;
	vertical-align: top;
	color: black;
}

#mail_messages .mail_message .message_top .small_message_icon {
	width: 28px;
	height: 18px;
	display: inline-block;
	/* Inline SVG small mail icon */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='18' viewBox='0 0 28 18'%3E%3Cpath fill='%23ffffff' d='M25 1H3c-.8 0-1.5.7-1.5 1.5v13c0 .8.7 1.5 1.5 1.5h22c.8 0 1.5-.7 1.5-1.5v-13c0-.8-.7-1.5-1.5-1.5zm0 4l-11 6-11-6V3l11 6 11-6v2z'/%3E%3C/svg%3E");
	margin-left: 40px;
	margin-top: 18px;
}

#mail_messages .mail_message .message_top .small_sender {
	display: inline-block;
	width: 209px;
	height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: top;
	margin-right: 10px;
	margin-top: 18px;
}

#mail_messages .mail_message .message_top .small_subject {
	display: inline-block;
	/* width: 450px; */
	height: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: top;
	margin-right: 20px;
	margin-top: 18px;
}

#mail_messages .mail_message .message_top .small_date {
	display: inline-block;
	width: 219px;
	height: 30px;
	vertical-align: top;
	margin-top: 18px;
}

#mail_messages .mail_message_expanded .message_top {
	border-bottom: 1px solid #90d2c5;
}

#mail_messages_content {
	width: 90%;

}

#mail_messages .message_bottom {
	display: none;
	color: black;
}

#mail_messages .mail_message_expanded .message_bottom {
	padding: 0 24px 24px 24px;
	display: block;
}

#mail_messages .message_bottom .message_icons {
	text-align: right;
	padding-top: 20px;
}

#mail_messages .message_bottom .message_reply {
	display: inline-block;
	cursor: pointer;
}

#mail_messages .message_bottom .message_reply_icon {
	width: 32px;
	height: 25px;
	/* Inline SVG reply arrow icon */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='25' viewBox='0 0 32 25'%3E%3Cpath fill='%23ffffff' d='M12 8v-4l-8 8 8 8v-4c8 0 12 2 14 8-1-6-4-12-14-12z'/%3E%3C/svg%3E");
	display: inline-block;
	vertical-align: top;
}

#mail_messages .message_bottom .message_forward {
	display: inline-block;
	cursor: pointer;
}

#mail_messages .message_bottom .message_forward_icon {
	width: 32px;
	height: 25px;
	/* Inline SVG forward arrow icon */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='25' viewBox='0 0 32 25'%3E%3Cpath fill='%23ffffff' d='M20 8v-4l8 8-8 8v-4c-8 0-12 2-14 8 1-6 4-12 14-12z'/%3E%3C/svg%3E");
	display: inline-block;
	vertical-align: top;
	margin-left: 26px;
}

#mail_messages .message_bottom .message_close {
	display: inline-block;
	cursor: pointer;
}

#mail_messages .message_bottom .message_close_icon {
	width: 20px;
	height: 20px;
	/* Inline SVG close X icon */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath fill='%23ffffff' d='M15 5l-10 10M5 5l10 10' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
	display: inline-block;
	vertical-align: top;
	margin-top: 2px;
	margin-left: 36px;
}

#mail_messages .mail_message_expanded .message_bottom p:first-of-type {
	margin-top: 0;
}

#mail_messages .mail_message .message_bottom .reply_to_message,
#mail_messages .mail_message .message_bottom .forward_message {
	display: none;
	border-bottom: 1px solid #53b4ce;
	padding-bottom: 40px;
	margin-bottom: 30px;
}

#mail_messages .mail_message .message_bottom .reply_message_text {
	width: 100%;
	height: 150px;
}

#mail_messages .mail_message .message_bottom .forward_message_address {
	width: 40%;
}

#mail_messages .mail_message .message_bottom .reply_success,
#mail_messages .mail_message .message_bottom .forward_success {
	display: none;
	background: green;
	margin: 10px;
	text-align: center;
	border-radius: 6px;
}

#mail_messages .mail_message .message_bottom .reply_success p,
#mail_messages .mail_message .message_bottom .forward_success p {
	font-weight: bold;
	color: #fff;
	padding: 10px 0;
}


/* end mail messages */

/* secondary pages */
#secondary_header {
	background: url('/img/10minutemail_main_bg-e372de2dba3d3505fa736535ee175d0e.jpg');
	color: #fff;
	height: 90px;
}

.secondary_main {
	width: 690px;
	display: inline-block;
	border-right: 2px solid #5f61b9;
	margin-top: 20px;
	padding-right: 12px;
}

.secondary_main h1 {
	color: #49a6db;
}

.secondary_main h2 {
	color: #49a6db;
}

.secondary_main strong {
	color: #49a6db;
}

.secondary_main a,
.secondary_main a:visited,
.secondary_main a:active {
	color: #49a6db;
	text-decoration: none;
}

.secondary_sidebar {
	width: 290px;
	display: inline-block;
	vertical-align: top;
	margin-top: 10px;
}

.secondary_sidebar h2 {
	color: #49a6db;
	margin-left: 20px;
	margin-bottom: 40px;
}

.accolades_sidebar {
	padding-top: 120px;
}

.accolades_sidebar a,
.accolades_sidebar a:visited,
.accolades_sidebar a:active {
	text-decoration: none;
}

.accolades_sidebar p {
	margin-left: 20px;
	margin-bottom: 40px;
}

.sidebar_circle {
	color: #fff;
	background: #49a6db;
	width: 200px;
	height: 200px;
	border-radius: 100px;
	margin-left: 40px;
}

.sidebar_circle .circle_number {
	display: block;
	margin-left: 45%;
	padding-top: 30px;
	font-size: 24px;
}

.sidebar_circle .circle_text {
	display: block;
	text-align: center;
	padding-top: 14px;
}

.sidebar_circle_separator {
	margin-left: 140px;
	height: 20px;
	width: 2px;
	background: #49a6db;
}

.sidebar_try_it {
	border-radius: 4px;
	background: #50597b;
	color: #fff;
	width: 200px;
	height: 50px;
	margin-left: 40px;
	margin-top: 20px;
	text-align: center;
}

.sidebar_try_it a,
.sidebar_try_it a:visited,
.sidebar_try_it a:active {
	text-decoration: none;
	text-transform: uppercase;
	color: #fff;
	font-size: 22px;
	line-height: 50px;
}

.privacy_main {
	padding-bottom: 600px;
}

/* end secondary pages */

/* Mobile CSS syles */
@media only screen and (max-device-width: 480px) {
	.content {
		width: 100%;
	}

	header h1 {
		display: block;
		margin: 20px auto;
	}

	header h2 {
		display: block;
		margin: 20px auto;
		background-size: 100% 100%;
		background-repeat: no-repeat;
		width: 350px;
		height: 24px;
	}

	footer {
		padding: 40px 20px 20px;
	}

	footer .content > p:first-child {
		font-size: 13px;
		margin-bottom: 25px;
		padding-bottom: 25px;
	}

	footer .donate {
		margin-bottom: 30px;
		padding-bottom: 30px;
	}

	.footer-grid {
		grid-template-columns: 1fr;
		gap: 30px;
		text-align: center;
		margin-bottom: 30px;
		padding-bottom: 30px;
		max-width: 100%;
	}

	footer .footer-links,
	footer .footer-info {
		text-align: center;
	}

	footer .footer-links a:hover {
		transform: none;
	}

	.btc_wallet_address {
		font-size: 11px;
		padding: 6px 10px;
		max-width: 90%;
	}

	header .language {
		margin-left: 25%;
		margin-top: 10px;
	}

	#main_content {
		margin-top: 80px;
		background: url('/img/10minutemail_main_bg_mobile-81ed75c297876346b43fe313e02bd8dc.jpg');
	}

	#main_content .mail_section {
		width: 100%;
	}

	#get_more_time {
		margin-left: 8px;
	}

	#counter_min_one {
		margin-left: 8px;
	}

	#counter_min_two {
		margin-right: 8px;
	}

	#main_content #copy_address {
		float: none;
		margin-left: 8px;
		margin-bottom: 6px;
	}

	#main_content .mail_section .mail_address {
		width: 95%;
		margin-left: 8px;
		float: none;
	}

	#main_content .mail_section .mail_address #mail_address {
		margin-top: 14px;
	}

	.inbox_count {
		margin: 10px 0 0 8px;
		float: none;
		clear: both;
		height: 42px;
	}

	#inbox_count {
		margin: 0 0 0 30px;
		padding-top: 5px;
	}

	#main_content .explanation {
		margin-bottom: 40px;
		width: 95%;
		padding: 30px 25px;
	}

	#main_content .explanation h2 {
		font-size: 26px;
	}

	#main_content .explanation h3 {
		font-size: 18px;
		margin-bottom: 20px;
	}

	#main_content .explanation p {
		font-size: 15px;
		line-height: 1.7;
	}

	#main_content .explanation strong {
		font-size: 16px;
	}

	#mail_messages .mail_message {
		width: 98%;
		margin-left: 2px;
	}

	#mail_messages .mail_message:first-of-type {
		margin-top: 0;
	}

	#mail_messages .message_top {
		height: auto;
	}

	#mail_messages .mail_message .message_top .small_subject {
		display: block;
		margin-left: 10px;
	}

	#mail_messages .mail_message .message_top .small_date {
		margin-left: 10px;
	}

	#mail_messages .message_bottom .message_icons {
		margin-bottom: 20px;
	}


	#mail_messages .mail_message .message_bottom .forward_message_address {
		width: 90%;
	}

	.secondary_main {
		width: 98%;
		padding-left: 5px;
		padding-right: 5px;
		border-right: none;
	}

	.secondary_sidebar {
		display: none;
	}

	.privacy_main {
		padding-bottom: 60px;
	}

}

/* ============================================
   UX IMPROVEMENTS - Added 2025-10-19
   ============================================ */

/* Toast Notification System */
.ux-toast {
	position: fixed;
	top: 20px;
	right: 20px;
	background: #4CAF50;
	color: white;
	padding: 16px 24px;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	font-size: 16px;
	font-weight: 500;
	z-index: 1500;
	opacity: 0;
	transform: translateY(-20px);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	pointer-events: none;
}

.ux-toast.show {
	opacity: 1;
	transform: translateY(0);
}

.ux-toast.hide {
	opacity: 0;
	transform: translateY(-20px);
}

.ux-toast-error {
	background: #f44336;
}

.ux-toast-warning {
	background: #FF9800;
}

/* Copy button success state */
#copy_address.copy-success {
	background: #4CAF50 !important;
	transform: scale(1.05);
	transition: all 0.2s ease;
}

/* Timer Warning */
.timer-warning {
	background: linear-gradient(135deg, #FF9800 0%, #F57C00 100%);
	color: white;
	padding: 12px 20px;
	border-radius: 8px;
	text-align: center;
	font-weight: bold;
	margin: 15px auto;
	max-width: 400px;
	font-size: 16px;
	box-shadow: 0 4px 12px rgba(255, 152, 0, 0.3);
	animation: pulse 1.5s ease-in-out infinite;
}

.timer-warning.hidden {
	display: none;
}

@keyframes pulse {
	0%, 100% {
		opacity: 1;
		transform: scale(1);
	}
	50% {
		opacity: 0.85;
		transform: scale(1.02);
	}
}

/* Button loading/success/error states */
#get_more_time.loading {
	opacity: 0.7;
	cursor: wait;
	pointer-events: none;
}

#get_more_time.success {
	background: #4CAF50 !important;
	transform: scale(1.02);
	transition: all 0.2s ease;
}

#get_more_time.error {
	background: #f44336 !important;
}

#get_more_time:disabled {
	cursor: not-allowed;
	opacity: 0.6;
}

/* Screen reader only class */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

/* Focus indicators for keyboard navigation */
#copy_address:focus-visible,
#get_more_time:focus-visible,
.message_top:focus-visible,
.message_reply:focus-visible,
.message_forward:focus-visible,
.message_close:focus-visible,
#language_btn:focus-visible {
	outline: 3px solid #FFD700;
	outline-offset: 3px;
	box-shadow: 0 0 0 6px rgba(255, 215, 0, 0.25);
}

/* Remove default focus for mouse users (keep for keyboard) */
#copy_address:focus:not(:focus-visible),
#get_more_time:focus:not(:focus-visible) {
	outline: none;
}

/* Enhanced hover states */
#copy_address:hover {
	background: #5d6690;
	transform: scale(1.05);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	transition: all 0.2s ease;
}

#get_more_time:hover {
	background: #5d6690;
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	transition: all 0.2s ease;
}

#get_more_time:active {
	transform: translateY(0);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.message_top:hover {
	background: #f0f8ff;
	transition: background 0.2s ease;
	cursor: pointer;
}

/* Increased touch target sizes */
#main_content #copy_address {
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#main_content #copy_address .copy_icon {
	margin: 0;
}

/* Reduced timer visual prominence */
#main_content .mail_section .counter_number {
	width: clamp(45px, 12vw, 70px);
	height: clamp(75px, 20vw, 120px);
}

.counter_colon {
	height: clamp(75px, 20vw, 120px);
}

.counter_colon span {
	line-height: clamp(75px, 20vw, 120px);
	font-size: clamp(30px, 10vw, 60px);
}

#main_content .mail_section .counter_number span {
	line-height: clamp(75px, 20vw, 120px);
	font-size: clamp(30px, 10vw, 60px);
}

/* Mobile-specific adjustments */
@media (max-width: 480px) {
	.ux-toast {
		top: 10px;
		right: 10px;
		left: 10px;
		text-align: center;
		font-size: 14px;
		padding: 12px 16px;
	}

	.timer-warning {
		font-size: 14px;
		padding: 10px 16px;
		margin: 10px 8px;
	}

	/* Timer already sized responsively via clamp() - no override needed */

	/* Also make "10 more minutes" button more compact */
	#get_more_time {
		font-size: 14px;
		padding: 10px 18px;
		margin-left: 8px;
	}
}

/* Disable hover effects on touch devices */
@media (hover: none) {
	#copy_address:hover,
	#get_more_time:hover {
		transform: none;
		box-shadow: none;
	}
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	#copy_address:focus-visible,
	#get_more_time:focus-visible {
		outline: 4px solid currentColor;
		outline-offset: 4px;
	}

	.ux-toast {
		border: 2px solid white;
	}
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
	.ux-toast,
	#copy_address,
	#get_more_time,
	.message_top {
		transition: none;
		animation: none;
	}

	.timer-warning {
		animation: none;
	}
}

/* ============================================
   INBOX EMPTY STATE - Added 2025-10-19
   ============================================ */

.inbox-empty-state {
	text-align: center;
	padding: 60px 20px;
	color: #fff;
	opacity: 1;
	transition: opacity 0.3s ease;
}

.inbox-empty-state.hidden {
	display: none;
}

.empty-state-icon {
	font-size: 64px;
	margin-bottom: 20px;
	animation: float 3s ease-in-out infinite;
}

@keyframes float {
	0%, 100% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-10px);
	}
}

.empty-state-title {
	font-size: 24px;
	font-weight: 600;
	margin: 0 0 10px 0;
	color: #fff;
}

.empty-state-subtitle {
	font-size: 16px;
	margin: 0;
	color: rgba(255, 255, 255, 0.8);
}

/* Mobile adjustments */
@media (max-width: 480px) {
	.inbox-empty-state {
		padding: 40px 20px;
	}

	.empty-state-icon {
		font-size: 48px;
	}

	.empty-state-title {
		font-size: 20px;
	}

	.empty-state-subtitle {
		font-size: 14px;
	}
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
	.empty-state-icon {
		animation: none;
	}
}

/* ============================================
   Session Expired Overlay
   ============================================ */

.session-expired-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.85);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	opacity: 0;
	transition: opacity 0.3s ease;
}

.session-expired-overlay:not(.hidden) {
	opacity: 1;
}

.session-expired-overlay.hidden {
	display: none;
}

.expired-content {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	padding: 50px 40px;
	border-radius: 16px;
	text-align: center;
	max-width: 500px;
	width: 90%;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
	animation: slideInUp 0.4s ease-out;
}

@keyframes slideInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.expired-icon {
	font-size: 80px;
	margin-bottom: 20px;
	animation: pulse-slow 2s ease-in-out infinite;
}

@keyframes pulse-slow {
	0%, 100% {
		opacity: 1;
		transform: scale(1);
	}
	50% {
		opacity: 0.8;
		transform: scale(1.05);
	}
}

.expired-title {
	color: #ffffff;
	font-size: 32px;
	font-weight: 700;
	margin: 0 0 15px 0;
	letter-spacing: 0.5px;
}

.expired-message {
	color: rgba(255, 255, 255, 0.9);
	font-size: 18px;
	margin: 0 0 30px 0;
	line-height: 1.6;
}

.refresh-session-btn {
	background: linear-gradient(135deg, #00d2ff 0%, #3a7bd5 100%);
	color: white;
	border: none;
	padding: 16px 40px;
	font-size: 18px;
	font-weight: 600;
	border-radius: 50px;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(0, 210, 255, 0.3);
	text-transform: uppercase;
	letter-spacing: 1px;
}

.refresh-session-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(0, 210, 255, 0.4);
	background: linear-gradient(135deg, #00d2ff 0%, #2e6bb8 100%);
}

.refresh-session-btn:active {
	transform: translateY(0);
	box-shadow: 0 2px 10px rgba(0, 210, 255, 0.3);
}

.refresh-session-btn:focus {
	outline: 3px solid rgba(255, 255, 255, 0.5);
	outline-offset: 3px;
}

/* Mobile adjustments for expired overlay */
@media (max-width: 480px) {
	.expired-content {
		padding: 40px 30px;
	}

	.expired-icon {
		font-size: 60px;
	}

	.expired-title {
		font-size: 26px;
	}

	.expired-message {
		font-size: 16px;
	}

	.refresh-session-btn {
		padding: 14px 30px;
		font-size: 16px;
	}
}

/* Reduced motion support for expired overlay */
@media (prefers-reduced-motion: reduce) {
	.expired-content {
		animation: none;
	}

	.expired-icon {
		animation: none;
	}

	.refresh-session-btn:hover {
		transform: none;
	}
}