/* =========================
   FOOTER — PRO
   ========================= */

[data-component-id="footer"].sa-footer {
  position: relative;
  margin-top: 28px;
  padding-top: 10px;

  /* premium dark panel */
  background: rgba(10, 10, 12, 0.70);
  border-top: 1px solid rgba(255,255,255,0.08);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* delikatny gradient na górze */
[data-component-id="footer"].sa-footer::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 140px;
  pointer-events: none;
  background: radial-gradient(900px 140px at 50% 0%, rgba(255,255,255,0.10), transparent 60%);
  opacity: 0.9;
}

[data-component-id="footer"].sa-footer .container {
  position: relative;
  z-index: 2;
}

/* Brand */
[data-component-id="footer"].sa-footer .sa-footer__brand img {
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 16px 50px rgba(0,0,0,0.35);
}

[data-component-id="footer"].sa-footer .sa-footer__brand p {
  color: rgba(255,255,255,0.92);
  letter-spacing: -0.02em;
}

/* Headings */
[data-component-id="footer"].sa-footer h5 {
  color: rgba(255,255,255,0.90);
  font-weight: 900;
  letter-spacing: -0.02em;
  margin-bottom: 14px;
  font-size: 0.95rem;
}

/* Links */
[data-component-id="footer"].sa-footer .nav-link {
  color: rgba(255,255,255,0.72);
  font-weight: 700;
  text-decoration: none;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;

  transition: transform 160ms ease, color 160ms ease, background-color 160ms ease;
}

[data-component-id="footer"].sa-footer .nav-link:hover {
  color: rgba(255,255,255,0.95);
  background: rgba(255,255,255,0.07);
  transform: translateY(-1px);
  padding-left: 10px; /* subtle motion */
  padding-right: 10px;
}

/* list spacing feels less “bootstrapy” */
[data-component-id="footer"].sa-footer .nav-item {
  margin-bottom: 10px !important;
}

/* row padding refinement */
[data-component-id="footer"].sa-footer .row.py-5 {
  padding-top: 46px !important;
  padding-bottom: 46px !important;
}

/* Responsive: lepsze odstępy na mobile */
@media (max-width: 575.98px) {
  [data-component-id="footer"].sa-footer .row.py-5 {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }

  [data-component-id="footer"].sa-footer h5 {
    margin-top: 14px;
  }
}
/* =========================
   ANNOUNCEMENT BAR — PRO
   ========================= */

[data-component-id="announcement"].announcement {
  position: relative;
  z-index: 1035; /* above navbar blur layers */
  padding: 10px 0;

  /* glass strip */
  background: rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255,255,255,0.08);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  color: rgba(255,255,255,0.86);
  font-weight: 700;
  letter-spacing: -0.01em;
  text-align: center;
  font-size: 0.92rem;
  line-height: 1.35;
}

/* make text not hug edges on mobile */
[data-component-id="announcement"].announcement {
  padding-left: 12px;
  padding-right: 12px;
}

/* Links inside announcement */
[data-component-id="announcement"].announcement a {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  margin-left: 10px;
  padding: 6px 10px;

  border-radius: 999px;
  text-decoration: none;

  color: rgba(255,255,255,0.92);
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.10);

  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease, opacity 160ms ease;
}

[data-component-id="announcement"].announcement a:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.14);
  opacity: 1;
}

/* icon */
[data-component-id="announcement"].announcement a svg {
  width: 16px;
  height: 16px;
  opacity: 0.9;
}

/* If announcement contains rendered HTML, keep it tidy */
[data-component-id="announcement"].announcement p,
[data-component-id="announcement"].announcement span {
  margin: 0;
}

/* Mobile: allow wrapping nicely */
@media (max-width: 575.98px) {
  [data-component-id="announcement"].announcement {
    font-size: 0.88rem;
  }

  [data-component-id="announcement"].announcement a {
    margin-left: 6px;
    padding: 6px 9px;
  }
}
/* =========================
   PRODUCT CARD — PRO
   ========================= */

a.sa-product-card.card {
  border-radius: 22px;
  overflow: hidden;

  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);

  box-shadow: 0 18px 60px rgba(0,0,0,0.22);
  transform: translateZ(0);

  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

a.sa-product-card.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 28px 90px rgba(0,0,0,0.32);
  border-color: rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
}

/* Image area */
a.sa-product-card .card-img-top {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

a.sa-product-card .card-img-top img {
  width: 100%;
  height: 100%;
  object-fit: var(--product-image-fit, cover);

  transform: scale(1.001);
  transition: transform 260ms ease, filter 260ms ease;
}

a.sa-product-card:hover .card-img-top img {
  transform: scale(1.06);
  filter: saturate(1.08) contrast(1.04);
}

/* Placeholder */
a.sa-product-card .product-img-placeholder {
  display: grid;
  place-items: center;
  background: rgba(255,255,255,0.04);
}

/* Badges */
a.sa-product-card .badges {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  z-index: 3;
}

a.sa-product-card .badges > div {
  display: inline-flex;
  align-items: center;
  gap: 6px;

  padding: 6px 10px;
  border-radius: 999px;

  font-weight: 900;
  font-size: 0.78rem;

  color: rgba(255,255,255,0.95);
  border: 1px solid rgba(255,255,255,0.14);

  box-shadow: 0 12px 30px rgba(0,0,0,0.28);
}

/* Overlay CTA */
a.sa-product-card .overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;

  background: linear-gradient(to bottom, rgba(0,0,0,0.00), rgba(0,0,0,0.48));
  opacity: 0;
  transition: opacity 200ms ease;
  z-index: 2;
}

a.sa-product-card:hover .overlay {
  opacity: 1;
}

a.sa-product-card .overlay .btn {
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 900;
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
}

/* Body */
a.sa-product-card .card-body {
  padding: 14px 14px 16px;
}

a.sa-product-card .info {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

/* Price */
a.sa-product-card .price {
  margin: 0;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.92);
}

a.sa-product-card .price s {
  margin-left: 8px;
  color: rgba(255,255,255,0.55);
}

/* Stock / meta line */
a.sa-product-card .text-primary {
  margin: 0;
  font-weight: 800;
  font-size: 0.9rem;

  /* make "primary" look premium on dark */
  color: rgba(var(--cl-accent-rgb), 0.95) !important;
}

a.sa-product-card .stock-unlimited svg {
  width: 16px;
  height: 16px;
  vertical-align: -0.2em;
  margin-right: 6px;
  opacity: 0.95;
}

/* Title */
a.sa-product-card .card-title {
  margin: 0;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.92);

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.6em; /* keeps consistent card heights */
}

/* Better focus state */
a.sa-product-card:focus-visible {
  outline: 3px solid rgba(var(--cl-accent-rgb), 0.65);
  outline-offset: 3px;
}

/* Mobile: less lift */
@media (max-width: 575.98px) {
  a.sa-product-card.card:hover {
    transform: translateY(-1px);
  }
}
/* =========================
   PRODUCTS PAGE — PRO
   ========================= */

.sa-products-page .py-5-nav {
  padding-top: 28px !important;
  padding-bottom: 42px !important;
}

/* Section title */
.sa-products-page .section-title {
  margin-bottom: 18px;
}

.sa-products-page .section-title h1 {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.04em;
  line-height: 1.05;
  font-size: clamp(1.9rem, 2.8vw, 2.6rem);
  color: rgba(255,255,255,0.92);
}

/* Sidebar panel (your .bg-gray wrapper) */
.sa-products-page .bg-gray {
  border-radius: 22px !important;
  padding: 16px !important;

  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;

  box-shadow: 0 18px 60px rgba(0,0,0,0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Labels */
.sa-products-page .form-label {
  color: rgba(255,255,255,0.80);
  font-weight: 900;
  letter-spacing: -0.01em;
}

/* Inputs */
.sa-products-page .form-control {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.18);
  color: rgba(255,255,255,0.92);

  padding: 10px 12px;
  font-weight: 700;

  box-shadow: none !important;
}

.sa-products-page .form-control:focus {
  border-color: rgba(var(--cl-accent-rgb), 0.55);
  outline: 0;
  box-shadow: 0 0 0 4px rgba(var(--cl-accent-rgb), 0.18) !important;
}

.sa-products-page .form-control::placeholder {
  color: rgba(255,255,255,0.45);
  opacity: 1;
}

/* Currency suffix */
.sa-products-page .text-muted.small {
  color: rgba(255,255,255,0.55) !important;
  font-weight: 800;
}

/* Category buttons (btn-outline / btn-primary) */
.sa-products-page a.btn.btn-sm.text-start {
  border-radius: 14px;
  padding: 9px 12px;
  font-weight: 900;
  letter-spacing: -0.01em;
  border-width: 1px;
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.sa-products-page a.btn.btn-sm.text-start:hover {
  transform: translateY(-1px);
}

/* If theme has "btn-outline" custom class, normalize it */
.sa-products-page .btn-outline {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.86) !important;
}

.sa-products-page .btn-outline:hover {
  background: rgba(255,255,255,0.07) !important;
  border-color: rgba(255,255,255,0.14) !important;
}

/* Primary buttons feel more premium */
.sa-products-page .btn.btn-primary,
.sa-products-page .btn.btn-outline-primary {
  border-radius: 16px;
  padding: 11px 14px;
  font-weight: 950;
  letter-spacing: -0.01em;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.sa-products-page .btn.btn-primary:hover,
.sa-products-page .btn.btn-outline-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
}

/* Products grid spacing */
.sa-products-page .products.row {
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
}

/* “Filters” mobile button */
.sa-products-page .d-lg-none .btn.btn-primary {
  border-radius: 18px;
}

/* Empty state */
.sa-products-page .text-muted {
  color: rgba(255,255,255,0.55) !important;
}

/* Modals (filters + group modal) */
.sa-products-page .modal-content {
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(15,15,18,0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.sa-products-page .modal-header {
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.sa-products-page .modal-title {
  font-weight: 950;
  letter-spacing: -0.02em;
}

.sa-products-page .btn-close {
  filter: invert(1);
  opacity: 0.8;
}

.sa-products-page .btn-close:hover {
  opacity: 1;
}

/* Make modal product grid nice */
.sa-products-page .modal .products.row {
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
}

/* Responsive: less padding on small devices */
@media (max-width: 575.98px) {
  .sa-products-page .py-5-nav {
    padding-top: 18px !important;
    padding-bottom: 34px !important;
  }

  .sa-products-page .bg-gray {
    padding: 14px !important;
    border-radius: 20px !important;
  }
}
/* =========================
   PRODUCTS PAGE — PRO (v2)
   ========================= */

.sa-products-page .py-5-nav {
  padding-top: 22px !important;
  padding-bottom: 44px !important;
}

/* Title */
.sa-products-page .section-title {
  margin-bottom: 18px;
}

.sa-products-page .section-title h1 {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.045em;
  line-height: 1.04;
  font-size: clamp(1.9rem, 2.9vw, 2.75rem);
  color: rgba(255,255,255,0.92);
}

/* Mobile Filters button */
.sa-products-page .d-lg-none .btn.btn-primary {
  border-radius: 18px;
  padding: 12px 14px;
  font-weight: 950;
}

/* Sidebar panel */
.sa-products-page aside .bg-gray {
  border-radius: 22px !important;
  padding: 16px !important;

  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;

  box-shadow: 0 18px 60px rgba(0,0,0,0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Sticky sidebar on desktop */
@media (min-width: 992px) {
  .sa-products-page aside {
    position: sticky;
    top: 96px; /* under announcement+navbar */
    height: fit-content;
  }
}

/* Labels */
.sa-products-page .form-label {
  color: rgba(255,255,255,0.82);
  font-weight: 900;
  letter-spacing: -0.01em;
}

/* Inputs */
.sa-products-page .form-control {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.20);
  color: rgba(255,255,255,0.92);

  padding: 10px 12px;
  font-weight: 750;

  box-shadow: none !important;
}

.sa-products-page .form-control:focus {
  border-color: rgba(var(--cl-accent-rgb), 0.55);
  outline: 0;
  box-shadow: 0 0 0 4px rgba(var(--cl-accent-rgb), 0.18) !important;
}

.sa-products-page .form-control::placeholder {
  color: rgba(255,255,255,0.46);
  opacity: 1;
}

/* Currency suffix */
.sa-products-page .text-muted.small {
  color: rgba(255,255,255,0.55) !important;
  font-weight: 850;
}

/* Category list buttons: nicer pills */
.sa-products-page a.btn.btn-sm.text-start {
  border-radius: 14px;
  padding: 9px 12px;
  font-weight: 900;
  letter-spacing: -0.01em;
  border-width: 1px;

  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease, opacity 160ms ease;
}

.sa-products-page a.btn.btn-sm.text-start:hover {
  transform: translateY(-1px);
}

/* Normalize custom btn-outline class if theme uses it */
.sa-products-page .btn-outline {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.86) !important;
}

.sa-products-page .btn-outline:hover {
  background: rgba(255,255,255,0.07) !important;
  border-color: rgba(255,255,255,0.14) !important;
}

/* Primary + Outline Primary buttons */
.sa-products-page .btn.btn-primary,
.sa-products-page .btn.btn-outline-primary {
  border-radius: 16px;
  padding: 11px 14px;
  font-weight: 950;
  letter-spacing: -0.01em;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.sa-products-page .btn.btn-primary:hover,
.sa-products-page .btn.btn-outline-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
}

/* Products grid: tighter + consistent */
.sa-products-page .products.row {
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
}

.sa-products-page .products > [class*="col-"] {
  margin-bottom: 0 !important; /* we rely on gutters */
}

/* Empty state */
.sa-products-page .text-center.py-5 {
  border-radius: 22px;
  padding: 34px 16px !important;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
}

.sa-products-page .text-muted {
  color: rgba(255,255,255,0.58) !important;
}

/* Modals (filters + group modal) */
.sa-products-page .modal-content {
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(15,15,18,0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.sa-products-page .modal-header {
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.sa-products-page .modal-title {
  font-weight: 950;
  letter-spacing: -0.02em;
}

.sa-products-page .btn-close {
  filter: invert(1);
  opacity: 0.8;
}

.sa-products-page .btn-close:hover {
  opacity: 1;
}

/* Group modal products grid */
.sa-products-page .modal .products.row {
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
}

/* Responsive tweaks */
@media (max-width: 575.98px) {
  .sa-products-page .py-5-nav {
    padding-top: 16px !important;
    padding-bottom: 34px !important;
  }

  .sa-products-page aside .bg-gray {
    padding: 14px !important;
    border-radius: 20px !important;
  }

  .sa-products-page .products.row {
    --bs-gutter-x: 14px;
    --bs-gutter-y: 14px;
  }
}
/* =========================
   PRODUCT PAGE — PRO (Spotlight Sections)
   ========================= */

.sa-product-page {
  padding-top: 18px;
  padding-bottom: 44px;
}

.sa-product-container {
  max-width: 1200px;
}

/* Main card */
.sa-product-main {
  border-radius: 22px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 18px 60px rgba(0,0,0,0.22);
  padding: 16px;
}

.sa-product-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 22px;
  align-items: start;
}

@media (max-width: 991.98px) {
  .sa-product-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* ===== Gallery ===== */
.sa-gallery { min-width: 0; }

.sa-main-image {
  border-radius: 18px;
  overflow: hidden;
  background: rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.10);
  aspect-ratio: 16 / 9;
  display: block;
  position: relative;
}

.sa-main-image img,
.sa-main-image .carousel,
.sa-main-image .carousel-inner,
.sa-main-image .carousel-item {
  width: 100%;
  height: 100%;
}

.sa-main-image img {
  object-fit: cover;
  transform: scale(1.001);
  transition: transform 260ms ease, filter 260ms ease;
}

.sa-main-image:hover img {
  transform: scale(1.03);
  filter: saturate(1.08) contrast(1.04);
}

.sa-placeholder {
  display: grid;
  place-items: center;
  color: rgba(255,255,255,0.55);
}

.sa-placeholder svg {
  width: 52px;
  height: 52px;
  opacity: 0.6;
}

.sa-thumbs {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: 10px;
}

.sa-thumb {
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  border-radius: 14px;
  overflow: hidden;
  padding: 0;
  cursor: pointer;
  aspect-ratio: 16 / 9;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.sa-thumb:hover {
  transform: translateY(-2px);
  border-color: rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.06);
}

.sa-thumb.active {
  border-color: rgba(var(--cl-accent-rgb), 0.55);
  box-shadow: 0 0 0 4px rgba(var(--cl-accent-rgb), 0.18);
}

.sa-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ===== Info ===== */
.sa-info {
  min-width: 0;
  border-radius: 18px;
  background: rgba(0,0,0,0.16);
  border: 1px solid rgba(255,255,255,0.08);
  padding: 16px;
}

.sa-title {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.045em;
  line-height: 1.05;
  font-size: clamp(1.6rem, 2.4vw, 2.1rem);
  color: rgba(255,255,255,0.92);
}

.sa-badges {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sa-badges > div {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 950;
  font-size: 0.75rem;
  color: rgba(255,255,255,0.95);
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 12px 30px rgba(0,0,0,0.20);
}

.sa-status {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.sa-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(255,255,255,0.06);
}

.sa-status-label {
  font-weight: 900;
  letter-spacing: -0.01em;
}

/* Live stats */
.sa-live {
  margin-top: 14px;
  border-radius: 16px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  padding: 12px;
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.sa-live-row {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}

.sa-live-strong {
  font-weight: 950;
  color: rgba(255,255,255,0.90);
}

.sa-live-muted {
  color: rgba(255,255,255,0.60);
  font-weight: 750;
}

/* Price bar */
.sa-pricebar {
  margin-top: 14px;
  padding: 14px 0;
  border-top: 1px solid rgba(255,255,255,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  display: flex;
  align-items: center;
  gap: 12px;
}

.sa-price {
  font-size: 1.85rem;
  font-weight: 950;
  letter-spacing: -0.04em;
  color: rgba(255,255,255,0.92);
}

.sa-stock { margin-left: auto; }

.sa-stock-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 999px;
  font-weight: 950;
  font-size: 0.85rem;
  border: 1px solid rgba(255,255,255,0.12);
}

.sa-stock-in {
  color: rgba(0,255,160,0.95);
  background: rgba(0,255,160,0.08);
  border-color: rgba(0,255,160,0.18);
}

.sa-stock-out {
  color: rgba(255,90,110,0.95);
  background: rgba(255,90,110,0.10);
  border-color: rgba(255,90,110,0.18);
}

.sa-stock-hold {
  color: rgba(255,200,90,0.95);
  background: rgba(255,200,90,0.10);
  border-color: rgba(255,200,90,0.18);
}

/* Form container (inside info) */
.sa-form {
  margin-top: 14px;
}

/* Make product-form buttons look premium ONLY on product page */
.sa-product-page .btn.w-100 {
  border-radius: 16px !important;
  padding: 12px 14px !important;
  font-weight: 950 !important;
  letter-spacing: -0.01em;
}

.sa-product-page .btn.w-100 svg {
  width: 18px;
  height: 18px;
}

/* Discord */
.sa-discord {
  margin-top: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  width: 100%;
  text-decoration: none;

  border-radius: 16px;
  padding: 12px 14px;

  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.90);

  font-weight: 950;
  letter-spacing: -0.01em;

  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.sa-discord:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.18);
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
}

.sa-discord .sa-icon {
  width: 18px;
  height: 18px;
  opacity: 0.95;
}

/* ===== Bottom section ===== */
.sa-bottom {
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 18px;
  align-items: start;
}

@media (max-width: 991.98px) {
  .sa-bottom {
    grid-template-columns: 1fr;
  }
}

.sa-description,
.sa-sidecard {
  border-radius: 22px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 18px 60px rgba(0,0,0,0.18);
  overflow: hidden;
}

.sa-description { padding: 16px; }

.sa-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  margin-bottom: 12px;
}

.sa-tab {
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.68);
  transition: transform 160ms ease, background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

.sa-tab:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.14);
  color: rgba(255,255,255,0.86);
}

.sa-tab.active {
  color: rgba(255,255,255,0.92);
  border-color: rgba(var(--cl-accent-rgb), 0.45);
  box-shadow: 0 0 0 4px rgba(var(--cl-accent-rgb), 0.16);
}

.sa-editor {
  color: rgba(255,255,255,0.70);
  line-height: 1.7;
  font-weight: 650;
}

/* Make editor content readable */
.sa-editor h1,
.sa-editor h2,
.sa-editor h3,
.sa-editor h4 {
  color: rgba(255,255,255,0.92);
  margin: 1.2rem 0 0.6rem;
  font-weight: 950;
  letter-spacing: -0.02em;
}

.sa-editor p { margin-bottom: 1rem; }
.sa-editor img { max-width: 100%; height: auto; border-radius: 14px; margin: 12px 0; }
.sa-editor a { color: rgba(var(--cl-accent-rgb), 0.95); text-decoration: none; font-weight: 900; }
.sa-editor a:hover { text-decoration: underline; }
.sa-editor code { background: rgba(255,255,255,0.08); padding: 2px 6px; border-radius: 8px; }
.sa-editor pre { background: rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,0.08); padding: 14px; border-radius: 14px; overflow-x: auto; }

/* Side card */
.sa-sidecard-title {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-weight: 950;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.90);
}

.sa-sidecard-body {
  padding: 16px;
}

/* Upsells */
.sa-upsells {
  margin-top: 22px;
  border-radius: 22px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  padding: 16px;
}

.sa-upsells-title {
  font-weight: 950;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.90);
  margin-bottom: 12px;
}

.sa-upsells-grid {
  --bs-gutter-x: 18px;
  --bs-gutter-y: 18px;
}
/* =========================
   FEATURES / WHY CHOOSE — PRO
   ========================= */

.sa-features {
  padding: 28px 0;
}

.sa-features .container {
  max-width: 1200px;
}

.sa-features-panel {
  border-radius: 26px;
  padding: 26px 22px;

  background: radial-gradient(80% 120% at 50% 0%, rgba(var(--cl-accent-rgb), 0.18), rgba(255,255,255,0.03) 55%, rgba(255,255,255,0.02));
  border: 1px solid rgba(255,255,255,0.10);

  box-shadow: 0 30px 120px rgba(0,0,0,0.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.sa-features-head {
  text-align: center;
  max-width: 78ch;
  margin: 0 auto 18px;
}

.sa-features-title {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.045em;
  line-height: 1.05;
  font-size: clamp(2.0rem, 3vw, 3.1rem);
  color: rgba(255,255,255,0.94);
}

.sa-features-title .sa-accent {
  color: rgba(var(--cl-accent-rgb), 1);
}

.sa-features-subtitle {
  margin: 12px auto 0;
  color: rgba(255,255,255,0.70);
  font-weight: 650;
  line-height: 1.6;
  font-size: 1.02rem;
}

.sa-features-grid {
  margin-top: 22px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

@media (max-width: 991.98px) {
  .sa-features-grid {
    grid-template-columns: 1fr;
  }
}

.sa-feature-card {
  border-radius: 18px;
  padding: 22px 20px;
  text-align: center;

  background: rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.10);

  box-shadow: 0 18px 60px rgba(0,0,0,0.22);

  transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.sa-feature-card:hover {
  transform: translateY(-2px);
  border-color: rgba(255,255,255,0.16);
  background: rgba(0,0,0,0.28);
  box-shadow: 0 26px 80px rgba(0,0,0,0.30);
}

.sa-feature-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  border-radius: 16px;

  display: grid;
  place-items: center;

  background: rgba(var(--cl-accent-rgb), 0.12);
  border: 1px solid rgba(var(--cl-accent-rgb), 0.22);
  box-shadow: 0 18px 50px rgba(0,0,0,0.22);
}

.sa-feature-icon i {
  font-size: 20px;
  color: rgba(var(--cl-accent-rgb), 1);
}

.sa-feature-title {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.02em;
  font-size: 1.12rem;
  color: rgba(255,255,255,0.92);
}

.sa-feature-text {
  margin: 10px 0 0;
  color: rgba(255,255,255,0.64);
  font-weight: 650;
  line-height: 1.6;
  font-size: 0.98rem;
}
/* =========================
   PSC Banner — PRO
   ========================= */

.sa-psc {
  padding: 18px 0;
}

.sa-psc .container {
  max-width: 1200px;
}

.sa-psc-panel {
  position: relative;
  border-radius: 22px;
  padding: 18px 18px;

  background: radial-gradient(120% 160% at 0% 0%, rgba(var(--cl-accent-rgb), 0.20), rgba(255,255,255,0.03) 58%, rgba(255,255,255,0.02));
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 26px 90px rgba(0,0,0,0.30);

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;

  overflow: hidden;
}

/* subtle inner shape on the left */
.sa-psc-panel::before {
  content: "";
  position: absolute;
  left: -70px;
  top: -70px;
  width: 180px;
  height: 180px;
  border-radius: 40px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  transform: rotate(18deg);
}

.sa-psc-left {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.sa-psc-badge {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: rgba(var(--cl-accent-rgb), 0.14);
  border: 1px solid rgba(var(--cl-accent-rgb), 0.24);
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
  flex: 0 0 auto;
}

.sa-psc-copy {
  min-width: 0;
}

.sa-psc-title {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.03em;
  color: rgba(255,255,255,0.92);
  font-size: 1.35rem;
}

.sa-psc-subtitle {
  margin: 6px 0 0;
  color: rgba(255,255,255,0.68);
  font-weight: 650;
  line-height: 1.55;
}

/* CTA */
.sa-psc-right {
  position: relative;
  flex: 0 0 auto;
}

.sa-psc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: 11px 16px;
  border-radius: 14px;

  background: rgba(var(--cl-accent-rgb), 0.95);
  border: 1px solid rgba(var(--cl-accent-rgb), 0.85);
  color: #0b0b0f;
  text-decoration: none;

  font-weight: 950;
  letter-spacing: -0.01em;

  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

.sa-psc-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
  filter: brightness(1.05);
  color: #0b0b0f;
}

.sa-psc-icon {
  width: 18px;
  height: 18px;
}

/* Responsive */
@media (max-width: 767.98px) {
  .sa-psc-panel {
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
  }

  .sa-psc-right {
    width: 100%;
  }

  .sa-psc-btn {
    width: 100%;
  }
}
/* =========================================================
   PSC Component – clean premium banner (no left square, no icon)
   + reveal animation (fade + slide)
   ========================================================= */

.sa-psc { padding: 20px 0; }
.sa-psc .container { max-width: 1200px; }

/* panel */
.sa-psc-panel{
  position: relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 24px;

  padding: 22px 26px;
  border-radius: 22px;

  background:
    radial-gradient(circle at 0% 50%, rgba(255,255,255,0.06), transparent 45%),
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.025));

  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 24px 80px rgba(0,0,0,0.45);
  overflow: hidden;
}

/* subtle glow */
.sa-psc-panel::before{
  content:"";
  position:absolute;
  left:-130px;
  top:50%;
  transform: translateY(-50%);
  width:260px;
  height:260px;
  background: radial-gradient(circle, rgba(255,255,255,0.10), transparent 70%);
  filter: blur(30px);
  pointer-events:none;
}

.sa-psc-text{ display:flex; flex-direction:column; gap:6px; }
.sa-psc-title{
  margin:0;
  font-size: 1.15rem;
  font-weight: 850;
  color: rgba(255,255,255,0.96);
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.sa-psc-subtitle{
  margin:0;
  font-size: 0.95rem;
  font-weight: 520;
  color: rgba(255,255,255,0.65);
  line-height: 1.55;
}

/* button */
.sa-psc-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding: 12px 18px;
  border-radius: 14px;

  color:#fff;
  text-decoration:none;

  background: linear-gradient(180deg, #3a3a3a 0%, #2a2a2a 55%, #1f1f1f 100%);
  border: 1px solid rgba(255,255,255,0.18);

  font-size: 0.95rem;
  font-weight: 900;
  letter-spacing: -0.01em;

  box-shadow:
    0 18px 55px rgba(0,0,0,0.45),
    0 0 0 0 rgba(30,136,255,0);

  transition:
    transform 160ms ease,
    box-shadow 180ms ease,
    filter 180ms ease;
}

.sa-psc-btn:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
  box-shadow:
    0 26px 75px rgba(0,0,0,0.55),
    0 0 0 4px rgba(30,136,255,0.16);
}

.sa-psc-btn:active{
  transform: translateY(0);
  filter: brightness(0.98);
  box-shadow:
    0 14px 45px rgba(0,0,0,0.45),
    0 0 0 3px rgba(30,136,255,0.14);
}

.sa-psc-btn:focus-visible{
  outline:none;
  box-shadow:
    0 26px 75px rgba(0,0,0,0.55),
    0 0 0 4px rgba(30,136,255,0.25),
    0 0 0 1px rgba(255,255,255,0.18) inset;
}

/* reveal animation */
.sa-reveal{
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 520ms ease, transform 520ms ease;
  will-change: opacity, transform;
}

.sa-reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}

/* responsive */
@media (max-width: 768px){
  .sa-psc-panel{ flex-direction:column; align-items:stretch; gap:16px; }
  .sa-psc-btn{ width:100%; }
}
/* =========================================================
   PRODUCTS section (Shop) – centered panel + nicer spacing
   ========================================================= */

.sa-products{
  padding: 28px 0 34px;
}

.sa-products .container{
  max-width: 1200px;
}

.sa-section-head{
  display:flex;
  flex-direction:column;
  gap: 6px;
  margin: 0 0 14px;
}

.sa-section-title{
  margin:0;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.95);
  font-size: 1.6rem;
}

.sa-section-subtitle{
  margin:0;
  color: rgba(255,255,255,0.60);
  font-weight: 600;
  line-height: 1.55;
}

.sa-products-panel{
  border-radius: 22px;
  padding: 18px;

  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,0.05), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));

  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 26px 90px rgba(0,0,0,0.35);
}

/* tighter, cleaner grid */
.sa-products-grid{
  margin-left: -10px;
  margin-right: -10px;
  row-gap: 18px;
}

.sa-product-col{
  padding-left: 10px;
  padding-right: 10px;
}

/* fix the “lonely card + empty space” look */
.sa-products .row{
  justify-content: flex-start;
}

@media (max-width: 575.98px){
  .sa-products-panel{ padding: 14px; }
  .sa-section-title{ font-size: 1.35rem; }
}
/* ================================
   SECTION HEADERS (SHOP / PRODUCTS)
================================ */

.sa-section-header {
  text-align: center;
  margin-bottom: 36px;
}

.sa-section-title {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92);
}

.sa-section-underline {
  display: block;
  width: 64px;
  height: 3px;
  margin: 14px auto 0;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.15),
    rgba(255,255,255,0.45),
    rgba(255,255,255,0.15)
  );
  box-shadow: 0 0 14px rgba(255,255,255,0.25);
}
/* =========================
   HERO (sa-hero) – premium
========================= */

.sa-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  border-radius: 26px;
  overflow: hidden;
  margin: 28px auto 0;
}

.sa-hero .container.sa-hero-container {
  padding: 44px 16px;
}

.sa-hero-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(900px 450px at 30% 30%, rgba(255,255,255,0.10), rgba(0,0,0,0) 60%),
    radial-gradient(700px 420px at 70% 60%, rgba(255,255,255,0.06), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(0,0,0,0.55), rgba(0,0,0,0.78));
  pointer-events: none;
}

.sa-hero-card {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,0.10);
  background: linear-gradient(180deg, rgba(18,18,18,0.70), rgba(10,10,10,0.55));
  box-shadow: 0 30px 120px rgba(0,0,0,0.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow: hidden;

  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

.sa-hero-content {
  padding: 42px 34px;
}

/* Optional side image column */
.sa-hero-media {
  padding: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.02);
}
.sa-hero-media img {
  max-height: 320px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
}

/* Alignment support */
.sa-hero.alignment-left .sa-hero-content { text-align: left; }
.sa-hero.alignment-center .sa-hero-content { text-align: center; }
.sa-hero.alignment-right .sa-hero-content { text-align: right; }

.sa-hero-title {
  margin: 0 0 12px;
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: rgba(255,255,255,0.95);
  font-size: clamp(34px, 4vw, 56px);
}

.sa-hero-subtitle {
  margin: 0 0 22px;
  max-width: 64ch;
  color: rgba(255,255,255,0.70);
  font-size: 15px;
  line-height: 1.6;
}
.sa-hero.alignment-center .sa-hero-subtitle { margin-left: auto; margin-right: auto; }
.sa-hero.alignment-right .sa-hero-subtitle { margin-left: auto; }

/* Actions */
.sa-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
}
.sa-hero.alignment-center .sa-hero-actions { justify-content: center; }
.sa-hero.alignment-right .sa-hero-actions { justify-content: flex-end; }

/* Searchbar (fake) */
.sa-hero-search {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  height: 46px;
  padding: 0 14px;
  min-width: min(560px, 100%);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.92);
  color: rgba(0,0,0,0.85);
  box-shadow: 0 18px 60px rgba(0,0,0,0.25);
  cursor: pointer;
  user-select: none;
  transition: transform 140ms ease, filter 140ms ease, box-shadow 140ms ease;
}
.sa-hero-search:hover {
  transform: translateY(-1px);
  filter: brightness(1.02);
  box-shadow: 0 22px 70px rgba(0,0,0,0.32);
}
.sa-hero-search:active { transform: translateY(0); }

.sa-hero-search-icon svg {
  width: 18px;
  height: 18px;
  color: rgba(0,0,0,0.55);
}

.sa-hero-search-text {
  font-weight: 650;
  color: rgba(0,0,0,0.60);
  font-size: 14px;
  flex: 1;
}

.sa-hero-search-kbd {
  font-size: 12px;
  font-weight: 750;
  color: rgba(0,0,0,0.50);
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(0,0,0,0.03);
  padding: 6px 9px;
  border-radius: 10px;
}

/* CTA button */
.sa-hero-cta {
  height: 46px;
  padding: 0 16px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.90);
  font-weight: 850;
  letter-spacing: -0.01em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: transform 140ms ease, background 140ms ease, border-color 140ms ease;
}
.sa-hero-cta:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.09);
  border-color: rgba(255,255,255,0.20);
  color: rgba(255,255,255,0.95);
}
.sa-hero-cta:active { transform: translateY(0); }
.sa-hero-cta-icon { width: 18px; height: 18px; opacity: 0.9; }

/* Stats */
.sa-hero-stats {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 560px;
}
.sa-hero.alignment-center .sa-hero-stats { margin-left: auto; margin-right: auto; }
.sa-hero.alignment-right .sa-hero-stats { margin-left: auto; }

.sa-stat {
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  padding: 14px 14px;
}
.sa-stat-top {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
}
.sa-hero.alignment-left .sa-stat-top { justify-content: flex-start; }
.sa-hero.alignment-right .sa-stat-top { justify-content: flex-end; }

.sa-stat-icon svg {
  width: 16px;
  height: 16px;
  color: rgba(255,255,255,0.85);
  opacity: 0.9;
}
.sa-stat-value {
  font-weight: 900;
  font-size: 16px;
  color: rgba(255,255,255,0.92);
}
.sa-stat-label {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  color: rgba(255,255,255,0.55);
  text-align: center;
}
.sa-hero.alignment-left .sa-stat-label { text-align: left; }
.sa-hero.alignment-right .sa-stat-label { text-align: right; }

/* Heights (works with your properties.height) */
.sa-hero.height-small .container.sa-hero-container { padding: 28px 16px; }
.sa-hero.height-medium .container.sa-hero-container { padding: 44px 16px; }
.sa-hero.height-large .container.sa-hero-container { padding: 72px 16px; }

/* Modal searchbar styling */
.sa-hero-search-modal .modal-content {
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(15,15,15,0.90);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.sa-hero-search-modal .modal-header {
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.sa-hero-modal-searchbar {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
}
.sa-hero-modal-icon svg {
  width: 18px;
  height: 18px;
  color: rgba(255,255,255,0.70);
}
.sa-hero-search-modal input.form-control {
  background: transparent !important;
  border: none !important;
  color: rgba(255,255,255,0.92) !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.sa-hero-search-modal input.form-control::placeholder {
  color: rgba(255,255,255,0.45) !important;
}

/* Responsive */
@media (min-width: 992px) {
  .sa-hero-card {
    grid-template-columns: 1fr auto;
    align-items: center;
  }
  .sa-hero-media {
    border-top: none;
    border-left: 1px solid rgba(255,255,255,0.08);
    min-width: 360px;
  }
}

@media (max-width: 768px) {
  .sa-hero-content { padding: 28px 18px; }
  .sa-hero-stats { grid-template-columns: 1fr; max-width: 100%; }
  .sa-hero-search { min-width: 100%; }
  .sa-hero-search-kbd { display: none; }
}
/* =========================
   NAVBAR – premium glass (SAFE VERSION)
========================= */

.sa-nav {
  position: relative;
  z-index: 999;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: rgba(10,10,10,0.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.sa-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0;
}

/* Brand */
.sa-nav-brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
}
.sa-nav-logo{
  height:26px;
  width:auto;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.10);
}
.sa-nav-name{
  font-weight:850;
  letter-spacing:-0.02em;
  color:rgba(255,255,255,0.92);
}

/* Desktop layout */
.sa-nav-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  flex:1;
}

.sa-nav-actions{
  display:flex;
  align-items:center;
  gap:10px;
}

/* Links */
.sa-nav-link{
  text-decoration:none;
  font-weight:750;
  font-size:14px;
  color:rgba(255,255,255,0.70);
  padding:8px 10px;
  border-radius:12px;
  transition:color 140ms ease, background 140ms ease, transform 140ms ease;
}
.sa-nav-link:hover{
  color:rgba(255,255,255,0.92);
  background:rgba(255,255,255,0.05);
  transform:translateY(-1px);
}

/* Pills */
.sa-pill{
  height:36px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.04);
  color:rgba(255,255,255,0.85);
  text-decoration:none;
  font-weight:800;
  font-size:13px;
  transition:transform 140ms ease, background 140ms ease, border-color 140ms ease;
}
.sa-pill:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,0.07);
  border-color:rgba(255,255,255,0.18);
  color:rgba(255,255,255,0.92);
}
.sa-pill-icon{ width:40px; padding:0; }
.sa-pill-icon svg{ width:18px; height:18px; opacity:0.9; }
.sa-pill-select{ min-width:74px; }

/* Dropdown */
.sa-dropdown{
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(14,14,14,0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  overflow:hidden;
}
.sa-dropdown .dropdown-item{
  color:rgba(255,255,255,0.85);
  font-weight:700;
  padding:10px 12px;
}
.sa-dropdown .dropdown-item:hover{
  background:rgba(255,255,255,0.06);
  color:rgba(255,255,255,0.95);
}

/* Mobile */
.sa-mobile{ display:none; }
.sa-nav-toggle{
  width:44px;
  height:38px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.04);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
.sa-nav-toggle span{
  display:block;
  width:18px;
  height:2px;
  border-radius:999px;
  background:rgba(255,255,255,0.75);
}

/* Mobile panel */
.sa-nav-mobilepanel{
  margin-bottom:12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(12,12,12,0.70);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  padding:12px;
}
.sa-nav-mobilelinks{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  margin-bottom:10px;
}
.sa-nav-mobileactions{
  display:flex;
  flex-direction:column;
  gap:8px;
}

@media (max-width: 991px){
  .sa-desktop{ display:none !important; }
  .sa-mobile{ display:block; }
  .sa-nav-inner{ gap:10px; }
}
/* Currency dropdown scroll fix (Bootstrap dropdown) */
#sa-currency-menu-desktop,
#sa-currency-menu-mobile {
  max-height: 320px;      /* możesz zmienić np. 240/400 */
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch; /* płynny scroll na iOS */
}

/* (opcjonalnie) trochę lepszy dotykowy scroll i brak "przeskoku" */
#sa-currency-menu-desktop .dropdown-item,
#sa-currency-menu-mobile .dropdown-item {
  white-space: nowrap;
}
/* =========================
   SOCIALS — PRO (glass)
   ========================= */

.sa-socials {
  padding: 28px 0 34px;
}

.sa-socials__container {
  max-width: 1200px;
}

.sa-socials__head {
  text-align: center;
  margin-bottom: 14px;
}

.sa-socials__title {
  margin: 0;
  font-weight: 950;
  letter-spacing: -0.04em;
  color: rgba(255,255,255,0.94);
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
}

.sa-socials__subtitle {
  margin: 10px auto 0;
  max-width: 70ch;
  color: rgba(255,255,255,0.65);
  font-weight: 650;
  line-height: 1.6;
}

.sa-socials__panel {
  border-radius: 22px;
  padding: 18px;

  background:
    radial-gradient(circle at 15% 0%, rgba(255,255,255,0.05), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));

  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 26px 90px rgba(0,0,0,0.35);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.sa-socials__grid {
  --bs-gutter-x: 16px;
  --bs-gutter-y: 16px;
}

.sa-social {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;

  padding: 14px 14px;
  border-radius: 18px;

  background: rgba(0,0,0,0.22);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 18px 60px rgba(0,0,0,0.22);

  text-decoration: none;
  color: rgba(255,255,255,0.90);

  transition: transform 180ms ease, border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

.sa-social:hover {
  transform: translateY(-2px);
  border-color: rgba(255,255,255,0.16);
  background: rgba(0,0,0,0.28);
  box-shadow: 0 26px 80px rgba(0,0,0,0.30);
  color: rgba(255,255,255,0.95);
}

.sa-social__left {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.sa-social__icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;

  display: grid;
  place-items: center;

  background: rgba(var(--cl-accent-rgb), 0.12);
  border: 1px solid rgba(var(--cl-accent-rgb), 0.22);
  box-shadow: 0 18px 50px rgba(0,0,0,0.22);

  flex: 0 0 auto;
}

.sa-social__icon svg {
  color: rgba(var(--cl-accent-rgb), 1);
  opacity: 0.98;
}

.sa-social__text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.sa-social__name {
  font-weight: 950;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,0.92);
  line-height: 1.1;
}

.sa-social__hint {
  color: rgba(255,255,255,0.60);
  font-weight: 650;
  font-size: 0.92rem;
  line-height: 1.2;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 22ch;
}

.sa-social__right svg {
  width: 20px;
  height: 20px;
  opacity: 0.85;
  transition: opacity 160ms ease, transform 160ms ease;
}

.sa-social:hover .sa-social__right svg {
  opacity: 1;
  transform: translateY(-1px);
}

/* Mobile */
@media (max-width: 575.98px) {
  .sa-socials__panel { padding: 14px; }
  .sa-social__hint { max-width: 28ch; }
}
/* =========================
   SOCIALS — title underline (ONLY HERE)
   ========================= */

.sa-socials .sa-socials__header{
  text-align: center;
  margin-bottom: 26px;
}

.sa-socials .sa-socials__title{
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92);
  margin: 0;
}

.sa-socials .sa-socials__underline{
  display: block;
  width: 64px;
  height: 3px;
  margin: 14px auto 0;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.12),
    rgba(255,255,255,0.55),
    rgba(255,255,255,0.12)
  );
  box-shadow: 0 0 14px rgba(255,255,255,0.22);
}

/* subtitle spacing */
.sa-socials .sa-socials__subtitle{
  text-align: center;
  margin-top: -10px;
  margin-bottom: 22px;
}
.sa-socials .sa-socials__subtitle p{
  margin: 0;
  color: rgba(255,255,255,0.65);
  font-weight: 600;
  line-height: 1.55;
}
/* ===== Customer Dashboard (SellAuth) ===== */
.customer-dash{
  --dash-bg: rgba(255,255,255,.03);
  --dash-border: rgba(255,255,255,.08);
  --dash-border-strong: rgba(255,255,255,.12);
  --dash-text: rgba(255,255,255,.92);
  --dash-muted: rgba(255,255,255,.62);
  --dash-muted-2: rgba(255,255,255,.45);
  --dash-glow: 0 0 0 1px rgba(255,255,255,.06), 0 18px 60px rgba(0,0,0,.55);
  --dash-radius: 14px;
  --dash-red: #ff3b3b;
}

.customer-dash .dash-card{
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  border: 1px solid var(--dash-border);
  border-radius: var(--dash-radius);
  box-shadow: var(--dash-glow);
  color: var(--dash-text);
  padding: 18px 18px;
}

.customer-dash .dash-sidebar{
  padding: 0;
  overflow: hidden;
}

/* Jeśli sidebar snippet ma własne tła – lekko go ujednolicamy */
.customer-dash .dash-sidebar .card,
.customer-dash .dash-sidebar .list-group,
.customer-dash .dash-sidebar .list-group-item{
  background: transparent !important;
  border-color: var(--dash-border) !important;
  color: var(--dash-text) !important;
}

.customer-dash .dash-stat__label{
  font-size: 14px;
  letter-spacing: .2px;
  color: var(--dash-muted);
  margin-bottom: 8px;
}

.customer-dash .dash-stat__value{
  font-size: 26px;
  font-weight: 700;
  line-height: 1.1;
}

.customer-dash .dash-stat__value--sm{
  font-size: 18px;
  font-weight: 650;
  color: var(--dash-text);
}

.customer-dash .dash-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 10px;
}

.customer-dash .dash-head__title{
  font-size: 14px;
  font-weight: 650;
  color: var(--dash-muted);
}

.customer-dash .dash-latest__name{
  font-size: 22px;
  font-weight: 750;
  letter-spacing: .2px;
}

.customer-dash .dash-latest__meta{
  margin-top: 10px;
  font-size: 13px;
  color: var(--dash-muted-2);
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

.customer-dash .dash-dot{
  opacity: .6;
}

.customer-dash .dash-link{
  color: var(--dash-muted);
  text-decoration: none;
}
.customer-dash .dash-link:hover{
  color: var(--dash-text);
  text-decoration: none;
}
.customer-dash .dash-link__accent{
  color: rgba(120,170,255,.95);
}

.customer-dash .dash-muted{
  color: var(--dash-muted);
}

.customer-dash .dash-balance__value{
  font-size: 26px;
  font-weight: 800;
  margin-top: 6px;
}

.customer-dash .dash-balance__meta{
  margin-top: 10px;
  font-size: 13px;
  color: var(--dash-muted);
}

/* Delete button (jak na screenie – cienka czerwona ramka, ciemne tło) */
.customer-dash .dash-danger-outline{
  border-radius: 10px;
  border: 1px solid rgba(255, 59, 59, .9);
  background: rgba(255, 59, 59, .06);
  color: rgba(255, 130, 130, .95);
  padding: 10px 16px;
  font-weight: 650;
}
.customer-dash .dash-danger-outline:hover{
  background: rgba(255, 59, 59, .12);
  color: rgba(255, 255, 255, .92);
}

/* Modal look */
.customer-dash .dash-modal{
  background: linear-gradient(180deg, rgba(20,20,20,.92), rgba(10,10,10,.92));
  border: 1px solid var(--dash-border-strong);
  border-radius: var(--dash-radius);
  box-shadow: 0 30px 90px rgba(0,0,0,.65);
  color: var(--dash-text);
}

.customer-dash .dash-modal__header{
  border-bottom: 1px solid var(--dash-border);
}

.customer-dash .dash-modal__body{
  color: var(--dash-text);
}

.customer-dash .dash-btn-muted{
  border-radius: 10px;
  border: 1px solid var(--dash-border-strong);
  background: rgba(255,255,255,.04);
  color: var(--dash-text);
  padding: 10px 14px;
}
.customer-dash .dash-btn-muted:hover{
  background: rgba(255,255,255,.06);
}

.customer-dash .dash-btn-danger{
  border-radius: 10px;
  border: 1px solid rgba(255, 59, 59, .85);
  background: rgba(255, 59, 59, .18);
  color: rgba(255,255,255,.92);
  padding: 10px 14px;
}
.customer-dash .dash-btn-danger:hover{
  background: rgba(255, 59, 59, .26);
}

/* Mobile spacing */
@media (max-width: 991px){
  .customer-dash .dash-card{ padding: 16px; }
}
/* =========================
   STATUS PAGE (SpadzettoShop style)
   ========================= */

.status-page .status-wrap{
  --bg: rgba(255,255,255,.03);
  --bg2: rgba(255,255,255,.02);
  --bd: rgba(255,255,255,.10);
  --bd2: rgba(255,255,255,.14);
  --tx: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.60);
  --shadow: 0 0 0 1px rgba(255,255,255,.06), 0 18px 60px rgba(0,0,0,.55);
  --radius: 14px;
  --radiusRow: 12px;
  --ok: #28d17c;
}

/* Header */
.status-page .status-header{
  padding: 10px 0 16px;
}
.status-page .status-title{
  margin: 0;
  font-size: 36px;
  font-weight: 850;
  letter-spacing: .2px;
  color: var(--tx);
}

/* Group title (np. Fivem Menu's) */
.status-page .status-group{
  margin-top: 18px;
}
.status-page .status-group-title{
  margin: 22px 0 12px;
  font-size: 20px;
  font-weight: 850;
  color: var(--tx);
  letter-spacing: .15px;
}

/* Layout */
.status-page .status-layout{
  width: 100%;
}

/* Cards container */
.status-page .status-cards{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

/* If your status-card snippet already outputs a wrapper card, we style it safely:
   - target common block elements inside status-cards
*/
.status-page .status-cards > *{
  border-radius: var(--radiusRow);
}

/* ====== Core row look (belt) ======
   We don't know exact structure inside status-card.njk,
   so we style the FIRST block-level wrapper and also common row patterns.
*/
.status-page .status-cards .status-card,
.status-page .status-cards .card,
.status-page .status-cards .list-group-item,
.status-page .status-cards .item,
.status-page .status-cards > div{
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  border: 1px solid var(--bd);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  border-radius: var(--radiusRow);
  color: var(--tx);
}

/* Padding + “row” spacing */
.status-page .status-cards .status-card,
.status-page .status-cards .card,
.status-page .status-cards .list-group-item,
.status-page .status-cards .item,
.status-page .status-cards > div{
  padding: 16px 18px;
}

/* Make rows behave like left name / right status if possible */
.status-page .status-cards .status-card,
.status-page .status-cards .list-group-item,
.status-page .status-cards > div{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

/* Left side: product name look */
.status-page .status-cards strong,
.status-page .status-cards .name,
.status-page .status-cards .title,
.status-page .status-cards h4,
.status-page .status-cards h5{
  margin: 0;
  font-weight: 850;
  letter-spacing: .15px;
  color: var(--tx);
}

/* Right side status text – catch common “success” patterns */
.status-page .status-cards .text-success,
.status-page .status-cards .status,
.status-page .status-cards .badge-success,
.status-page .status-cards [class*="success"],
.status-page .status-cards [class*="Success"]{
  color: var(--ok) !important;
  font-weight: 800;
  white-space: nowrap;
}

/* Green dot before status */
.status-page .status-cards .text-success::before,
.status-page .status-cards .status::before,
.status-page .status-cards .badge-success::before,
.status-page .status-cards [class*="success"]::before,
.status-page .status-cards [class*="Success"]::before{
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--ok);
  display: inline-block;
  margin-right: 10px;
  box-shadow: 0 0 0 4px rgba(40,209,124,.10);
  transform: translateY(1px);
}

/* Muted bits */
.status-page .status-cards small,
.status-page .status-cards .text-muted,
.status-page .status-cards .muted{
  color: var(--muted) !important;
}

/* Links */
.status-page a{
  color: rgba(120,170,255,.95);
  text-decoration: none;
}
.status-page a:hover{
  color: var(--tx);
}

/* Mobile */
@media (max-width: 575px){
  .status-page .status-title{ font-size: 30px; }
  .status-page .status-cards .status-card,
  .status-page .status-cards .card,
  .status-page .status-cards .list-group-item,
  .status-page .status-cards .item,
  .status-page .status-cards > div{
    padding: 14px 14px;
  }
}
/* =========================
   FEEDBACKS PAGE – cohesive dark/glass design
   ========================= */

.feedbacks-page .feedbacks-wrap{
  --tx: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.62);
  --muted2: rgba(255,255,255,.45);
  --bd: rgba(255,255,255,.10);
  --bd2: rgba(255,255,255,.14);
  --cardA: rgba(255,255,255,.035);
  --cardB: rgba(255,255,255,.02);
  --shadow: 0 0 0 1px rgba(255,255,255,.06), 0 18px 60px rgba(0,0,0,.55);
  --r: 16px;
}

/* Header */
.feedbacks-page .feedbacks-header{
  padding: 10px 0 18px;
}
.feedbacks-page .feedbacks-title{
  margin: 0;
  font-size: 36px;
  font-weight: 850;
  letter-spacing: .2px;
  color: var(--tx);
}
.feedbacks-page .feedbacks-subtitle{
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 14px;
}

/* Card wrapper (we don't care what feedback-card outputs inside) */
.feedbacks-page .feedback-shell{
  height: 100%;
  background: linear-gradient(180deg, var(--cardA), var(--cardB));
  border: 1px solid var(--bd);
  border-radius: var(--r);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  overflow: hidden;
  position: relative;
}

/* subtle top highlight */
.feedbacks-page .feedback-shell::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  opacity: .7;
}

/* soften whatever card snippet has */
.feedbacks-page .feedback-shell .card,
.feedbacks-page .feedback-shell .feedback-card,
.feedbacks-page .feedback-shell > div{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  height: 100%;
}

/* unify padding inside regardless of snippet structure */
.feedbacks-page .feedback-shell .card-body,
.feedbacks-page .feedback-shell .body,
.feedbacks-page .feedback-shell .content{
  padding: 16px 18px;
}

/* If snippet doesn't have body wrappers, give padding to direct children */
.feedbacks-page .feedback-shell > div{
  padding: 16px 18px;
}

/* Quote icon – smaller and elegant */
.feedbacks-page .feedback-shell i.fa-quote-left,
.feedbacks-page .feedback-shell i.fa-quote-right,
.feedbacks-page .feedback-shell [class*="quote"]{
  color: rgba(255,255,255,.14) !important;
}

/* Text */
.feedbacks-page .feedback-shell p{
  color: rgba(255,255,255,.88);
  line-height: 1.45;
}

/* Stars: keep visible but not “too yellow aggressive” (no exact colors, just soften) */
.feedbacks-page .feedback-shell .fa-star,
.feedbacks-page .feedback-shell i[class*="star"]{
  filter: drop-shadow(0 2px 10px rgba(0,0,0,.25));
  opacity: .95;
}

/* Footer bar (product/date line): make it look like subtle strip */
.feedbacks-page .feedback-shell .card-footer,
.feedbacks-page .feedback-shell .footer,
.feedbacks-page .feedback-shell .meta{
  border-top: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(0,0,0,.18) !important;
  padding: 10px 14px !important;
  color: var(--muted) !important;
}

/* Muted text */
.feedbacks-page .feedback-shell small,
.feedbacks-page .feedback-shell .text-muted{
  color: var(--muted) !important;
}

/* Pagination */
.feedbacks-page .feedbacks-pagination{
  margin-top: 22px;
  display: flex;
  justify-content: center;
}

.feedbacks-page .pagination{
  gap: 8px;
  flex-wrap: wrap;
}

.feedbacks-page .page-link{
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: var(--tx) !important;
  border-radius: 12px !important;
  padding: 8px 12px !important;
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
}

.feedbacks-page .page-item.active .page-link{
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(255,255,255,.18) !important;
}

.feedbacks-page .page-link:hover{
  background: rgba(255,255,255,.07) !important;
}

/* Mobile */
@media (max-width: 575px){
  .feedbacks-page .feedbacks-title{ font-size: 30px; }
  .feedbacks-page .feedbacks-subtitle{ font-size: 13px; }
}
/* ===== TEST (na 30 sekund) =====
   Jak NIE widzisz czerwonej ramki wokół kart, to CSS NIE działa / nie ładuje się / zły plik.
*/
.home-feedbacks .home-feedbacks__card{ outline: 2px solid red !important; }

/* ===== HOME FEEDBACKS – strong override ===== */
.home-feedbacks{
  --tx: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.62);
  --muted2: rgba(255,255,255,.45);
  --bd: rgba(255,255,255,.10);
  --bdHover: rgba(255,255,255,.16);
  --r: 16px;
}

.home-feedbacks .home-feedbacks__title h2{
  color: var(--tx) !important;
  font-weight: 850 !important;
  letter-spacing: .2px !important;
  margin: 0 0 8px 0 !important;
}

.home-feedbacks .home-feedbacks__subtitle p{
  color: var(--muted) !important;
  margin: 0 0 14px 0 !important;
}

/* Karta jako “premium panel” */
.home-feedbacks .home-feedbacks__card{
  outline: none !important; /* <- jak zobaczysz że działa, usuń linię TEST powyżej i to zostaw */
  height: 100%;
  background: linear-gradient(180deg, rgba(255,255,255,.030), rgba(255,255,255,.016)) !important;
  border: 1px solid var(--bd) !important;
  border-radius: var(--r) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.40) !important;
  overflow: hidden !important;
  position: relative !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

.home-feedbacks .home-feedbacks__card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius: var(--r);
  pointer-events:none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  opacity:.95;
}

.home-feedbacks .home-feedbacks__card:hover{
  transform: translateY(-3px) !important;
  border-color: var(--bdHover) !important;
  box-shadow: 0 16px 46px rgba(0,0,0,.52) !important;
}

/* Zdejmij tła/bordery z tego co renderuje feedback-card */
.home-feedbacks .home-feedbacks__card .card,
.home-feedbacks .home-feedbacks__card .feedback-card,
.home-feedbacks .home-feedbacks__card > div{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Wymuś układ: content + footer na dole */
.home-feedbacks .home-feedbacks__card .card{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
}

/* ciaśniejsze wnętrze */
.home-feedbacks .home-feedbacks__card .card-body,
.home-feedbacks .home-feedbacks__card .body,
.home-feedbacks .home-feedbacks__card .content,
.home-feedbacks .home-feedbacks__card > div{
  padding: 14px 16px !important;
}

/* tekst opinii: czytelny i max 3 linie */
.home-feedbacks .home-feedbacks__card p{
  color: rgba(255,255,255,.86) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin: 10px 0 0 !important;

  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* stopka mniej toporna */
.home-feedbacks .home-feedbacks__card .card-footer,
.home-feedbacks .home-feedbacks__card .footer,
.home-feedbacks .home-feedbacks__card .meta{
  margin-top: auto !important;
  padding: 9px 14px !important;
  background: rgba(0,0,0,.14) !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
}

.home-feedbacks .home-feedbacks__card small,
.home-feedbacks .home-feedbacks__card .text-muted{
  color: var(--muted2) !important;
  font-size: 12px !important;
}
/* =========================
   CART PAGE – dark/glass cohesive
   ========================= */

.cart-page .cart-shell{
  --tx: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.62);
  --muted2: rgba(255,255,255,.45);
  --bd: rgba(255,255,255,.10);
  --bd2: rgba(255,255,255,.14);
  --panelA: rgba(255,255,255,.035);
  --panelB: rgba(255,255,255,.02);
  --r: 16px;
}

.cart-page .cart-title h1{
  color: var(--tx);
  font-weight: 850;
  letter-spacing: .2px;
}

/* Alerts / loading / empty */
.cart-page .cart-alert,
.cart-page .cart-loading,
.cart-page .cart-empty{
  background: linear-gradient(180deg, var(--panelA), var(--panelB)) !important;
  border: 1px solid var(--bd) !important;
  border-radius: var(--r) !important;
  color: var(--tx) !important;
}
.cart-page .cart-empty p{ color: var(--muted) !important; }

/* Items list */
.cart-page .cart-items .cart-item{
  background: linear-gradient(180deg, var(--panelA), var(--panelB)) !important;
  border: 1px solid var(--bd) !important;
  border-radius: var(--r) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.40);
  overflow: hidden;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.cart-page .cart-items .cart-item:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.16) !important;
  box-shadow: 0 16px 46px rgba(0,0,0,.52);
}

/* Product image */
.cart-page .cart-item__img{
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.08);
}

/* Text */
.cart-page .cart-variant-text{ color: var(--muted) !important; }
.cart-page .cart-discount-text{ color: rgba(120,170,255,.9) !important; }
.cart-page .cart-addon-badge{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: var(--tx);
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
}

/* Remove icons */
.cart-page .cart-remove-icon,
.cart-page .cart-remove-icon-sm{
  opacity: .75;
  transition: opacity .15s ease, transform .15s ease;
}
.cart-page .cart-remove-mobile:hover .cart-remove-icon-sm,
.cart-page .cart-remove-desktop:hover .cart-remove-icon{
  opacity: 1;
  transform: scale(1.03);
}

/* Quantity controls */
.cart-page .cart-quantity-controls{
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.cart-page .cart-qty-btn{
  width: 34px;
  height: 34px;
  color: var(--tx);
}
.cart-page .cart-qty-btn:disabled{
  opacity: .35;
}
.cart-page .cart-qty-input{
  width: 52px;
  height: 34px;
  background: transparent !important;
  color: var(--tx) !important;
}
.cart-page .cart-qty-input:focus{
  box-shadow: none !important;
  outline: none !important;
}

/* Price */
.cart-page .cart-price-text{
  color: var(--tx);
  font-weight: 800;
}

/* Right summary panel */
.cart-page .cart-summary{
  background: linear-gradient(180deg, var(--panelA), var(--panelB)) !important;
  border: 1px solid var(--bd) !important;
  border-radius: var(--r) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.40);
}

.cart-page .cart-summary__title{
  color: var(--tx);
  font-weight: 800;
}

.cart-page .cart-summary__row .text-muted{
  color: var(--muted) !important;
}

/* Checkout button – keep your outline style but make it match */
.cart-page .cart-checkout{
  border-radius: 12px;
  border-color: rgba(255,255,255,.18) !important;
  color: var(--tx) !important;
  background: rgba(255,255,255,.04) !important;
}
.cart-page .cart-checkout:hover{
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.24) !important;
}

/* Small polish */
.cart-page .border{ border-color: rgba(255,255,255,.10) !important; }
.cart-page .text-muted{ color: var(--muted) !important; }

/* Mobile spacing */
@media (max-width: 575px){
  .cart-page .cart-title h1{ font-size: 30px; }
}