/**
* Memberpress Account pages CSS
*/

:root {
  --color-fullBlack: #000000;
  --color-black: #212121;
  --color-dark: #333333;
  --color-lightDark: #4D5961;
  --color-indigo: #96ACF6;
  --color-light: #F5F3ED;
  --color-lime: #E2F6D4;
  --color-galaxy: #D0C1F0;
  --color-green: #17B26A;
  --color-current: currentColor;
  --color-lightGray: #7A7A7A;
  --body-font: studio6, sans-serif;
  --heading-font: bw_stretch;
}

@font-face {
  font-family: "bw_stretchblack";
  src: url("../fonts/bwstretch/bwstretch-black-webfont.woff2") format("woff2"),
    url("../fonts/bwstretch/bwstretch-black-webfont.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "bw_stretch";
  src: url("../fonts/bwstretch/bwstretch-bold-webfont.woff2") format("woff2"),
    url("../fonts/bwstretch/bwstretch-bold-webfont.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "bw_stretch";
  src: url("../fonts/bwstretch/bwstretch-heavy-webfont.woff2") format("woff2"),
    url("../fonts/bwstretch/bwstretch-heavy-webfont.woff") format("woff");
  font-weight: bolder;
  font-style: normal;
}
@font-face {
  font-family: "bw_stretch";
  src: url("../fonts/bwstretch/bwstretch-black-webfont.woff2") format("woff2"),
    url("../fonts/bwstretch/bwstretch-black-webfont.woff") format("woff");
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: "studio6";
  src: url("../fonts/studio6/studio6-demibold-webfont.woff2") format("woff2"),
    url("../fonts/studio6/studio6-demibold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "studio6";
  src: url("../fonts/studio6/studio6-regular-webfont.woff2") format("woff2"),
    url("../fonts/studio6/studio6-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

body {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  font-family: var(--body-font);
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--color-black);
}

a:visited, .mepr-account-container a:visited {
	color: var(--color-black);
}

.mepr-pro-template {
	background: var(--color-light);
	color: var(--color-black);
}
  
.mepr-checkout-container .invoice-wrapper .invoice-heading,
.mepr-checkout-container .invoice-wrapper p,
.mepr-checkout-container .invoice-wrapper .mp-cart-item-details,
.mepr-checkout-container .invoice-wrapper .mp-cart-item,
.mepr-checkout-container .invoice-wrapper .mp-cart-footer,
.have-coupon-link {
	color: var(--color-black);
  font-family: 'bw_stretch';
  font-size: 1.5rem;
  letter-spacing: 0.5px;
  font-weight: 500;
}
  
.mp_wrapper .mp-form-row.mp-address-group label.placeholder-text.active, .mp_wrapper .mp-form-row .mp-form-row-group label.placeholder-text.active, #mepr_loginform .mp-form-label label.placeholder-text.active, .mepr-pro-template .mp_wrapper .mepr_mepr-address-country .mp-form-label label.placeholder-text, .mepr-pro-template .mp_wrapper .mepr_mepr-address-state .mp-form-label label.placeholder-text {
  color: var(--color-black);
}

.mepr-checkout-container .invoice-wrapper .invoice-amount {
  color: var(--color-dark);
  font-family: var(--heading-font);
}

.mepr-checkout-container .form-wrapper input[type="submit"] {
  background-color: var(--color-black);
  color: var(--color-light);
  font-family: var(--heading-font);
  border-radius: 0;
  font-size: 1.5rem;
  padding: .5rem 2.5rem .5rem 1.25rem;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.5;
  transition-property: all;
  transition-duration: .5s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}

/**
* Site Header Dropdown Override
*/
.app-layout .profile-menu__text,
.site-header .profile-menu__text,
.app-layout .profile-menu__text--small,
.guest-layout .profile-menu__text--small {
  color: var(--color-light);
  font-family: var(--heading-font);
  font-weight: 500;
}

.site-header .dropdown__item, .site-header .dropdown a {
  color: var(--color-black);
  font-family: var(--heading-font);
  font-weight: 500;
}

.site-header .dropdown__item:hover,
.site-header .dropdown__item:focus,
.site-header .dropdown a:hover,
.site-header .dropdown a:focus {
  background-color: var(--color-light);
}

/**
* MemberPress Account Pages - Profile Form
*/
.mp_wrapper h1,
.mp_wrapper h2,
.mp_wrapper h3,
#mepr-account-nav .mepr-nav-item a,
.mepr-account-welcome-message {
  color: var(--color-light);
  font-family: var(--heading-font);
  font-weight: 500;
}

.mp_wrapper h1,
.mp_wrapper h2,
.mp_wrapper h3 {
  color: var(--color-black);
}

.mepr-account-welcome-message {
  background-color: var(--color-black);
  border: none;
  border-radius: 0;
  font-size: 1.25rem;
}

.mepr-profile-wrapper > div {
  border: 1px solid var(--color-black);
}

#mepr-account-nav .mepr-nav-item a:hover,
#mepr-account-nav .mepr-nav-item a:focus {
  background-color: var(--color-fullBlack);
}

#mepr-account-nav .mepr-nav-item.--active a,
#mepr-account-nav .mepr-nav-item.mepr-active-nav-tab a,
#mepr-account-nav .mepr-nav-item.--active a:hover,
#mepr-account-nav .mepr-nav-item.mepr-active-nav-tab a:hover,
#mepr-account-nav .mepr-nav-item.--active a:focus,
#mepr-account-nav .mepr-nav-item.mepr-active-nav-tab a:focus {
  background-color: var(--color-light);
  color: var(--color-black);
  font-weight: 500;
}


.site-header .profile-menu__button.--is-mobile,
.site-header .profile-menu__hamburger {
  background-color: var(--color-light);
  color: var(--color-black);
  font-weight: 500;
}

.site-header .profile-menu__button.--is-mobile {
  line-height: 1;
  padding: 6px;
  border-radius: 2px;
  width: 36px;
  height: 36px;
}

@media screen and (max-width: 600px) {
  .mepr-checkout-container .invoice-wrapper,
  .form-wrapper,
  #mepr-account-content {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  } 
}

/**
* Account Page
*/
#mepr-account-content .mepr-pro-account-table__col-actions button {
  color: var(--color-light);
  background: var(--color-light);
  width: 36px;
  height: 36px;
}

#mepr-account-content .mepr-pro-account-table__col-actions button svg {
  width: 36px;
  height: 36px;
  stroke: var(--color-black);
}

.mepr-account-container button,
.mepr-account-container .mepr-button,
.mepr-account-container input[type="button"],
.mepr-account-container input[type="reset"],
.mepr-account-container input[type="submit"] {
  background-color: var(--color-black);
  color: var(--color-light);
  font-family: var(--heading-font);
  border-radius: 0;
  font-size: 1.25rem;
  padding: .5rem 1.5rem;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1.5;
  transition-property: all;
  transition-duration: .5s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}

.mepr-account-container .mepr-button.btn-outline {
  color: var(--color-black);
  border-color: var(--color-black);
}

.mepr-account-container .mepr-button.btn-outline:hover,
.mepr-account-container .mepr-button.btn-outline:active,
.mepr-account-container .mepr-button.btn-outline:focus {
  color: var(--color-light);
  border-color: var(--color-black);
  background-color: var(--color-black);
}

.mepr-tooltip-content a {
  color: var(--color-black);
  font-family: var(--heading-font);
  font-size: 1rem;
  font-weight: 500;
}

.mepr-tooltip-content a:hover, .mepr-tooltip-content a:active {
  background-color: var(--color-light);
}

.mepr-pro-account-table thead th {
  color: var(--color-lightGray);
  border-bottom: 1px solid var(--color-lightGray);
}

.mepr-pro-account-table thead td {
  color: var(--color-black);
  border-bottom: 1px solid var(--color-lightGray);
}

.mepr-pro-account-table p,
.mepr-pro-account-table .sub {
  color: var(--color-black);
}

.text-gray {
  color: var(--color-lightGray);
}

.mepr_modal button.mepr_modal__close {
  color: var(--color-black);
}


@media screen and (max-width: 600px) {
  .mepr-account-container table tr {
    border-bottom: 1px solid var(--color-lightGray);
  }

  div.mepr-pro-account-table__badge {
    padding: 0.375rem 0.75rem !important;
  }

  .mepr-account-container table td {
    color: var(--color-black);
    padding: 0.75rem 0;
  }

  .mepr-account-container table td:before{
    color: var(--color-lightGray);
  }
}