/*
+----------------------------------------------------------------+
|																							|
|	WordPress Plugin: awesome-polls										|
|	Copyright (c) 2012 Lester "GaMerZ" Chan									|
|																							|
|	File Written By:																	|
|	- Lester "GaMerZ" Chan															|
|	- http://lesterchan.net															|
|																							|
|	File Information:																	|
|	- Polls CSS File																	|
|	- wp-content/plugins/awesome-polls/polls-css.css								|
|																							|
+----------------------------------------------------------------+
*/


.awesome-polls-archive {
	/* background-color: #ffffff; */
}
.awesome-polls, .awesome-polls-form {
	/* background-color: #ffffff; */
}
.awesome-polls ul li, .awesome-polls-ul li, .awesome-polls-ans ul li {
	text-align: center;
	background-image: none;
	display: block;
	font-size: 21px;
}
.awesome-polls ul, .awesome-polls-ul, .awesome-polls-ans ul  {
	text-align: center;
	list-style: none;
	float: none;
}
.awesome-polls ul li:before, .awesome-polls-ans ul li:before, #sidebar ul ul li:before {
	content: '';
}
.awesome-polls IMG, .awesome-polls LABEL , .awesome-polls INPUT, .awesome-polls-loading IMG, .awesome-polls-image IMG {
	display: inline;
	border: 0px;
	padding: 0px;
	margin: 0px;
}
.awesome-polls-ul {
	padding: 0px;
	margin: 0px 0px 10px 10px;
}
.awesome-polls-ans {
	width:100%;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
	/* background-color: #ffffff; */
}
.awesome-polls-loading {
	display: none;
	text-align: center;
	height: 16px;
	line-height: 16px;
}
.awesome-polls-image {
	border: 0px;
}
.awesome-polls .Buttons {
	border:1px solid #c8c8c8;
	background-color: #DC143C;
}
/* Polls Archive Paging */
.awesome-polls-paging a, .awesome-polls-paging a:link {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #0066cc;
	color: #0066cc;
	background-color: #FFFFFF;	
}
.awesome-polls-paging a:visited {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #0066cc;
	color: #0066cc;
	background-color: #FFFFFF;	
}
.awesome-polls-paging a:hover {	
	border: 1px solid #000000;
	color: #000000;
	background-color: #FFFFFF;
}
.awesome-polls-paging a:active {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	text-decoration: none;
	border: 1px solid #0066cc;
	color: #0066cc;
	background-color: #FFFFFF;	
}
.awesome-polls-paging span.pages {
	padding: 2px 4px 2px 4px; 
	margin: 2px 2px 2px 2px;
	color: #000000;
	border: 1px solid #000000;
	background-color: #FFFFFF;
}
.awesome-polls-paging span.current {
	padding: 2px 4px 2px 4px; 
	margin: 2px;
	font-weight: bold;
	border: 1px solid #000000;
	color: #000000;
	background-color: #FFFFFF;
}
.awesome-polls-paging span.extend {
	padding: 2px 4px 2px 4px; 
	margin: 2px;	
	border: 1px solid #000000;
	color: #000000;
	background-color: #FFFFFF;
}




/* Match the form background and overall styling */
.poll-container #mc_embed_signup {
    background-color: #f9f9f9; /* Light background color */
    border: 1px solid #ddd; /* Light border */
    padding: 20px;
    border-radius: 10px;
    font-family: Arial, sans-serif;
    max-width: 728px;
	width:auto !important;
    margin: 0 auto;
}

/* Style the form header */
.poll-container #mc_embed_signup h2 {
    text-align: center;
    color: #1148A0; /* Blue color similar to your poll */
    font-weight: bold;
}

/* Style the labels */
.poll-container #mc_embed_signup label {
    font-size: 14px;
    font-weight: bold;
    color: #333; /* Darker text for labels */
}

/* Style the input fields */
.poll-container #mc_embed_signup input[type="email"],
.poll-container #mc_embed_signup input[type="text"] {
    width: 100%;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-sizing: border-box;
}

/* Style the submit button */
.poll-container #mc_embed_signup input[type="submit"] {
    background-color: #DC143C; 
    color: white;
    font-size: 16px;
    border: none;
    border-radius: 25px;
    cursor: pointer;
    width: 100%;
    text-align: center;
}

.poll-container #mc_embed_signup input[type="submit"]:hover {
    background-color: #FF0000; /* Darker orange on hover */
}

/* Center the form elements */
.poll-container #mc_embed_signup_scroll {
    display: flex;
    flex-direction: column;
}

/* Additional styling to match your poll */
.poll-container #mc_embed_signup .mc-field-group {
    width: 100%;
    max-width: 500px;
    margin: 0 auto 15px;
}

.poll-container #mc_embed_signup .clear {
    text-align: center;
}

/* Asterisk style */
.poll-container .indicates-required .asterisk {
    color: #FF6B35;
}

/* Style the response messages */
.poll-container #mce-error-response, #mce-success-response {
    background-color: #f2f2f2;
    border: 1px solid #ddd;
    padding: 10px;
    border-radius: 5px;
    margin-top: 10px;
    color: #333;
}




/* custom styles */

.poll-container {
	border-radius:20px;
}

/*center button */
.poll-container .wp-block-buttons {
    display: flex;
    justify-content: center; /* Centers the button horizontally */
    align-items: center;     /* Centers the button vertically if needed */
    width: 100%;             /* Ensure the container takes full width */
}

.poll-container .wp-block-button {
    margin: 0 auto;          /* Ensure any potential margin doesn't interfere */
}

.poll-container, .awesome-polls {
	text-align:center;
}


.poll-container {
	position:relative;
}

.poll-container  .floating-arrow {
    position: absolute;
    top: 44%;
    right: 1%;
    width: 75px;
    height: 75px;
    background-color: #FF0000; /* Change to your preferred color */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    color: white;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
	opacity:0.61;
}

.poll-container  .floating-arrow:hover {
	background-color: #C00000;
}

.poll-container  .floating-arrow::before {
    content: '›'; /* Use the right arrow character */
    font-size: 24px;
}







/* CUSTOM STYLES */
/* Center the question text */
.poll-container p {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
    color: #1148A0; /* Similar blue as in the image */
}

/* Style the poll options */
.wp-polls-ul {
    list-style-type: none;
    padding: 0;
    display: flex;
    flex-direction: column;  
	align-items:center;
}

.wp-polls-ul li {
    margin-bottom: 15px;
    width: 79%;
	text-align:center;
}

.wp-polls-ul li label {
    font-size: 18px;
    font-weight: bold;
    display: inline-block;
    padding: 10px 20px;
    background-color: #F4F4F4;
    border: 2px solid #D1D1D1;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
    width: 80%;
	max-width:500px;
}

.wp-polls-ul li label:hover {
    background-color: #ECECEC;
    border-color: #1148A0;
}

.wp-polls-ul li input[type="radio"] {
    display: none;
}

/* Style the button */
.wp-block-button__link {
    display: inline-block;
    color: white;
    padding: 10px 30px;
    font-size: 18px;
    border-radius: 25px;
    text-align: center;
    border: none;
    cursor: pointer;
    transition: all 0.3s ease;
	background-color:#FF0000;
}

.wp-block-button__link:hover {
    background-color: #C00000; /* Slightly darker shade on hover */
}

/* Adjust the footer note */
/* .poll-container span {
    display: block;
    text-align: center;
    font-size: 16px;
    font-style: italic;
    color: #6D6D6D;
    margin-top: 15px;
} */


.wp-polls-ul li label.selected {
    background-color: #d1e7ff; /* Light blue background */
    border-color: #005dd1; /* Blue border */
    color: #005dd1; /* Blue text */
    font-weight: bold; /* Make the text bold */
    padding: 5px; /* Add padding to the label */
    border-radius: 5px; /* Round the corners */
}



/* Main container for the quiz navbar */
.quiz-navbar {
    display: flex;
    width: 100%;
    margin: 0;
    position: relative;
    font-family: Arial, sans-serif; /* Set a base font family */
}

/* Inner content container */
.quiz-navbar-inner {
    display: flex;
    align-items: center;
    color: #ffffff; /* Set text color to white */
    justify-content: space-between;
    height: 2rem;
    width: 100%;
    padding: 0 .2rem 0 0.375rem;
    position: relative;
    font-size: 14px; /* Set default font size */
}

/* Background styling inside the header */
.quiz-navbar-inner-bg {
    position: absolute;
    left: 0;
    top: 0;
    background-color: #00387d; /* Blue background */
    width: 0%; /* Initially 0 for animation */
    height: 100%;
    z-index: 0;
    border-radius: .5rem;
    animation: background-intro-animation .7s forwards .4s;
}

/* Category Icon styling */
.category-icon {
    position: absolute;
    left: -.5rem;
    height: 3.375rem;
    width: 3.375rem;
    opacity: 0;
    z-index: 1;
    transform: scale(0);
    animation: category-icon-intro-animation .5s forwards;
}

@media screen and (max-width: 767px) {
    .category-icon {
        height: 2.5rem;
        width: 2.5rem;
    }
}

/* Quiz progress styling */
.quiz-progress {
    position: relative;
    opacity: 0;
    left: -100px;
    z-index: 0;
    font-weight: 600; /* Medium weight for progress text */
    font-size: 14px; /* Ensure the correct font size */
    animation: quiz-progress-intro-animation .7s forwards .4s;
    color: #ffffff; /* Ensure the text color is white */
}

.quiz-progress big {
    font-weight: 700; /* Bold font weight */
    height: 1.75rem;
    width: 1.75rem;
    font-size: 16px; /* Ensure the correct font size */
    line-height: 1.75rem;
    text-align: center;
    background-color: #005dd1; /* Bright blue background for the question number */
    border-radius: 20px;
    letter-spacing: -.32px;
    color: #ffffff; /* Ensure the text color is white */
}

.quiz-progress small {
    font-weight: 500; /* Slightly lighter weight */
    margin-left: -.125rem;
    font-size: 12px; /* Set a smaller font size for small text */
/*     color: #FF602E; */
}

/* Points section styling */
.quiz-stats {
    display: flex;
    align-items: center;
    animation: quiz-points-intro-animation .7s forwards .7s;
}

.quiz-stats .icon {
    padding: 0;
    height: 2.375rem;
    width: 2.375rem;
    margin-right: .25rem;
    opacity: 0;
    transform: scale(0);
    animation: category-icon-intro-animation .5s forwards .7s;
}

@media screen and (max-width: 767px) {
    .quiz-stats .icon {
        margin-right: .5rem;
    }
}

.quiz-points {
    font-size: 14px; /* Ensure the correct font size */
    font-weight: 600; /* Medium weight */
    display: inline-flex;
    align-items: center;
    color: #ffffff; /* Ensure the text color is white */
}

.quiz-points big {
    font-weight: 700; /* Bold font weight */
    line-height: 2rem;
    font-size: 24px; /* Ensure the correct font size */
    margin-right: .25rem;
    color: #FF602E; /* Orange color for the points number */
}

@media screen and (max-width: 767px) {
    .quiz-points big {
        font-size: 16px; /* Adjust font size on smaller screens */
    }
}

/* Keyframes for animations */
@keyframes category-icon-intro-animation {
    0% { opacity: 0; transform: scale(0); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes background-intro-animation {
    0% { width: 0%; }
    100% { width: 100%; }
}

@keyframes quiz-progress-intro-animation {
    0% { opacity: 0; left: -100px; }
    100% { opacity: 1; left: 0; }
}

@keyframes quiz-points-intro-animation {
    0% { opacity: 0; left: -10px; }
    100% { opacity: 1; left: 0; }
}

.quiz-navbar .quiz-icon-left {
    width: 54px;
    height: 54px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54"><circle cx="27" cy="27" r="26" fill="%23005dd1" stroke="%23005dd1" stroke-width="2"/><rect x="15" y="12" width="24" height="30" rx="2" ry="2" fill="%23ffffff"/><rect x="18" y="16" width="18" height="3" fill="%23005dd1"/><rect x="18" y="22" width="12" height="3" fill="%23005dd1"/><circle cx="21" cy="33" r="2.5" fill="%23005dd1"/><rect x="25" y="31" width="9" height="3" fill="%23005dd1"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	z-index:1;
}

.quiz-navbar .quiz-icon-right {
    width: 38px;
    height: 38px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="38" height="38" viewBox="0 0 38 38"><circle cx="19" cy="19" r="18" fill="%23FF602E" stroke="%23005dd1" stroke-width="2"/><path d="M12 12 L26 12 Q26 16 22 20 Q18 24 16 20 Q12 16 12 12 Z" fill="%23ffffff"/><rect x="16" y="22" width="6" height="4" fill="%23ffffff"/><rect x="14" y="26" width="10" height="2" fill="%23ffffff"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
	z-index:1;
}




/* mailchimp form */
#mc_embed_signup .button {
	height:auto !important;
}