@media only screen and (max-width: 1199.98px) {
  .table {
    min-width: 700px;
  }
  .order-summary-outer .table {
    min-width: inherit;
  }
  .notes-summary-area .order-summary .table {
    min-width: inherit;
  }
  .carousel-content .week-sale-bnr h4 {
    font-size: 26px;
  }
  .carousel-content .week-sale-bnr p {
    font-size: 18px;
  }
  .newsletter-content .social-icons li:first-child {
    margin-bottom: 15px;
    display: block;
  }
  .newsletter-content label {
    line-height: normal;
    margin-left: 0;
    margin-bottom: 15px;
  }
  .newsletter-content form {
    float: none;
    width: 100%;
  }
  .brands-content .owl-brands .owl-prev {
    left: -15px;
  }
  .brands-content .owl-brands .owl-next {
    right: -15px;
  }
}

@media only screen and (max-width: 992px) {
  .header-area {
    padding-bottom: 0.9375rem;
  }
  .header-area .header-maxi .spaceright-0 {
    padding-left: 0;
  }
  .header-area .header-maxi .logo {
    margin-bottom: 5px;
  }
  .header-area .header-maxi .form-inline {
    padding-left: 0.9375rem;
  }
  .header-area .header-maxi .top-right-list .phone-header {
    display: none;
  }
  .header-area .header-navi .navbar-2 .navbar-nav .nav-item.first {
    display: none;
  }
  .header-area .header-navi .navbar-2 .navbar-nav .nav-item {
    margin-right: 0;
    margin-top: 10px;
  }
  .header-area .header-navi .navbar-2 .navbar-nav .nav-item.last {
    position: static;
  }
  .categories {
    margin-top: 30px;
  }
  .categories .navbar-nav li a {
    padding: 0.5625rem;
  }
  .carousel-content .carousel {
    margin-top: 30px;
  }
  .carousel-content .carousel .carousel-inner .carousel-item img {
    height: auto;
  }
  .breadcum-area {
    background-position: center center;
  }
  .footer-content {
    padding-bottom: 0;
  }
  .footer-content .single-footer {
    margin-bottom: 30px;
  }
  .footer .footer-image, .footer .footer-info {
    margin-bottom: 15px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .footer .floating-top {
    right: 15px !important;
  }
  .notes-summary-area {
    margin-top: 40px;
  }
  .notes-summary-area .order-summary .table {
    min-width: inherit;
  }
  .order-summary-outer {
    margin-top: 50px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199.98px) {
  .header-area .header-navi .navbar-1 .navbar-nav .nav-item {
    margin-right: 10px;
  }
  .header-area .header-maxi .form-inline {
    padding-left: 35px;
  }
  .products .product.product-2x {
    width: 50%;
  }
  .products-5x .product {
    width: 25%;
  }
  .login-card {
    height: 380px !important;
  }
  #panel-signin, #panel-create {
    overflow-y: auto !important;
    height: auto !important;
  }
  .login-form-panel {
    overflow: visible !important;
  }
  .login-signin-btn {
    padding: 5px !important;
  }
  .login-or-row {
    display: none !important;
  }
  .login-image-panel {
    flex: 0 0 52% !important;
  }
  .login-terms-label {
    font-size: 11px !important;
    line-height: 1.4 !important;
  }
  #panel-create input[type="text"],
  #panel-create input[type="email"],
  #panel-create input[type="password"] {
    padding: 5px 12px !important;
  }
  #panel-create .login-create-btn {
    padding: 5px !important;
  }
  .login-terms-wrap {
    margin-bottom: 6px !important;
  }
  #panel-create label {
    margin-bottom: 2px !important;
  }
  .login-already {
    display: none !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991.98px) {
  body[dir="ltr"] .spaceright-0 {
    padding-right: 15px;
  }
  .carousel-content .new-product, .carousel-content .week-sale-bnr {
    float: left;
    width: 50%;
  }
  .newsletter-content .banner-single {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-right: none;
    border-bottom: 1px solid #dee2e6;
  }
  .newsletter-content .banner-single.second-last {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom-width: 0;
  }
  .newsletter-content .banner-single.last {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom-width: 0;
  }
  .products .product.product-2x {
    width: 66.66%;
  }
  .products-3x .product {
    width: 33.33%;
  }
  .products-4x .product {
    width: 33.33%;
  }
  .products-5x .product {
    width: 33.33%;
  }
  .toolbar {
    padding: 13px 26px 10px 26px;
  }
  .toolbar .form-group .col-form-label {
    padding-left: 0;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .toolbar .form-group.center {
    padding-left: 0;
    padding-right: 15px;
  }
  .orders-detail-area .card {
    margin-bottom: 15px;
  }
  .blogs-3x .blog-post {
    width: 33.33%;
  }
  .blogs-4x .blog-post {
    width: 33.33%;
  }
  .blogs-5x .blog-post {
    width: 33.33%;
  }
  .payment-area {
    margin-top: 40px;
  }
  .checkout-right {
    display: none;
  }
  .checkout-left .nav .nav-item .nav-link {
    width: 130px !important;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767.98px) {
  .carousel-content .new-product, .carousel-content .week-sale-bnr {
    float: left;
    width: 50%;
  }
  .newsletter-content .banner-single {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-right: none;
    border-bottom: 1px solid #dee2e6;
  }
  .newsletter-content .banner-single.last {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom-width: 0;
  }
  .products .product.product-2x {
    width: 100%;
  }
  .products-3x .product {
    width: 50%;
  }
  .products-4x .product {
    width: 50%;
  }
  .products-5x .product {
    width: 50%;
  }
  .registration-area .registered-customers {
    margin-top: 50px;
  }
  .registration-area .new-customers ul {
    margin-top: 50px;
    padding-left: 0;
  }
  .toolbar {
    padding: 13px 26px 10px 26px;
  }
  .toolbar .form-group .col-form-label {
    padding-left: 0;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  .orders-detail-area .card {
    margin-bottom: 15px;
  }
  .blogs-3x .blog-post {
    width: 50%;
  }
  .blogs-4x .blog-post {
    width: 50%;
  }
  .blogs-5x .blog-post {
    width: 50%;
  }
  .my-shipping-area .my-shipping {
    margin-bottom: 40px;
  }
  .contact-area .contact-list {
    display: none;
    padding-left: 0;
    margin-top: 40px;
  }
  .payment-area {
    margin-top: 40px;
  }
  .checkout-right {
    display: none;
  }
  .checkout-left .nav .nav-item {
    width: 50%;
    margin-right: 0 !important;
    margin-bottom: 30px;
  }
  .checkout-left .nav .nav-item .nav-link {
    width: 100% !important;
  }
}

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

  .newsletter-content .social-icons {
    margin-bottom: 30px;
  }
  .newsletter-content label {
    margin-left: 0;
  }
  .newsletter-content form {
    float: none;
    width: 100%;
  }
  .newsletter-content form .btn {
    position: static;
    margin-top: 15px;
    width: 100%;
  }
  .brands-content .owl-brands {
    text-align: center;
  }
  .brands-content .owl-brands li {
    float: none;
  }
  .brands-content .owl-brands .owl-prev {
    left: 0;
  }
  .brands-content .owl-brands .owl-next {
    right: 0px;
  }
  /* ---- Login page: mobile ---- */
  .login-form-panel {
    padding: 8px 16px 16px 16px !important;
  }
  .login-tabs {
    margin-bottom: 6px !important;
  }
  .login-field-row {
    flex-direction: column !important;
  }
  .login-field-row > div {
    width: 100% !important;
  }
  .login-tabs a {
    padding: 4px 10px !important;
  }
  #panel-create input[type="text"],
  #panel-create input[type="email"],
  #panel-create input[type="password"] {
    padding: 6px 12px !important;
  }
  #panel-create .login-field-row,
  #panel-create > form > div {
    margin-bottom: 6px !important;
  }
  .login-page-heading {
    margin-top: 12px !important;
  }
  #panel-create label {
    margin-bottom: 1px !important;
  }
  .login-page-heading {
    margin-bottom: 8px !important;
  }
}

@media only screen and (max-width: 575.98px) {
  #accordion {
    padding-right: 15px;
  }
  .carousel-content .carousel {
    margin-top: 4px;
  }
  .site-content {
    padding-top: 4px;
  }
  .header-area {
    padding-bottom: 4px;
  }
  .header-navi {
    display: none;
  }
  .products-area {
    padding-top: 12px;
  }
  .products-area .heading {
    margin-bottom: 16px;
  }
  .blue-text {
    margin-bottom: 15px;
    text-align: center;
    display: block;
  }
  .button .btn {
    margin-bottom: 15px;
    width: 100%;
  }
  .heading h2 {
    font-size: 18px;
    margin-bottom: 10px;
  }
  .carousel-content .week-sale-bnr {
    height: auto;
    padding-bottom: 35px;
  }
  .header-area .header-maxi .spaceleft-0 {
    padding-left: 15px;
  }
  .header-area .header-maxi .form-inline {
    padding-right: 0.9375rem;
  }
  .header-area .header-maxi .search-categories {
    background-color: transparent;
    border-color: transparent;
    position: relative;
  }
  .header-area .header-maxi .search-categories #category_id {
    border: 1px solid #ced4da;
    width: 100%;
    margin-right: 0;
    margin-bottom: 0.5rem;
  }
  .header-area .header-maxi .search-categories .ui-selectmenu-button {
    border: 1px solid #ced4da;
    width: 100%;
    padding-right: 0.875rem;
    margin-right: 0;
    margin-bottom: 0.5rem;
  }
  /* Phone: search button to the RIGHT of the input */
  .header-area .header-maxi .search-categories input {
    border: 1px solid #ced4da;
    width: calc(100% - 46px);
    margin-bottom: 0;
    float: left;
  }
  .header-area .header-maxi .search-categories .btn-secondary {
    position: absolute;
    right: 0;
    bottom: 0;
    top: auto;       /* pin to bottom row, not stretch from top */
    height: 41px;    /* match input height, don't span both rows */
    width: 46px;
    margin-bottom: 0;
  }
/* Phone: reflow header — icons up top, right of Menu */
  .header-area .header-maxi .row {
    flex-wrap: wrap;
    align-items: center;
	justify-content: space-between;
  }
  .header-area .header-maxi .logoholder {
    flex: 0 1 auto;
    min-width: 0;
    order: 1;
  }
  /* logo img has inline width:100% — must use !important to override */
  .header-area .header-maxi .logoholder .logo img {
    width: auto !important;
    max-height: 36px;
  }
  /* Menu button: shrink to content, don't take 43% */
  .header-area .header-maxi .smallmenu {
    flex: 0 0 auto !important;
    max-width: none;
    order: 3;
    margin-left: 8px;
    margin-right: 8px;
  }
  .header-area .header-maxi .smallmenu .toggler {
    width: auto;
    padding: 8px 16px;
  }
  .header-area .header-maxi .smallmenu #smallmenu1 {
    left: auto !important;
    right: 0 !important;
    width: 240px !important;
  }
  .header-area .header-maxi .cartholder {
    flex: 0 0 auto;
    max-width: none;
    width: auto;
    order: 2;
    margin-bottom: 0;
  }
  .header-area .header-maxi .cartholder .cart-header .block {
    display: none;
  }
  .header-area .header-maxi .searchholder {
    flex: 0 0 100%;
    max-width: 100%;
    order: 4;
    margin-top: 10px;
  }
  .header-area .header-maxi .top-right-list li {
    width: auto;
    margin-bottom: 0;
    height: 32px;
    display: flex;
    align-items: center;
  }
  /* Phone: smaller cart/wishlist icons + tighter spacing */
  .header-area .header-maxi .top-right-list li > a .fa-cart-arrow-down {
    font-size: 26px;
  }
  .header-area .header-maxi .top-right-list li > a .fa-shopping-bag {
    font-size: 26px;
  }
  .header-area .header-maxi .top-right-list li > a .fa-heart {
    font-size: 0.8rem;
    top: 8px;
  }
  .header-area .header-maxi .top-right-list .wishlist-header, .header-area .header-maxi .top-right-list .cart-header {
    margin-left: 12px;
  }
  .header-area .header-maxi .cartholder .cart-header {
    float: none;
  }
  .header-area .header-maxi .cartholder .cart-header > a {
    align-items: center;
  }
  .header-area .header-maxi .cartholder .cart-header > a:after {
    display: none;
  }
  .header-area .header-maxi .cartholder .wishlist-header .fa-stack {
    height: 26px;
    line-height: 26px;
    width: 26px;
  }
  .header-area .header-maxi .cartholder .wishlist-header .badge, .header-area .header-maxi .cartholder .cart-header .badge {
    top: 0;
  }
  /* ============================================================
     HEADER CART DROPDOWN: widen + reposition on mobile
     ============================================================ */
  .header-area .header-maxi .cart-header .shopping-cart {
    position: fixed !important;
    top: 72px !important;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    margin: 0 !important;
  }

  /* Kill horizontal scroll on the items list — the 4px overflow triggers a scrollbar */
  .header-area .header-maxi .cart-header .shopping-cart .shopping-cart-items {
    overflow-x: hidden !important;
    overflow-y: auto;
    max-height: 240px;
  }

  /* Rebalance li columns so title doesn't wrap to 4 lines */
  .header-area .header-maxi .cart-header .shopping-cart .shopping-cart-items li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
  }
  .header-area .header-maxi .cart-header .shopping-cart .shopping-cart-items li .item-thumb {
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
  }
  .header-area .header-maxi .cart-header .shopping-cart .shopping-cart-items li .item-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.8125rem;
    line-height: 1.25;
  }
  .header-area .header-maxi .cart-header .shopping-cart .shopping-cart-items li .item-quantity {
    flex: 0 0 auto;
    font-size: 0.75rem;
    white-space: nowrap;
  }
  .header-area .header-maxi .cart-header .shopping-cart .shopping-cart-items li .item-price {
    flex: 0 0 auto;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
  }
  .newsletter-content .banner-single {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-right: none;
    border-bottom: 1px solid #dee2e6;
  }
  .newsletter-content .banner-single.last {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom-width: 0;
  }
  .group-banners .banner-image {
    margin-top: 15px;
  }
  .products-5x, .shop-area .products {
    display: flex;
    flex-wrap: wrap;
  }
  .products-3x .product {
    width: 50%;
    float: none;
  }
  .products-5x .product {
    width: 50%;
	margin-bottom: 8px;
	float: none;
  }
  .products-5x .product article .thumb {
    height: auto;
  }
  .products-5x .product article .thumb img {
    height: auto;
  }
  .products-5x .product .blog-post .module .cat-thumb {
    height: auto;
  }
  .products-5x .product .blog-post .module .cat-title {
    margin-top: 4px;
  }
  .products-5x .product article {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .products-3x .cat-thumb {
    height: auto;
  }
  .products-3x .product article .thumb {
    height: auto;
  }
  .products-3x .product article .thumb img {
    height: auto;
  }
  .banner-content .banner-single .panel {
    width: 250px;
    margin-left: auto;
    margin-right: auto;
  }
  .banner-content .banner-single .panel .block {
    float: none;
    width: auto;
    overflow: hidden;
  }
  .banner-content .banner-single .panel .block p {
    white-space: nowrap;
    font-size: 13px;
  }
  .banner-content {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .banner-content .col-12 {
    margin-bottom: 12px;
  }
  .banner-content .col-12:last-child {
    margin-bottom: 0;
  }
  .footer-content {
    padding-top: 10px;
  }
  .footer-content .single-footer .contact-list li .fa {
    flex-shrink: 0;
  }
  .breadcum-area {
    padding: 6px 15px;
    margin-bottom: 12px;
  }
  .breadcum-area .breadcum-inner h3 {
    display: none;
  }
  body[dir="ltr"] .breadcum-area {
    background-image: linear-gradient(to right, #ffffff, #cceff5);
  }
  .filters .block .card-body {
    padding: 4px 9px;
  }
  .filters .block .card-body ul.list {
    column-count: 2;
    column-gap: 14px;
  }
  .filters .block .card-body ul.list li {
    break-inside: avoid;
  }
  .filters .block .card-body .form-check {
    margin-bottom: 2px;
  }
  .filters .block .card-body #slider-values {
    margin-top: 8px;
  }
  .filters .card .filter-toggle {
    cursor: pointer;
    position: relative;
  }
  .filters .card .filter-toggle h2:before {
    position: absolute;
    right: 9px;
    top: 3px;
    width: 20px;
    font-size: 26px;
    text-align: center;
    content: "-";
  }
  .filters .card.filter-collapsed .filter-toggle h2:before {
    content: "+";
  }
  .filters .card.filter-collapsed .block, .filters .card.filter-collapsed .button {
    display: none;
  }
  .filters .card {
    margin-bottom: 4px;
  }
  .filters .card .card-header {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .filters {
    margin-bottom: 12px;
  }
  .toolbar .form-group {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    margin-bottom: 4px;
  }
  .toolbar .form-inline .form-group:last-child {
    margin-bottom: 0;
  }
  .toolbar .form-inline .form-group .col-form-label {
    width: 110px;
    flex: 0 0 110px;
    padding: 0 8px 0 0;
    margin-bottom: 0;
    white-space: nowrap;
  }
 .toolbar .form-group > select {
    width: auto;
    flex: 1;
    height: 28px;
    padding: 1px 8px;
    font-size: 13px;
    line-height: 1.2;
  }
  /* Bottom toolbar: stack "Showing…" and "Load More" full-width */
  .toolbar .form-inline .form-group.col-6 {
    flex: 0 0 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
    justify-content: center;
  }
  .toolbar .form-inline .form-group.col-6 .col-form-label {
    width: auto;
    flex: 1 1 100%;
    padding: 0;
	text-align: center;
  }
  .toolbar .form-inline .form-group.col-6 #load_products {
    width: 100%;
  }
  .toolbar .form-group > .btn-group.col-12 {
    flex: 0 0 auto;
    align-items: center;
    width: auto;
    max-width: max-content;
  }
  .products-area .nav .nav-item {
    width: 33%;
  }
  .products-area .nav .nav-item .nav-link {
    font-size: 12px;
    width: 100%;
  }
  .products-area .tab-content .owl-carousel .owl-stage-outer {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
  }
  .products-area .tab-content .owl-carousel .owl-stage-outer .owl-item .product {
    float: none;
    margin-left: auto;
    margin-right: auto;
    width: 240px;
  }
  .products-area .tab-content .owl-carousel .owl-nav {
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: 100%;
  }
  .products-area .tab-content .owl-carousel .owl-nav .owl-next, .products-area .tab-content .owl-carousel .owl-nav .owl-prev {
    position: absolute;
    margin-left: 0;
    border-radius: 50px;
  }
  .products-area .tab-content .owl-carousel .owl-nav .owl-next {
    right: 0;
  }
  .products-area .tab-content .owl-carousel .owl-nav .owl-prev {
    left: 0;
  }
  .products .product.product-2x {
    width: 100%;
  }
  .products .product.product-2x article .thumb {
    bottom: 20%;
  }
  .shop-area .products .product {
    padding-left: 0;
  }
  .shop-area .products-list .product .thumb {
    width: 100%;
  }
  .shop-area .products-list .product .block-panel {
    width: 100%;
  }
  .shop-area .products-list .product .product-hover {
    width: 100%;
    height: 53%;
  }
  .blogs-3x .blog-post {
    width: 100%;
  }
  .blogs-4x .blog-post {
    width: 100%;
  }
  .blogs-5x .blog-post {
    width: 100%;
  }
  .blog-content {
    padding-bottom: 0;
  }
  .blog-content .blog-area .blogs .blog-post {
    margin-bottom: 30px;
  }
  .registration-area .facebook, .registration-area .google {
    margin-left: 15px;
    margin-right: 15px;
    width: 100%;
  }
  .registration-area .new-customers ul {
    margin-top: 50px;
    padding-left: 0;
  }
  .registration-area .registered-customers {
    margin-top: 50px;
  }
  .toolbar {
    padding: 8px 26px 8px 26px;
    margin-left: 0;
  }
  .toolbar.mt-3 {
    margin-top: 6px;
  }
  .toolbar .form-group .col-form-label {
    padding-left: 0;
    text-align: left;
  }
  .orders-detail-area .card {
    margin-bottom: 15px;
  }
  .my-shipping-area .my-shipping {
    margin-bottom: 40px;
  }
  .contact-area .contact-list {
    display: none;
    padding-left: 0;
    margin-top: 40px;
  }
  #update_cart_form {
    margin-bottom: 40px;
  }
  .payment-area {
    margin-top: 40px;
  }
  .checkout-right {
    display: none;
  }
  .checkout-left .nav .nav-item {
    width: 100%;
    margin-right: 0 !important;
    margin-bottom: 30px;
  }
  .checkout-left .nav .nav-item .nav-link {
    width: 100% !important;
  }
  .login-signin-btn {
    padding: 5px !important;
  }
  .login-create-btn {
    padding: 5px !important;
  }
  .login-terms-label {
    font-size: 10px !important;
    line-height: 1.3 !important;
  }
  .login-already {
    display: none !important;
  }
  .login-form-panel {
    padding-top: 2px !important;
  }
  #login-alert,
  #signup-alert {
    margin-bottom: 4px !important;
  }
  #panel-create .login-field-row,
  #panel-create .login-create-field {
    margin-bottom: 5px !important;
  }
  .login-field-row {
    gap: 0 !important;
    margin-bottom: 0 !important;
  }
  .login-field-row > div {
    margin-bottom: 5px !important;
  }
  #panel-create input {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
  }
  #panel-create label {
    margin-top: 0 !important;
  }
}


/* claude addon — mobile category/news/info menu */
@media only screen and (max-width: 991.98px) {

  /* ---- Stack the 3-column category grid to single column ---- */
  .smallmenu .clivedropdown-menu > div {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .smallmenu .clivedropdown-menu > div > div {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* ---- Cap height, scroll inside the menu ---- */
  .smallmenu .clivedropdown-menu {
    max-height: 75vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* ---- CATEGORY TITLE: flush left, emphasised ---- */
  .smallmenu .smcat-title a {
    display: block;
    padding: 8px 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2;
  }

  /* ---- CATEGORY SUB: indented, tighter ---- */
  .smallmenu .smcat-sub {
    padding-left: 1.5rem;
  }
  .smallmenu .smcat-sub a {
    display: block;
    padding: 4px 0;
    font-size: 16px;
    line-height: 1.2;
  }

  /* ---- NEWS & INFO PAGES: match sub-category feel ---- */
  .smallmenu .smcat-list a {
    padding: 8px 1.5rem !important;   /* !important beats inline 0.5615rem */
    font-size: 16px;
    line-height: 1.2;
  }
  /* claude addon — very narrow phones (S8+, ZFold): keep header on one row */
  @media only screen and (max-width: 375px) {
    .header-area .header-maxi .logoholder .logo img {
      max-width: 110px !important;
    }
  }
}
/* Filter buttons — self-contained, no Bootstrap */
.btn-reset,.btn-apply {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}
.btn-apply {
    background-color: #ffcc67;
    border-color: #ffcc67;
    color: #111;
    font-weight: 500;
}
.btn-reset {
    background-color: #e4e4e4;
    border-color: #e4e4e4;
    color: #333;
}
.filters .button {
    display: flex;
    gap: 10px;
}
.filters .button .btn-reset,
.filters .button .btn-apply {
    flex: 1;
    margin-bottom: 0;
}
.btn-apply:hover {
    background-color: #f0bd4f;
    border-color: #f0bd4f;
}
.btn-reset:hover {
    background-color: #d4d4d4;
    border-color: #d4d4d4;
    text-decoration: none;
}
/* Toolbar labels: size to content so longer labels (e.g. "Items per page") don't wrap below their control on desktop */
.toolbar .form-group .col-form-label {
    width: auto;
    max-width: none;
    flex: 0 0 auto;
    white-space: nowrap;
}
/* viewcart: stack as cards on mobile (≤767px), keep table on tablet+ */
@media only screen and (max-width: 991.98px) {

  /* Kill table behaviour for the cart items table only — Order Summary stays a table */
  .cart-area #update_cart_form .table,
  .cart-area #update_cart_form .table thead,
  .cart-area #update_cart_form .table tbody,
  .cart-area #update_cart_form .table tr,
  .cart-area #update_cart_form .table td {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Hide the column headers row — values are self-evident or labelled inline */
  .cart-area #update_cart_form .table thead {
    display: none !important;
  }

  /* Each <tbody id="cartrow_X"> becomes a card */
  .cart-area #update_cart_form .table tbody {
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    padding: 10px 12px 4px 12px;
    margin-bottom: 6px;
    background: #fff;
  }

  /* Remove the underline-borders normal table cells have */
  .cart-area #update_cart_form .table td {
    border: none;
    padding: 6px 0;
    text-align: left !important;   /* beats inline align="right" */
  }

  .cart-area #update_cart_form .table td.item {
    display: flex !important;
    flex-direction: row;
    align-items: flex-start !important;
    gap: 15px;
    padding: 0 0 6px 0 !important;
    border-bottom: 1px solid #f0f0f0;
    margin-bottom: 2px;
  }

  /* Price row — label + value on one line */
  .cart-area #update_cart_form .table td.price {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 2px 0 !important;
  }
  .cart-area #update_cart_form .table td.price::before {
    content: "Price";
    color: #888;
    font-size: 0.9375rem;
    font-weight: 500;
  }
  /* Match Price value size to the "Price" label — Subtotal stays bigger for emphasis */
  .cart-area #update_cart_form .table td.price span {
    font-size: 0.9375rem !important;
    font-weight: 500;
  }
  /* Qty row — label + stepper on one line */
  .cart-area #update_cart_form .table td.Qty {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 2px 0 !important;
  }
  /* Shrink qty stepper to match label height */
  .cart-area #update_cart_form .table td.Qty .input-group .qty {
    height: 24px !important;
    padding: 0 4px !important;
    font-size: 0.875rem !important;
    width: 38px !important;
    min-width: 0;
    flex: 0 0 38px;
    text-align: center;
    line-height: 24px;
  }
  .cart-area #update_cart_form .table td.Qty .input-group .input-group-btn {
    height: 24px;
    width: 26px;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    border: 1px solid #ced4da;
    background: #f8f9fa;
    cursor: pointer;
  }
  .cart-area #update_cart_form .table td.Qty .input-group .input-group-btn .fa {
    font-size: 0.75rem;
  }
  .cart-area #update_cart_form .table td.Qty::before {
    content: "Qty";
    color: #888;
    font-size: 0.9375rem;
    font-weight: 500;
  }
  .cart-area #update_cart_form .table td.Qty .input-group {
    width: auto;
    flex-wrap: nowrap;
  }

  /* Subtotal row — emphasised */
  .cart-area #update_cart_form .table td.subtotal {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 7px 0 0 0 !important;
    margin-top: 2px;
    border-top: 1px solid #f0f0f0;
    font-weight: 500;
  }
  .cart-area #update_cart_form .table td.subtotal::before {
    content: "Subtotal";
    color: #555;
    font-size: 0.9375rem;
  }
  /* Mobile: don't push Remove to bottom — keep it under the title */
  .cart-area .cart-product-detail .remove-link {
    margin-top: 4px !important;
    padding-top: 0 !important;
  }
  .cart-area .cart-product-detail .title {
    margin-bottom: 0 !important;
    line-height: 1.3 !important;
  }
  /* Mobile: unfloat thumb + shrink to 70x70 */
  .cart-area #update_cart_form td.item .cart-thumb {
    float: none !important;
    width: 70px !important;
    height: 70px !important;
    margin-right: 0 !important;
    flex-shrink: 0;
  }
  /* Kill desktop min-height on mobile — collapse to actual content */
  .cart-area {
    min-height: 0 !important;
    margin-bottom: 15px !important;
  }
  /* ============================================================
     ORDER SUMMARY + ACTION BUTTONS: mobile layout
     ============================================================ */

  /* Mobile column stack — single column, natural order */
  .cart-area > .row {
    flex-direction: column !important;
  }

  /* Hide "Back to Shopping" on mobile — browser back button covers this,
     keeping Checkout as the only/dominant action */
  .cart-area .row.button {
    display: none !important;
  }

  /* ---- Order Summary container: card-style like line items ---- */
  .cart-area .order-summary-outer {
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    background: #fff;
    padding: 4px 12px 4px 12px;
	margin-top: 0;
    margin-bottom: 10px;
  }

  /* Order Summary table: keep as table (don't nuke it like cart table) */
  .cart-area .order-summary .table {
    margin-bottom: 6px;
  }
  .cart-area .order-summary .table th {
    font-size: 0.9375rem;
    font-weight: 500;
    color: #555;
    padding: 0 0 6px 0;
    border-bottom: 1px solid #f0f0f0;
  }
  .cart-area .order-summary .table td {
    padding: 4px 0;
    font-size: 0.9375rem;
    border: none;
  }
  .cart-area .order-summary .table td.last {
    padding-top: 6px;
    border-top: 1px solid #f0f0f0;
    font-weight: 500;
  }

  /* ---- Voucher form: compact ---- */
  .cart-area .coupons {
    margin-bottom: 8px;
  }
  .cart-area .coupons .form-group {
    margin-bottom: 8px;
  }
  .cart-area .coupons label {
    font-size: 0.875rem;
    color: #555;
    font-weight: 500;
    margin-bottom: 2px;
  }
  .cart-area .coupons .voucher-hint {
    margin-bottom: 4px;
  }
  .cart-area .coupons .btn {
    width: 100%;
  }

  /* ---- Proceed To Checkout: dominant primary CTA ---- */
  .cart-area .order-summary-outer .buttons {
    margin-top: 4px;
  }
  .cart-area .order-summary-outer .buttons .btn {
    display: block;
    width: 100%;
    background-color: #ffcc67 !important;
    border-color: #ffcc67 !important;
    color: #111 !important;
    font-weight: 500;
    text-transform: uppercase;
    padding: 12px;
    font-size: 1rem;
  }

  /* Close gap inside cart-left — kill any min-height/padding on cart-left and its inner row */
  .cart-area .cart-left {
    min-height: 0 !important;
    padding-bottom: 0 !important;
  }
  .cart-area .cart-left > .row {
    margin-bottom: 0 !important;
  }
  .cart-area #update_cart_form {
    margin-bottom: 0 !important;
  }
  /* ---- Login page: tablet and below ---- */
  .login-image-panel {
    display: none !important;
  }
  .login-card {
    height: auto !important;
  }
  .login-form-panel {
    overflow: visible !important;
  }
  #panel-signin,
  #panel-create {
    overflow: visible !important;
    height: auto !important;
  }
}