/*!
 * Theme Developer: Manu Marshel
 * Email: manumarshel@gmail.com
 * Website: https://manumarshal.com
 */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');
@import url('https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/tabler-icons.min.css');

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  max-width: 100%;
  overflow-x: clip;
}

body {
  font-family: 'Inter', sans-serif;
  background-color: #FAF5EA; /* brand-cream */
  color: #1F3328; /* brand-ink-800 */
  max-width: 100%;
  overflow-x: clip;
}

::selection {
  background-color: #F5D27E; /* brand-gold-300 */
  color: #16271C; /* brand-ink-900 */
}
.text-brand-gold-300 {
    color: #c8942b !important;
}
a.color-brand-stone-300 {
    color: #a6a6a6;
}
/* Scroll margin offsets for sections to accommodate sticky header */
.section-anchor {
  scroll-margin-top: 68px;
}
@media (max-width: 768px) {
  .section-anchor {
    scroll-margin-top: 60px;
  }
}

/* Scroll Reveal animation classes */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.yhidden {
        overflow-y: hidden;
}
.vbg {
        background: rgb(0 0 0 / 78%) !important;
}
.reveal.active {
  opacity: 1;
  transform: translateY(0);
}
.bg-white\/92 {
    background: rgb(255 255 255 / 90%);
}
/* SVG Logo path animation */
.logo-path {
  stroke-dasharray: 400;
  stroke-dashoffset: 400px;
  animation: logo-draw-keyframes 6s cubic-bezier(0.4, 0, 0.2, 1) forwards infinite;
}
.pt-0 {
  padding-top: 0px !important;
}
.bg-\[f7f0e6\] {
    background: #e5e4e4 !important;
}.mt-\[10px\] {
    margin-top: 14px !important;
}
.pb-0 {
  padding-bottom: 0px !important;
}

@keyframes logo-draw-keyframes {
  0% {
    stroke-dashoffset: 400px;
  }
  45%, 55% {
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dashoffset: -400px;
  }
}

/* Mobile Drawer & Scrim transitions */
.drawer {
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.drawer.open {
  transform: translateX(0);
  visibility: visible;
}
.scrim {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.scrim.show {
  opacity: 1;
  pointer-events: auto;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.scrollbar-none::-webkit-scrollbar {
  display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.scrollbar-none {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}
.mt-0 {
    margin-top: 0px !important;
}
/* Custom grid for footer columns on desktop/monitor views (40% first column, 20% others) */
@media (min-width: 1024px) {
  .footer-grid-custom {
    grid-template-columns: 2fr 1fr 1fr 1fr !important;
  }
}

/* ── Wishlist page ── */
.wishlist-card {
  transition: all 0.3s ease;
}
.wishlist-card:hover {
  box-shadow: 0 12px 32px rgba(0,0,0,0.09);
}

/* ── Account Tabs Engine ── */
.tab-radio {
  display: none !important;
}

.acct-tab-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  font-size: 0.85rem;
  font-weight: 600;
  border-radius: 12px;
  color: #5E7064; /* brand-ink-500 */
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
}

.acct-tab-label:hover {
  color: #1F3328; /* brand-ink-800 */
  background-color: #F2EDE2; /* brand-stone-100 */
}

.acct-tab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 9999px;
  background-color: #F2EDE2; /* brand-stone-100 */
  color: #5E7064;
  transition: all 0.2s ease;
}

/* Active tab styles via radio states */
#acct-tab-orders:checked ~ .acct-tabs label[for="acct-tab-orders"],
#acct-tab-profile:checked ~ .acct-tabs label[for="acct-tab-profile"],
#acct-tab-addresses:checked ~ .acct-tabs label[for="acct-tab-addresses"],
#acct-tab-invoices:checked ~ .acct-tabs label[for="acct-tab-invoices"],
#acct-tab-notifs:checked ~ .acct-tabs label[for="acct-tab-notifs"] {
  background-color: #FAF5EA; /* brand-cream */
  color: #A8741A; /* brand-gold-700 */
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

#acct-tab-orders:checked ~ .acct-tabs label[for="acct-tab-orders"] .acct-tab-badge {
  background-color: #E0A11E; /* brand-gold-500 */
  color: #16271C; /* brand-ink-900 */
}

/* Hide panels by default and show the active one */
.acct-content > [data-panel] {
  display: none;
}

#acct-tab-orders:checked ~ .acct-content > [data-panel="orders"],
#acct-tab-profile:checked ~ .acct-content > [data-panel="profile"],
#acct-tab-addresses:checked ~ .acct-content > [data-panel="addresses"],
#acct-tab-invoices:checked ~ .acct-content > [data-panel="invoices"],
#acct-tab-notifs:checked ~ .acct-content > [data-panel="notifs"] {
  display: block;
}
.mt-2.accordion-content {
    max-height: 170px;
    overflow: hidden;
    overflow-y: scroll;
}
.mt-1 {
    margin-top: 5px !important;
}