/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 30 2025 | 16:33:23 */
@media (max-width: 768px) {
  .woocommerce-MyAccount-navigation {
    position: relative;
    padding: 10px 15px 30px;
    background-color: #f8f9fa;
    border-radius: 6px;
    overflow: hidden;
	max-width: 400px !important;
  }

  .woocommerce-MyAccount-navigation::before,
  .woocommerce-MyAccount-navigation::after {
    content: "";
    position: absolute;
    top: 0;
    width: 40px;
    height: 100%;
    z-index: 2;
    pointer-events: none;
  }

  .woocommerce-MyAccount-navigation::before {
    left: 0;
    background: linear-gradient(to right, #f8f9fa, rgba(248, 249, 250, 0));
  }

  .woocommerce-MyAccount-navigation::after {
    right: 0;
    background: linear-gradient(to left, #f8f9fa, rgba(248, 249, 250, 0));
  }

  .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: nowrap;
    gap: 14px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 5px 10px;
    margin: 0;
    list-style: none;
    scroll-snap-type: x mandatory;
  }

  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
    height: 4px;
  }

  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border-radius: 4px;
  }

  .woocommerce-MyAccount-navigation li {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }

  .woocommerce-MyAccount-navigation a {
    white-space: nowrap;
    font-size: 15px;
    padding: 10px 14px;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    color: #333;
    display: inline-block;
    transition: 0.2s ease;
  }

  .woocommerce-MyAccount-navigation a:hover {
    background-color: #e2e6ea;
    color: #000;
  }

  .woocommerce-MyAccount-navigation .is-active a {
    background-color: #15c1e5;
    color: #fff;
    border-color: #15c1e5;
    font-weight: 600;
  }

  /* Indicadores visuais com setas */
.woocommerce-MyAccount-navigation::before,
.woocommerce-MyAccount-navigation::after {
  content: "";
  font-size: 22px;
  font-weight: bold;
  color: #555;
  top: 85%;
  transform: translateY(-50%);
  background: none;
  line-height: 1;
  position: absolute;
  z-index: 2;
  pointer-events: none;
}

.woocommerce-MyAccount-navigation::before {
  content: "◀"; /* seta esquerda simétrica */
  left: 0px;
}

.woocommerce-MyAccount-navigation::after {
  content: "▶"; /* seta direita simétrica */
  right: -15px;
}

	
}