/*
Theme Name: Lumelos Child Theme
Description: Lumelos
Template: lumelos
*/

/* Globals */

:root {
  /* Base */
  --transition: .3s;
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-size-large: 24px;
  --font-size-medium: 18px;
  --font-size-regular: 16px;
  --font-size-tiny: 1rem;
  --font-size-small: 1.3rem;
  --font-italic: italic;

  /* Dimensions & Spacing */
  --margin-none: 0;
  --margin-small: .5rem;
  --margin-medium: 1rem;
  --margin-large: 2rem;
  --margin-other: 25px;
  --padding: 1rem 0.625rem;
  --padding-tiny: .25rem;
  --padding-small: 1rem;
  --padding-medium: 2rem;
  --padding-large: 4rem;
  --padding-huge: 8rem;
  --border-width-small: 1px;
  --border-width: 2px;
  --border-radius: 12px;
  --border-radius-medium: 6px;
  --border-radius-small: 3px;
  --border-radius-pill: 34px;
  --border-radius-circle: 50%;
  --modal-max-width: 500px;
  --modal-max-height: calc(90vh - 100px);
  --form-max-width: 32rem;
  --gap-small: 0.5rem;
  --gap-medium: 1rem;
  --column-gap: 2rem;
  --x-gap: 5vw;
  --y-gap: 1.5rem;

  /* Colors */
  --color-opacity-low: .15;
  --color-opacity-medium: .3;
  --color-background: #f5f5f6;
  --color-background-transparent-light: rgba(255, 255, 255, 0.5) !important;
  --color-dark-background: #232427;
  --color-dark-background-transparent-light: rgba(0, 0, 0, 0.2) !important;
  --color-text: #333;
  --color-dark-text: #fff;
  --color-white: #fff;
  --color-black: #000;
  --color-grey: #9E9E9E;
  --color-error: #f44336;
  --color-success: #4CAF50;
  --color-warning: #FFC107;
  --color-info: #00BCD4;
  --color-hover-info: #008C9E;
  --color-border-primary: var(--color-primary);
  --color-hover-bg-primary: var(--color-primary);
  --color-hover-border-white: #FFF;
  --star-color: #FFD700;
  --color-link-hover: var(--color-primary);

  /* Typography */
  --font-weight-bold: 600;

  /* Shadows  */
  --box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.25);

  /* Animation */
  --scale-hover: scale(1.03);
  --scale-hover-big: scale(1.2);
  --animation-fadeIn: fadeIn 0.5s ease-in-out;

  /* Form */
  --form-input-focus-border: var(--border-width) solid var(--color-primary);

  /* Button */
  --button-font-size: 16px;
  --button-padding: 5px 9px;
  --button-hover-transform: scale(1.05);

  /* Cat-links */
  --cat-link-padding: 0.2rem 0.5rem;

  /* Switch */
  --switch-width: 60px;
  --switch-height: 34px;

  /* New Variables */
  --color-blockquote: #fff;
  --font-family-quote: Georgia, Cambria, "Times New Roman", Times, serif;
  --font-size-quote: 1.25rem;
  --font-quote-accent: arial;
  --quote-box-shadow-light: 0 1px 5px rgba(0, 0, 0, 0.025);
  --quote-cite-color: #888;
  --quote-accent-color: #888;

  /* Dimensions & Spacing */
  --border-style-solid: solid;

  /* Blockquote */
  --blockquote-padding: 2rem 4rem;
  --blockquote-border-radius: 1rem;
  --blockquote-shadow: var(--box-shadow);
  --blockquote-margin-bottom: 3rem;
  --blockquote-accent-size: 6rem;
  --blockquote-accent-left-position: 1rem;
  --blockquote-accent-top-position: 4rem;

  /* Cite */
  --cite-position-bottom: -3rem;
  --cite-text-align: right;
}



:where(.wp-block-columns) {
  margin-bottom: 0;
}


.rtl {
  direction: rtl;
  --offcanvas: 100%;
  --transform-rotate: 180deg;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: var(--font-family);
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  scroll-behavior: smooth;
}

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
  display: block;
}

body {
  margin: 0;
  font-family: var(--font-family);
  overflow-x: hidden;
  color: var(--text-color);
  background-color: var(--body-bg-color);
  font-size: var(--font-size);
  font-weight: var(--font-weight, 400);
  line-height: var(--line-height, 1.5);
}

h4 {
  font-size: 24px !important;
  padding-top: 18px;
}

.entry-header {
  margin-top: var(--margin-other);
}

.user-description a,
.entry-content>p a,
.entry-content>table a,
.entry-content>dl a,
.entry-content>ul a,
.entry-content>ol a,
.station-content a {
  color: var(--color-primary);
}

.grecaptcha-badge {
  visibility: hidden;
}

#main,
.site-content {
  padding: 0;
  min-height: 0px;
  margin-top: 0px !important;
}

#menu-state:not(:checked)~.site-sidebar .nav>li.hide-icon>a {
  font-size: var(--font-size-small);
}

.site-title {
  margin-left: 16px !important;
  font-size: 30px !important;
}

.is-medium {
  box-shadow: none;
  height: 100%;
  max-width: none;
}

.no-scroll {
  overflow: hidden;
}

/* Shared and custom styles */

.z-index-1 {
  z-index: 1;
}

.shadow {
  box-shadow: var(--box-shadow);
}

.hide {
  display: none;
}

.grayscale {
  filter: grayscale(1);
}

.rounded figure, .rounded img {
  border-radius: var(--border-radius) !important;
}

.circle figure, .circle img {
  border-radius: var(--border-radius-circle) !important;
}

.pill figure, .pill img {
  border-radius: var(--border-radius-pill) !important;
}


.primary-color {
  color: var(--color-primary) !important;
}

.pipe {
  border-left: var(--border-width) solid var(--color-border-primary);
  border-right: var(--border-width) solid var(--color-border-primary);
  padding-left: var(--padding-tiny);
  padding-right: var(--padding-tiny);
}

/* Logo */

.dark .custom-logo-link,
.dark .logo-image {
  display: inherit;
  filter: invert(1);
}

.dark .invert {
  filter: invert(1);
}


.site-logo svg,
.site-logo img {
  max-width: none;
}

/* Dark Mode */

.dark .dark-block,
.dark #login-form,
.dark .wpcf7-form,
.dark .error,
.dark .required,
.dark #login-form .message #login_error,
.dark .success,
.dark .login-form-links a {
  color: var(--color-dark-text) !important;
  background-color: var(--color-dark-background) !important;
}



/* Lumeos style related posts */

.related-post-wrapper .entry-header .posted-on a {
  color: #ccc;
}

.dark .entry-content {
  color: var(--color-dark-text);
}

.related-post-wrapper,
.related-post-wrapper .entry-title a,
.related-post-wrapper .entry-content {
  color: white;
}

.related-post-wrapper {
  padding: 20px;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: var(--border-radius);
  height: 300px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--box-shadow);
}

.related-post-wrapper::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 0;
}

.entry-header,
.entry-content {
  position: relative;
  z-index: 1;
}



.full-page .entry-header, .full-page .entry-footer, .full-page #related-posts {
  display: none;
}

.related-post-wrapper .entry-header,
.related-post-wrapper .entry-content {
  position: relative;
  z-index: 1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0x;
}

.archive-content-column h3 {
  border-bottom: none !important;
  padding-bottom: var(--y-gap);
}

.archive-content-column {
  display: grid;
  grid-gap: calc(var(--y-gap));
  margin-top: calc(var(--y-gap)*2);
  margin-bottom: calc(var(--y-gap)*2);
}



/* Lumelos style banners */
.banner {
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  margin: var(--margin-other) 0;
}

.banner-primary {
  color: var(--color-dark-text) !important;
  padding: 0 3%;
  background-color: var(--wc-primary) !important;
  filter: opacity(0.9);
}

.banner-primary .posted-on {
  color: var(--color-dark-text);
}

.title-cover,
.title-cover-banner {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
}

.title-cover {
  padding: 20px;
  text-align: center;
}

.title-cover-banner {
  padding: 40px 20px;
}

.title-cover-banner .title-font-style,
.title-font-style {
  font-size: 24px;
  font-style: normal;
  font-weight: 300;
}

.title-cover-banner .title-font-style {
  font-size: 36px;
  text-shadow: var(--box-shadow);
  margin: var(--margin-none) auto; /* Added 'auto' to horizontally center the block */
  text-align: center; /* Centers the text inside the block */
  max-width: fit-content; /* Ensures the block only takes up as much width as it needs */
}

.title-background,
.post-title {
  background-color: rgba(0, 0, 0, 0.6);
  padding: 10px;
  display: inline-block;
  border-radius: var(--border-radius-medium);
  box-shadow: var(--box-shadow);
}

.title-cover-banner .wp-block-cover__inner-container {
  display: flex;
  justify-content: center;  /* Horizontally centering */
  align-items: center;      /* Vertically centering */
  width: 100%;  /* Ensure it takes up the full width of its parent */
  height: 100%; /* Ensure it takes up the full height of its parent */
}


.title-font-style.title-background {
  max-width: fit-content;
  margin: 0 auto; /* This will horizontally center the block with respect to its parent */
  text-align: center; /* This will ensure the text inside the block is centered */
}


.post-title {
  color: white;
  padding-left: 20px;
}

.cover-min-height {
  min-height: 200px;
}

.cover-object-position {
  object-position: 50% 25%;
}

.wp-block-cover {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  height: 100%;
}

.wp-block-cover__background {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.wp-block-cover__inner-container {
  width: 100%;
}

.wp-block-cover .has-background-dim:not([class*=-background-color]),
.wp-block-cover-image .has-background-dim:not([class*=-background-color]),
.wp-block-cover-image.has-background-dim:not([class*=-background-color]),
.wp-block-cover.has-background-dim:not([class*=-background-color]) {
  background-color: #666;
}


/* Lumelos style Pricing Box */
.pricing-box-container {
  display: inline-block;
  width: 320px;
  height: 400px;
  overflow: hidden;
}

.pricing-container {
  display: flex;
  justify-content: center;
  gap: var(--gap-medium);
}

.pricing-box-link {
  display: block;
  text-decoration: none;
}

.pricing-box {
  background-color: var(--color-background);
  color: var(--color-text);
  border-radius: var(--border-radius);
  padding: 20px;
  text-align: center;
  position: relative;
  transition: transform var(--transition) ease-in-out, border var(--transition) ease-in-out, box-shadow var(--transition) ease-in-out;
  z-index: 1;
  overflow: hidden;
  max-width: 350px !important;
  margin: auto;
}

.pricing-box:hover {
  transform: scale(1.05);
  box-shadow: var(--box-shadow);
}

.dark .pricing-box {
  background-color: var(--color-dark-background);
  color: var(--color-dark-text);
}

.price-box-price {
  font-size: 36px;
  margin-bottom: var(--margin-other);
}

.features {
  list-style: none;
  padding: 0;
  margin-top: 10px;
}

.features li {
  margin: 10px 0;
}

.fa-star {
  margin-right: 10px;
  color: var(--star-color);
}

.best-deal-tag {
  position: absolute;
  top: 0;
  right: 0;
  background-color: var(--color-primary);
  border-radius: var(--border-radius);
  color: var(--color-dark-text);
  padding: 5px 20px;
  font-size: 0.8em;
  z-index: 1;
  transform: rotate(0deg) translate(-10px, 10px);
  transform-origin: bottom left;
}

.old-price {
  text-decoration: line-through;
  margin-right: 10px;
  font-size: 0.8em;
  color: var(--color-grey);
}

.dark .old-price {
  color: var(--text-secondary-color);
}

.new-price {
  font-weight: var(--font-weight-bold);
}

.period {
  font-size: 0.7em;
  vertical-align: baseline;
  margin-left: 5px;
  color: var(--color-primary);
}


/* Lumelos style switch */
.switch {
  position: relative;
  display: inline-block;
  width: var(--switch-width);
  height: var(--switch-height);
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.switch-label {
  color: var(--color-white);
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--color-text);
  transition: var(--transition);
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: var(--color-dark-text);
  transition: var(--transition);
}

input:checked+.slider {
  background-color: var(--color-primary);
}

input:checked+.slider:before {
  transform: translateX(26px);
}

.slider.round {
  border-radius: var(--border-radius-pill);
}

.slider.round:before {
  border-radius: var(--border-radius-pill);
}

.dark .slider {
  background-color: var(--color-dark-background);
}

.dark input:checked+.slider {
  background-color: var(--color-primary);
}


/* Lumelos style button */
.new-button-class {
  display: block;
  align-items: center;
  background-color: var(--color-primary);
  border-radius: var(--border-radius-medium);
  color: var(--color-dark-text) !important;
  font-size: var(--button-font-size);
  justify-content: center;
  line-height: inherit;
  padding: var(--button-padding);
  text-align: center;
  text-decoration: none;
  margin-bottom: 0;
  transition: transform var(--transition) ease-in-out, border var(--transition) ease-in-out, box-shadow var(--transition) ease-in-out;
}

.new-button-class:hover {
  transform: var(--button-hover-transform);
  box-shadow: var(--box-shadow);
}

.pricing-box .new-button-class,
.cat-links a:hover {
  transform: none;
}

.site-navbar .new-button-class {
  padding: 0;
  margin: 15px 0;
}

/* Lumelos Style categories */
.entry-cat li+li:before {
  display: inline-block;
  content: '\f054';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: var(--color-primary);
  margin-right: var(--margin-small);
}

.cat-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: var(--gap-small);
  margin-bottom: var(--margin-medium);
  text-transform: none;
  font-weight: var(--font-weight-bold);
}

.cat-links a {
  display: inline-flex;
  align-items: center;
  padding: var(--cat-link-padding);
  border-radius: var(--border-radius-small);
  transition: all var(--transition);
  box-shadow: var(--box-shadow);
  border: var(--border-width) solid var(--color-border-primary);
}

.cat-links a:hover {
  background-color: var(--color-hover-bg-primary);
  color: var(--color-dark-text);
  border: var(--border-width) solid var(--color-hover-border-white);
}

body .cat-links a:hover:before {
  display: none;
}

/* Lumelos style sidebox */
.sidebox {
  background: var(--color-white);
}

.dark .sidebox {
  background: #171719;
}

/* Lumelos style author box */
.author-bio-box {
  display: flex;
  align-items: center;
  padding: 15px 20px 20px 20px;
  border: var(--border-width) solid var(--color-border-primary);
  border-radius: var(--border-radius-medium);
  margin-bottom: 20px;
  background-color: #f9f9f9;
  box-shadow: var(--box-shadow);
}

.dark .author-bio-box {
  background-color: var(--color-dark-background);
}

.author-avatar {
  flex: 0 0 auto;
  margin-right: var(--margin-other);
  margin-top: 5px;
}

.author-avatar img {
  border-radius: var(--border-radius-circle);
  box-shadow: var(--box-shadow);
  max-width: 70px;
}

.author-details {
  flex-grow: 1;
  font-size: 12px !important;
}

.author-bio-box .author-name {
  font-size: 16px !important;
  margin-top: -8px;
}

.author-description {
  margin: var(--margin-none);
  font-size: 1em;
  line-height: 1.5;
  color: var(--color-text);
  margin-top: -16px;
  margin-bottom: 8px;
}

.dark .author-description {
  color: var(--color-dark-text);
}

/* Lumelos style modal (unused I think) */

.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 10vh;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.5);
}

/* .modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.1);
  width: 80%;
  max-width: 500px;
  max-height: calc(90vh - 100px);
  overflow-y: auto;
  border-radius: var(--border-radius-medium);
  transition: var(--transition);
} */

.modal-wrapper {
  padding: 20px;
  overflow-y: auto;
  max-height: 70vh;
  border-radius: var(--border-radius-medium);
}

.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  transition: color var(--transition) ease-in-out;
}


/* Lumelos style contact form */
.wpcf7-spinner {
  display: none;
}

.wpcf7-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: var(--font-size-tiny);
  max-width: var(--form-max-width);
  margin: var(--margin-medium) auto;
  padding: var(--padding-medium);
  background-color: var(--color-background);
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  color: var(--color-text);
  transition: box-shadow var(--transition), transform var(--transition);
}

.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-email,
.wpcf7-form-control.wpcf7-textarea {
  width: 100%;
  padding: var(--padding);
  margin-bottom: var(--gap-small);
  border: var(--border-width) solid var(--color-grey);
  border-radius: var(--border-radius);
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.wpcf7-form textarea:focus,
.wpcf7-form input:focus,
#login-form .input:focus,
#login-form .input:hover {
  box-shadow: var(--box-shadow) !important;
  border: var(--form-input-focus-border) !important;
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

/* Lumelos style footer */
.site-footer {
  box-shadow: 0 -8px 16px var(--color-dark-background-transparent-light);
}

.icon-gray {
  color: var(--color-grey) !important;
}

/* Duotone */

.footer-duotone {
  position: relative;
  overflow: hidden;
}

.footer-duotone::before,
.footer-duotone::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  background-blend-mode: overlay;
  mix-blend-mode: overlay;
}

.footer-duotone::before {
  background-color: #000;
  filter: brightness(0) invert(1);
}

.footer-duotone::after {
  background-color: var(--color-primary);
  filter: brightness(1);
}





/* ========= Blockquote Styles ========= */

/* General Blockquote Styles */
blockquote {
  padding: var(--blockquote-padding);
  background-color: var(--color-background);
  border-radius: var(--blockquote-border-radius);
  position: relative;
  font-family: var(--font-family);
  box-shadow: var(--blockquote-shadow);
  margin-bottom: var(--blockquote-margin-bottom);
  font-style: normal;
  color: var(--color-text);
  font-size: var(--font-size-small);
}

blockquote p {
  font-size: var(--font-size-small);
}

.dark blockquote {
  color: var(--color-dark-text);
  background-color: var(--color-dark-background);
}

blockquote:before {
  content: '\201C';
  color: var(--color-primary);
  font-family: var(--font-quote-accent);
  position: absolute;
  left: var(--blockquote-accent-left-position);
  top: var(--blockquote-accent-top-position);
  font-size: var(--blockquote-accent-size);
  line-height: 0;
  opacity: 1;
  z-index: 1;
}

blockquote:after {
  display: none;
}

/* Cite Styles for Blockquote */
blockquote cite {
  display: block;
  color: var(--color-text);
  position: relative;
  bottom: var(--cite-position-bottom);
  height: 0;
  margin: var(--margin-none) !important;
}

.dark blockquote cite {
  color: var(--color-dark-text);
}

/* WP Block Quote Styles */
.wp-block-quote {
  overflow-wrap: break-word;
  border: var(--border-width) var(--border-style-solid);
  border-color: var(--color-primary);
  padding-left: var(--padding-medium);
  font-family: var(--font-family);
  background-color: var(--color-background);
}

.wp-block-quote.has-text-align-right {
  border-left: none;
  border-right: var(--border-width) var(--border-style-solid);
  padding-left: var(--margin-none);
  padding-right: var(--padding-medium);
}

.wp-block-quote.has-text-align-center,
.wp-block-quote.is-large,
.wp-block-quote.is-style-large,
.wp-block-quote.is-style-plain {
  border: none;
  margin: var(--margin-medium) 0;
  padding: var(--padding-medium);
}

.wp-block-quote p {
  font-size: var(--font-size-small);
  line-height: 1.6;
}

.wp-block-quote cite,
.wp-block-quote footer {
  color: var(--color-text);
  font-size: var(--font-size-small);
  font-style: normal;
  text-align: var(--cite-text-align);
}

.dark .wp-block-quote {
  background-color: var(--color-dark-background);
}

/* ========= Pullquote Styles ========= */

/* General Pullquote Styles */
.wp-block-pullquote blockquote {
  padding: var(--blockquote-padding);
  background-color: var(--color-background);
  border-radius: 0px;
  position: relative;
  font-family: var(--font-family);
  box-shadow: var(--blockquote-shadow);
  margin-bottom: var(--blockquote-margin-bottom);
  font-style: normal;
  color: var(--color-text);
  font-size: var(--font-size-small);
}

.wp-block-pullquote blockquote:before {
  content: none;
}

.dark .wp-block-pullquote blockquote {
  color: var(--color-dark-text);
  background-color: var(--color-dark-background);
}

/* Cite Styles for Pullquote */
.wp-block-pullquote cite {
  display: block;
  color: var(--color-text);
  position: static;
  bottom: 0;
  height: auto;
  margin: var(--margin-none) !important;
  text-align: var(--cite-text-align);
}

.dark .wp-block-pullquote cite {
  color: var(--color-dark-text);
}

/* WP Block Pullquote Specific Styles */
.wp-block-pullquote {
  border-left: 5px solid var(--color-primary);
  padding-left: 1.5em;
  background-color: var(--color-background-light);
  font-style: italic;
}

.wp-block-pullquote blockquote {
  border: 0;
}

.wp-block-pullquote.is-style-solid-color {
  border-radius: var(--border-radius);
}

.wp-block-pullquote.is-style-solid-color blockquote {
  max-width: 100%;
  background-color: transparent;
  border-width: var(--margin-none);
}

.wp-block-pullquote cite,
.wp-block-pullquote footer,
.wp-block-pullquote__citation {
  color: var(--color-text);
  font-size: var(--font-size-small);
  font-style: normal;
  text-transform: none;
  text-align: right;
}

.dark .wp-block-pullquote,
.dark .wp-block-pullquote cite,
.dark .wp-block-pullquote footer,
.dark .wp-block-pullquote__citation {
  color: var(--color-dark-text);
}




























/* Lumelos style log in form */
#login-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: var(--font-size-base);
  max-width: var(--form-max-width);
  margin: var(--margin-medium) auto;
  padding: var(--padding-medium);
  background-color: var(--color-background);
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  color: var(--color-text);
  transition: box-shadow var(--transition), transform var(--transition);
}

#login-form .input {
  width: 100%;
  padding: var(--padding-tiny);
  margin-bottom: var(--margin-small);
  border: 1px solid var(--color-grey);
  border-radius: var(--border-radius);
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.btn-toggle-pwd {
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  margin: var(--margin-none) var(--margin-small) var(--margin-small);
  vertical-align: middle;
}

.error,
.required,
#login-form .message #login_error,
.success {
  color: var(--color-error);
  margin: var(--padding-tiny) 0;
  text-decoration: none;
  transition: color var(--transition);
}

.login-form-links a {
  color: var(--color-error);
  position: relative;
  margin: var(--padding-tiny) 0;
  text-decoration: none;
  transition: color var(--transition);
}

.login-form-links a:focus,
.login-form-links a:hover {
  color: var(--color-link-hover);
  outline: var(--border-width) solid var(--color-link-hover);
  outline-offset: 2px;
}

.login-form-links a::after {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: var(--color-link-hover);
  visibility: hidden;
  transition: all var(--transition);
}

.login-form-links a:hover::after {
  visibility: visible;
  width: 100%;
}


/* Lumelos style Random Image Block */

.ud-random-img-block {
  border-radius: var(--border-radius-circle);
  padding: 5px;
}

.ud-random-img-block .ud-random-img-block__images img {
  border-radius: var(--border-radius-circle);
  box-shadow: var(--box-shadow);
}


/* Lumelos style loop block */

.block-loop-item .post-thumbnail {
  background-size: cover;
  box-shadow: var(--box-shadow) !important;
}

.block-loop-item .entry-meta {
  color: var(--color-white);
}

.wp-block-loop-station .entry-meta {
  display: none;
}


/* Lumelos style play block */

.plyr-playlist .plyr--soundcloud .plyr__video-wrapper,
.plyr-playlist .plyr--mixcloud .plyr__video-wrapper,
.plyr-playlist .plyr--spotify [data-plyr="fullscreen"],
.plyr-playlist .plyr--soundcloud [data-plyr="fullscreen"],
.plyr-playlist .plyr--mixcloud [data-plyr="fullscreen"],
.plyr-playlist .plyr--spotify [data-plyr="video"],
.plyr-playlist .plyr--soundcloud [data-plyr="video"],
.plyr-playlist .plyr--mixcloud [data-plyr="video"] {
  display: none;
}

.plyr-control-left,
.plyr-control-center,
.plyr-control-right {
  display: flex;
  flex: 1;
  align-items: center;
}

.plyr-control-right {
  justify-content: flex-end;
  background-color: inherit;
}

.plyr-control-center {
  justify-content: center;
  align-items: center;
}

.plyr-control-center-top {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 3px;
  width: 100%;
}

.plyr-control-center-bottom {
  display: flex;
  width: 100%;
  align-items: center;
}

.plyr__msg {
  display: none;
  position: absolute;
  z-index: 100000;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(var(--plyr-control-height) + var(--padding-medium));
  animation: var(--animation-fadeIn);
  width: 90%;
  max-width: var(--modal-max-width);
}

.plyr__msg_content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-medium);
  padding: var(--padding-small) var(--padding-medium);
  border-radius: var(--border-radius);
  background-color: var(--color-primary);
  color: var(--color-white);
  box-shadow: var(--box-shadow);
  transition: box-shadow var(--transition), transform var(--transition);
}

.plyr__msg_content:hover {
  box-shadow: var(--box-shadow);
  transform: var(--scale-hover);
}

.plyr__msg .close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  font-size: var(--font-size-small);
  padding: 4px 8px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  transition: color var(--transition);
}

.plyr__msg .close:hover {
  color: var(--color-white);
  transform: var(--scale-hover-big);
}

.plyr__msg .fa-exclamation-circle {
  margin-right: 8px;
}

.plyr__author,
.plyr__queue,
.plyr-item .plyr-item-author,
.header-station .entry-info {
  display: none;
}


/* Woocommerce styles */

.woocommerce-store-notice,
p.demo_store,
.woocommerce .widget_price_filter .ui-slider .ui-slider-handle,
.woocommerce .widget_price_filter .ui-slider .ui-slider-range,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled],
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled]:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled],
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled]:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled],
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled]:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled],
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled]:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt.disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt.disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled[disabled],
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled[disabled]:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt.disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt.disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled[disabled],
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled[disabled]:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt.disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt.disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled[disabled],
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled[disabled]:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt.disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt.disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled[disabled],
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled[disabled]:hover,
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
  background-color: var(--color-primary);
}


.woocommerce-store-notice__dismiss-link {
  font-size: var(--font-size-large);
  font-weight: var(--font-weight-bold);
  position: relative;
  margin-left: var(--margin-small);
}

.woocommerce-order {
  margin: var(--margin-none) auto;
  padding: var(--padding-medium);
  border: var(--border) solid var(--color-primary);
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  background-color: var(--color-background);
}

.dark .woocommerce-order {
  background-color: var(--color-dark-background);
}


.woocommerce-order table {
  width: 100%;
  border-collapse: collapse;
}

.woocommerce-order table th {
  font-family: var(--font-family);
  font-size: var(--font-size-medium);
  font-weight: normal;
  padding: var(--padding);
  border-bottom: none;
}

.woocommerce-order table td {
  font-family: var(--font-family);
  font-size: var(--font-size-regular);
  padding: var(--padding);
  border-bottom: none;
}

.woocommerce-order table td a {
  color: var(--color-primary);
}

.woocommerce-order table td a:hover {
  color: var(--color-white);
  background-color: var(--color-primary);
}

.woocommerce-order .woocommerce-order-actions {
  display: flex;
  justify-content: center;
}

.woocommerce-order .woocommerce-order-actions button {
  font-family: var(--font-family);
  font-size: var(--font-size-medium);
  color: var(--color-white);
  background-color: var(--color-primary);
  padding: var(--padding);
  border: none;
  border-radius: var(--border-radius-medium);
}

.woocommerce-order .woocommerce-order-actions button:hover {
  transform: var(--button-hover-transform);
  transition-duration: var(--transition);
}

.woocommerce address {
  font-style: normal;
  margin-bottom: 0;
  border-bottom-width: var(--border-width);
  border-right-width: var(--border-width);
  text-align: left;
  width: 100%;
  background-color: var(--color-white);
  border: var(--border-width) solid var(--color-primary);
  border-radius: var(--border-radius);
  padding: var(--padding-small);
}

.dark .woocommerce address {
  background-color: var(--body-bg-color);
}

.woocommerce .woocommerce-customer-details p {
  margin-bottom: var(--margin-medium);
}

.wc-block-checkout {
  width: 100%;
  margin: var(--margin-none) auto;
  padding: var(--padding-small);
  box-sizing: border-box;
}

/*
.wc-block-components-checkout-return-to-cart-button {
  display: none;
}
*/

/* Lumelos style WooCommerce button */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.disabled,
.woocommerce #respond input#submit:disabled,
.woocommerce #respond input#submit:disabled[disabled],
.woocommerce a.button.disabled,
.woocommerce a.button:disabled,
.woocommerce a.button:disabled[disabled],
.woocommerce button.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled],
.woocommerce input.button.disabled,
.woocommerce input.button:disabled,
.woocommerce input.button:disabled[disabled] {
  display: block;
  align-items: center;
  background-color: var(--color-primary) !important;
  border-radius: var(--border-radius-medium) !important;
  color: var(--color-dark-text) !important;
  font-size: var(--button-font-size) !important;
  justify-content: center;
  line-height: inherit;
  padding: var(--button-padding) !important;
  text-align: center;
  text-decoration: none;
  margin-bottom: 0 !important;
  transition: transform var(--transition) ease-in-out, border var(--transition) ease-in-out, box-shadow var(--transition) ease-in-out;
  font-weight: normal;
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  background-color: var(--color-primary);
  transform: var(--button-hover-transform);
  box-shadow: var(--box-shadow);
}


.woocommerce .woocommerce-customer-details,
.woocommerce .woocommerce-order-details,
.woocommerce .woocommerce-order-downloads {
  margin-bottom: 0em;
}


/* Lumelos style wordpress elements */

.wp-block-cover__inner-container2 {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  flex-direction: column;
}

.entry-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  grid-gap: var(--entry-meta-grid-gap, var(--gap-medium));
  margin-bottom: var(--y-gap);
}

.post-thumbnail.featured-image {
  display: none !important;
}

.spacer-20 {
  height: 20px;
}

.wp-block-heading .heading-title {
  color: var(--color-primary) !important;
}


/* Lumelos animations */

@keyframes fadeInUp {

  from {
    transform: translateY(20px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }

}

#login-form,
.wpcf7-form {
  animation: fadeInUp 0.5s ease-out;
}


/* Lumelos media constraints */

@media (max-width: 767px) {
  #login-form {
    margin: var(--margin-large) auto;
    padding: var(--padding-small);
  }

  .outer-container .pricing-container {
    flex-direction: column;
    align-items: center;
  }

  .wc-block-checkout {
    width: calc(100% - var(--padding-medium));
    padding: var(--padding-small);
  }

  .woocommerce-order {
    max-width: 100%;
  }

  .wpcf7-form {
    margin: var(--margin-large) auto;
    padding: var(--padding-small);
  }

  .hide-on-mobile {
    display: none !important;
  }

}

@media (min-width: 768px) { 
    .hide-on-desktop {
        display: none !important; 
    }
}

@media screen and (min-width: 1600px) {
  .content-area, .max-width-widescreen {
      max-width: 1600px;
      margin: 0 auto;
  }
}

@media only screen and (max-width: 700px) {
  .wp-block-woocommerce-checkout.is-loading {
      flex-direction:column;
      margin: 0 auto 16px
  }

  .wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-fields-block,.wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-totals-block {
      padding: 0;
      width: 100%
  }

  .wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-totals-block .wc-block-components-panel,.wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-totals-block .wc-block-components-totals-item {
      padding-left: 0;
      padding-right: 0
  }

  .wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-totals-block .wc-block-components-totals-coupon-link {
      margin-left: 0;
      margin-right: 0
  }
}

@media screen and (prefers-reduced-motion:reduce) {
  .is-loading .wc-block-components-product-price:before {
      animation: none
  }
}















/* Checkout */

/* General Styling */
.wp-block-woocommerce-checkout-order-summary-block, .wc-block-checkout__main {
  padding: var(--padding-small) !important;
  border: 1px !important;
  border-style: solid !important;
  border-color: var(--color-primary) !important;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  margin-bottom: var(--margin-medium);
  font-family: var(--font-family);
  background-color: var(--color-background);
  color: var(--color-text);
}

.dark .wc-block-checkout__main .p_Input {
  background-color: #000 !important;
}

.wc-block-components-panel__content .wc-block-components-totals-wrapper {
  box-shadow: none;
  border: none !important;
  border-radius: 0;
  padding: var(--padding-tiny) var(--padding-small) !important;
}



.wc-block-components-totals-wrapper:empty {
  display: none ;
}

.dark .wp-block-woocommerce-checkout-order-summary-block, .dark .wc-block-checkout__main {
  background-color: var(--color-dark-background);
  color: var(--color-dark-text);
}

.wc-block-components-totals-wrapper:after {
  border-style:none !important;
}

/* Order Summary Section */
.wc-block-components-order-summary__button-text {
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-medium);
  color: var(--color-text);
}

/* Order Summary Section */
.dark .wc-block-components-order-summary__button-text {
  color: var(--color-dark-text);
}



.wc-block-components-panel__button {
  background-color: var(--color-dark-background);
  color: var(--color-white);
  padding: var(--padding-small) !important;
  border-radius: var(--border-radius-medium);
  cursor: pointer;
  transition: var(--transition);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  font-size: var(--button-font-size);
  box-shadow: var(--box-shadow);
}

.wc-block-components-panel__button:hover {
  background-color: var(--color-hover-info);
  box-shadow: var(--box-shadow);
}

.wc-block-components-order-summary-item {
  display: flex;
  align-items: center;
  background-color: var(--color-background-transparent-light) !important;
  border: var(--border-width-small) solid var(--color-primary);
  border-radius: var(--border-radius);
  padding: var(--padding-small) !important;
}

.dark .wc-block-components-order-summary-item {
  background-color: var(--color-dark-background-transparent-light) !important;
}


/*

.wc-block-components-order-summary-item__image {
  position: relative;
  margin-right: var(--margin-medium);
  flex-shrink: 0;
}

.wc-block-components-order-summary-item__quantity {
  position: absolute;
  top: var(--margin-small);
  left: var(--margin-small);
  background-color: var(--color-background-transparent-light);
  color: var(--color-background-transparent-light);
  padding: var(--padding-tiny);
  border-radius: var(--border-radius-circle);
  font-size: var(--font-size-tiny);
}

.wc-block-components-order-summary-item__description {
  flex: 1;
  font-size: var(--font-size-regular);
}
*/
.wc-block-components-product-name {
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-medium);
  margin-bottom: var(--margin-small);
}

.wc-block-components-product-price__value {
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
}

.wc-block-components-product-price__regular {
  text-decoration: line-through;
  margin-right: var(--margin-small);
  color: var(--color-grey);
}

.wc-block-components-totals-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--padding-tiny) 0;
  font-size: var(--font-size-regular);
}

.wc-block-components-totals-footer-item {
  font-weight: var(--font-weight-bold);
}

/* Recurring Totals Section */
.wcs-recurring-totals-panel__title {
  font-size: var(--font-size-medium);
  margin-bottom: var(--margin-medium);
}

.wcs-recurring-totals-panel__details {
  padding: var(--padding-small);
  border: 1px solid var(--color-primary);
  background-color: var(--color-background-transparent-light);
  border-radius: var(--border-radius);
  transition: var(--transition);
  font-family: var(--font-family);
  font-size: var(--font-size-regular);
  color: var(--color-text);
}

.dark .wcs-recurring-totals-panel__details {
  background-color: var(--color-dark-background-transparent-light);
  color: var(--color-dark-text);
}

/* If there are any links inside .wcs-recurring-totals-panel__details */
.wcs-recurring-totals-panel__details a {
  color: var(--color-primary);
  transition: var(--transition);
  text-decoration: none;
  font-weight: var(--font-weight-bold);
}

/* Enhancing the SVG buttons */
.wc-block-components-panel__button-icon {
  margin-right: var(--margin-small);
  fill: var(--color-white);
}

.wcs-recurring-totals-panel {
  padding: 0;
}

.wc-block-components-totals-wrapper.slot-wrapper>*>* {
  padding: 0 !important;
  position: relative
}

.wcs-recurring-totals-panel__details .wc-block-components-panel__button,.wcs-recurring-totals-panel__details .wc-block-components-panel__button:hover,.wcs-recurring-totals-panel__details .wc-block-components-panel__button:focus {
  font-size: var(--font-size-regular);
}

.wp-block-woocommerce-checkout-order-summary-discount-block:empty {
  display: none ;
}

.wc-block-components-form .wc-block-components-checkout-step {
  padding: 0 !important;
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox] {
  border: none !important;
  background-color: none;
  position: relative !important;

}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:checked {
  background: var(--color-primary) !important;
  border: 0 !important;
  position: relative;
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type=checkbox]:focus {
  border: 0 !important;
}

.sineWavesSVG {
  padding-bottom: var(--padding-medium);
  padding-top: var(--padding-small);
  transition: all var(--transition);
}

.sineWavesSVG:hover {
  filter: opacity(0.5);
}


/* container */
.wide-page .site-main > .entry > .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
	width: inherit;
	max-width: inherit;
	margin-left: auto;
	margin-right: auto; 
}

.wide-page-content {
  /* Set a max width for the content to constrain it */
  max-width: 100%; /* This value can be adjusted based on your design preference */
  margin-left: auto; 
  margin-right: auto;
  padding-left: var(--padding-large); /* Padding on the left to add space */
  padding-right: var(--padding-large); /* Padding on the right to add space */
}

:where(.wp-block-columns) {
  margin-bottom: 0;
}



.wc-block-components-checkbox .wc-block-components-checkbox__mark {

  display: none !important;

}




















/* Base styles to ensure consistency */
*, *::before, *::after {
  box-sizing: border-box;
}

/* Main navigation styles */
.woocommerce-MyAccount-navigation {
width: 100%;
background-color: var(--color-background);
box-shadow: var(--box-shadow);
border-radius: var(--border-radius);
padding: var(--padding-small);
transition: box-shadow var(--transition);
border: var(--border-width) solid var(--color-primary);
}

.woocommerce-MyAccount-navigation {
	padding-bottom: var(--padding-small) !important;
}

.dark .woocommerce-MyAccount-navigation {
  background-color: var(--color-dark-background);
}


.woocommerce-MyAccount-navigation ul {
  display: flex;
  flex-direction: column;
  gap: var(--gap-medium);
}

.woocommerce-MyAccount-navigation-link {
  display: block;
  background-color: var(--color-white);
  padding: var(--padding-tiny);
  border-radius: var(--border-radius-medium);
  transition: transform var(--transition);
  text-align: center;
}

.dark .woocommerce-MyAccount-navigation-link {
  background-color: var(--body-bg-color);
  color: var(--color-dark-text);
  padding: var(--padding-tiny);
  border-radius: var(--border-radius);
  transition: transform var(--transition), box-shadow var(--transition);
  text-align: center;
}



.woocommerce-MyAccount-navigation-link:hover,
.woocommerce-MyAccount-navigation-link:focus {
  background-color: var(--color-hover-bg-primary);
  transform: var(--scale-hover);
  box-shadow: var(--box-shadow);
}

.woocommerce-MyAccount-navigation-link.is-active {
font-weight: var(--font-weight-bold);
background-color: var(--color-dark-background);
color: white;
transform: var(--scale-hover);
}

.dark .woocommerce-MyAccount-navigation-link.is-active {
background-color: var(--color-white);
}

.woocommerce-MyAccount-navigation-link a {
padding: var(--padding-tiny) var(--padding-small);
display: block;
font-size: var(--font-size-regular);
text-decoration: none;
color: var(--color-text);
}

.woocommerce-MyAccount-navigation-link:hover a {
color: var(--color-white);
}

.dark .woocommerce-MyAccount-navigation-link a {
color: var(--color-dark-text);
}

.woocommerce-MyAccount-navigation-link.is-active a {
color: var(--color-dark-text);
}

.dark .woocommerce-MyAccount-navigation-link.is-active a {
color: var(--color-text);
}












.woocommerce-MyAccount-content {
  padding: var(--padding-medium);
  padding-bottom: var(--padding-small);
  background-color: var(--color-background);
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  max-width: 100%;
  border: var(--border-width) solid var(--color-primary);
  height: 100%;
}

.dark .woocommerce-MyAccount-content {
  color: var(--color-dark-text);
  background-color: var(--color-dark-background);
}

.woocommerce-MyAccount-content .button {
  background-color: white !important;
  padding: var(--padding-medium) !important;
  margin: var(--margin-small) !important;
  box-shadow: none !important;
  display: block;
}

.woocommerce-MyAccount-content a.edit {
  background-color: var(--color-primary);
  margin: var(--margin-small) !important;
  box-shadow: none !important;
  display: block;  
  border-radius: var(--border-radius);
  max-width: fit-content;
  padding: var(--padding-tiny) var(--padding-medium) !important;
  color: white;
}

.woocommerce-MyAccount-content a.edit:hover {
  transform: var(--scale-hover);
  transition: 0.3s !important;
}

.dark .woocommerce-MyAccount-content .button {
  background-color: var(--color-primary) !important;
}

.woocommerce-MyAccount-content .button.cancel, .woocommerce-MyAccount-content .button.delete {
  background-color: var(--color-error) !important;
}

.woocommerce-MyAccount-content .button:hover {
  transform: var(--scale-hover);
  transition: 0.3s !important;
}

.woocommerce-MyAccount-content p {
margin-bottom: var(--margin-medium);
line-height: 1.6;
font-size: var(--font-size-regular);
}

.woocommerce-MyAccount-content strong {
font-weight: var(--font-weight-bold);
}

/* Links in paragraph style */
.woocommerce-MyAccount-content p a {
border-bottom: var(--border-width-small) solid var(--color-primary);
transition: color var(--transition), border-bottom-color var(--transition);
text-decoration: none;
}

.woocommerce-MyAccount-content p a:hover,
.woocommerce-MyAccount-content p a:focus {
color: var(--color-link-hover);
border-bottom-color: var(--color-link-hover);
}

/* Notices wrapper styling */
.woocommerce-notices-wrapper {
margin-bottom: var(--margin-medium);
padding: var(--padding-tiny);
}

.woocommerce-notices-wrapper:empty {
  display: none;
}


.woocommerce form .form-row .input-checkbox {
  display: inline-block;
}

button.button.btn-toggle-pwd {
  display:none;
}

/* Form Global Style */
.woocommerce-EditAccountForm {
  font-family: var(--font-family);
  max-width: var(--form-max-width);
  transition: var(--transition);
}

/* Labels */
.woocommerce-EditAccountForm label {
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--margin-small);
  color: var(--color-text);
  display: block;
}

/* Inputs */
.woocommerce-Input {
  width: 100%;
  color:var(--color-text) !important;
  font-size: var(--font-size-regular) !important;
  padding: var(--padding-small) !important;
  margin-bottom: var(--margin-medium) !important;
  border: var(--border-width) solid var(--color-grey) !important;
  border-radius: var(--border-radius) !important;
  background-color: var(--color-white) !important;
  transition: var(--transition) !important;

  &:focus {
      border-color: var(--color-primary) !important;
      box-shadow: var(--box-shadow);
  }
}

.dark .woocommerce-Input {
  color:var(--color-dark-text) !important;
}

/* Buttons with SVG icons */
.button.btn-toggle-pwd {
  background: none;
  border: none;
  position: absolute;
  top: 50%;
  right: var(--padding-small);
  transform: translateY(-50%);
  cursor: pointer;
}

.feather-eye {
  width: 20px;
  height: 20px;
  color: var(--color-grey);
  transition: var(--transition);

  &:hover {
      color: var(--color-text);
  }
}

/* Helper Texts */
em {
  font-style: normal;
  font-size: var(--font-size-tiny);
  color: var(--color-grey);
}

/* Clear divs - Clearfix */
.clear {
  clear: both;
}

/* Password change legend */
fieldset legend {
  font-size: var(--font-size-medium);
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--margin-medium);
  color: var(--color-text);
}

/* Making sure first and last name fields sit side by side */
.woocommerce-form-row--first,
.woocommerce-form-row--last {
  width: calc(50% - var(--gap-small) / 2);
  float: left;
}

.woocommerce-form-row--last {
  margin-left: var(--gap-small);
}

/* Required Asterisk */
span.required {
  color: var(--color-error);
}
















/* Form Global Style */
.dark .woocommerce-EditAccountForm {
  background-color: var(--color-dark-background);
  color: var(--color-dark-text);
}

/* Labels */
.dark .woocommerce-EditAccountForm label {
  color: var(--color-dark-text);
}

/* Inputs */
.dark .woocommerce-Input {
  background-color: var(--color-dark-background-transparent-light) !important;
  border-color: var(--color-dark-background-transparent-light) !important;
  color: var(--color-dark-text) !important;
  
  &:focus {
      border-color: var(--color-primary) !important;
      box-shadow: none;
  }
}

/* Password change legend */
.dark fieldset legend {
  color: var(--color-dark-text);
}

/* Required Asterisk */
.dark span.required {
  color: var(--color-warning);
}

.subscription-auto-renew-toggle__i {
	border: 2px solid var(--color-success) !important;
	background-color: var(--color-success) !important;
}

.subscription-auto-renew-toggle--off .subscription-auto-renew-toggle__i {
	border-color: var(--color-error) !important;
	background-color: var(--color-error) !important;
}













.dark .wc-block-components-form .wc-block-components-text-input input[type=email], .dark .wc-block-components-form .wc-block-components-text-input input[type=number], .dark .wc-block-components-form .wc-block-components-text-input input[type=tel], .dark .wc-block-components-form .wc-block-components-text-input input[type=text], .dark .wc-block-components-form .wc-block-components-text-input input[type=url], .dark .wc-block-components-text-input input[type=email], .dark .wc-block-components-text-input input[type=number], .dark .wc-block-components-text-input input[type=tel], .dark .wc-block-components-text-input input[type=text], .dark .wc-block-components-text-input input[type=url] {
  color: #fff !important;
}

.dark .wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input, .dark .wc-block-components-form .wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input {

  color: #fff !important;
}



.user-likes .entry-meta {
  display:none;
}

.private {
  display: none;
}

.btn-share {
  display: none;
}

.woocommerce-store-notice {
  display: none !important;
}

.wc-block-checkout, .woocommerce-order {
    max-width: 700px;
}

.woocommerce-thankyou-order-received {
  display: none;
}

.woocommerce table.shop_table {
  align-items: center;
  background-color: var(--color-background-transparent-light) !important;
  border: var(--border-width-small) solid var(--color-primary);
  border-radius: var(--border-radius);
  padding: var(--padding-small) !important;

}


.dark .woocommerce table.shop_table {
  background-color: var(--color-dark-background-transparent-light) !important;
}

.woocommerce ul.order_details {
  margin: 0 !important;
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  border: none;
  border-radius: 5px;
  background-color: var(--color-background-transparent-light);
}

.dark .woocommerce ul.order_details {
  background-color: var(--color-dark-background-transparent-light);
}

.woocommerce ul.order_details li {
  flex: 1;
  padding: 10px 15px;
  text-transform: uppercase;
  font-size: 0.8em;
  line-height: 1.4;
  border: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  margin: 0;
}

.woocommerce ul.order_details li:last-of-type {
  border-right: none;
}

.woocommerce ul.order_details li strong {
  margin-top: 5px;
  font-size: 1.2em;
  text-transform: none;
  color: var(--color-text);
}

.dark .woocommerce ul.order_details li strong {
  color: var(--color-dark-text);
}

.woocommerce ul.order_details li:hover {
  background-color: var(--color-primary);
  color: white;
}

.woocommerce ul.order_details li:hover strong {
  color: white;
}

.password-banner {
  background-color: var(--color-primary) !important;
  color: white;
  padding: 20px;
  font-size: 18px;
  text-align: center;
  margin: 20px 0;
  border-radius: var(--border-radius);
  transition: var(--transition)
}

.password-banner::before {
  content: '\f06a';
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  margin-right: 10px;
  vertical-align: middle;
}

.password-banner-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.password-banner:hover {
  transform: var(--button-hover-transform);
  box-shadow: var(--box-shadow);
}

/* #login-modal,
.modal-backdrop {
    display: none !important;
} */

body.modal-open, html.modal-open {
  overflow: visible !important;
  position: static !important;
  height: auto !important;
  width: 100% !important;
}

.wc-block-components-form .wc-block-components-text-input input[type=email],.wc-block-components-form .wc-block-components-text-input input[type=number],.wc-block-components-form .wc-block-components-text-input input[type=tel],.wc-block-components-form .wc-block-components-text-input input[type=text],.wc-block-components-form .wc-block-components-text-input input[type=url],.wc-block-components-text-input input[type=email],.wc-block-components-text-input input[type=number],.wc-block-components-text-input input[type=tel],.wc-block-components-text-input input[type=text],.wc-block-components-text-input input[type=url] {
  padding: 2.5em 1em 1em 0.5em !important;
}

.wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input,.wc-block-components-form .wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input {
  padding: 2.5em 1em 1em 0.5em !important;
}


.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
    float: none;
    width: 48%;
    clear: none;

    /* Matching the style */
    font-size: var(--font-size-tiny); /* Use the same font size */
    max-width: var(--form-max-width); /* Max width similar to form */
    margin: var(--margin-medium) auto; /* Consistent margin */
    padding: var(--padding-medium); /* Consistent padding */
    background-color: var(--color-background); /* Background color */
    border-radius: var(--border-radius); /* Rounded corners */
    box-shadow: var(--box-shadow); /* Shadow effect */
    color: var(--color-text); /* Text color */
    transition: box-shadow var(--transition), transform var(--transition); /* Smooth transitions */
}

/* If you have specific input styles within the summary, you can add them here */
.woocommerce div.product div.summary .input-class {
    width: 100%;
    padding: var(--padding);
    margin: var(--margin-medium) auto;
    border: var(--border-width) solid var(--color-grey);
    border-radius: var(--border-radius);
    transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

/* Focus and hover state for inputs within the summary */
.woocommerce div.product div.summary .input-class:focus,
.woocommerce div.product div.summary .input-class:hover {
    box-shadow: var(--box-shadow) !important;
    border: var(--form-input-focus-border) !important;
    transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.woocommerce div.product form.cart div.quantity {
  display:none !important;
}

.woocommerce .woocommerce-breadcrumb {
  display: none !important;
}

.wc-block-components-notice-banner.is-info {
  background-color: var(--color-background-transparent-light) !important;
  border-color: var(--color-primary) !important;
}

.dark .wc-block-components-notice-banner.is-info {
  background-color: var(--color-dark-background-transparent-light) !important;
}

.woocommerce-account .woocommerce-MyAccount-content, .woocommerce-account .woocommerce-MyAccount-navigation {
  margin-bottom: var(--margin-medium);
}

.woocommerce-cart {
  background-color: #f9f9f9; /* Background color */
  padding: 20px; /* Padding */
  border-radius: 10px; /* Rounded corners */
  /* Add more styling as needed */
}


.site-header{
  padding-top: 1rem;
  padding-bottom: 1rem;
  padding-left: 10px;
  padding-right: 10px;
	box-shadow: none !important;
  position: static !important;
  z-index:1000;
}

@media (min-width: 782px) {
    .site-header .site-brand {
        width: calc(var(--side-width) - 1rem) !important;
    }
}

/* inner container matches your content width */
.header-container{
  max-width: 1600px;          /* same as main content */
  margin-inline: auto;        /* centers it */
  padding-inline: clamp(16px, 3vw, 32px); /* match content side padding */
  box-sizing: border-box;
}
.site-header .site-logo img,
.site-header .site-brand img,
.site-header .custom-logo {
  height: 48px;
  max-height: 48px; /* beats theme caps */
  width: auto;               /* keep aspect ratio */
}

/* .plyr__controls__item.plyr__menu {
  display: none !important;
} */

.sq-card-wrapper {
  min-width: 100% !important
}

.wc-block-components-totals-coupon-link {
  font-size: var(--font-size-medium) !important;
  display: block; /* This ensures the element is treated as a block-level element */
  text-align: center; /* Centers the text within the element */
  margin-left: auto;
  margin-right: auto;
  width: fit-content; /* Optional: This can help if you want to center the block itself if it doesn't span full width */
}

.woot-widget-bubble {
  position: relative;
  bottom: 75px !important;
}

.play-duration {
    display: none;
 }

.block-loop-item .entry-meta {
  display: none !important;
}

.archive-footer {
  display: none !important;
}

.station-more-from{
  display: none !important;
}

.type-station a {
    pointer-events: none;
}

.block-loop-item .entry-title {
    pointer-events: none;
}

.search-form {
    max-width: 100% !important;
}

.sub-menu {
  z-index: 1000;
  margin-left: 5px !important;
  margin-right: 5px !important;
}

.loop-filter {
  margin-left:1rem !important;
}