/*
Theme Name: Anna Lawska
Author: StudioX
Description: Wordpress store for Anna Ławska designed by Extra Studio
Version: 1.0.1
Requires at least: 5.0
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: anna-lawska
*/

/* Font Face Definitions */
@font-face {
  font-family: 'Lato';
  src: url('./fonts/Lato-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Lato';
  src: url('./fonts/Lato-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}

/* Define a transition duration during page visits */
html.is-changing .transition-fade {
  transition: opacity 0.3s ease-in-out;
  opacity: 1;
}
/* Define the styles for the unloaded pages */
html.is-animating .transition-fade {
  opacity: 0;
}

/* General Reset */
* {
  box-sizing: border-box !important;
  padding: 0;
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

:root {
  --black: #000000;
  --black-10: rgba(0, 0, 0, 0.1);
  --black-20: rgba(0, 0, 0, 0.2);
  --white: #ffffff;
  --light-gray: #e3e3e3;
  --light-gray-60: rgba(227, 227, 227, 0.6);
  --gray-c1: #c1c1c1;
  --dark-gray: #020202;
  --medium-gray: #989898;

  --navbar-mobile-height: 72rem;
  --navbar-desktop-height: 120rem;
}

html {
  font-size: min(calc(100vw / 430), 1.3px);
}

@media (min-width: 1024px) {
  html {
    font-size: calc(100vw / 1728);
  }
}

body {
  font-size: 16rem;
  font-family: 'Lato', sans-serif;
  color: var(--black);
  background: var(--white);
  overscroll-behavior: none;
  overflow-x: hidden;
  overflow-y: scroll;
}

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

button {
  all: unset;
  cursor: pointer;
}

svg {
  width: 100%;
  height: 100%;
}

textarea,
input {
  all: unset;
  appearance: none;
  border: none;
}

.woocommerce-input-wrapper,
select {
  all: unset;
  appearance: none;
}

input[type='radio'],
input[type='checkbox'] {
  all: revert;
  appearance: revert;
  border: revert;
}

.underline {
  text-decoration: underline;
}

main {
  font-size: 16rem;
}

/* Hides element on mobile (below 1024px) */
@media (max-width: 1023px) {
  .hide-on-mobile {
    display: none !important;
  }
}

/* Hides element on desktop (1024px and above) */
@media (min-width: 1024px) {
  .hide-on-desktop {
    display: none !important;
  }
}

/* Aspect Ratios */
@media (max-width: 1023px) {
  .mobile-16x9 {
    aspect-ratio: 16/9;
  }

  .mobile-1x1 {
    aspect-ratio: 1/1;
  }

  .mobile-3x2 {
    aspect-ratio: 3/2;
  }
}

@media (min-width: 1024px) {
  .desktop-16x9 {
    aspect-ratio: 16/9;
  }

  .desktop-1x1 {
    aspect-ratio: 1/1;
  }

  .desktop-3x2 {
    aspect-ratio: 3/2;
  }
}

.flexible-content__wrapper {
  display: grid;
  row-gap: 20rem;
}

@media (min-width: 1024px) {
  .flexible-content__wrapper {
    row-gap: 40rem;
  }
}

/* wrapper added to make sure that footer is only visible after "scroll" */
.outer-wrapper {
  min-height: calc(100vh - var(--navbar-mobile-height));
}

@media (min-width: 1024px) {
  .outer-wrapper {
    min-height: calc(100vh - var(--navbar-desktop-height));
  }
}

/* text-alignment */
@media (max-width: 1023px) {
  .mobile__text-left {
    text-align: left;
  }

  .mobile__text-center {
    text-align: center;
  }

  .mobile__text-right {
    text-align: right;
  }
}

@media (min-width: 1024px) {
  .desktop__text-left {
    text-align: left;
  }

  .desktop__text-center {
    text-align: center;
  }

  .desktop__text-right {
    text-align: right;
  }
}

#payment {
  background: unset !important;
}