@charset "UTF-8";
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Mixins
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/
/* Box sizing
--------------------------------------------- */
/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/
/* Typography
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
  color: #404040;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
}

/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Mixins
--------------------------------------------------------------*/
dfn,
cite,
em,
i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5em;
  padding: 1em;
  background: #FFFFFE;
}

blockquote p {
  margin-bottom: 0;
}

address {
  margin: 0 0 1.5em;
}

pre {
  background: #eee;
  font-family: "Courier 10 Pitch", courier, monospace;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code,
kbd,
tt,
var {
  font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
  border-bottom: 1px dotted #E5E7EB;
  cursor: help;
}

mark,
ins {
  background: #fff9c0;
  text-decoration: none;
}

big {
  font-size: 125%;
}

/* Elements
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
html, body {
  height: 100%;
}

body {
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  background: #FFFFFE;
}
body main {
  flex: 1;
  padding: 0;
}
body main.no-sidebar {
  padding: 0 !important;
}
body .hea-theme-builder-wrapper {
  padding: 1.8em 0em;
}
body .site main,
body .site .category-page, body .single main,
body .single .category-page {
  flex: 1;
  padding: 1.8em 0em;
}
@media (max-width: 576px) {
  body .site main,
  body .site .category-page, body .single main,
  body .single .category-page {
    padding: 1em 0.8em;
  }
}
body .site .category-page, body .single .category-page {
  padding: 0;
}
body .site .category-page .content, body .single .category-page .content {
  padding: 0 0;
}

/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
hr {
  background-color: #ccc;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

ul,
ol {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

ul {
  list-style: inherit;
}

ol {
  list-style: inherit;
}

li > ul,
li > ol {
  margin-bottom: 0;
  margin-left: 1.5em;
}

dt {
  font-weight: 700;
}

dd {
  margin: 0 1.5em 1.5em;
}

.wp-block-list {
  display: flex;
  flex-direction: column;
  margin-bottom: 14px;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

img {
  height: auto;
  max-width: 100%;
}

figure {
  margin: 0;
}

.wp-block-image {
  margin-bottom: 1em;
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/* Links
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
a {
  color: #4169e1;
  text-decoration: none !important;
}
a:visited {
  color: currentColor;
}
a:hover, a:focus, a:active {
  color: #191970;
}
a:focus {
  outline: thin dotted;
}
a:hover, a:active {
  outline: 0;
}

/* Forms
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
button,
input[type=button],
input[type=reset],
input[type=submit],
.wp-block-search__button,
.wp-block-button__link {
  border: 1px solid;
  line-height: normal;
  font-weight: 600;
  color: #FFFFFE;
  border-color: #ccc #ccc #bbb;
  border-radius: 0;
  background: #4169e1;
  transition: 0.3s ease-in;
  display: block;
  text-align: center;
  padding: 16px 28px;
}
button:hover,
input[type=button]:hover,
input[type=reset]:hover,
input[type=submit]:hover,
.wp-block-search__button:hover,
.wp-block-button__link:hover {
  color: #111827;
  background: #FFFFFE;
  border-color: #ccc #bbb #aaa;
}
button:active, button:focus,
input[type=button]:active,
input[type=button]:focus,
input[type=reset]:active,
input[type=reset]:focus,
input[type=submit]:active,
input[type=submit]:focus,
.wp-block-search__button:active,
.wp-block-search__button:focus,
.wp-block-button__link:active,
.wp-block-button__link:focus {
  border-color: #aaa #bbb #bbb;
}

.btn-close:hover {
  opacity: 100%;
}

.read-time .btn-read-more-arrow {
  font-size: 1em;
  font-weight: 500;
  text-transform: uppercase;
  color: #4169e1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.read-time i {
  font-size: 1.2em;
  color: #4169e1;
}

/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
input[type=text],
input[type=email],
input[type=url],
input[type=password],
input[type=search],
input[type=number],
input[type=tel],
input[type=range],
input[type=date],
input[type=month],
input[type=week],
input[type=time],
input[type=datetime],
input[type=datetime-local],
input[type=color],
textarea {
  color: #666;
  border-radius: 0.375em;
  padding: 0.375em 0.75em;
  border: 1px solid #ccc;
  border-radius: 0;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=password]:focus,
input[type=search]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=range]:focus,
input[type=date]:focus,
input[type=month]:focus,
input[type=week]:focus,
input[type=time]:focus,
input[type=datetime]:focus,
input[type=datetime-local]:focus,
input[type=color]:focus,
textarea:focus {
  color: #111;
}

label {
  font-family: "Instrument Sans";
  font-weight: 500;
  font-size: 0.875em;
  margin-bottom: 0.5em;
}

select {
  border: 1px solid #ccc;
}

textarea {
  width: 100%;
}

.wp-block-search__label {
  margin-bottom: 0.6em;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/
/* Navigation
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
header.header-main {
  width: 100%;
  padding: 24px 0;
  background-color: #FFFFFE;
  z-index: 1000;
  position: relative;
  border-bottom: 1px solid #E5E7EB;
}
@media screen and (max-width: 768px) {
  header.header-main {
    padding: 8px 12px;
  }
}
header.header-main .site-title a {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111827;
  text-decoration: none;
  text-transform: capitalize;
}
header.header-main ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.huda-mobile-toggle {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 30px;
  height: 20px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  z-index: 1100;
}
.huda-mobile-toggle .hamburger-line {
  width: 100%;
  height: 2px;
  background-color: #111827;
  transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.huda-mobile-toggle.active .hamburger-line:nth-child(1) {
  transform: translateY(9px) rotate(45deg);
}
.huda-mobile-toggle.active .hamburger-line:nth-child(2) {
  opacity: 0;
}
.huda-mobile-toggle.active .hamburger-line:nth-child(3) {
  transform: translateY(-9px) rotate(-45deg);
}

@media (min-width: 992px) {
  .huda-theme-menu {
    display: flex;
    align-items: center;
    gap: 2rem;
  }
  .huda-theme-menu li {
    position: relative;
  }
  .huda-theme-menu li a {
    display: block;
    padding: 0;
    color: #111827;
    text-decoration: none;
    font-weight: 500;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .huda-theme-menu li a:hover {
    color: #4169e1;
  }
  .huda-theme-menu li.menu-item-has-children > a::after {
    content: "\ea4e";
    font-family: "remixicon";
    margin-left: 5px;
    font-size: 0.8rem;
    vertical-align: middle;
  }
  .huda-theme-menu li .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 230px;
    background: #FFFFFE;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 99;
  }
  .huda-theme-menu li .sub-menu li {
    width: 100%;
  }
  .huda-theme-menu li .sub-menu li a {
    padding: 8px 20px;
    font-size: 0.95rem;
  }
  .huda-theme-menu li .sub-menu li a:hover {
    background: rgba(65, 105, 225, 0.05);
  }
  .huda-theme-menu li .sub-menu li .sub-menu {
    top: 0;
    left: 100%;
    margin-top: -10px;
  }
  .huda-theme-menu li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
}
@media (max-width: 991px) {
  .huda-menu-container {
    position: fixed;
    top: 0;
    left: -100%;
    width: 300px;
    height: 100vh;
    background: #FFFFFE;
    box-shadow: 10px 0 30px rgba(0, 0, 0, 0.1);
    padding: 80px 20px 40px;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1050;
    overflow-y: auto;
  }
  .huda-menu-container.is-open {
    left: 0;
  }
  .huda-theme-menu {
    flex-direction: column;
  }
  .huda-theme-menu li {
    border-bottom: 1px solid #4D3E3B;
  }
  .huda-theme-menu li a {
    padding: 12px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .huda-theme-menu li .sub-menu {
    display: none;
    padding-left: 15px;
    background: rgba(0, 0, 0, 0.02);
  }
  .huda-theme-menu li .sub-menu.submenu-open {
    display: block;
  }
  .huda-theme-menu li.menu-item-has-children > a::after {
    content: "\ea4e";
    font-family: "remixicon";
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .huda-theme-menu li.active-child > a::after {
    transform: rotate(180deg);
  }
}
.huda-header-icons-wrapper i {
  font-size: 24px;
  color: #111827;
  transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.huda-header-icons-wrapper .woo-cart-count {
  position: absolute;
  top: 6px;
  right: -5px;
  background: #4169e1;
  color: #fff;
  font-size: 10px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Navigation
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
.main-navigation {
  display: block;
  width: 100%;
}
.main-navigation ul {
  display: none;
  list-style: none;
  margin: 0;
  padding-left: 0;
}
.main-navigation ul ul {
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
  float: left;
  position: absolute;
  top: 100%;
  left: -999em;
  z-index: 99999;
}
.main-navigation ul ul ul {
  left: -999em;
  top: 0;
}
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {
  display: block;
  left: auto;
}
.main-navigation ul ul a {
  width: 200px;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
  left: auto;
}
.main-navigation li {
  position: relative;
}
.main-navigation a {
  display: block;
  text-decoration: none;
}
/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
  display: block;
}

@media screen and (min-width: 37.5em) {
  .menu-toggle {
    display: none;
  }
  .main-navigation ul {
    display: flex;
  }
}
.single-post-navigation-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1em;
}
@media (max-width: 576px) {
  .single-post-navigation-wrapper {
    flex-wrap: wrap;
  }
}
.single-post-navigation-wrapper.stikcy-element {
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  padding: 2em;
  background-color: #FFFFFE;
  z-index: 99;
}

@media (max-width: 768px) {
  .posts-navigation {
    flex-wrap: wrap;
  }
}

nav.navigation.pagination {
  justify-content: center;
}
nav.navigation.pagination .nav-links {
  padding: 0.96em 1.2em;
  border-radius: 50px;
  margin: 0 auto;
  background: #FFFFFE;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2em;
}
nav.navigation.pagination .nav-links .page-numbers.current {
  width: 30px;
  height: 30px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFE;
  background-color: #4169e1;
}
nav.navigation.pagination .nav-links .fa-arrow-right {
  transform: rotate(320deg);
}
nav.navigation.pagination .nav-links .fa-arrow-left {
  transform: rotate(45deg);
}
nav.previous-post, nav.next-post {
  width: 400px;
  padding: 1.25em 1.5em;
  border: 1px solid #E5E7EB;
  margin-top: 1em;
}
@media screen and (max-width: 768px) {
  nav.previous-post, nav.next-post {
    width: 100%;
  }
}
nav.previous-post .content, nav.next-post .content {
  width: 100%;
  height: auto;
  background-color: #FFFFFE;
}
@media screen and (max-width: 768px) {
  nav.previous-post .content, nav.next-post .content {
    max-width: 100%;
    padding: 0;
  }
}
nav.previous-post .content a, nav.next-post .content a {
  color: #111827 !important;
}
nav.previous-post .next-post-image img,
nav.previous-post .prevoius-post-image img, nav.next-post .next-post-image img,
nav.next-post .prevoius-post-image img {
  max-width: 100%;
  height: auto;
  border-radius: 0;
}
nav.previous-post a.link, nav.next-post a.link {
  font-family: "Space Grotesk";
  font-weight: 600;
  font-size: 1.2em;
}
nav.previous-post a.link span, nav.previous-post a.link i, nav.next-post a.link span, nav.next-post a.link i {
  font-weight: 400;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
  padding: 1em 0;
  border-top: 1px solid #E5E7EB;
}
@media (max-width: 576px) {
  .site-main .comment-navigation,
  .site-main .posts-navigation,
  .site-main .post-navigation {
    padding-bottom: 0;
    margin-bottom: 0 !important;
  }
}
.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
  display: flex;
  margin-top: 2em;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
  flex: 1 0 50%;
  text-align: center;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
  text-align: end;
  flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
  display: block;
}

header.page-header {
  text-align: left;
  padding-bottom: 1em;
}
@media screen and (max-width: 576px) {
  header.page-header {
    text-align: center;
  }
}
header.page-header h1.page-title {
  font-size: 2.75em;
  color: #111827;
  margin-bottom: 0;
}
@media screen and (max-width: 768px) {
  header.page-header h1.page-title {
    font-size: 2em;
  }
}
header.page-header .archive-description {
  margin-bottom: 0;
}

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

.sidebar-layout {
  padding: 2.5em 0 !important;
}
.sidebar-layout aside {
  padding-left: 1em;
}
@media screen and (max-width: 768px) {
  .sidebar-layout aside {
    padding: 0em 1.8em;
  }
}
.sidebar-layout .article-single {
  padding-bottom: 0;
}
.sidebar-layout .article-single p {
  margin-bottom: 1em !important;
}
@media screen and (max-width: 768px) {
  .sidebar-layout .article-single {
    padding: 2.5em 1.8em;
  }
}
.sidebar-layout article p,
.sidebar-layout article ul,
.sidebar-layout article ol {
  font-size: 1.25em;
}
.sidebar-layout article .article-content {
  padding-top: 1em;
}
.sidebar-layout .comments-area {
  padding: 0;
  background-color: transparent;
}
.sidebar-layout .comments-area .comment-respond {
  width: 100%;
}
.sidebar-layout .comments-area .comments-title,
.sidebar-layout .comments-area .comment-list {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .sidebar-layout .social-share,
  .sidebar-layout .comments-area {
    padding: 0 1.83em;
  }
}
.sidebar-layout .related-posts {
  padding-top: 1em;
}
@media screen and (max-width: 768px) {
  .sidebar-layout .related-posts {
    padding: 1em 1.8em;
  }
}

section.page-hero-section {
  width: 100%;
  text-align: center;
  padding: 5rem 2rem;
  background-color: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 4rem;
}
@media screen and (max-width: 576px) {
  section.page-hero-section {
    padding: 3.5rem 1rem;
    margin-bottom: 2.5rem;
  }
}
section.page-hero-section .hero-title {
  font-size: 2.75rem;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 1rem;
  letter-spacing: -0.02em;
  text-transform: capitalize;
}
@media screen and (max-width: 768px) {
  section.page-hero-section .hero-title {
    font-size: 2.2rem;
  }
}
section.page-hero-section .hero-description p {
  font-size: 1.1rem;
  color: #64748b;
  margin: 0 auto;
  line-height: 1.6;
  font-weight: 400;
}
section.featured-section,
section .hero-section {
  width: 100%;
  text-align: center;
  padding: 2em;
}
section.featured-section p,
section .hero-section p {
  margin-bottom: 1em;
  text-align: center;
}
@media screen and (max-width: 576px) {
  section.featured-section,
  section .hero-section {
    padding: 1em;
    padding-bottom: 0;
  }
}
section .comments-area {
  margin-top: 2em;
}
@media screen and (max-width: 768px) {
  section .social-share {
    padding: 0 2em;
  }
}

.updated:not(.published) {
  display: none;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 1.5em 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

.post-categories {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6em;
}
.post-categories span.category a {
  font-size: 1em;
  color: #4169e1;
  text-transform: uppercase;
}

body.search form.huda-search-form {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
}
body.search form.huda-search-form input {
  padding: 0.5em 1.5em;
}

.social-share {
  background: #FFFFFE;
}
.social-share a {
  cursor: pointer;
}
.social-share a i {
  font-size: 18px;
  padding: 0.4em;
  color: #111827;
  border: 1px solid #E5E7EB;
}

section.no-results h1,
section.no-results p, section.error-404 h1,
section.error-404 p {
  text-align: center;
}
section.no-results a, section.error-404 a {
  color: #4169e1;
}
section.no-results .nothing-found-img-wrapper, section.error-404 .nothing-found-img-wrapper {
  text-align: center;
}
section.no-results .nothing-found-img-wrapper img, section.error-404 .nothing-found-img-wrapper img {
  width: 100%;
  max-width: 36%;
  margin: 1.2em auto;
}
section.no-results button.btn-outline, section.error-404 button.btn-outline {
  color: #111827;
  background-color: #FFFFFE;
  border-color: #E5E7EB;
}
section.no-results button.btn-outline:hover, section.error-404 button.btn-outline:hover {
  color: #FFFFFE;
  border-color: #4169e1;
  background-color: #4169e1;
}

/* =========================================
   Modern Blog Card Styles
   ========================================= */
.huda-blog-card {
  background-color: #FFFFFE;
  border: 1px solid #E5E7EB;
  border-radius: 16px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
}
.huda-blog-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.huda-blog-card .huda-card-image-wrapper {
  position: relative;
  width: 100%;
  height: 240px;
  background-color: #F7F7F7;
  overflow: hidden;
}
.huda-blog-card .huda-card-image-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.5s ease;
}
.huda-blog-card .huda-card-image-wrapper:hover img {
  transform: scale(1.05);
}
.huda-blog-card .huda-card-badge {
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 10;
}
.huda-blog-card .huda-card-badge .badge-link {
  display: inline-block;
  background-color: #E0E7FF;
  color: #4169e1;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 50px;
  text-decoration: none;
  text-transform: capitalize;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease;
}
.huda-blog-card .huda-card-badge .badge-link:hover {
  background-color: #4169e1;
  color: #FFFFFE;
}
.huda-blog-card .huda-card-body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.huda-blog-card .huda-card-body .huda-card-meta {
  margin-bottom: 0.75rem;
}
.huda-blog-card .huda-card-body .huda-card-meta .posted-date {
  color: #667085;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  gap: 8px;
}
.huda-blog-card .huda-card-body .huda-card-meta .posted-date::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23667085' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.huda-blog-card .huda-card-body .entry-title {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 0;
}
.huda-blog-card .huda-card-body .entry-title a {
  color: #111827;
  text-decoration: none;
  transition: color 0.2s;
}
.huda-blog-card .huda-card-body .entry-title a:hover {
  color: #4169e1;
}
.huda-blog-card .huda-card-body .entry-summary p {
  font-size: 0.95rem;
  color: #667085;
  line-height: 1.6;
  margin-bottom: 8px;
  margin-top: 4px !important;
}
.huda-blog-card .huda-card-body .read-more-link {
  margin-top: auto;
  color: #4169e1;
  font-weight: 600;
  text-decoration: none;
  font-size: 0.95rem;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.huda-blog-card .huda-card-body .read-more-link::after {
  content: "→";
  font-family: sans-serif;
  transition: transform 0.2s;
}
.huda-blog-card .huda-card-body .read-more-link:hover {
  color: #191970;
}
.huda-blog-card .huda-card-body .read-more-link:hover::after {
  transform: translateX(4px);
}

/* =========================================
   Single Post Styles (Cleaned up)
   ========================================= */
.single-post-wrapper {
  padding: 60px 0;
}
.single-post-wrapper .entry-header .entry-title {
  font-size: 3.5rem;
  line-height: 1.2;
  color: #111827;
  letter-spacing: -1px;
}
.single-post-wrapper .entry-header .entry-meta {
  color: #667085;
  font-size: 0.95rem;
}
.single-post-wrapper .entry-header .entry-meta .meta-divider {
  width: 4px;
  height: 4px;
  background: #cbd5e0;
  border-radius: 50%;
  margin: 0 15px;
}
.single-post-wrapper .entry-header .entry-meta .meta-author {
  font-weight: 600;
  color: #111827;
}
.single-post-wrapper .entry-header .entry-meta .meta-item i {
  margin-right: 5px;
  color: #4169e1;
}
.single-post-wrapper .post-featured-image img {
  max-width: 100%;
  max-height: 600px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0;
}
.single-post-wrapper .single-post-layout > p:first-of-type::first-letter {
  float: left;
  font-size: 4.5rem;
  line-height: 1;
  padding-right: 12px;
  padding-top: 4px;
  color: #4169e1;
  font-weight: 800;
  font-family: serif;
}
.single-post-wrapper .single-post-layout p {
  font-size: 1.15rem;
  line-height: 1.8;
  color: #667085;
  margin-bottom: 1.5rem;
}
.single-post-wrapper .single-post-layout blockquote {
  background-color: #f1f1f1;
  border-left: 4px solid #4169e1;
  padding: 30px;
  margin: 40px 0;
  font-size: 1.3rem;
  font-style: italic;
  color: #404040;
  border-radius: 0 8px 8px 0;
}
.single-post-wrapper .single-post-layout blockquote p {
  margin-bottom: 0;
}
.single-post-wrapper .single-post-layout h2,
.single-post-wrapper .single-post-layout h3 {
  color: #111827;
  font-weight: 700;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}
.single-post-wrapper .author-bio-card {
  background: #F4F4F4;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
}
.single-post-wrapper .author-bio-card h4 {
  font-weight: 700;
  text-transform: capitalize;
  color: #111827;
}
.single-post-wrapper .author-bio-card small {
  font-size: 14px;
  font-weight: 300;
  padding: 4px 14px;
  border-radius: 50px;
  border: 1px solid #E5E7EB;
  background-color: #FFFFFE;
}
.single-post-wrapper .post-navigation-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 48px;
}
@media (max-width: 768px) {
  .single-post-wrapper .post-navigation-wrapper {
    flex-direction: column;
  }
}
.single-post-wrapper .post-navigation-wrapper .nav-box {
  flex: 1;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a {
  display: block;
  text-decoration: none;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 25px;
  transition: all 0.3s ease;
  background: #ffffff;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a .nav-inner {
  display: flex;
  align-items: center;
  gap: 15px;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a .nav-icon {
  width: 50px;
  height: 50px;
  background-color: #f8fafc;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 20px;
  transition: all 0.3s ease;
  flex-shrink: 0;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a .nav-content {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /* Prevents long titles from breaking layout */
}
.single-post-wrapper .post-navigation-wrapper .nav-box a .nav-content .nav-label {
  font-size: 13px;
  color: #94a3b8;
  margin-bottom: 4px;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a .nav-content .nav-title {
  font-size: 18px;
  font-weight: 700;
  color: #1a202c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.3s ease;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a {
  /* Hover State Logic */
}
.single-post-wrapper .post-navigation-wrapper .nav-box a:hover {
  border-color: #2563eb;
  box-shadow: 0 10px 15px -3px rgba(37, 99, 235, 0.1);
}
.single-post-wrapper .post-navigation-wrapper .nav-box a:hover .nav-title {
  color: #2563eb;
}
.single-post-wrapper .post-navigation-wrapper .nav-box a:hover .nav-icon {
  background-color: #2563eb;
  color: #ffffff;
}
.single-post-wrapper .post-navigation-wrapper {
  /* Alignment specifically for Next post */
}
.single-post-wrapper .post-navigation-wrapper .next-post .nav-inner {
  justify-content: flex-end;
  text-align: right;
}
.single-post-wrapper .similar-articles-wrapper {
  margin: 60px 0;
  padding: 80px 20px;
  background-color: #F9FAFB;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .related-section-title {
  font-size: 24px;
  font-weight: 700;
  color: #1a202c;
  margin-bottom: 30px;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  overflow: hidden;
  height: 100%;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-thumbnail-link {
  display: block;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-thumbnail-link .card-image-wrapper {
  height: 220px;
  overflow: hidden;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-thumbnail-link .card-image-wrapper img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content {
  padding: 24px;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content .card-meta-top {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content .card-meta-top .card-category-badge {
  background: #ebf4ff;
  color: #3182ce;
  font-size: 14px;
  font-weight: 500;
  padding: 4px 16px;
  border-radius: 50px;
  text-transform: capitalize;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content .card-meta-top .card-post-date {
  font-size: 14px;
  color: #718096;
  margin-left: 12px;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content .card-title-link {
  text-decoration: none;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content .card-title-link .card-post-title {
  font-size: 20px;
  font-weight: 700;
  color: #1a202c;
  line-height: 1.4;
  margin: 0;
  transition: color 0.2s ease;
}
.single-post-wrapper .similar-articles-wrapper .related-posts-section .huda-related-card .card-body-content .card-title-link .card-post-title:hover {
  color: #3182ce;
}
@media (max-width: 768px) {
  .single-post-wrapper .related-posts-section .huda-related-card .card-thumbnail-link .card-image-wrapper {
    height: 200px;
  }
  .single-post-wrapper .related-posts-section .card-post-title {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .single-post-wrapper .entry-header .entry-title {
    font-size: 2.2rem;
  }
  .author-bio-card {
    flex-direction: column;
    text-align: center;
  }
  .author-bio-card .author-avatar {
    margin: 0 0 15px 0;
  }
}
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
/**
 * Gutenberg Block Styles
 * Basic styles for WordPress default blocks when Gutenberg CSS is disabled.
 */
/* Blockquote
--------------------------------------------- */
blockquote {
  border-left: 4px solid #4169e1;
  margin: 1.5em 0;
  padding: 0.5em 1.5em;
  font-style: italic;
}
blockquote cite {
  display: block;
  margin-top: 0.5em;
  font-size: 0.8em;
  font-style: normal;
  color: #94a3b8;
}
blockquote cite::before {
  content: "— ";
}

/* Tables
--------------------------------------------- */
.wp-block-table {
  margin: 0 0 1.5em;
  width: 100%;
  border-collapse: collapse;
}
.wp-block-table th,
.wp-block-table td {
  padding: 0.75em;
  border: 1px solid #E5E7EB;
  text-align: left;
}
.wp-block-table thead {
  background-color: #F7F7F7;
}
.wp-block-table thead th {
  font-weight: 700;
}
.wp-block-table figcaption {
  margin-top: 0.5em;
  font-size: 0.85em;
  color: #94a3b8;
  text-align: center;
}

/* Image Block
--------------------------------------------- */
.wp-block-image {
  margin: 0 0 1.5em;
}
.wp-block-image img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
}
.wp-block-image.aligncenter {
  text-align: center;
}
.wp-block-image.aligncenter img {
  margin-left: auto;
  margin-right: auto;
}
.wp-block-image.alignleft {
  float: left;
  margin-right: 1.5em;
}
.wp-block-image.alignright {
  float: right;
  margin-left: 1.5em;
}
.wp-block-image figcaption {
  margin-top: 0.5em;
  font-size: 0.85em;
  color: #94a3b8;
  text-align: center;
}

/* Separator
--------------------------------------------- */
.wp-block-separator {
  border: none;
  border-bottom: 2px solid #E5E7EB;
  margin: 2em auto;
  max-width: 100px;
}
.wp-block-separator.is-style-wide {
  max-width: 100%;
}
.wp-block-separator.is-style-dots {
  border-bottom: none;
  text-align: center;
  height: auto;
  line-height: 1;
}
.wp-block-separator.is-style-dots::before {
  content: "···";
  color: #94a3b8;
  font-size: 1.5em;
  letter-spacing: 0.5em;
}

/* Lists
--------------------------------------------- */
.wp-block-list {
  margin-bottom: 1.5em;
  padding-left: 1.5em;
}

/* Embeds (Responsive)
--------------------------------------------- */
.wp-block-embed {
  margin-bottom: 1.5em;
}
.wp-block-embed .wp-block-embed__wrapper {
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 Aspect Ratio */
  height: 0;
  overflow: hidden;
}
.wp-block-embed .wp-block-embed__wrapper iframe,
.wp-block-embed .wp-block-embed__wrapper object,
.wp-block-embed .wp-block-embed__wrapper embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Code & Preformatted
--------------------------------------------- */
.wp-block-code,
pre.wp-block-preformatted {
  background-color: #eee;
  padding: 1em;
  border-radius: 4px;
  font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
  font-size: 0.9em;
  overflow-x: auto;
  margin-bottom: 1.5em;
}

/* Comments
--------------------------------------------- */
.comments-area .comment-respond {
  border-radius: 20px;
  padding: 40px;
  margin-top: 40px;
  border: 1px solid #E5E7EB;
  background: #FFFFFE;
}
.comments-area .comment-respond .comment-reply-title {
  font-size: 24px;
  font-weight: 700;
  color: #374151;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.comments-area .comments-title {
  margin-bottom: 32px;
}
.comments-area {
  /* The actual list (ol) */
}
.comments-area .comment-list {
  list-style: none !important;
  padding: 0;
  margin-top: 48px;
}
.comments-area .comment-list li.single-comment-card-wrapper {
  margin-bottom: 24px;
  /* The card structure */
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 30px;
  display: flex;
  align-items: flex-start;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-avatar {
  flex-shrink: 0;
  margin-right: 20px;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-avatar img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  -o-object-fit: cover;
     object-fit: cover;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main {
  flex: 1;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-meta {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-meta .author-name {
  font-size: 18px;
  font-weight: 700;
  color: #1a202c;
  margin-right: 12px;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-meta .comment-date {
  font-size: 14px;
  color: #94a3b8;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-text-area {
  font-size: 16px;
  line-height: 1.7;
  color: #4a5568;
  margin-bottom: 15px;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-text-area p:last-child {
  margin-bottom: 0;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-footer .comment-reply-link {
  font-size: 15px;
  font-weight: 600;
  color: #2563eb;
  text-decoration: none;
  transition: color 0.2s ease;
}
.comments-area .comment-list li.single-comment-card-wrapper .comment-card-body .comment-content-main .comment-footer .comment-reply-link:hover {
  color: #1d4ed8;
  text-decoration: underline;
}
.comments-area .comment-list li.single-comment-card-wrapper {
  /* Threaded / Nested Replies */
}
.comments-area .comment-list li.single-comment-card-wrapper .children {
  list-style: none;
  padding-left: 60px;
  margin-top: 24px;
}
@media (max-width: 576px) {
  .comments-area .comment-list li.single-comment-card-wrapper .children {
    padding-left: 20px;
  }
}
.comments-area .comment-list li.single-comment-card-wrapper .children .single-comment-card-wrapper {
  margin-bottom: 15px;
}
.comments-area .huda-comment-form .huda-form-row {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .comments-area .huda-comment-form .huda-form-row {
    flex-direction: column;
  }
}
.comments-area .huda-comment-form .huda-form-row .comment-form-column {
  flex: 1;
}
.comments-area .huda-comment-form .comment-form-full {
  width: 100%;
  margin-bottom: 20px;
}
.comments-area .huda-comment-form label {
  display: block;
  font-weight: 600;
  font-size: 14px;
  color: #374151;
  margin-bottom: 8px;
}
.comments-area .huda-comment-form .input-wrapper {
  position: relative;
  width: 100%;
}
.comments-area .huda-comment-form .input-wrapper .field-icon {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: #6b7280;
  font-size: 20px;
  pointer-events: none;
  z-index: 10;
}
.comments-area .huda-comment-form .input-wrapper.textarea-wrapper .field-icon {
  top: 14px;
  transform: none;
}
.comments-area .huda-comment-form .input-wrapper input, .comments-area .huda-comment-form .input-wrapper textarea {
  width: 100%;
  background-color: #FFFFFE;
  border: 1px solid #ccc;
  border-radius: 12px;
  padding: 14px 15px 14px 48px;
  font-size: 16px;
  color: #374151;
  outline: none;
  transition: all 0.2s ease;
}
.comments-area .huda-comment-form .input-wrapper input::-moz-placeholder, .comments-area .huda-comment-form .input-wrapper textarea::-moz-placeholder {
  color: #a0aec0;
}
.comments-area .huda-comment-form .input-wrapper input::placeholder, .comments-area .huda-comment-form .input-wrapper textarea::placeholder {
  color: #a0aec0;
}
.comments-area .huda-comment-form .input-wrapper input:focus, .comments-area .huda-comment-form .input-wrapper textarea:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
}
.comments-area .huda-comment-form .input-wrapper textarea {
  min-height: 160px;
}
.comments-area .huda-comment-form .comment-form-cookies-consent {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 25px;
  color: #4a5568;
  font-size: 14px;
}
.comments-area .huda-comment-form .comment-form-cookies-consent input[type=checkbox] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.comments-area .huda-comment-form .submit-btn {
  background-color: #2563eb;
  color: #ffffff;
  border: none;
  padding: 14px 35px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 12px;
  cursor: pointer;
  transition: background 0.3s;
}
.comments-area .huda-comment-form .submit-btn:hover {
  background-color: #1d4ed8;
}

/* Widgets
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
.widget {
  margin: 0 0 0;
}
.widget select {
  max-width: 100%;
}
.widget.widget_text a {
  color: #4169e1 !important;
}

.offcanvas.main .offcanvas-header .site-title a {
  color: #111827 !important;
}
.offcanvas.main .offcanvas-header {
  border-bottom: 1px solid #E5E7EB;
}
.offcanvas.main .offcanvas-header .wp-block-image {
  margin-bottom: 0;
}
.offcanvas.main .offcanvas-title {
  line-height: 0 !important;
}
.offcanvas.main span {
  font-size: 14px;
}
.offcanvas.main .dropdown .dropdown-menu {
  top: 0 !important;
  position: relative !important;
  margin-top: 0 !important;
  margin-bottom: 1em !important;
  transform: translateY(1em) !important;
}
.offcanvas.main .offcanvas-footer {
  padding: 1em;
  border-top: 1px solid #E5E7EB;
}

aside {
  width: 100%;
  height: 100%;
  padding-left: 1em;
  display: flex;
  flex-direction: column;
  gap: 1em;
}
aside.widget-area {
  position: sticky;
  top: 0;
}
aside.widget-area ul.wp-block-categories-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8em;
}
aside.widget-area ul.wp-block-categories-list li.cat-item {
  padding: 8px 16px;
  border-radius: 0;
  background-color: #FFFFFE;
}
aside.widget-area ul.wp-block-categories-list li.cat-item a {
  color: #111827;
}
aside.widget-area ul.wp-block-categories-list li.cat-item #text {
  background-color: #F25F4C;
}
aside.widget-area ul li {
  display: flex;
  align-items: start;
  justify-content: start;
  margin-bottom: 1em;
  border-bottom: 1px solid #E5E7EB;
  padding-bottom: 1em;
  gap: 0.6em;
}
aside.widget-area ul li span.post_count {
  width: 22px;
  height: 22px;
  font-size: 14px;
  color: #FFFFFE;
  border-radius: 50px;
  background: #F25F4C;
  text-align: center;
}
aside.widget-area ul li a.wp-block-latest-posts__post-title {
  color: #111827;
}
aside.widget-area ul li img {
  border-radius: 4px;
}
aside.widget-area .widget_tag_cloud p {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.8em;
}
aside.widget-area .widget_tag_cloud a.tag-cloud-link {
  font-size: 1em !important;
  color: #111827;
  padding: 8px 16px;
  border-radius: 50px;
  background-color: #FFFFFE;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
}
aside.widget-area .widget_tag_cloud a.tag-cloud-link span.tags_count {
  width: 22px;
  height: 22px;
  font-size: 14px;
  color: #FFFFFE;
  border-radius: 50px;
  background: #F25F4C;
  text-align: center;
}

.wp-block-search__inside-wrapper {
  display: flex;
  gap: 0.6em;
}

.offcanvas.search-wrapper {
  height: -moz-max-content;
  height: max-content;
  padding-bottom: 6em;
}

.search-form-wrapper {
  width: 800px;
  position: relative;
  margin: 0 auto;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper {
    width: 100%;
  }
}
.search-form-wrapper article.search {
  width: 100%;
  display: flex;
  align-items: start;
  justify-content: start;
  gap: 16px;
  background: #F4F4F4;
  padding-bottom: 1em;
  border-bottom: 1px solid #E5E7EB;
  padding: 14px;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper article.search {
    flex-direction: column !important;
  }
}
.search-form-wrapper article.search .woo-product-image {
  width: 20%;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper article.search .woo-product-image {
    width: 100%;
  }
}
.search-form-wrapper article.search a {
  font-size: 1.4em;
  font-weight: 500;
  margin-bottom: 0.5em;
}
.search-form-wrapper article.search a.post-thumbnail {
  width: 20%;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper article.search a.post-thumbnail {
    width: 100%;
  }
}
.search-form-wrapper article.search a.post-thumbnail img {
  max-width: 140px;
  max-height: 140px;
  border-radius: 0;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper article.search a.post-thumbnail img {
    max-width: 100%;
    max-height: 100%;
  }
}
.search-form-wrapper article.search .post-content {
  width: 80%;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper article.search .post-content {
    width: 100%;
  }
}
.search-form-wrapper article.search .posted-on {
  font-size: 14px;
}
.search-form-wrapper form {
  margin-top: 2.5em;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper form {
    margin-top: 1em;
  }
}
.search-form-wrapper form.huda-search-form {
  width: 100%;
  text-align: center;
}
.search-form-wrapper form.huda-search-form input {
  width: 100%;
  padding: 0.75em 1.25em;
  border-radius: 0;
  border: 1px solid #E5E7EB;
  color: #111827;
}
.search-form-wrapper .search-result-wrapper {
  width: 100%;
}
.search-form-wrapper .search-result-wrapper #datafetch {
  width: 100%;
  margin: 0 auto;
  background-color: #FFFFFE;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  border-radius: 0;
}
@media screen and (max-width: 576px) {
  .search-form-wrapper .search-result-wrapper #datafetch {
    flex-wrap: wrap;
  }
}
.search-form-wrapper .search-result-wrapper #datafetch h3 {
  margin: 1em 0;
}
.search-form-wrapper .search-result-wrapper #datafetch .search-wrapper {
  padding: 0;
}
.search-form-wrapper .search-result-wrapper #datafetch article {
  text-align: left;
  flex-direction: row;
  background-color: transparent;
}
@media screen and (max-width: 768px) {
  .search-form-wrapper .search-result-wrapper #datafetch article {
    width: 100%;
  }
}
@media screen and (max-width: 576px) {
  .search-form-wrapper .search-result-wrapper #datafetch article {
    width: 100%;
    margin: 0;
    margin-top: 0.6em;
  }
}

body.search header.page-header h1.page-title {
  font-size: 3em;
  text-align: center;
}
body.search form.search-form {
  text-align: center;
}
body.search form.search-form input {
  padding: 12px 28px;
}

.sticky {
  position: sticky;
  top: 0;
}

.relative {
  position: relative;
}

.backto-top {
  position: fixed;
  width: 2.375em;
  height: 2.375em;
  bottom: 2em;
  right: 2em;
  background: #4169e1;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.backto-top i {
  font-size: 1.25em;
}

/* =================================================================
  HUDA SEARCH MODAL STYLES
================================================================= */
.huda-search-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(17, 24, 39, 0.95);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 10vh;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1);
}
.huda-search-modal-overlay.active {
  opacity: 1;
  visibility: visible;
}

.huda-search-modal-container {
  width: 90%;
  max-width: 1000px;
  background: #FFFFFE;
  border-radius: 16px;
  overflow: hidden;
  transform: translateY(-30px);
  transition: transform 0.3s ease;
}
.active .huda-search-modal-container {
  transform: translateY(0);
}

.huda-modal-header {
  display: flex;
  align-items: center;
  padding: 20px 30px;
  border-bottom: 1px solid #ccc;
  gap: 20px;
}
.huda-modal-header .huda-modal-input-group {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 15px;
}
.huda-modal-header .huda-modal-input-group i {
  font-size: 1.5rem;
  color: #4169e1;
}
.huda-modal-header .huda-modal-input-group input {
  width: 100%;
  border: none;
  font-size: 1.2rem;
  color: #111;
  outline: none;
  background: transparent;
}
.huda-modal-header .spinner-border-sm {
  border-width: 0.15em;
  color: #4169e1 !important;
}
.huda-modal-header .huda-modal-close {
  background: #F4F4F4;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  padding: 0;
}
.huda-modal-header .huda-modal-close:hover {
  background: #F25F4C;
  color: #FFFFFE;
}

.huda-modal-results {
  padding: 40px;
  max-height: 70vh;
  overflow-y: auto;
}
.huda-modal-results .huda-results-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
}
.huda-modal-results .huda-col-title {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #667085;
  margin-bottom: 20px;
  font-weight: 700;
}

.huda-result-item {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 10px;
  border-radius: 8px;
  text-decoration: none;
  margin-bottom: 10px;
  transition: 0.2s;
}
.huda-result-item:hover {
  background: #F4F4F4;
}
.huda-result-item:hover .huda-result-title {
  color: #4169e1;
}
.huda-result-item .huda-result-image {
  width: 60px;
  height: 60px;
  border-radius: 8px;
  background: #eee;
  overflow: hidden;
  flex-shrink: 0;
}
.huda-result-item .huda-result-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.huda-result-item .huda-result-title {
  font-size: 14px;
  font-weight: 600;
  color: #111827;
  margin-bottom: 4px;
  display: block;
}
.huda-result-item .huda-result-price {
  font-size: 13px;
  color: #22c55e;
  font-weight: 700;
}

@media (max-width: 768px) {
  .huda-modal-results .huda-results-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .huda-search-modal-container {
    width: 95%;
  }
}
.huda-breadcrumbs-nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-size: 14px;
  padding: 15px 0;
  color: #667085;
}
.huda-breadcrumbs-nav a {
  color: #404040;
  text-decoration: none;
  transition: 0.3s;
}
.huda-breadcrumbs-nav a:hover {
  color: #4169e1;
}
.huda-breadcrumbs-nav .huda-sep-icon {
  display: flex;
  align-items: center;
  color: #ccc;
  font-size: 16px;
}
.huda-breadcrumbs-nav span.current-item {
  color: #4169e1;
  font-weight: 500;
}

/* Media
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
  display: inline-block;
}

img.author-avatar {
  border-radius: 50px;
}

/* Captions
--------------------------------------------- */
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}
.wp-caption img[class*=wp-image-] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
}

.wp-caption-text {
  text-align: center;
}

/* Galleries
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
.gallery {
  margin-bottom: 1.5em;
  display: grid;
  grid-gap: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  width: 100%;
}

.gallery-columns-2 {
  grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
  grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
  grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
  grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
  grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
  grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
  grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
  grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
  display: block;
}

/* Gallery
--------------------------------------------- */
.wp-block-gallery {
  display: grid;
  gap: 1.5em;
  margin: 1.5em 0;
  padding: 0;
  list-style: none;
  /* Hide rogue WordPress <p> and <br> tags */
}
.wp-block-gallery > p,
.wp-block-gallery > br,
.wp-block-gallery > div:empty {
  display: none !important;
}
.wp-block-gallery {
  /* Default responsive fallback */
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.wp-block-gallery.aligncenter {
  margin-left: auto;
  margin-right: auto;
}
.wp-block-gallery figure.wp-block-image {
  margin: 0 !important;
  position: relative;
  overflow: hidden;
  border-radius: 0;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  /* MOBILE DEFAULT: Let the image show its natural uncropped shape */
  aspect-ratio: auto;
  /* TABLET/DESKTOP: Force uniform grid sizes so rows line up perfectly */
}
@media (min-width: 600px) {
  .wp-block-gallery figure.wp-block-image {
    aspect-ratio: 4/3; /* You can also try 16 / 9 if you want them wider */
  }
}
.wp-block-gallery figure.wp-block-image img {
  width: 100%;
  height: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.wp-block-gallery figure.wp-block-image figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0));
  color: #fff;
  padding: 30px 15px 15px;
  font-size: 0.85rem;
  text-align: center;
  opacity: 0;
  transform: translateY(15px);
  transition: all 0.35s ease;
  margin: 0;
  pointer-events: none;
}
.wp-block-gallery figure.wp-block-image:hover img {
  transform: scale(1.05);
}
.wp-block-gallery figure.wp-block-image:hover figcaption {
  opacity: 1;
  transform: translateY(0);
}
.wp-block-gallery {
  /* Column handling */
}
.wp-block-gallery.columns-2 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-2 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-3 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-3 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-3 {
    grid-template-columns: repeat(3, 1fr);
  }
}
.wp-block-gallery.columns-4 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-4 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-4 {
    grid-template-columns: repeat(4, 1fr);
  }
}
.wp-block-gallery.columns-5 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-5 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-5 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-5 {
    grid-template-columns: repeat(5, 1fr);
  }
}
.wp-block-gallery.columns-6 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-6 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-6 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-6 {
    grid-template-columns: repeat(6, 1fr);
  }
}
.wp-block-gallery.columns-7 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-7 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-7 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-7 {
    grid-template-columns: repeat(7, 1fr);
  }
}
.wp-block-gallery.columns-8 {
  /* Mobile: 1 column */
  grid-template-columns: 1fr;
  /* Tablet: 2 columns */
}
@media (min-width: 600px) {
  .wp-block-gallery.columns-8 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.wp-block-gallery.columns-8 {
  /* Desktop: Honors the WP Block column setting */
}
@media (min-width: 900px) {
  .wp-block-gallery.columns-8 {
    grid-template-columns: repeat(8, 1fr);
  }
}

/* Footer
--------------------------------------------- */
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
footer.footer-main {
  width: 100%;
  padding: 20px 0 20px 0;
  color: #FFFFFE;
  background-color: #FFFFFE;
  border-top: 1px solid #E5E7EB;
  position: static;
  bottom: 0;
  left: 0;
}
footer.footer-main .footer-content {
  padding: 2em 0;
  border-bottom: 1px solid rgb(77, 62, 59);
}
footer.footer-main .footer-content a {
  color: #111827;
}
footer.footer-main .footer-content a:hover {
  color: #4169e1;
}
footer.footer-main .footer-content p {
  color: #4169e1;
  padding-top: 0.8em;
}
footer.footer-main .footer-content p:hover, footer.footer-main .footer-content a:hover, footer.footer-main .footer-content span:hover, footer.footer-main .footer-content i:hover {
  opacity: 100%;
}
footer.footer-main .footer-content ul {
  display: flex;
  flex-direction: column;
  gap: 0.8em;
}
footer.footer-main .footer-content ul li.current-cat a {
  color: #4169e1;
}
footer.footer-main .footer-content h2.widget-title {
  color: #FFFFFE;
}
footer.footer-main .footer-copyright {
  color: #111827;
  display: flex;
  align-items: center;
  justify-content: center;
  text-transform: capitalize;
  padding: 12px 0;
}
footer.footer-main .footer-copyright span {
  font-weight: 300;
}
footer.footer-main .footer-copyright a:hover {
  color: #4169e1;
}
footer.footer-main .footer-copyright .social-icons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
}
footer.footer-main .footer-copyright .footer-author-link {
  color: #4169e1;
}
footer ul, footer ol {
  list-style-type: none;
}

/*--------------------------------------------------------------
# Blocks
--------------------------------------------------------------*/
/*!
Theme Name: Huda
Theme URI: http://underscores.me/
Author: softmetik
Author URI: https://softmetik.com/wphuda
Description: Huda Multipurpose Wordpress Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: huda
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Huda is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	// - Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
.blog-single {
  padding: clamp(32px, 4vw, 64px) 0;
  color: #2f2a25;
}
.blog-single__hero {
  margin-bottom: clamp(24px, 3vw, 32px);
}
.blog-single__hero img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  -o-object-fit: cover;
     object-fit: cover;
  box-shadow: 0 16px 36px -24px rgba(0, 0, 0, 0.3);
}
.blog-single__body {
  gap: clamp(24px, 3vw, 40px);
  align-items: flex-start;
}
.blog-single__content {
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 2vw, 24px);
}
.blog-single__header {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.blog-single__meta {
  width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid #e7dfd7;
  font-size: 0.95rem;
  color: #766e66;
}
.blog-single__categories a {
  color: #766e66;
  text-decoration: none;
}
.blog-single__author-inline {
  font-weight: 600;
  color: #2f2a25;
}
.blog-single__title {
  font-size: clamp(1.9rem, 3vw, 2.6rem);
  line-height: 1.2;
  margin: 0;
}
.blog-single__article {
  display: grid;
  gap: 1.25rem;
}
.blog-single__article > * {
  max-width: 760px;
}
.blog-single__article .wp-block-image img, .blog-single__article figure {
  border-radius: 10px;
  overflow: hidden;
}
.blog-single__comments {
  margin-top: clamp(28px, 3vw, 40px);
  border-top: 1px solid #e7dfd7;
  padding-top: 24px;
}
.blog-single__comment {
  border-bottom: 1px solid #f0e9e2;
  padding: 16px 0;
}
.blog-single__comment:last-child {
  border-bottom: none;
}
.blog-single__comment-body {
  display: grid;
  gap: 6px;
}
.blog-single__sidebar {
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 2vw, 20px);
}
.blog-single__sidebar-card {
  background: #fbf7f2;
  border: 1px solid #ece4db;
  border-radius: 12px;
  padding: 18px 18px 14px;
  box-shadow: 0 18px 36px -28px rgba(0, 0, 0, 0.3);
}
.blog-single__sidebar-author {
  text-align: center;
}
.blog-single__sidebar-author .wp-block-post-author__bio {
  margin-top: 8px;
  color: #6c6258;
  font-size: 0.95rem;
  line-height: 1.6;
}
.blog-single__sidebar-list li + li {
  margin-top: 8px;
}
.blog-single__featured-item {
  align-items: flex-start;
}
.blog-single__featured-title {
  margin: 0;
}
.blog-single__featured-date {
  font-size: 0.85rem;
  color: #7c7168;
}
@media (max-width: 1080px) {
  .blog-single__body {
    flex-wrap: wrap;
  }
  .blog-single__content, .blog-single__sidebar {
    flex-basis: 100% !important;
  }
}
@media (max-width: 720px) {
  .blog-single {
    padding: 24px 0;
  }
  .blog-single__meta {
    gap: 8px;
  }
  .blog-single__hero img {
    border-radius: 10px;
  }
  .blog-single__sidebar-card {
    padding: 16px;
  }
}

/* =========================================
   Block: Modern Blog Cards (Fixed Layout)
   ========================================= */
.huda-blog-section {
  padding: 5rem 0;
  background-color: transparent;
}
.huda-blog-section .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 2rem;
  margin-top: 3rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.huda-blog-card {
  background-color: #FFFFFE;
  border: 1px solid #E5E7EB;
  border-radius: 16px;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.huda-blog-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  border-color: transparent;
}
.huda-blog-card .huda-card-image {
  position: relative;
  width: 100%;
  height: 240px;
  overflow: hidden;
  margin: 0;
}
.huda-blog-card .huda-card-image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.huda-blog-card .huda-card-image:hover img {
  transform: scale(1.05);
}
.huda-blog-card .huda-card-image .wp-block-post-terms {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 10;
  margin: 0;
}
.huda-blog-card .huda-card-image .wp-block-post-terms a {
  background-color: #FFFFFE;
  color: #4169e1;
  padding: 6px 14px;
  border-radius: 50px;
  font-size: 0.75rem;
  font-weight: 700;
  text-decoration: none;
  text-transform: capitalize;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  display: inline-block;
}
.huda-blog-card .huda-card-image .wp-block-post-terms a:hover {
  background-color: #4169e1;
  color: #FFFFFE;
}
.huda-blog-card .huda-card-body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
.huda-blog-card .huda-card-body .wp-block-post-date {
  color: #667085;
  font-size: 0.85rem;
  font-weight: 500;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 6px;
}
.huda-blog-card .huda-card-body .wp-block-post-date::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23667085' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.huda-blog-card .huda-card-body .wp-block-post-title {
  font-size: 1.25rem;
  line-height: 1.4;
  margin-top: 0;
  margin-bottom: 0.75rem;
  font-weight: 700;
}
.huda-blog-card .huda-card-body .wp-block-post-title a {
  color: #111827;
  text-decoration: none;
  transition: color 0.2s;
}
.huda-blog-card .huda-card-body .wp-block-post-title a:hover {
  color: #4169e1;
}
.huda-blog-card .huda-card-body .wp-block-post-excerpt {
  color: #667085;
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: 1.5rem;
}
.huda-blog-card .huda-card-body .huda-read-more {
  margin-top: auto;
}
.huda-blog-card .huda-card-body .huda-read-more a {
  color: #4169e1;
  font-weight: 600;
  text-decoration: none;
  font-size: 0.95rem;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.huda-blog-card .huda-card-body .huda-read-more a::after {
  content: "→";
  font-family: sans-serif;
  transition: transform 0.2s;
}
.huda-blog-card .huda-card-body .huda-read-more a:hover::after {
  transform: translateX(4px);
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/
/* Jetpack infinite scroll
--------------------------------------------- */
/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/
/* Accessibility
--------------------------------------------- */
/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
  outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {
  /*rtl:ignore*/
  float: left;
  /*rtl:ignore*/
  margin-right: 1.5em;
  margin-bottom: 1.5em;
}

.alignright {
  /*rtl:ignore*/
  float: right;
  /*rtl:ignore*/
  margin-left: 1.5em;
  margin-bottom: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.5em;
}/*# sourceMappingURL=stylesheet.css.map */