/*
 Theme Name: AxusDivi5
 Description: Divi5 Child Theme for Axus Decor
 Author: Sejul Shah
 Template: Divi
 Version: 2.0.0
*/

/* =Theme customization starts here
------------------------------------------------------- */

:root {
--spacing:0.25rem;--breakpoint-xl:80rem;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-base--line-height:1.5;--text-lg:1.125rem;--text-lg--line-height:1.55556;--text-xl:1.25rem;--text-xl--line-height:1.4;--text-2xl:1.5rem;--text-2xl--line-height:1.33333;--text-3xl:1.875rem;--text-3xl--line-height:1.2;--text-5xl:3rem;--text-5xl--line-height:1;--text-8xl:6rem;--text-8xl--line-height:1;--font-weight-bold:700;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--blur-sm:8px;--default-transition-duration:150ms;--default-transition-timing-function:cubic-bezier(0.4,0,0.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-blue-300:oklch(0.809 0.105 251.813);--color-blue-600:oklch(0.546 0.245 262.881);--color-blue-700:oklch(0.488 0.243 264.376);--color-green-300:oklch(0.871 0.15 154.449);--color-green-400:oklch(0.792 0.209 151.711);--color-green-500:oklch(0.723 0.219 149.579);--color-red-200:oklch(0.885 0.062 18.334);--color-red-300:oklch(0.808 0.114 19.571);--color-red-400:oklch(0.704 0.191 22.216);--color-red-600:oklch(0.577 0.245 27.325);--color-red-700:oklch(0.505 0.213 27.518);--color-gray-100:oklch(0.97 0 0);--color-gray-200:oklch(0.922 0 0);--color-gray-300:oklch(0.87 0 0);--color-gray-400:oklch(0.708 0 0);--color-gray-500:oklch(0.556 0 0);--color-black:#000;--color-white:#fff;--color-brand:oklch(0.772 0.0962 182.63);--color-brand-l:oklch(0.84 0.0962 182.63);--color-brand-sec:oklch(0.358 0.0227 245.93);--font-sans: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

header{background-color:var(--color-brand);position:sticky;top:0;z-index:15;section{align-items:center;display:flex;gap:1rem;margin:0 auto;max-width:var(--breakpoint-xl);padding:.5rem 1rem}button{cursor:pointer}nav{&:focus-within{&>ul{opacity:1;visibility:visible}}}}#header_icons{flex-grow:1;justify-content:flex-end}#header_icons,#header_menu{display:flex;gap:1rem}header nav>ul{opacity:0;visibility:hidden}#header_products{img{display:inline-block;height:2rem;margin-right:1rem}a{display:block}}#searchFormPopover{background-color:var(--color-brand);margin:0 auto;max-width:var(--breakpoint-xl);padding:.25rem 1rem;text-align:right;width:100%;input{border-radius:.5rem}}@media screen and (max-width:48rem){#header_menuclose{border:1px solid var(--color-brand);border-radius:var(--radius-xl);cursor:pointer;padding:.5rem 1rem;position:absolute;right:.25rem;top:.25rem}#header_img{order:999;img{height:3rem}}#header_menu{background-color:#fff;border:2px solid var(--color-brand-sec);border-radius:var(--radius-xl);flex-direction:column;height:calc(100vh - 2rem);left:0;overflow-y:scroll;padding:1rem;position:absolute;top:0;transition:opacity .5s;width:calc(100vw - 2rem);z-index:99;&>li>:is(a,button){color:var(--color-brand);font-size:var(--text-2xl);font-weight:700;line-height:var(--tw-leading,var(--text-2xl--line-height))}}#header_products ul{display:flex;flex-direction:column;gap:1rem;padding:1rem}a:hover{text-decoration:underline var(--color-brand)}#header_icons{li:first-child{flex-grow:1}img{height:2rem}}}@media screen and (min-width:48rem){header nav{flex-grow:1;width:100%}#header_button,#header_menuclose{display:none}#header_img{img{height:4rem}}#header_menu{align-items:center;justify-content:center;opacity:1;position:relative;visibility:visible;&>li>:is(a,button){font-weight:700}}#header_admin,#header_products{button{&:after{content:"\25bc"}}}#header_admin,#header_products,#locale_switcher{position:relative;ul{background-color:#fff;border:2px solid var(--color-brand-sec);border-radius:var(--radius-xl);left:0;opacity:0;padding:1rem;position:absolute;top:auto;transition:opacity .5s;visibility:hidden}&:focus-within{&>ul{opacity:1;visibility:visible}}}#header_products{position:static;ul{display:grid;gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));max-width:var(--breakpoint-xl);width:100%}a{&:hover{background-color:var(--color-gray-200)}}}#header_icons{li:first-child{display:none}}#searchFormPopover{padding:1rem}}

footer{background:var(--color-brand-sec)}#footer_top{display:flex;flex-direction:column;font-size:var(--text-xl);gap:calc(var(--spacing)*4);justify-content:center;line-height:var(--tw-leading,var(--text-xl--line-height));padding:calc(var(--spacing)*2);text-align:center;--tw-font-weight:var(--font-weight-bold);background:var(--color-brand);font-weight:var(--font-weight-bold);text-transform:uppercase;a{border:1px solid var(--color-brand-sec);display:block}}#footer_main{display:grid;gap:calc(var(--spacing)*4);margin-block:calc(var(--spacing)*8);margin-inline:auto;max-width:var(--breakpoint-xl);padding:calc(var(--spacing)*2)}#footer_main_social{display:flex;flex-wrap:wrap;font-size:var(--text-2xl);gap:calc(var(--spacing)*2);justify-content:center;line-height:var(--tw-leading,var(--text-2xl--line-height));margin-block:calc(var(--spacing)*8);a{padding:calc(var(--spacing)*2)}}#footer_main_company{dt{color:var(--color-brand);font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height));margin-block:calc(var(--spacing)*4);--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold);text-transform:uppercase}a{color:#fff}}#footer_main_guides{a{color:var(--color-brand);font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height));margin-block:calc(var(--spacing)*4);--tw-font-weight:var(--font-weight-bold);display:inline-block;font-weight:var(--font-weight-bold);text-transform:uppercase}}#footer_main_address{color:#fff;display:flex;flex-direction:column;font-size:var(--text-lg);gap:calc(var(--spacing)*4);line-height:var(--tw-leading,var(--text-lg--line-height));text-align:center;img{height:8rem}}#footer_nav{border-top:1px solid var(--color-brand);margin-inline:auto;max-width:var(--breakpoint-xl);padding:1rem;ul{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(18rem,1fr))}img{display:inline-block;height:3rem;margin-right:1rem}a{color:#fff}}#footer_base{background-color:var(--color-brand);color:var(--color-brand-sec);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));padding:calc(var(--spacing)*1);text-align:center}:is(#footer_main_company,#footer_main_address,#footer_nav) a:hover{color:var(--color-brand)}@media screen and (min-width:48rem){#footer_top{flex-direction:row}#footer_main{margin-block:calc(var(--spacing)*8);padding:calc(var(--spacing)*4)}}@media screen and (min-width:64rem){#footer_main{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr}#footer_main_social{grid-column:3/4;grid-row:2/3;justify-content:flex-end}#footer_main_company{grid-column:1/2;grid-row:1/3}#footer_main_guides{grid-column:3/4;grid-row:1/2;text-align:right}#footer_main_address{grid-column:2/3;grid-row:1/3}}

@keyframes dialogAnim {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

#dialog-product-detail {
  animation: dialogAnim 0.2s ease-in;
  box-shadow: 2px 2px 10px 1px rgb(0 0 0 / 20%);
  border-radius: 0.5rem;
  width: 100%;
  padding: 0;
  border: 0;
}

#dialog-product-detail div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 10;
  top: 0;
  position: sticky;
  padding: 0.5rem;
  background-color: var(--color-brand);
}

#dialog-product-detail iframe {
  margin: 0.5rem;
  width: 100%;
  height: 80vh;
}

body:has(#dialog-product-detail[open]) {
  overflow: hidden;
}

@media (min-width: 1280px) {
  #dialog-product-detail {
    width: 66.666667%;
  }
}

/** Common Styles */

.mr-2 {
  margin-right: 0.5rem;
}

.form-button {
  border: none;
  border-radius: 0.375rem;
  background-color: var(--color-brand);
  padding: 0.5rem 1rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.form-button:hover {
  background-color: rgb(116 230 212 / 1);
}

/** Tweaks to alter for divi css */

header, footer {
  font-family: var(--default-font-family);
}

header section {
  font-size: 1rem
}

header a {
  color: var(--color-brand-sec);
}

header button {
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 1rem
}

header input {
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5rem;
}

@media (min-width: 768px) {
  #header_menu > li > :is(a, button) {
    color: black;
  }
}

footer {
  color: black;
  font-size: 1rem;
}

footer a {
  color: inherit;
}

footer dd {
  margin: 0;
}

#footer_main :is(ul, dt, dd, p) {
/*  list-style: none !important;*/
  padding: 0 !important;
/*  margin: 0;*/
}

#footer_nav a, #header_products a {
  display: flex;
  align-items: center;
}

/* End of tweaks */