@charset "UTF-8";

/*************************************************************/
/* Amgee Membership Login Block                              */
/*************************************************************/

#amgee_membership_login_block {
  z-index: 101;
  position:relative;
  padding: 0.5em 1em;
  color:   white;
  background-color: black;
  font-weight:bold;
  border-radius: 10px;
  display:inline-block;
}
#amgee_membership_login_block a {
  color: white;  
}
#amgee_membership_login_block a:hover, 
#amgee_membership_login_block a:active{
  color: red;
}

#amgee_membership_login_block div.content {
  display:   flex;  
  flex-wrap: nowrap;
}

#amgee_membership_login_block h2 {
  margin-top:0;
  display: inline;
  font-family: 'Roboto', san-serif;
  font-size: 1.0em;
}

#amgee_membership_login_block .statusAuth::after,
#amgee_membership_login_block .statusNotAuth::after{
  content: "\00bb";
}

#amgee_membership_login_block .buttons a {
  margin-left:0.5em;
}
#amgee_membership_login_block .buttons .createAccountWrapper {
  margin-left:0.4em;
}
#amgee_membership_login_block .createAccountWrapper::before{
  content: "|";
}

.statusAuth {
  display: none;  
}

/****************************************************************************/
/* Amgee Membership Sign up forms                                           */
/****************************************************************************/
#amgee-membership-form h2{
  display: inline;
  vertical-align: middle;
}
#amgee-membership-form .changeLink {
  display: inline;
  vertical-align: middle;
  margin-left: 1em;
}
#amgee-membership-form fieldset{
  border: none;  
  padding: 0;
  font-weight: bold;
}
#amgee-membership-form fieldset span.error,
#amgee_membership_customer fieldset span.error {
  position: relative;
  line-height: 0px;
  display: block;
  top: -.7em;
}

#amgee_membership_customer .error {
  color: #a51b00;
  border-color: #f9c9bf;
}
#amgee-membership-form fieldset .password-confirm span.error, 
#amgee_membership_customer fieldset .password-confirm span.error {
  display: inline;
  top: 0;  
}

#amgee-membership-form .form-item, #amgee-membership-form .form-actions, 
#amgee-membership-form .addPayment {
  margin-top: .5em;
  margin-bottom: 1.5em;
}

#amgee-membership-form .fieldset-wrapper label {
  font-weight: normal;
}

#amgee-membership-form .fieldset-wrapper .inlineDiv, 
#amgee-membership-admin-subscription-form .inlineDiv,
#subscription-admin-form .inlineDiv,
#amgee-membership-admin-member-form .inlineDiv,
#amgee-membership-add-subscription-form .inlineDiv,
#amgee-membership-admin-add-member-form .inlineDiv,
#amgee-membership-admin-add-subscription-form .inlineDiv,
#payment-form .inlineDiv,
#amgee-membership-admin-report-form .inlineDiv { 
  float: left;
  padding-right: 2em;
}

#subscription-admin-form .inlineDiv { 
  float: left;
  padding-right: 1.1em;
}

#subscription-admin-form .inlineDiv .button {
  margin-top: 1.6rem;
}

.clear-float{
  clear: both;
  float: none;
}

#amgee-membership-form .inlineDiv .form-item,
#amgee-membership-admin-subscription-form .inlineDiv .form-item,
#amgee-membership-admin-member-form .inlineDiv .form-item,
#amgee-membership-add-subscription-form .inlineDiv .form-item,
#amgee-membership-admin-add-member-form .inlineDiv .form-item, 
#amgee-membership-admin-add-subscription-form .inlineDiv .form-item,
#amgee-membership-admin-report-form .inlineDiv .form-item ,
#subscription-admin-form .inlineDiv .form-item {
  margin-top: 0;
  padding:0;
}

#amgee-membership-subscription-table td,
#amgee-membership-admin-member-table td,
#amgee-membership-admin-subscription-table td{
  vertical-align: top;
}
#amgee-membership-subscription-table td:nth-child(2) span,
#amgee-membership-admin-subscription-table td:nth-child(4) span{
  border-bottom: 1px dashed #CCCCCC;
  display: inline-block;
  width: 90px;
}

#amgee-membership-admin-report-form select { width: 200px; }

/* card not valid styles */
#amgee-membership-payment-edit-form .card-expired{
  border: #df0101 2px solid;  
}
#amgee-membership-payment-edit-form .card-expiring{
  border: #FDC269 2px solid;  
}
/* payment form */
#payment-form input, #payment-form #card-element{ 
  /* copied from drupal form styles - not fapi form */
  padding: 2px;
  border: 1px solid #ccc;
  border-top-color: #999;
  background: #fff;
  color: #333;
}
#payment-form #card-element{ 
  max-width: 30em; /* constrain width */
}
#payment-form button{ 
  margin: 1em 0; 
}

/* dropdown styles on subscriptions page */
.amgee-membership-ac {
  padding: 3px;
}
.amgee-membership-ac-label {
  font-weight: 700;
}

/* login page */

.page-user.not-logged-in #content {
  position: relative; 
  display: flex;
}
.page-user.not-logged-in #main-content-header{
  display: none;  
}
#content #membership_login .statusNotAuth, 
#content #membership_login .statusAuth, 
#content #membership_login .statusAuth a,
#content #membership_login .statusAuth a:visited{
  color: #fff;
}
.page-user.not-logged-in #content #user-login,
.page-user.not-logged-in #content #user-pass,
#content #membership_login {
  width: 50%;
  border-radius: 12px;
  border: 1px solid #ddd;
  margin: 1em;
  padding: 1em;
  box-sizing: border-box;
}
.page-user.not-logged-in #content .tabs.primary{
  display:flex;
}
#content #startButtons .nav-tabs {
  padding: .5em;
  font-weight: bold;
  border-radius: 12px;  
  display: block;
  clear: both;
  width: 20vw;
  margin: 2em 0;
  text-align: center;
  border: 1px solid #000;
  background-color: #FDC269;
  border: 1px solid #FDC269;
  color: #000;
}
#content #startButtons .nav-tabs a {
  color: #000;
  width: 20vw;
  display: block;
}
#content #createAccountButton:before{
  content: "";
}
/* menu links */
.page-membership ul.action-links a:before { /* mimic seven theme */
  content: "+";
  font-weight: 700;
  width: 1em;
  right: .5em;
  position: relative;
  font-size: larger;
}
.page-membership ul.action-links a { 
  padding-left: 15px;
  line-height: 30px;
  font-weight: bold;
  color: #093f59; /* pbp theme */
}
.page-membership ul.action-links a:hover, .page-membership ul.action-links a:active { 
  color: red; /* red - mok */
}

/* paywall popup */
#block-amgee-membership-amgee-membership-paywall{
  position: absolute;  
  display: none;  
  left: 0;
  top: 0;
  width: 0;
  height: 0;
}
#block-amgee-membership-amgee-membership-paywall.active{
  display: block;  
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 200;
  background-color: rgba(155, 155, 155, .3);
  font-size: 2em;
}
#payWallPopUp{
  position: relative;
  width: 500px;
  max-width: 90vw;
  min-height: 25vh;
  max-height: 90vh;
  background-color: rgba(255, 255, 255, 1);
  margin: auto;
  color: #093f59;
  top: 25vh;
  border-radius: .25em;
  border: 1px solid #dfdfdf;
  padding: 1em 1em 2em 1em;
  box-shadow: 2px 4px 4px rgba(9,63,89, .5);
  text-align: center;
  font-size:.75em;
}
#payWallPopUp .subscribe-btn{
  background-color: #093f59;
  border-radius: .75em;
  color: #fff;
  display: block;
  margin: 1em auto;
  padding: .75em;
  font-size: 1.125em;
  text-align: center; 
  max-width: 65%;
}
#payWallPopUp .subscribe-btn:hover,
#payWallPopUp .subscribe-btn:active
{
  color: #FDC269;
  box-shadow: 2px 4px 4px rgba(9,63,89, .5);
}


/* product selection page */
#product-cards{
  clear: both;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  box-sizing: border-box;
}

#product-cards .product-card{
  margin: 2.5% 1%;
  border: 1px solid #dfdfdf;
  border-radius: .25em;
  padding: 1em 1em 2em 1em; 
  flex-basis: 30%;
  position: relative;
  box-sizing: border-box;
}
/* #product-cards .product-card:nth-child(3n+1){ /* first in a row of 3 */
  /* margin-left:0;
} */
/* #product-cards .product-card:nth-child(3n+0){ last in a row of 3 */
  /* margin-right:0;
} */ */
#product-cards .product-card-image{
  text-align: center;
  padding: .5em;
}
#product-cards .product-card h2{
  text-align: center;
}
#product-cards .product-card .product-description {
  margin-bottom: 1em;  
}
#product-cards .product-card .subscribe-btn{
  background-color: #093f59;
  border-radius: .75em;
  color: #fff;
  display: block;
  margin: 1em auto;
  padding: .75em;
  font-size: 1.125em;
  text-align: center; 
}
#product-cards .product-card .form-type-textfield{
  display: inline-block;
}
#product-cards .product-card .form-type-textfield input{
  padding: .5em;
  margin: 0 1em 0 .25em;
}
#product-cards .product-card input[type=submit].form-submit {
  background-color: #093f59;
  border: none;
  border-radius: .75em;
  color: #fff;
  display: inline-block;
  margin: 1em auto;
  padding: .75em;
}
#product-cards .product-card .subscribe-btn:hover,
#product-cards .product-card .subscribe-btn:active
{
  color: #FDC269;
  box-shadow: 2px 4px 4px rgba(9,63,89, .5);
}
#login-overlay{
  height: 100%;
  width: 100vw;
  position: fixed;
  background-color: rgba(255,255,255, .5);
  z-index: 1000; /* arbitrarily high */
}
#login-overlay p{
  text-align: center;
  vertical-align: middle;
  font-size: 2em;
  font-weight: bold;
  top: 33%;
  position: absolute;
  width: 100%;
  
}

.amgee-membership-form {
  margin-left: 300px;
  margin-right: 300px;
}


#amgee-membership-admin-report-form .inlineDiv.button-submit,
#amgee_membership_customer #member_info #phone-div,
#amgee_membership_customer #member_info #email-div,
#amgee_membership_customer #gift_recipient-div #gift_recipient_email-div,
#amgee_membership_customer #gift_recipient-div #gift_recipient_phone-div, 
#amgee-membership-form #member_info #edit-member-info #phone-div,
#amgee-membership-form #member_info #edit-member-info #email-div,
#amgee-membership-form #gift_recipient-div #gift_recipient_email-div,
#amgee-membership-form #gift_recipient-div #gift_recipient_phone-div {
  clear: both;
}

/**
 * Password strength indicator.
 */
 #amgee_membership_customer .password-strength,
 #amgee-membership-form .password-strength,
 #amgee-cognito-password-member-form .password-strength {
  width: 17em;
  float: right;  /* LTR */
  margin-top: 1.4em;
}
#amgee_membership_customer .password-strength-title,
#amgee-membership-form .password-strength-title,
#amgee-cognito-password-member-form .password-strength-title {
  display: inline;
}
#amgee_membership_customer .password-strength-text,
#amgee-membership-form .password-strength-text,
#amgee-cognito-password-member-form .password-strength-text {
  float: right; /* LTR */
  font-weight: bold;
}
#amgee_membership_customer .password-indicator,
#amgee-membership-form .password-indicator  {
  background-color: #C4C4C4;
  height: 0.3em;
  width: 100%;
}
#amgee_membership_customer .password-indicator div,
#amgee-membership-form .password-indicator div  {
  height: 100%;
  width: 0%;
  background-color: #47C965;
}
#amgee_membership_customer input.password-confirm,
#amgee_membership_customer input.password-field,
#amgee-membership-form input.password-confirm,
#amgee-membership-form input.password-field {
  width: 16em;
  margin-bottom: 0.4em;
}
#amgee_membership_customer div.password-confirm,
#amgee-membership-form div.password-confirm {
  float: right;  /* LTR */
  margin-top: 1.5em;
  visibility: hidden;
  width: 17em;
}
#amgee_membership_customer div.form-item div.password-suggestions,
#amgee-membership-form div.form-item div.password-suggestions  {
  padding: 0.2em 0.5em;
  margin: 0.7em 0;
  width: 38.5em;
  border: 1px solid #B4B4B4;
}
#amgee_membership_customer div.password-suggestions ul,
#amgee-membership-form div.password-suggestions ul  {
  margin-bottom: 0;
}
#amgee_membership_customer .confirm-parent,
#amgee_membership_customer .password-parent,
#amgee-membership-form .confirm-parent,
#amgee-membership-form .password-parent,
#amgee-cognito-password-member-form .confirm-parent,
#amgee-cognito-password-member-form .password-parent  {
  clear: left; /* LTR */
  margin: 0;
  width: 36.3em;
}

#amgee-cognito-password-member-form .password-confirm__confirm {
  display: block;
  max-height: 4rem;
} 

#amgee-cognito-password-member-form .password-suggestions {
  margin: 4em 0;
}

@media only screen and (max-width: 1023px) {
   
  .page-user.not-logged-in #content,
  .page-user.not-logged-in #content #user-login,
  .page-user.not-logged-in #content #user-pass {
    display: block;
    width: 100%;
    margin: 1em 0;
  }
  
  #content #startButtons .nav-tabs,
  #content #startButtons .nav-tabs a {
    width: 50vw;
  }
  
  #product-cards .product-card{
    flex-basis: 45%;
  }
  /* #product-cards .product-card:nth-child(3n+1){ first in a row of 3
    margin-left:2.5%;
  }
  #product-cards .product-card:nth-child(3n+0){ last in a row of 3
    margin-right:2.5%;
  } */
  #product-cards .product-card:nth-child(2n+1){ /* first in a row of 2 */
    margin-left:0;
  }
  #product-cards .product-card:nth-child(2n+0){ /* last in a row of 2 */
    margin-right:0;
  }
}

@media only screen and (max-width:736px) {

  #product-cards .product-card{
    flex-basis: 75%;
    margin: 1em auto;
  }
  #product-cards .product-card:nth-child(3n+1){ /* first in a row of 3 */
    margin-left:auto;
  }
  #product-cards .product-card:nth-child(3n+0){ /* last in a row of 3 */
    margin-right:auto;
  }
  #product-cards .product-card:nth-child(2n+1){ /* first in a row of 2 */
    margin-left:auto;
  }
  #product-cards .product-card:nth-child(2n+0){ /* last in a row of 2 */
    margin-right:auto;
  }
  .amgee-membership-form{
    margin: 0 1% 0 0;
  }

}

/*********************************************************************/
/* Amgee Membership                                                  */
/*********************************************************************/

#membership_login {
  background-color:#000;
}
#amgee_membership_login_block_home_page {
  background-image: linear-gradient(#000,#555);
}
#content #startButtons .nav-tabs {
  background-color: #000;
  border: 1px solid #000;
  color: #000;
}
#content #startButtons .nav-tabs a {
  color: #000;
}

/* menu links */
.page-membership ul.action-links a {
  color: #000; 
}

/* paywall popup */
#block-amgee-membership-amgee-membership-paywall.active{
  background-color: rgba(155, 155, 155, .3);
}
#payWallPopUp{
  background-color: rgba(255, 255, 255, 1);
  box-shadow: 2px 4px 4px rgba(255, 255, 255, .5);
}
#payWallPopUp .subscribe-btn{
  background-color: #000;
  color: #fff;
}
#payWallPopUp .subscribe-btn:hover,
#payWallPopUp .subscribe-btn:active{
  color: red;
  box-shadow: 2px 4px 4px rgba(255, 255, 255, .5);
}


/* product selection page: membership-member-product */

.amgee-membership-product-form #product-cards-content {
  background-color:#eee;
  border-radius: 1em;
  padding: 1em;
}

.pbp .amgee-membership-product-form #product-cards-content {
  background-image: linear-gradient(#111,#02a3a7,#111);
  border-radius: 1em;
  padding: 1em;
}

.online_member_product_intro,
.online_member_product_end {
  padding: 0 1.0em;
  border-radius:1em;
}

.pbp .online_member_product_intro,
.pbp .online_member_product_end {
  color: white;
  padding: 0 1.0em;
  border-radius: 1em;
}

.online_member_product_intro {
  border-bottom:1px solid #aaa;
}
.online_member_product_end {
  border-top:1px solid #aaa;
}
.online_member_product_intro a,
.online_member_product_end a {
  color:red;
  text-decoration:underline;
}
/* CUSTOM support css */
.online_member_product_end h3, .online_member_product_end p {
  margin-bottom: 10px;
}
.online_member_product_end .supporter_notes {
  font-size: 13px;
}
.online_member_product_end .supporter_notes a {
  color:red;
  letter-spacing: 0.5px;
}
.pbp .online_member_product_end .supporter_notes a {
  color: #fff;
}

#product-cards .product-card.block {
  border:1px solid #fff;
  background-color:#ccc;
}
#product-cards .product-card-image,
#product-cards .product-description {
  display:none;
}
#product-cards .product-card h2 {
  color:white;
  background-color:black;
  border-radius:1em;
  border-bottom:1px solid white;
  padding:0.25em 0;
}

.pbp #product-cards .product-card h2 {
  color: white;
  background-color: #0c4344;
  padding: 0.25em 0;
  border-radius: 1em;
  border-bottom: 1px solid white;
}

#product-cards .product-card .subscribe-btn,
#product-cards .product-card input[type=submit].form-submit {
  color: #cc0000;
  font-weight:bold;
  background-color:#eee;
  border-radius:1.5em;
  box-shadow: 2px 4px 5px black;
}

.pbp #product-cards .product-card .subscribe-btn,
.pbp #product-cards .product-card input[type=submit].form-submit {
  border-radius: 1.5em;
  background-image: linear-gradient(#eaea00, yellow, #b3b300);
  color: black;
  font-weight: bold;
  box-shadow: 2px 4px 4px #000;
}
#product-cards .product-card .subscribe-btn:hover,
#product-cards .product-card .subscribe-btn:active,
#product-cards .product-card input[type=submit].form-submit:hover,
#product-cards .product-card input[type=submit].form-submit:active {
  color:red;
  background-image:linear-gradient(#ddd,#aaa,#ddd);
  box-shadow: 2px 4px 5px #888;
}


/* editor dashbord changes added. */
.view-mok-core-editor-dashboard .views-field-field-tags .tags-data:first-of-type::before {
  content: "Tags: ";
}

.path-membership-member-subscribe .datepicker.dropdown-menu,
.transaction-reports .datepicker.dropdown-menu,
.path-membership-subscription-add .datepicker.dropdown-menu {
  z-index: 1000 !important;
}

.path-membership #rid-content {
  width: 70%;
  margin-right: 350px;
  margin-left: 0;

}

.path-membership #rid-sidebar-first {
  width: 25%;
  margin-left: -300px;
}

#amgee_membership_login_block_home_page .statusAuth h2::after,
#amgee_membership_login_block_home_page .statusNotAuth h2::after{
  content: " \00bb";
}

#amgee_membership_login_block_home_page .statusAuth a {
  text-decoration: underline;
}

#amgee_membership_login_block_home_page h2 a {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
  width: 55%;
}

/* =============================================================================
 *   Tabs (local tasks)
 * ========================================================================== */
/* line 955, ../sass/global.styles.scss */
#tasks {
  margin-bottom: 15px;
}

/* line 960, ../sass/global.styles.scss */
ul.primary {
  border-bottom-color: #ccc;
  margin: 20px 0;
  padding: 0 0 0 5px;
}
/* line 965, ../sass/global.styles.scss */
ul.primary li {
  display: block;
  float: left;
  margin: 0 1px -1px;
}
/* line 970, ../sass/global.styles.scss */
ul.primary li a {
  background-color: #f5f5f5;
  border-color: #ccc;
  margin-right: 1px;
  padding: 0 10px;
  display: block;
  float: left;
  height: 1.5em;
  line-height: 1.5em;
}
/* line 980, ../sass/global.styles.scss */
ul.primary li a:hover, ul.primary li a:focus {
  background-color: #eee;
  border-color: #ccc;
}
/* line 989, ../sass/global.styles.scss */
ul.primary li.active a,
ul.primary li.active a:hover,
ul.primary li.active a:focus {
  background-color: #fff;
  border-bottom-color: #fff;
}

/* line 999, ../sass/global.styles.scss */
ul.secondary {
  border-bottom: 1px solid #ccc;
  margin: 1em 0 0;
  padding: 0 .3em 1em;
}
/* line 1004, ../sass/global.styles.scss */
ul.secondary li {
  border-right: 0;
  list-style: none;
  padding: 0 10px 0 0;
}
/* line 1010, ../sass/global.styles.scss */
ul.secondary li a:hover, ul.secondary li a.active {
  border-bottom: none;
  text-decoration: underline;
}

/* =============================================================================
 *   Action links
 * ========================================================================== */
/* line 1024, ../sass/global.styles.scss */
ul.action-links {
  margin: 20px 0 0;
  list-style: none;
}

/**
 * Markup generated by theme_menu_local_tasks().
 */
 ul.primary {
  border-bottom: 1px solid #bbb;
  border-collapse: collapse;
  height: auto;
  line-height: normal;
  list-style: none;
  margin: 5px;
  padding: 0 0 0 1em; /* LTR */
  white-space: nowrap;
}
ul.primary li {
  display: inline;
}
ul.primary li a {
  background-color: #ddd;
  border-color: #bbb;
  border-style: solid solid none solid;
  border-width: 1px;
  height: auto;
  margin-right: 0.5em; /* LTR */
  padding: 0 1em;
  text-decoration: none;
}
ul.primary li.active a {
  background-color: #fff;
  border: 1px solid #bbb;
  border-bottom: 1px solid #fff;
}
ul.primary li a:hover {
  background-color: #eee;
  border-color: #ccc;
  border-bottom-color: #eee;
}

.calender-page .datepicker.dropdown-menu {
  z-index: 1000 !important;
}

div.amgee_dropbox_links {
  display: inline-block;
}

.path-user-login-landing #amgee_membership_login_block_home_page {
  display: none;
}

#amgee-membership-account-password-form #edit-id {
  display: none;
}

/* Blur background */
.blur-background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.7);
  z-index: 999;
  backdrop-filter: blur(5px); /* This creates the blur effect */
}

/* Loading message */
.loading-message {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 20px;
  background-color: #333;
  color: #fff;
  font-size: 16px;
  border-radius: 5px;
  z-index: 1000;
  text-align: center;
}

#amgee_membership_payment .js-form-item-default-card input[type="radio"]:checked {
  pointer-events: none; /* Prevent any interaction */
  opacity: 0.5;         /* Make it look disabled */
  cursor: not-allowed;
}

.authenticated-only #toolbar-bar,
.authenticated-only .account-edit {
  display: none;
}

/* membership join buttons */
#amgee-membership-product-form .signInButton {
  cursor: pointer;
}

.path-membership-member-subscribe .form-item-gift-recipient-state .form-type-select__select-wrapper:not(.is-multiple) .form-select,
.path-membership-member-subscribe #edit-member-info .form-type-select__select-wrapper:not(.is-multiple) .form-select {
  padding-left: 0.7%;
}

/* Loading spinner styles */
#membership-loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: center;
}

.loading-spinner {
  width: 50px;
  height: 50px;
  border: 5px solid #f3f3f3;
  border-top: 5px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}