
.account-nav-hidden .account-body {padding-left: 21px !important;}
.affirm-as-low-as {font-size:13px !important;}
.affirm-modal-trigger {text-decoration:underline !important;}

.alert-error {background-color:#cc5650 !important;}

.alertBox--error { display: none !important; }
.alertBox[data-alert-type="error"] { display: none !important; }
[data-alerts]: # ".alertBox { display: none !important; }"
[data-cart-errors]: # "{ display: none !important; }"
[data-cart-errors]: # ".alert { display: none !important; }"
.alert.alert-error { display: none !important; }


@font-face {
  font-family:"playfair";
  src: url("https://store-ej00a4zcne.mybigcommerce.com/content/fonts/PlayfairDisplay-VariableFont_wght.ttf") format("truetype");
}

@font-face {
font-family:"Heinberg Regular";
src: url("https://store-ej00a4zcne.mybigcommerce.com/content/fonts/Heinberg-Regular.otf");
}

@font-face {
font-family:"Oranges Lemons Script";
src: url("https://store-ej00a4zcne.mybigcommerce.com/content/fonts/Oranges And Lemons Script.otf");
}

@font-face {
font-family:"American Lemon";
src: url("https://store-ej00a4zcne.mybigcommerce.com/content/fonts/American Lemon Sans.ttf");
}


BODY DIV MAIN DIV DIV DIV DIV DIV A#zoom:not(.mz-no-rt-width-css) > .mz-figure:not(.mz-no-rt-width-css) > img {
  width: auto !important;
  max-width:100% !important;
}

BODY DIV MAIN DIV DIV DIV DIV DIV A#zoom > .mz-figure > img {
  max-height: 650px !important;
  width:auto !important;
  max-width:100% !important;
}

.account-header .account-heading {text-align: left !important;}

.account-heading {
  padding-bottom: 15px !important;
  font-size: 30px !important;
}

.account-horizontal-link {
	margin-right:17px;
	font-weight:500 !important;
	font-size:18px;
	font-family: "Cardo";
	color:#696969;
}
.account-horizontal-link:hover {text-decoration:none;color:#000;}

.account-items .account-item:first-child {
  border-top: 1px solid #dfdfdf;
  padding-top:15px !important;
}

.account-body 
{
border-left:0px !important;
-webkit-box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);-moz-box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);padding:20px 20px 20px 5px;
}

.account-nav {display:none !important;}
.account-menu {display:none !important;}
#account-menu-pc {display:none !important;}

.account-status {
  padding: 10px 15px 10px !important;
  background: #f58f8a !important;
}

.account-tab
{width:47%;
height:130px !important;
-webkit-box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);
-moz-box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);
box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);
margin-top:15px;margin-bottom:15px;
position:relative;}

.account-tab table, th, td {
  border: 0px solid #ffffff !important;
  color:#000 !important;
}

.account-tab td {padding: 10px 10px 10px 20px !important;}

.account-tab-c1 {width:85px;vertical-align:middle !important;}
.account-tab-c1 img {width:50px;}

.account-tab-left
{float:left;}

.account-tab-middle
{margin:15px auto;}

.account-tab-right
{float:right;}

.account-tab-table {position: absolute; top: 38%; left: 50%; transform: translate(-50%, -50%);}

.account-tab-txt1
{font-size:30px;}

.account-welcome {background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/icons/account-icon-2.png);
background-position:10px 17px;
background-repeat:no-repeat;
display:inline;
background-size:auto 15px;
padding-left:50px !important;}

.alert-success {background-color:#cc5650 !important;}

/* ============= CART PAGE STUFF ================== */
.account-heading, .blog-item-title, .blog-post-title, .cart-row .cart-item-name, .main-menu, .page-heading, h1, h2, h3, h4, h5, h6, th {
  font-weight: 500 !important;
}

.cart-modal-continue {
border-radius:6px !important;
}

.button-primary {background-color:#cc5650 !important;border-color:#cc5650 !important;background-image: none !important;}
.button-primary:hover {background-color:#b3605b !important;}

.cart-header .cart-product {color: #000;}
.cart-header .cart-each {color: #000;}
.cart-header .cart-quantity {color: #000;}
.cart-header .cart-total {color: #000;}
.cart-row .cart-item-name {color: #000 !important;}
@media screen and (min-width: 768px) {
  .cart-row .cart-each, .cart-row .cart-remove, .cart-row .cart-total {
    color:#000 !important;
  }
}
.cart-update-quantity {color: #000 !important;display:none !important;}
.cart-totals-label {color: #000 !important;}
.cart-totals-row {color: #000 !important;}
.cart-totals-value {color: #000 !important;}
.shipping-toggle {color: #000 !important;}
#cart-related-section {width:35%;float:left !important;}

#cart-related-section h2 {text-align:right !important;}

.catalog-desktop {position: relative; height: 800px; width: 95%; margin: 0 auto;}
.catalog-mobile {position: relative; height: 375px; width: 95%; margin: 0 auto;display:none;}

.catalogs-all {text-align:center;}
.catalog-single {display:inline-block; margin:20px;width:225px;}


/* ======================= CONTACT PAGE CSS ============================ */

/* ============================================================
   Echo Park Paper — Contact Us & FAQ Page Styles
   Add to your main stylesheet.
   All selectors prefixed with "contact-pg-" to avoid conflicts.
   ============================================================ */


/* ----- Outer Wrapper ----- */
.contact-pg-wrapper {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0px 0px 0px 95px;
  box-sizing: border-box;
}


/* ----- Two-Column Top Row ----- */
.contact-pg-top-row {
  display: flex;
  flex-wrap: wrap;
  gap: 50px;
  align-items: flex-start;
  margin-bottom: 17px;
}

.contact-pg-col-left {
  flex: 1 1 300px;
  min-width: 280px;
  margin-right:50px;
}

.contact-pg-col-right {
  flex: 1 1 280px;
  min-width: 280px;
}


/* ----- Section Titles (h2) ----- */
.contact-pg-section-title {
  font-size: 2.2rem !important;
  font-weight: 400;
  margin: 0 0 18px 0;
  line-height: 1.2;
}


/* ----- Contact Info Block ----- */
.contact-pg-support-hours {
  font-size: 0.95rem;
  line-height: 1.8;
  margin: 0 0 14px 0;
}

.contact-pg-indent {
  display: inline-block;
  padding-left: 80px;
}

.contact-pg-contact-line {
  font-size: 0.95rem;
  margin: 0 0 10px 0;
  padding-left: 4px;
}

.contact-pg-link {
  color: inherit;
  text-decoration: none;
}

.contact-pg-link:hover {
  text-decoration: underline;
}


/* ----- Common FAQ's Section ----- */
.contact-pg-common-faqs {
  margin-top: 36px;
}

.contact-pg-divider {
  border: none;
  border-top: 1px solid #ccc;
  margin: 0;
}


/* ----- Accordion ----- */
.contact-pg-accordion-item {
  /* The hr above each item acts as the top border */
}

.contact-pg-accordion-trigger {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background: none;
  border: none;
  padding: 14px 0;
  cursor: pointer;
  text-align: left;
  gap: 12px;
}

.contact-pg-accordion-trigger:focus {
  outline: 2px solid #999;
  outline-offset: 2px;
}

.contact-pg-accordion-question {
  font-size: 0.95rem;
  font-weight: 400;
  color: inherit;
  line-height: 1.4;
}

.contact-pg-accordion-icon {
  font-size: 1.3rem;
  font-weight: 300;
  line-height: 1;
  flex-shrink: 0;
  color: inherit;
  transition: transform 0.2s ease;
  /* Use a slightly larger, lighter "+" to match the screenshot style */
  width: 20px;
  text-align: center;
}

/* Panel: hidden by default via the "hidden" HTML attribute.
   When open, max-height is set via JS for a smooth reveal. */
.contact-pg-accordion-panel {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.3s ease;
}

/* When the hidden attribute is removed, allow height to animate */
.contact-pg-accordion-panel:not([hidden]) {
  /* max-height set dynamically by JS */
}

.contact-pg-accordion-body {
  padding: 4px 0 16px 0;
}

.contact-pg-accordion-body p {
  font-size: 0.9rem;
  line-height: 1.65;
  margin: 0 0 12px 0;
  color: inherit;
}

.contact-pg-accordion-body p:last-child {
  margin-bottom: 0;
}


/* ----- Order Messages Form (Right Column) ----- */
.contact-pg-form-intro {
  font-size: 0.95rem;
  line-height: 1.6;
  margin: 0 0 20px 0;
}

.contact-pg-form {
  width: 100%;
}

.contact-pg-form-group {
  margin-bottom: 14px;
}

.contact-pg-form-label {
  display: block;
  font-size: 0.8rem;
  margin-bottom: 4px;
  color: inherit;
}

.contact-pg-required {
  color: inherit;
}

.contact-pg-form-input,
.contact-pg-form-textarea {
  display: block;
  width: 100%;
  padding: 9px 10px;
  font-size: 0.9rem;
  border: 1px solid #d0d0d0;
  background-color: #f5f5f5;
  color: inherit;
  box-sizing: border-box;
  border-radius: 0;
  appearance: none;
  -webkit-appearance: none;
}

.contact-pg-form-input::placeholder,
.contact-pg-form-textarea::placeholder {
  color: #999;
  font-size: 0.85rem;
}

.contact-pg-form-input:focus,
.contact-pg-form-textarea:focus {
  outline: 1px solid #888;
  background-color: #fff;
}

.contact-pg-form-textarea {
  resize: vertical;
  min-height: 110px;
}

.contact-pg-submit-btn {
  display: inline-block;
  background-color: #1a1a1a;
  color: #fff;
  border: none;
  padding: 13px 24px;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  cursor: pointer;
  text-transform: uppercase;
  border-radius: 0;
  transition: background-color 0.2s ease;
}

.contact-pg-submit-btn:hover {
  background-color: #333;
}


/* ----- Full FAQ Section (below two-column row) ----- */
.contact-pg-full-faqs {
  border-top: 1px solid #e0e0e0;
  padding-top: 0px;
}

.contact-pg-full-faqs .contact-pg-section-title {
  margin-bottom: 24px;
}

.contact-pg-faq-block {
  margin-bottom: 28px;
}

.contact-pg-faq-category {
  font-size: 0.9rem;
  font-weight: bold;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin: 0 0 8px 0;
}

.contact-pg-faq-block p {
  font-size: 0.9rem;
  line-height: 1.7;
  margin: 0 0 10px 0;
}

.contact-pg-faq-block p:last-child {
  margin-bottom: 0;
}


/* ============================================================
   MOBILE — Responsive Breakpoints
   ============================================================ */

/* Tablet: stack columns at 768px and below */
@media (max-width: 768px) {

  .contact-pg-top-row {
    flex-direction: column;
    gap: 30px;
  }

  .contact-pg-col-left,
  .contact-pg-col-right {
    flex: 1 1 100%;
    min-width: 0;
  }

  .contact-pg-section-title {
    font-size: 1.7rem;
  }

  .contact-pg-indent {
    padding-left: 0;
    display: block;
  }

}

/* Mobile: tighten spacing at 480px and below */
@media (max-width: 480px) {

  .contact-pg-wrapper {
    padding: 20px 16px 40px;
  }

  .contact-pg-section-title {
    font-size: 1.5rem;
  }

  .contact-pg-accordion-question {
    font-size: 0.9rem;
  }

  .contact-pg-submit-btn {
    width: 100%;
    text-align: center;
  }

}

/* ======================= END CONTACT PAGE ============================ */

/* ======================= EVENTS & SHOWS ============================== */

.events-shows-button 
{
	background:#000000;
	color:#ffffff;
	text-decoration:none;
	padding:10px 15px 10px 15px;
	font-size: clamp(15px, 4vw, 20px);   /* min, fluid, max */
	margin-left:30px;
	white-space: nowrap;
}

.events-shows-button:hover 
{
	color:#eae4e4;
}

.events-shows-column 
{
	box-sizing:border-box;
	padding:0px 30px 30px 30px;
	
}

.events-shows-header 
{
    font-family: "Tenor Sans";
	font-size: clamp(34px, 4vw, 64px);   /* min, fluid, max */
	line-height: 1.2 !important;
	color:#f26d72;
	padding-bottom:25px;
}

.events-shows-left 
{
	float:left;
	width:48%;
}

.events-shows-list ul li {
  line-height: 1.4 !important;
  padding-bottom: 20px !important;
  font-size: clamp(16px, 4vw, 18px);   /* min, fluid, max */
}

.events-shows-right 
{
	float:left;
	width:48%;

}

.events-shows-subheader
{
	font-weight: 500 !important;
    font-family: "Tenor Sans" !important;
	font-size: clamp(24px, 4vw, 34px);   /* min, fluid, max */
	padding-bottom:10px !important;
}

.events-shows-wrapper 
{
	box-sizing:border-box;
	max-width:1200px;
	margin:0 auto;
	padding-left:100px;
}


/* Fix diagonal hover line on Subscribe button */
.footer-site-subscribe input.button.button-primary:hover,
.footer-site-subscribe input.button.button-primary:focus,
.footer-site-subscribe input.button.button-primary:active {
  background-color: #947e7e !important;

  /* remove diagonal line / svg / gradient that some browsers render */
  background-image: none !important;
  box-shadow: none !important;
}



.form-submit-container .advanced-search-toggle, .form-submit-container .button, .form-submit-container .form-field-quantity-control, .form-submit-container .mobile-filters-modal .facet-apply, .form-submit-container .mobile-filters-modal .faceted-show-more-button, .mobile-filters-modal .form-submit-container .facet-apply, .mobile-filters-modal .form-submit-container .faceted-show-more-button {
  line-height: 0px !important;
}

/* LOGIN button hover: remove svg/gradient that causes diagonal seam */
input.button.account-button-primary.account-login-button:hover,
input.button.account-button-primary.account-login-button:focus,
input.button.account-button-primary.account-login-button:active {
  background-color: #947e7e !important;
  border-color: #947e7e !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* CREATE ACCOUNT button hover: remove svg/gradient diagonal seam */
a.button.account-button-primary:hover,
a.button.account-button-primary:focus,
a.button.account-button-primary:active {
  background-color: #947e7e !important;
  border-color: #947e7e !important;

  /* removes diagonal artifact */
  background-image: none !important;
  box-shadow: none !important;
}




h1.title.fs-result-page-17bgrm {
 font-weight: 500 !important;
 margin-top: 31px !important;
 font-family: "Tenor Sans" !important;
}

#hello-guest-wrapper
{text-align:center;
padding-bottom:25px;}

.hello-guest
{
font-size:55px;color:#000 !important;font-weight:500;
font-family: "playfair";
}

.hello-guest-welcome
{max-width:391px;
margin:0 auto;}

.main-content {max-width:1420px !important;padding-top:10px !important;}

.main-content > .slideshow .slideshow-item-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}

.main-menu {font-weight:500 !important;}

.mz-figure > img {
  width: 100%;
  max-height: 650px !important;
}

.nav-submenu-item a[href="https://echoparkpaper.com/sale/clearance/"] {
  display: none !important;
}

.nav-menu > .nav-menu-item > a[href="/gift-card-preview/"],
.nav-menu > .nav-menu-item > a[href="https://echoparkpaper.com/gift-card-preview/"] {
  display: none !important;
}


.navBar-item {font-weight:500 !important; font-size:30px !important;display:block !important;}

.navBar-item:hover {text-decoration:none;color:#000000;}

.product-image img {
    max-height: 650px !important;
	width:auto;
	max-width:100% !important;
}

.MagicZoom > img {
    max-height: 650px !important;
	width:auto;
	max-width:100% !important;
}

.page-content {font-family: 'Tenor Sans' !important; color:#000000 !important;}

.page-heading {display:none !important;}

.primary-navigation {
  font-weight: 500 !important;
  max-width:1420px !important;
  margin:0 auto !important;
  border-top:0px !important;
  border-bottom:0px !important;
}

  /* Draw the TOP/BOTTOM lines full-viewport width, independent of the constrained container */
  .primary-navigation::before,
  .primary-navigation::after{
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 100vw !important;
    height: 1px !important;
    background: #dfdfdf !important;
    z-index: 0 !important;
    pointer-events: none !important;
  }
  .primary-navigation::before{ top: 0 !important; }
  .primary-navigation::after{ bottom: 0 !important; }
  

.product-main-image { visibility:hidden; }

.rca-account-navbar-section li a {color:#000 !important;}

.retail-box {
	display:inline-block;
	width:40%;
	border-radius:10px;
	background-color:#f6f7f9;
	padding:20px;
	min-height:400px;
	margin:0px 20px 0px 20px;
	vertical-align:top;
}

.retail-box-1-btn {
	padding:15px;
	margin:20px auto;
	background:#f26d72;
	color:#ffffff;
	width:70%;
	border-radius:20px;
	font-family: "Heinberg Regular", sans-serif;
	/*font-family: "Tenor Sans";*/
	font-size: clamp(13px, 4vw, 14px);   /* min, fluid, max */
	line-height:1.5 !important;
	font-weight:300;

}

.retail-box-1-btn a {
	text-decoration:none;color:#ffffff;
}

.retail-box-2-btn {padding:20px 0px 20px 0px;}

.retail-box-1-txt-1
{
	font-family: "Heinberg Regular", sans-serif;
	font-size: clamp(14px, 4vw, 16px);   /* min, fluid, max */
	line-height: 1.2 !important;
}

.retail-box-1-txt-2
{
	font-family: "Heinberg Regular", sans-serif;
	font-size: clamp(14px, 4vw, 14px);   /* min, fluid, max */
	line-height: 1.2 !important;
}

.retail-box-2-txt-1
{
	font-family: "Heinberg Regular", sans-serif;
	font-size: clamp(13px, 4vw, 14px);   /* min, fluid, max */
	line-height: 1.2 !important;
}

.retail-box-2-txt-2
{
	font-family: "Heinberg Regular", sans-serif;
	font-size: clamp(10px, 4vw, 11px);   /* min, fluid, max */
	line-height: 1.2 !important;
}

.retail-box-header {
	font-family: "Oranges Lemons Script", cursive;
	/*font-size: clamp(50px, 4vw, 80px);   /* min, fluid, max */
	/*font-size:7rem;*/
	font-size: clamp(3rem, 7vw, 7rem);
	line-height: 1 !important;
}

.retail-header-1 {
  font-family: "Heinberg Regular", sans-serif;
  font-size: clamp(18px, 4vw, 30px);   /* min, fluid, max */
  font-weight: 700;
  text-align: center;
  letter-spacing: clamp(1px, 0.6vw, 4px);
  line-height: 1 !important;
}

.retail-header-2 {
  font-family: "Oranges Lemons Script", cursive;
  color: #f26d72;
  font-size: clamp(56px, 14vw, 150px);
  line-height: 1.1 !important;
}

.social-nav {display:none;}

#CheckBalanceLink {background:#000;color:#fff;padding:10px 20px 10px 10px;border-radius:10px;}
a.fill-div {
  display: block;
  height: 100%;
  width: 100%;
  text-decoration: none;
}

.active .product-tab-link {
  color: #000;
  font-size:16px;
}

.account-heading {
  text-align: center !important;
}

.button {min-width:230px !important;}

.button.button-secondary
{background:#000 !important;
color:#fff !important;
border:0px !important;
}

.cart-preview-trigger
{
  display: flex !important;          /* Aligns the elements horizontally */
  align-items: center !important;    /* Vertically aligns the image and text */
  padding-top:5px !important;
}

/*.cart-preview-quantity {padding-bottom:7px !important;display:inline-block;}*/

.col-main.col-sm-9, .grid__item.large--three-quarters, .main-content, .reading-column {
 margin: 0 auto;
}

.custom-cart-icon
{width:16px;
height:16px;
margin-right:5px;
/*margin-top:9px;*/
}

#description {
  max-height: 600px !important;
  overflow: none !important;
}

.desktop-bar-2 
{
	display:block;
	/*margin-top:10px;
	margin-bottom:16px;*/
	margin-top:0px;
	margin-bottom:0px;
}
.desktop-bar-2 img {width:100% !important;}

/*#giftcard-message {display:none;}*/

.desktop-bottom-banner {padding-bottom:10px !important;}

/* CODE FOR THE LOGIN/LOGOUT ACCOUNT DROP-DOWN */

.customer-links
{margin-right:6px !important;
}

.dropbtn {
  border: none;
  background-color:#ffffff;
  padding:10px 0px 0px 0px !important;
}

.dropdown {
  position: relative;
  display: inline-block;
  z-index:10000 !important;
}

.dropdown-content {
  display: none;
  position: absolute;
  /*background-color: #f1f1f1;*/
  background-color:#ffffff;
  min-width: 140px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  margin-left:-60px; 
}

.dropdown-content a {
  color: black;
  padding: 5px 5px 5px 17px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:first-child {
  color: black;
  padding: 10px 5px 5px 17px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:last-child {
  color: black;
  padding: 5px 5px 10px 17px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #ffffff !important;text-decoration:underline !important;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {background-color: #ffffff;}

/* END OF LOGIN/LOGOUT DROP-DOWN CODE */

.header-logo {width:400px;margin:0 auto;}

.home-footer-wrapper 
{
	width:100%;
	text-align:center;
	/*padding-top:27px;*/
	/*padding-top:17px;*/
}
.home-footer-div1 {width:48.5%;display:inline-block;padding:0px;margin:0px;float:left;}
.home-footer-div2 {width:48.5%;display:inline-block;padding:0px;margin:0px;float:right;}
.home-footer-div1 img {width:100%;height:auto;}
.home-footer-div2 img {width:100%;height:auto;}

.home-hero-banner {
  max-width: 1420px;
  margin: 0 auto;
  padding-bottom:20px;
}

.home-hero-banner__img {
  display: block;
  width: 100%;
  height: auto;
}


.mobile-social-icons {display:none;text-align:center;}
.mobile-social-icons2 {padding:10px;text-align:center;}
.mobile-social-icons2 img {width:45px !important;height:45px !important;margin:0px !important;}
.mobile-social-icons2 a {display:inline-block !important;}

.or-use-label {display:none !important;}

.product-detail-custom-field span a {
  color: #000000 !important;
  text-decoration:underline;
}
.product-detail-custom-field span a:hover {
  color: #bcaeae !important;
}

.product-item-details, .product-value-wrapper {text-align:center !important;}

.product-share-container {
   z-index: -10;
}

.scroll-locked {
    position: relative !important;
    overflow-y: visible !important;
}

#social-media-2
{
  float: right;
  width: 385px;
  margin-right: -570px;
  height: 116px;
  padding: 38px 0 0 33px;
  margin-top: -120px;
}
 #social-media-icon{width:37px;height:37px;float:left;margin-right:7px}
.header-facebook{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Facebook_grey.png);background-size:100% 100%;background-repeat:no-repeat}
.header-facebook:hover{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Facebook_color.png);background-size:100% 100%;background-repeat:no-repeat}
.header-twitter{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Twitter_grey.png);background-size:100% 100%;background-repeat:no-repeat}
.header-twitter:hover{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Twitter_color.png);background-size:100% 100%;background-repeat:no-repeat}
.header-instagram{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Instagram_grey.png);background-size:100% 100%;background-repeat:no-repeat}
.header-instagram:hover{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Instagram_color.png);background-size:100% 100%;background-repeat:no-repeat}
.header-pintrest{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Pintrest_grey.png);background-size:100% 100%;background-repeat:no-repeat}
.header-pintrest:hover{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Pintrest_color.png);background-size:100% 100%;background-repeat:no-repeat}
.header-youtube{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/YouTube_grey.png);background-size:100% 100%;background-repeat:no-repeat}
.header-youtube:hover{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/YouTube_color.png);background-size:100% 100%;background-repeat:no-repeat}
.header-tiktok{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Tiktok_grey.png);background-size:100% 100%;background-repeat:no-repeat}
.header-tiktok:hover{background-image:url(https://store-ej00a4zcne.mybigcommerce.com/content/images/social/Tiktok_color.png);background-size:100% 100%;background-repeat:no-repeat}

.social-media-mobile {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 0px 0px 75px 0px;
  text-align: center;
}

.social-media-mobile .social-icon {
  width: 32px;
  height: 32px;
  display: inline-block;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center center;
  flex: 0 0 32px;
}

.social-media-mobile .fill-div {
  display: block;
  width: 100%;
  height: 100%;
}

@media (max-width: 768px) {
  .social-media-mobile {
    gap: 12px;
    padding-top: 10px;
  }

  .social-media-mobile .social-icon {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
  }
}

.swym-button-bar {
  margin: 10px;
  display: block !important;
  float: right;
  padding-right: 27px;
}

.tab-product-description
{font-size:14px;}

.upsellme {display:none;}

/* Style for "View All Orders" link-like button */
#view-all-orders {
    background: none;
    border: none;
    color: #000; /* Black text */
    text-decoration: underline;
    cursor: pointer;
    font-size: 16px; /* Optional: Adjust size if needed */
    padding: 0; /* Remove padding to make it look like a link */
}

/* Add hover effect for better UX */
#view-all-orders:hover {
    text-decoration: none;
    color: #333; /* Optional: Darker on hover */
}


/*#textarea-giftcard-message {display:none;}*/

/*-------------------- CODE FOR THE SITE FOOTER --------------------------*/
.footer-menu {line-height:18px !important;}
.footer-column-1 {width:195px;float:left;box-sizing:border-box;padding:0px 0px 0px 15px;border-left:1px #dfdfdf solid;height:146px;}
.footer-column-2 {width:212px;float:left;box-sizing:border-box;padding:0px 0px 0px 15px;border-left:1px #dfdfdf solid;height:146px;}
.footer-column-3 {width:195px;float:left;box-sizing:border-box;padding:0px 0px 0px 15px;border-left:1px #dfdfdf solid;height:146px;}
.footer-column-1 a {font-weight:400 !important;}
.footer-column-2 a {font-weight:400 !important;}
.footer-column-3 a {font-weight:400 !important;}
@media all and (max-width:1000px){
.footer-column-1 {width:100%;float:none;padding:10px 0px 10px 0;height:auto;border-left:0px #000 solid;font-size:18px !important;}
.footer-column-2 {width:100%;float:none;padding:10px 0px 10px 0;height:auto;border-left:0px #000 solid;font-size:18px !important;}
.footer-column-3 {width:100%;float:none;padding:10px 0px 10px 0;height:auto;border-left:0px #000 solid;font-size:18px !important;}
} 

.page-wrap {margin-top:25px !important;max-width:100% !important;}

/*-------------------- CODE FOR COMING SOON PAGE -------------------------*/
.whats-new-box{text-align:center;width:268px;display: inline-block;}
.whats-new-header{padding:10px;font-size:22px;text-align:center;}
.whats-new-image{height:200px;width:278px;text-align:center;display:table-cell;vertical-align:middle}
.whats-new-image img{width:200px}.whats-new-txt{text-align:center;padding:10px 0 10px 0}
.whats-new-wrapper{border:2px #000 solid;max-width:840px;margin:45px auto 20px auto}
.whats-new-wrapper2{border:2px #000 solid;max-width:840px;margin:25px auto 20px auto}
/* == CODE TO HIDE SUPPORT FROM TOP NAV ==*/
/*.nav-menu-item:nth-child(6n) {display:inline-block !important;}*/
.nav-menu-item:nth-child(6n) {display:inline-block !important;}

@media screen and (max-width: 1130px) {
	
.events-shows-wrapper 
{
	max-width:100%;
	padding-left:0px;
}

.swym-button-bar {
  display: block !important;
  float: none;
  padding-right: 0px;
}
}

@media screen and (min-width: 992px) {
	
.footer-branding img {float:right;margin-right:-30px;position:relative;}

	.fs-recommendation-widget {padding-left:200px;}
	
    #cart-preview-count::before {
        content: "(";
    }

    #cart-preview-count::after {
        content: ")";
    }
	
  .footer-site-subscribe {
    width: 21.2% !important;
  }

  .footer-navigation {
    width: 51.8% !important;
  }

  .nav-submenu-item a {
    font-weight: 500;
  }
  .nav-submenu-item a:hover {
    text-decoration:underline;
  }
 .search-form {
    padding-top: 7px;
	background:none !important;
  }
}


@media screen and (max-width: 992px) {
	
.account-body {
float: none !important;
width: 90% !important;
padding-left: 7.5px;
margin:0 auto !important;
}
	
.account-menu {display:block !important;}
/*#account-menu-pc {display:none !important;}*/	

.account-tab
{width:90%;
height:130px !important;
-webkit-box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);
-moz-box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);
box-shadow: -1px 0px 7px 0px rgba(0,0,0,0.43);
margin-top:15px !important;
margin-bottom:15px !important;
position:relative;
display:block;}

.account-tab td {padding: 10px 10px 10px 20px !important;}

.account-tab-c1 {width:85px;vertical-align:middle !important;}
.account-tab-c1 img {width:50px;}

.account-tab-left
{float:none;margin:0 auto;}

.account-tab-right
{float:none;margin:0 auto;}

.account-tab-txt1, .account-heading {font-size:20px !important;}

#cart-related-section {width:100%;float:none !important;}
	
.cart-preview-trigger {
    display: inline-block !important;      /* Turns off flexbox on mobile */
    align-items: unset !important;  /* Removes vertical centering on mobile */
  }	
	
.custom-cart-icon
{width:16px;
height:16px;
margin-right:1px;
margin-top:5px;}
	
.customer-links
     {display:inline-block !important;margin-right:7px !important;}
	 
.dropbtn {
  background: none !important;
}	 

.dropdown-content {
  min-width: 140px;
  box-shadow: 0px 6px 14px 0px rgba(0,0,0,0.2);
  z-index: 1;
  margin-left:-65px;
  padding-bottom:10px;  
}

.dropdown-content a {
  color: black;
  padding: 10px 0px 0px 20px;
  text-decoration: none;
  display: block;
}
	 .header-tools .cart-preview-trigger {
     vertical-align: top !important;
     padding-top: 5px;
     }
	.mobile-social-icons {display:block;}
    .nav-menu-item:nth-child(6n) {display:block !important;}
	#social-media-2 {display:none;}
	.header-logo {width:250px;margin:0 auto;}
	
.hello-guest, #customer-first-name {font-size:35px !important;}	

.hello-guest-welcome {max-width:300px !important;}
	
.navBar-item {font-size:20px !important;}	
}

@media screen and (max-width: 991px) {
  .main-menu .nav-tools {
    display: none !important;
  }
}

@media screen and (max-width: 991px) {
  .menu-dropdown.active > a::before {
	margin-left:10px;  
}}

@media screen and (min-width: 900px) {
  .account-body {
    width: 100% !important;
  }
}


/* Fix anchor offset for mobile when header overlaps */
@media (max-width: 800px) {
  #faqs {
    scroll-margin-top: 80px;
  }
}

/* ===== CHATGPT CODE TO FIX VIEW CART LAYOUT ISSUES ======*/

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

  .cart-footer {
    padding-top: 0px !important;
  }

  .cart-header {
    display: none !important;
  }

  .cart-row {
    display: grid !important;
    grid-template-columns: 100px minmax(0, 1fr) 24px !important;
    column-gap: 16px !important;
    row-gap: 8px !important;
    align-items: start !important;
  }

  .cart-row > .cart-cell {
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    float: none !important;
    clear: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
    align-self: start !important;
    justify-self: stretch !important;
  }

  .cart-cell.cart-image {
    grid-column: 1 !important;
    grid-row: 1 / span 5 !important;
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
    display: block !important;
  }

  .cart-cell.cart-image a,
  .cart-cell.cart-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }

  .cart-cell.cart-product {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: block !important;
    padding-right: 6px !important;
  }

  .cart-cell.cart-product .cart-item-name,
  .cart-cell.cart-product a {
    display: block !important;
    font-size: 18px !important;
    line-height: 1.22 !important;
    margin: 0 !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    text-align: left !important;
  }

  .cart-cell.cart-each {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: block !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    margin-top: 2px !important;
  }

  .cart-cell.cart-each span,
  .cart-cell.cart-each .cart-price-label,
  .cart-cell.cart-each span[class*="price"] {
    line-height: 1.35 !important;
    font-size: 16px !important;
    margin: 0 !important;
    display: inline !important;
  }

  .cart-cell.cart-each::after {
    content: none !important;
    display: none !important;
  }

  .cart-cell.cart-quantity {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    margin-top: 2px !important;
  }

  .cart-cell.cart-quantity .form-field-quantity-control {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
    margin: 0 !important;
  }

  .cart-cell.cart-quantity input.form-input.rca-cart-item-quantity {
    text-align: center !important;
  }

  .cart-cell.cart-quantity .cart-update-quantity {
    display: none !important;
  }

  .cart-cell.cart-quantity .swym-save-for-later-btn-container {
    display: block !important;
    margin: 0 !important;
    width: auto !important;
    text-align: left !important;
  }

  .cart-cell.cart-quantity .swym-save-for-later-btn {
    display: inline-block !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    text-align: left !important;
  }

  .cart-cell.cart-total {
    grid-column: 2 !important;
    grid-row: 4 !important;
    display: block !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
    margin-top: 2px !important;
  }

  .cart-cell.cart-total::before {
    content: "Total: ";
    display: inline !important;
  }

  .cart-cell.cart-total .rca-cart-item-total {
    display: inline !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
  }

  .cart-cell.cart-remove {
    grid-column: 3 !important;
    grid-row: 1 !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    display: block !important;
    text-align: right !important;
    justify-self: end !important;
    align-self: start !important;
  }

  .cart-cell.cart-remove a {
    display: inline-block !important;
  }

  .events-shows-left {
    float:none;
    width:100%;
    margin:0 auto;
  }

  .events-shows-right {
    float:none;
    width:100%;
    margin:0 auto;
  }

  .retail-box {
    display:block;
    width:80%;
    /*max-width:350px;*/
    border-radius:10px;
    padding:20px;
    min-height:300px;
    margin:20px auto;
    vertical-align:top;
  }
}

.retail-gallery {text-align:center;padding-top:15px;}
.retail-gallery img {display:inline-block;width:267px;margin:10px;}

/* =========== END CHAT GPT VIEW CART CODE ===============*/

@media all and (max-width:750px){
.desktop-bar-2 {display:none !important;}
.home-footer-div1 {width:97%;display:block;margin:0 auto;float:none;padding:0px 0px 0px 0px}
.home-footer-div2 {width:97%;display:block;margin:0 auto;float:none;padding:0px 0px 0px 0px}
.home-hero-banner {display:none;}
}

@media screen and (min-width: 620px) {
  .account-nav + .account-body {
    border-left: 0px solid #dfdfdf !important;
  }
}

.mobile-bar {
    margin-top: 10px !important;
}

.mobile-bottom-banner {padding-bottom:8px;}

.wholesale-button {
  background: #000;
  border: 1px solid #000;
  color: #fff;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  margin: 0 auto;
  width: 250px;
  text-align: center;
  line-height: 20px;
  cursor: pointer;
  font-family: "Tenor Sans";
  font-weight: 700;
  letter-spacing: 2.5px;
  padding: 5px 5px 5px 7px;
  font-size:15px;
}
.wholesale-button a {color:#ffffff;display:block;}
.wholesale-button a:hover {color:#aba8a8;}

.wishlist-list-form .form-field-radio .form-label-text {
  color: #ffffff !important;
}

.wishlist-modal-title
{
  color:#ffffff !important;
}
.form-label-text {color:#ffffff !important;}

/* ============= RECHARGE RELATED CSS ================== */

.rca-subscription-widget select
{
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
} 


.rca-subscription-form__frequency-selector {
  display: inline-block !important;
  border:0px;
  background:#fff;
  padding:0px !important;
  margin:0px !important;
}


/* ============ MANUAL-ONLY CAROUSEL (Drag/Swipe + Arrows) — 2025-09-17 ============= */
.ep-slider{
  overflow:hidden;
  position:relative;
  background:none !important;
  touch-action: pan-y;
}
.ep-track{
  display:flex;
  will-change: transform;
  transition: transform 600ms ease; /* must match MOVE_MS in JS */
}
.ep-track.no-transition{ transition:none !important; }

.ep-slide{
  flex: 0 0 calc(100% / 4);        /* 4-up desktop */
  display:flex; justify-content:center; align-items:center;
  padding: 8px;
  box-sizing: border-box;
  text-decoration: none;
  background:none !important;
  cursor: grab;
}
.ep-slider.ep-dragging .ep-slide{ cursor: grabbing; }

.ep-slide img{
  width:100%; height:auto;
  /*max-width:286px; max-height:393px; -- desktop constraints */
  max-width:330px; max-height:450px;
  display:block;
  border-radius: 0;
  object-fit: contain;
  background:none !important;
}

/* Nav arrows */
.ep-nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:42px; height:42px;
  border-radius: 50%;
  border: 1px solid rgba(0,0,0,.15);
  background: rgba(255,255,255,.9);
  color: #111;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  display:flex; align-items:center; justify-content:center;
  font-size: 28px; line-height: 1;
  z-index: 3;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.ep-nav:hover{ background:#fff; box-shadow:0 6px 18px rgba(0,0,0,.2); transform:translateY(-50%) scale(1.03); }
.ep-prev{ left: 8px; }
.ep-next{ right: 8px; }
.ep-nav:focus{ outline: 2px solid #1a73e8; outline-offset: 2px; }

/* Tablet: 2-up */
@media (max-width:1024px){
  .ep-slide{ flex-basis: calc(100% / 3); }
  .ep-slide img{ max-width: 220px; max-height: 300px; }
}

@media screen and (max-width: 991px) {
  .header-tools {
    z-index: 1000 !important;
  }
}

@media (max-width: 850px) {
  #ep-slider .ep-slide {
    flex-basis: 30% !important;
  }
  
.catalog-desktop {display:none;}
.catalog-mobile {display:block;}
}

@media (max-width: 640px) {
  #ep-slider .ep-slide {
    flex-basis: 60% !important;
  }
}


.nav-menu > .nav-menu-item > a[href="/gift-guide/"],
.nav-menu > .nav-menu-item > a[href="https://echoparkpaper.com/gift-guide/"] {
    display: none !important;
}

.nav-menu > .nav-menu-item > a[href="/gift-guide/"],
.nav-menu > .nav-menu-item > a[href="https://echoparkpaper.com/gift-guide/"] {
    pointer-events: none;
    visibility: hidden;
}


/* Mobile menu background behavior:
   - drawer/panel background = transparent
   - each menu row/tab = white
*/
@media (max-width: 900px) {

  /* Make the overall drawer area transparent */
  nav.main-menu[data-main-menu],
  nav.main-menu[data-main-menu] .nav-menu,
  nav.main-menu[data-main-menu] .dropdown.nav-submenu,
  nav.main-menu[data-main-menu] .nav-submenu {
    background: transparent !important;
    box-shadow: none !important;
  }

  /* If your theme uses the "blurred" class on dropdowns, kill blur/overlay background */
  nav.main-menu[data-main-menu] .blurred {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* White only behind the actual menu rows (tabs) */
  nav.main-menu[data-main-menu] > ul.nav-menu > li,
  nav.main-menu[data-main-menu] > ul.nav-menu > li > a,
  nav.main-menu[data-main-menu] .nav-submenu > li,
  nav.main-menu[data-main-menu] .nav-submenu > li > a {
    background: #fff !important;
  }

  /* Prevent “full height” drawer that creates white space below the last item */
  nav.main-menu[data-main-menu],
  nav.main-menu[data-main-menu] > ul.nav-menu {
    height: auto !important;
    min-height: 0 !important;
  }
}

@media (max-width: 768px) {

  /* Make footer stack its children vertically */
  .cart-footer {
    display: flex !important;
    flex-direction: column !important;
  }

  /* Totals + checkout FIRST */
  .cart-footer .cart-totals.rca-cart-totals {
    order: 1 !important;
  }

  /* Related products AFTER totals */
  .cart-footer #cart-related-section {
    order: 2 !important;
    margin-top: -50px !important;
  }
}

/* ==========================================================
   ACCOUNT > PAYMENT METHODS (LIST PAGE) – MOBILE FIXES
   ========================================================== */

/* Reset list + prevent overflow */
.payment-method-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.payment-method,
.panel-payment-method,
.panel-new-payment-method,
.panel-payment-method .panel-body,
.panel-new-payment-method .panel-body {
  box-sizing: border-box;
  max-width: 100%;
}

@media (max-width: 768px) {
  /* Force single-column layout on mobile */
  .payment-method-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  /* Kill any float/inline-block grid behavior from the theme */
  .payment-method-list > .payment-method {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    display: block !important;
    clear: both !important;
  }

  /* Fix iOS overflow on "Add new payment method" card */
  .payment-method .panel-new-payment-method {
    width: 100%;
    max-width: calc(100% - 32px);
    margin: 0 auto;
    display: block;
  }

  /* Center + space Edit / Delete buttons (payment list) */
  .payment-method .form-actions,
  .payment-method-edit-form .form-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .payment-method .form-actions .button,
  .payment-method-edit-form .form-actions .button {
    width: 100%;
    max-width: 320px;
    text-align: center;
  }
}

/* ==========================================================
   ACCOUNT > ADD PAYMENT METHOD – LOCK ICON FIX (FINAL)
   ========================================================== */

/* Desktop/tablet: keep locks inside inputs (only in real field wrappers) */
.form-field .payment-method-form-inputs,
.form-fieldset .payment-method-form-inputs,
.form-row .payment-method-form-inputs {
  position: relative;
}

.form-field .payment-method-form-inputs-icon,
.form-fieldset .payment-method-form-inputs-icon,
.form-row .payment-method-form-inputs-icon {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0.65;
  z-index: 2;
}

.form-field .payment-method-form-inputs-icon svg,
.form-fieldset .payment-method-form-inputs-icon svg,
.form-row .payment-method-form-inputs-icon svg,
.form-field .payment-method-form-inputs-icon .icon,
.form-fieldset .payment-method-form-inputs-icon .icon,
.form-row .payment-method-form-inputs-icon .icon {
  width: 16px;
  height: 16px;
  display: block;
}

.form-field .payment-method-form-inputs .form-input,
.form-fieldset .payment-method-form-inputs .form-input,
.form-row .payment-method-form-inputs .form-input {
  padding-right: 44px;
}

/* Mobile: keep locks INSIDE inputs, but make them tiny + properly aligned */
@media (max-width: 768px) {
  /* Ensure the icon is positioned relative to its input wrapper */
  .payment-method-form-inputs {
    position: relative !important;
    overflow: visible !important;
    display: block !important;   /* IMPORTANT: do NOT flex the input+icon row */
  }

  .payment-method-form-inputs-icon {
    position: absolute !important;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) !important;
    width: 14px;
    height: 14px;
    opacity: 0.55;
    z-index: 2;
    pointer-events: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
  }

  .payment-method-form-inputs-icon svg,
  .payment-method-form-inputs-icon .icon {
    width: 12px !important;
    height: 12px !important;
    display: block;
  }

  .payment-method-form-inputs .form-input {
    padding-right: 34px !important; /* room for tiny lock */
  }
}

@media (max-width: 768px) {
  .payment-method-form-inputs-icon { display: none !important; }
}

/* Ensure Swym hearts sit above product links */
.swym-button,
.swym-wishlist-cta {
  position: relative;
  z-index: 50;
  pointer-events: auto;
}

/* FORCE TOP BANNER TO 1420PX */

/* Force homepage hero/banner to fill its parent width */
body .slideshow,
body .slideshow .slick-list,
body .slideshow .slick-track,
body .slideshow .slideshow-slide,
body .slideshow .slideshow-item,
body .slideshow .slideshow-item-link,
body .slideshow .slideshow-item-image {
  width: 100% !important;
  max-width: none !important;
}

/* Make sure the image behaves like a full-width banner */
body .slideshow .slideshow-item-image {
  display: block !important;
  height: auto !important;
}

/* =========================================================
   Smooth dropdowns - CLICK based (balanced speed)
   ========================================================= */

.nav-menu .dropdown.nav-submenu {
  display: block !important;
  transform-origin: top;

  opacity: 0 !important;
  transform: translateY(-9px) scaleY(0.95) !important;

  visibility: hidden !important;
  pointer-events: none !important;

  transition:
    opacity 280ms ease,
    transform 420ms ease,
    visibility 0s linear 420ms;
}

/* OPEN */
.nav-menu .dropdown.nav-submenu.visible,
.nav-menu .nav-menu-item.menu-dropdown.active > .dropdown.nav-submenu {
  opacity: 1 !important;
  transform: translateY(0) scaleY(1) !important;

  visibility: visible !important;
  pointer-events: auto !important;

  transition:
    opacity 280ms ease,
    transform 420ms ease,
    visibility 0s;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .nav-menu .dropdown.nav-submenu {
    transition: none !important;
    transform: none !important;
  }
}

/* ============================================================
   CART — Mobile landscape fix
   Phones in landscape are typically 568px–915px wide but
   under 500px tall. This restores the portrait-style layout
   (image left, details right) at those dimensions.
   ============================================================ */
@media screen and (max-width: 915px) and (max-height: 500px) {

  /* Image: float left, same proportion as portrait */
  .cart-image {
    width: 22% !important;
    float: left !important;
    margin-right: 3% !important;
  }

  /* Product name: float right next to image */
  .cart-product {
    width: 72% !important;
    float: right !important;
    margin-right: 0 !important;
    margin-bottom: 8px !important;
    padding-right: 30px !important;
  }

  /* Each price: float right, under product name */
  .cart-each {
    width: 72% !important;
    float: right !important;
    margin-right: 0 !important;
    clear: none !important;
    padding-right: 30px !important;
  }

  /* Total: float right, under Each */
  .cart-total {
    width: 72% !important;
    float: right !important;
    margin-right: 0 !important;
    clear: none !important;
    padding-right: 30px !important;
  }

  /* Quantity stepper: float right, under Total */
  .cart-quantity {
    position: static !important;
    width: 72% !important;
    float: right !important;
    text-align: left !important;
    margin-right: 0 !important;
    padding-right: 30px !important;
    clear: none !important;
  }

  /* Show the "Total:" label that is hidden at desktop widths */
  .cart-row .cart-price-label {
    display: inline !important;
  }
  
    /* Add "Total:" label before the total amount in landscape */
  .cart-row .cart-total::before {
    content: "Total: ";
    font-size: 14px;
    color: #9b8e8e;
  }


  /* Keep the X remove button top-right */
  .cart-remove {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
  }

  /* Hide desktop column headers (Each, Quantity, Item Total) */
  .cart-header .cart-each,
  .cart-header .cart-quantity,
  .cart-header .cart-total {
    display: none !important;
  }
}

/* Echo Park forgot password form - fix collapsed email field on mobile */
@media (max-width: 768px) {

  .account-forgot-form,
  .account-forgot-form .form-field,
  .account-forgot-form .form-label,
  .account-forgot-form .form-field-control {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
  }

  .account-forgot-form .form-field-title {
    display: block !important;
    width: 100% !important;
    margin: 0 0 8px 0 !important;
  }

  .account-forgot-form .form-input,
  .account-forgot-form input[type="email"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
    float: none !important;
  }

  .account-forgot-form .form-actions {
    display: block !important;
    width: 100% !important;
    margin-top: 14px !important;
  }

  .account-forgot-form .account-button-primary {
    width: 100% !important;
    display: block !important;
  }
}

.warehouse-sale-page .page-heading,
.warehouse-sale-page h1 {
  display: none !important;
}

@media (max-width: 480px) {
  .category-links-wrapper,
  .online-warehouse-sale-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }

  .category-links-wrapper .category-links-box,
  .online-warehouse-sale-wrapper .category-links-box {
    width: calc((100% - 10px) / 2) !important;
    max-width: calc((100% - 10px) / 2) !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  .category-links-wrapper .category-links-box img,
  .online-warehouse-sale-wrapper .category-links-box img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
  }
}

/* === THIS IS CODE TO FORCE THE MOBILE VERTICAL VIEW CART MATCH HORIZONTAL VIEW CART  ====*/

@media screen and (max-width: 480px) and (orientation: portrait) {

  .cart-row {
    display: grid !important;
    grid-template-columns: 100px 1fr 24px !important;
    grid-template-areas:
      "image product remove"
      "image each remove"
      "image qty remove"
      "image save remove"
      "image total remove" !important;
    column-gap: 14px !important;
    row-gap: 8px !important;
    align-items: start !important;
  }

  .cart-cell.cart-image {
    grid-area: image !important;
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
  }

  .cart-cell.cart-product {
    grid-area: product !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .cart-cell.cart-each {
    grid-area: each !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .cart-cell.cart-quantity {
    grid-area: qty !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  .cart-cell.cart-quantity .form-field-quantity-control {
    display: flex !important;
    width: 140px !important;
    max-width: 140px !important;
    margin: 0 !important;
  }

  .cart-cell.cart-quantity .swym-save-for-later-btn-container {
    display: block !important;
    margin: 10px 0 0 0 !important;
    text-align: left !important;
  }

  .cart-cell.cart-total {
    grid-area: total !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .cart-cell.cart-remove {
    grid-area: remove !important;
    align-self: start !important;
    justify-self: end !important;
  }

  /* make sure nothing floats side-by-side */
  .cart-cell.cart-each,
  .cart-cell.cart-quantity,
  .cart-cell.cart-total,
  .cart-cell.cart-product {
    float: none !important;
    clear: none !important;
  }
}

/* ===== CART PORTRAIT OVERRIDE: stack like landscape ===== */
@media screen and (max-width: 480px) and (orientation: portrait) {

  .cart-row {
    display: grid !important;
    grid-template-columns: 100px minmax(0, 1fr) 24px !important;
    grid-template-areas:
      "image product remove"
      "image each remove"
      "image qty remove"
      "image total remove" !important;
    column-gap: 14px !important;
    row-gap: 10px !important;
    align-items: start !important;
  }

  .cart-cell.cart-image {
    grid-area: image !important;
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
  }

  .cart-cell.cart-product {
    grid-area: product !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .cart-cell.cart-product .cart-item-name,
  .cart-cell.cart-product a {
    display: block !important;
    margin: 0 !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  .cart-cell.cart-each {
    grid-area: each !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: none !important;
    text-align: left !important;
  }

  .cart-cell.cart-each::after {
    content: none !important;
    display: none !important;
  }

  .cart-cell.cart-each .cart-price-label,
  .cart-cell.cart-each .rca-cart-item-price {
    display: inline !important;
    line-height: 1.35 !important;
  }

  .cart-cell.cart-quantity {
    grid-area: qty !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: none !important;
    position: static !important;
    text-align: left !important;
  }

  .cart-cell.cart-quantity .form-field-quantity-control {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
    margin: 0 !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
  }

  .cart-cell.cart-quantity .swym-save-for-later-btn-container {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    text-align: left !important;
  }

  .cart-cell.cart-quantity .swym-save-for-later-btn {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    line-height: 1.3 !important;
  }

  .cart-cell.cart-total {
    grid-area: total !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    clear: none !important;
    text-align: left !important;
  }

  .cart-cell.cart-total::before {
    content: "Total: ";
    display: inline !important;
  }

  .cart-cell.cart-remove {
    grid-area: remove !important;
    align-self: start !important;
    justify-self: end !important;
  }
}
/* ===== END CART PORTRAIT OVERRIDE ===== */