/*
Theme Name: Saeid
Theme URI: https://saeid.aymanhafez.net
Author: Ayman Hafez
Author URI: https://saeid.aymanhafez.net
Description: Saeid - Perfect Theme for Charities
Version: 3.6.1
Requires at least: 5.0
Tested up to: 6.0
Requires PHP: 7.0
Text Domain: saeid
*/

/*
* General
*/

:root {
	--primary-color: #ffcc5e;
	--secondary-color: #f95f5c;
	--hover-color: #c4486b;
	--default-background-color: #fff;
	--selection-color: #ffcc5e;
	--border-radius: 15px;
	--widget-background-color: #ffcc5e;
}

::selection {
	background-color: var(--selection-color);
}

.post, .page {
	margin: 0px;
}

.wp-block-search__label {
	width: 100%;
	margin-top: 0;
	margin-bottom: 0.5rem;
}

input:focus,
textarea:focus {
	outline: none !important;
	border: 1px solid var(--primary-color) !important;
}

html, body {
	max-width: 100%;
	overflow-x: hidden;
}

a {
	transition: 0.2s !important;
}

.owl-carousel .owl-stage-outer {
	direction: ltr;
}

/*
* General Pages
*/

.page-template-default,
.single-post,
.archive,
.author,
.blog,
.search {
	background-color: var(--default-background-color);
}

.page-template-default textarea,
.single-post textarea,
.archive textarea,
.author textarea {
	border-radius: var(--border-radius);
	resize: initial !important;
}

.page-template-default button,
.single-post button .archive button .author button,
.page-template-default input[type="button"],
.single-post input[type="button"],
.archive input[type="button"],
.author input[type="button"],
.page-template-default input[type="reset"],
.single-post input[type="reset"],
.archive input[type="reset"],
.author input[type="reset"],
.page-template-default input[type="submit"],
.single-post input[type="submit"],
.archive input[type="submit"],
.author input[type="submit"],
.search input[type="submit"],
.page-template-default .wp-block-search__button,
.single-post .wp-block-search__button,
.archive .wp-block-search__button,
.author .wp-block-search__button,
.blog .wp-block-search__button,
.search .wp-block-search__button {
	background-color: white;
	border: 1px solid white;
	color: var(--primary-color);
	padding: 10px 20px;
	border-radius: var(--border-radius);
}

.page-template-default input[type="text"],
.single-post input[type="text"],
.archive input[type="text"],
.author input[type="text"],
.search input[type="text"],
.page-template-default input[type="email"],
.single-post input[type="email"],
.archive input[type="email"],
.author input[type="email"],
.page-template-default input[type="search"],
.single-post input[type="search"],
.archive input[type="search"],
.author input[type="search"],
.blog input[type="search"],
.search input[type="search"],
.page-template-default input[type="url"],
.single-post input[type="url"],
.archive input[type="url"],
.author input[type="url"],
.page-template-default .textarea,
.single-post textarea,
.archive textarea,
.author textarea {
	width: 100%;
	border-radius: var(--border-radius);
	border: 1px solid var(--primary-color);
    text-indent: 7px;
}

.search input[type="search"]
{
	height: 45px;
}

#primary {
	padding: 0px 15px;
	border-radius: var(--border-radius);
}

#primary h1,
#primary h2,
#primary h3,
#primary h4,
#primary h5,
#primary h6,
#primary #comments p label {
	color: var(--primary-color);
}

#primary .entry-meta {
	padding: 16px 0px;
}

#primary .post-thumbnail {
    width: 65%;
    margin: 0 auto;
}

#primary .post-thumbnail img {
	width: 100%;
	height: auto;
	border-radius: var(--border-radius);
	margin-bottom: 25px;
}

#primary img {
	border-radius: var(--border-radius);
	transition: 0.2s;
}

#primary img:hover {
	opacity: 0.7;
}

#primary .post img:hover {
	opacity: 1;
}


#primary .post-navigation span.nav-subtitle {
	display: block;
	margin: 4px 0px;
}

#primary .post-navigation a {
	color: white;
	text-decoration: auto;
}

#primary .post-navigation .nav-previous,
#primary .post-navigation .nav-next {
	background-color: var(--primary-color);
	padding: 20px;
	margin: 10px;
	text-align: center;
	border-radius: var(--border-radius);
	width: 47%;
	display: inline-block;
}

#primary a {
	color: var(--primary-color);
	text-decoration: none;
}

#primary a:hover {
	color: var(--hover-color);
}

#primary span.edit-link,
#primary span.tags-links,
#primary span.comments-link {
	margin-right: 10px;
}

#primary .post {
	margin-bottom: 40px;
}

#primary .page-header {
	margin-bottom: 0px;
}

#primary .entry-title {
	margin-bottom: 0px;
}

#primary footer.entry-footer {
	display: flex;
}

#primary #reply-title .small,
#primary #reply-title small {
	margin-right: 10px;
}

#primary .comment-author img {
	width: auto;
	display: inline-block;
}

#primary #comments {
	margin: 30px 0px;
}

#primary #comments h2 {
	font-size: 1.5rem;
	margin-bottom: 25px;
}

#primary #comments p {
	margin: 15px 0px;
}

#primary #comments p label {
	margin: 5px 0px;
}

#secondary .widget_block {
	background-color: var(--widget-background-color);
	padding: 25px 10px;
	border-radius: var(--border-radius);
	text-align: center;
	margin-bottom: 20px;
}


#secondary .widget_block a {
	color: white;
	text-decoration: auto;
}

#secondary .widget_block a:hover {
	color: var(--hover-color);
}

#secondary div {
	color: white;
}

#secondary .widget_block ul {
	list-style: none;
}

#secondary .widget_block h2,
#secondary .wp-block-search__label {
	font-size: 1.7rem;
	color: white;
}

#secondary .wp-block-latest-posts.wp-block-latest-posts__list {
	padding: 0px;
}

#secondary ol,
#secondary ul {
	padding: 0rem 1rem;
}

#secondary li {
	padding: 6px 0px;
}

#secondarydl,
#secondary ol,
#secondary ul {
	margin-top: 0;
	margin-bottom: 0;
}

#secondary p.wp-block-tag-cloud {
	margin-top: 0;
	margin-bottom: 0;
}

#secondary .wp-block-tag-cloud a {
	background-color: white;
	color: var(--primary-color);
	padding: 10px;
	border-radius: var(--border-radius);
	margin-bottom: 5px;
	font-size: 10pt !important;
}

@media only screen and (max-width: 768px) {
	.p-5 {
		padding: 2rem !important;
	}

	#primary {
		padding: 0px;
	}

	#primary .post-thumbnail {
		width: 100%;
		margin: 0 auto;
	}

	.post-navigation .nav-links {
		display: block;
	}

	#primary .entry-content img {
		width: 100%;
	}

	#primary .post-navigation .nav-previous,
	#primary .post-navigation .nav-next {
		width: 100%;
		display: block;
		margin: 15px 0px;
	}
}

/*
* 404 Page
*/

.error404 {
	background-color: var(--default-background-color);
	color: var(--primary-color);
}

.error404 h2 {
	font-size: 13rem;
	font-family: system-ui !important;
}

.error404 [type=search] {
	border: 1px solid var(--primary-color);
	padding: 6px 20px;
	border-radius: var(--border-radius);
}

.error404 input.search-submit {
	background-color: var(--primary-color);
	color: white;
	border: 1px solid var(--primary-color);
	padding: 6px 20px;
	border-radius: var(--border-radius);
}

/*
* Social Share
*/

.social-share {
	margin-bottom: 22px;
}

.a2a_kit {
	display: inline-block;
}

/*
* Related Posts
*/

#related_posts img {
	width: 228px;
	height: 142px;
	margin: 0 auto;
}

.relatedthumb {
	text-align: center;
}

#related_posts li {
	display: inline-block;
	width: 30%;
	margin: 0px 10px;
	vertical-align: top;
}

#related_posts .relatedcontent h3 {
	font-size: 1.3rem;
	text-align: center;
	margin-top: 12px;
}

#related_posts ul {
	padding: 0;
}

#related_posts {
	margin: 30px 0px;
}

@media only screen and (max-width: 768px) {
	#related_posts li {
		width: 100%;
		margin: 10px 0px;
		text-align: center;
	}
}

/*
* Plugin: Elementor Header & Footer Builder
*/

nav.hfe-nav-menu__layout-horizontal.hfe-nav-menu__submenu-arrow.hfe-dropdown.menu-is-active {
	left: -10px !important;
	right: auto !important;
	top: 4rem !important;
}

.sub-menu .menu-item.current-menu-item a.hfe-sub-menu-item.hfe-sub-menu-item-active, nav.hfe-dropdown .menu-item.current-menu-item a.hfe-menu-item, nav.hfe-dropdown .menu-item.current-menu-ancestor a.hfe-menu-item, nav.hfe-dropdown .sub-menu .menu-item.current-menu-item a.hfe-sub-menu-item.hfe-sub-menu-item-active {
	color: var(--primary-color) !important;
	background-color: white !important;
}

.rtl .hfe-nav-menu__layout-horizontal .hfe-nav-menu .sub-arrow {
	margin-right: 10px;
	margin-left: 0px;
}

.rtl a.hfe-sub-menu-item {
	text-align: right;
	line-height: 1.5em;
}

.hfe-nav-menu .menu-item-has-children .sub-menu {
	right: 0;
	left: auto;
}

.hfe-menu-cart__toggle .elementor-button-icon {
	-webkit-order: 6;
	-ms-flex-order: 6;
	order: 6;
}

.elementor-widget-hfe-cart.toggle-icon--bag-solid .hfe-menu-cart__toggle .elementor-button-icon i:before {
	content: '\e8e9';
}

.hfe-search-button-wrapper input[type=search] {
    border: 0 !important;
    border-radius: 0 !important;
}

/*
* Plugin: BetterDocs
*/

.betterdocs-search-form-wrap input[type="text"] {
	border: none !important;
}

.betterdocs-search-form-wrap input:focus {
	border: none !important;
}

/*
* Plugin: WPForms
*/

.wpforms-form button[type=submit] {
	background-color: var(--primary-color) !important;
	color: white !important;
	width: 100%;
	transition: all .2s;
}

.wpforms-form button[type=submit]:hover {
	background-color: var(--hover-color) !important;
}

.wpforms-submit,
.wpforms-field-large,
.wpforms-form textarea,
textarea#comment
{
	border-radius: var(--border-radius) !important;
}

/*
* Plugin: WooCommerce
*/

.woocommerce h1,
.woocommerce h2,
.woocommerce-info::before {
	color: var(--primary-color);
	text-decoration: auto;
}

.woocommerce h2 {
	margin-bottom: 1rem;
}

.woocommerce-page ul.products li {
	text-align: center;
}

.woocommerce-page .related {
	text-align: center;
}

.woocommerce #primary .entry-title {
	margin-bottom: 1rem;
}

.woocommerce-info {
	border-top-color: var(--primary-color);
}

.woocommerce-message {
	border-top-color: var(--primary-color);
}

.woocommerce-message::before {
	color: var(--primary-color);
}

.price ins {
	text-decoration: none;
}

input#coupon_code {
	height: 37px;
	text-indent: 10px;
}

.woocommerce-checkout input#coupon_code {
	width: 100%;
}

.woocommerce-cart input#coupon_code {
	width: auto;
}


span.page-numbers.current {
	background-color: var(--primary-color) !important;
	color: white !important;
}

.woocommerce .button,
.woocommerce #review_form #respond .form-submit input {
	background-color: var(--primary-color) !important;
	color: white !important;
	border: 1px solid transparent !important;
	transition: all 0.2s;
	font-weight: normal !important;
}

.woocommerce .button:hover,
.woocommerce #review_form #respond .form-submit input:hover {
	background-color: white !important;
	color: var(--primary-color) !important;
	border: 1px solid var(--primary-color) !important;
}

.woocommerce .onsale {
	background-color: var(--primary-color) !important;
}

.woocommerce .quantity .qty {
	height: 38px;
}

.woocommerce ul.products li.product .button {
	margin-top: 0.2em;
}

.rtl .woocommerce .col2-set .col-1, .rtl .woocommerce-page .col2-set .col-1 {
	float: right;
	margin: 10px;
}

.rtl .woocommerce .col2-set .col-2, .rtl .woocommerce-page .col2-set .col-2 {
	margin: 10px;
}

form.woocommerce-form.woocommerce-form-login.login {
	padding-bottom: 55px;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
	background-color: var(--primary-color);
	text-align: center;
	border-radius: var(--border-radius);
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
	color: white !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	list-style: none;
	padding: 10px;
}

.woocommerce-loop-product__title {
	font-size: 1.3em !important;
}

.woocommerce-orders-table__cell-order-actions a {
	margin: 9px 0px !important;
}

.woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce ul.products li.product .price {
	color: var(--primary-color) !important;
}

.woocommerce .woocommerce-ordering select {
    padding: 7px 5px;
}

@media only screen and (max-width: 768px) {
	.woocommerce-checkout input#coupon_code,
	.woocommerce-cart input#coupon_code {
		width: 100%;
		display: block;
		margin-bottom: 10px;
	}

	.coupon button.button {
		width: 100% !important;
	}

	.woocommerce-form-coupon .form-row {
		width: 100% !important;
	}

	.woocommerce .col2-set, .woocommerce-page .col2-set {
		width: 94%;
	}

	.woocommerce-form-coupon .form-row button {
		width: 100% !important;
	}

	.woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering {
		float: right;
	}
}