/* Dellstock Fidelity Stylesheet */

/* 1. Global Container & Layout Constraints */
body.awix-fidelity .pb-container:not(.width-full),
body.awix-fidelity .pb-widget:not(.width-full),
.kit-page-width,
.dellstock-header-inner,
.dellstock-container {
  max-width: 1320px !important;
  margin-inline: auto !important;
  padding-inline: 20px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 2. Hero Banner Grid Constraints */
.awix-banner-grid .pb-widget,
.awix-banner-grid .pb-banners {
  max-width: 1320px !important;
  margin-inline: auto !important;
  padding-inline: 20px !important;
  box-sizing: border-box !important;
}

.pb-tiles.tiles-two-wide {
  display: grid !important;
  grid-template-columns: 360px 1fr !important;
  gap: 24px !important;
  align-items: stretch !important;
}

@media (max-width: 992px) {
  .pb-tiles.tiles-two-wide {
    grid-template-columns: 1fr !important;
  }
}

.pb-tiles.tiles-two-wide .pb-cover-img {
  border-radius: 32px !important;
  overflow: hidden !important;
}

.pb-tiles.tiles-two-wide .pb-cover-img img {
  border-radius: 32px !important;
  object-fit: cover !important;
  height: 100% !important;
}

/* 3. Header Branding & Emblem */
.dellstock-logo-img {
  width: 65px !important;
  height: 65px !important;
  border-radius: 50% !important;
  object-fit: contain !important;
}

.dellstock-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
}

.dellstock-brand-titles {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  text-align: start !important;
}

.dellstock-brand-main {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #0547c1 !important;
  line-height: 1.3 !important;
}

.dellstock-brand-sub {
  font-size: 11px !important;
  color: #64748b !important;
  line-height: 1.3 !important;
}

/* 4. Collection / Product Listing Layout */
.awix-collection {
  direction: rtl !important;
  max-width: 1320px !important;
  margin-inline: auto !important;
  padding-inline: 20px !important;
  box-sizing: border-box !important;
}

.awix-titlebar {
  padding-block: 16px 8px !important;
  background: transparent !important;
  border: none !important;
}

.awix-titlebar .kit-page-width {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding-inline: 0 !important;
}

.awix-crumbs {
  font-size: 13px !important;
  color: #64748b !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.awix-crumbs a {
  color: #64748b !important;
  text-decoration: none !important;
}

.awix-crumbs a:hover {
  color: #0547c1 !important;
}

.awix-titlebar h1 {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #1e293b !important;
  margin: 0 !important;
  display: none !important;
}

@media (min-width: 769px) {
  .awix-cols {
    display: flex !important;
    gap: 28px !important;
    align-items: flex-start !important;
    padding-inline: 0 !important;
    margin-block-start: 12px !important;
  }
  .awix-panel {
    width: 290px !important;
    flex-shrink: 0 !important;
  }
}

.awix-panel {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 20px !important;
  padding: 20px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
}

.awix-cols-main {
  flex: 1 1 0% !important;
  min-width: 0 !important;
}

/* 5. Sort Bar */
.awix-sortbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  padding-block-end: 20px !important;
  border: none !important;
  background: transparent !important;
  margin: 0 !important;
}

.awix-sort-label {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
}

.awix-seg {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.awix-seg label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 9999px !important;
  border: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.awix-seg label:hover {
  color: #0547c1 !important;
  border-color: #cbd5e1 !important;
}

.awix-seg input[type="radio"]:checked + span,
.awix-seg label:has(input[type="radio"]:checked) {
  background: #1e293b !important;
  color: #ffffff !important;
  border-color: #1e293b !important;
}

.awix-count {
  display: none !important;
}

/* 6. Product Grid (4 Columns) */
.pb-product-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

@media (max-width: 1200px) {
  .pb-product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .pb-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

/* 7. Product Card (Exact Dellstock Design) */
.pb-product.awix-card--image {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 24px !important;
  padding: 20px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  position: relative !important;
  min-height: 380px !important;
  box-sizing: border-box !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02) !important;
}

.pb-product.awix-card--image:hover {
  border-color: #cbd5e1 !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08) !important;
  transform: translateY(-3px) !important;
}

.pb-product.awix-card--image .pb-product-link {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-decoration: none !important;
  width: 100% !important;
  flex: 1 1 auto !important;
}

.pb-product.awix-card--image .awix-product-media {
  width: 100% !important;
  height: 175px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-block-end: 14px !important;
}

.pb-product.awix-card--image .awix-product-media img {
  max-height: 165px !important;
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  transition: transform 0.3s ease !important;
}

.pb-product.awix-card--image:hover .awix-product-media img {
  transform: scale(1.05) !important;
}

.pb-product.awix-card--image .pb-product-title {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.6 !important;
  margin: 0 0 14px 0 !important;
  text-align: center !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 42px !important;
}

/* Compare Badge (Blue Pill on Card) */
.dellstock-card-badge-compare {
  position: absolute !important;
  top: 14px !important;
  inset-inline-end: 14px !important;
  background: #0547c1 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  padding: 3px 8px !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  z-index: 2 !important;
  box-shadow: 0 2px 6px rgba(5, 71, 193, 0.2) !important;
}

.pb-product.awix-card--image .awix-card-actions {
  position: absolute !important;
  top: 14px !important;
  inset-inline-start: 14px !important;
  display: flex !important;
  gap: 4px !important;
  z-index: 2 !important;
}

.pb-product.awix-card--image .awix-card-actions button {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748b !important;
}

/* Footer & Buttons */
.dellstock-card-footer {
  margin-block-start: auto !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.pb-product.awix-card--image .pb-product-price {
  background: #00897b !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
  padding: 7px 18px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  margin: 0 !important;
  box-shadow: 0 2px 8px rgba(0, 137, 123, 0.25) !important;
  border: none !important;
  text-decoration: none !important;
}

.pb-product.awix-card--image .pb-product-price .pb-product-price-final {
  color: #ffffff !important;
  font-weight: 700 !important;
}

.pb-product.awix-card--image .pb-product-price .pb-product-price-list {
  color: rgba(255, 255, 255, 0.75) !important;
  font-size: 11px !important;
  text-decoration: line-through !important;
  margin-inline-end: 4px !important;
}

.pb-product.awix-card--image .pb-product-price .pb-product-discount {
  background: #dc2626 !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
  padding: 2px 6px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

.dellstock-pill-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 9999px !important;
  padding: 7px 18px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

.dellstock-btn-options {
  background: #1e293b !important;
  color: #ffffff !important;
  transition: background 0.2s ease !important;
}

.dellstock-btn-options:hover {
  background: #0f172a !important;
}

.dellstock-pill-btn.is-out {
  background: #f1f5f9 !important;
  color: #94a3b8 !important;
}

/* 8. Sidebar Filters (Switches, Range Track, Pricing) */
.dellstock-sidebar-toggles {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-block-end: 18px !important;
}

.dellstock-switch-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 14px !important;
  background: #f8fafc !important;
  border-radius: 14px !important;
  border: 1px solid #e2e8f0 !important;
  cursor: pointer !important;
}

.dellstock-switch-label {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
}

.dellstock-switch {
  position: relative !important;
  display: inline-block !important;
  width: 40px !important;
  height: 22px !important;
}

.dellstock-switch input {
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.dellstock-slider {
  position: absolute !important;
  cursor: pointer !important;
  inset: 0 !important;
  background-color: #cbd5e1 !important;
  transition: 0.3s !important;
  border-radius: 22px !important;
}

.dellstock-slider:before {
  position: absolute !important;
  content: "" !important;
  height: 16px !important;
  width: 16px !important;
  inset-inline-start: 3px !important;
  bottom: 3px !important;
  background-color: white !important;
  transition: 0.3s !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

.dellstock-switch input:checked + .dellstock-slider {
  background-color: #0547c1 !important;
}

.dellstock-switch input:checked + .dellstock-slider:before {
  inset-inline-start: 21px !important;
}

.awix-group--price summary {
  background: #ecfdf5 !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  color: #065f46 !important;
  margin-block-end: 12px !important;
}

.dellstock-range-track {
  position: relative !important;
  height: 5px !important;
  background: #e2e8f0 !important;
  border-radius: 4px !important;
  margin: 16px 8px 14px !important;
}

.dellstock-range-bar {
  position: absolute !important;
  inset-inline-start: 0 !important;
  inset-inline-end: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  background: #10b981 !important;
  border-radius: 4px !important;
}

.dellstock-range-thumb {
  position: absolute !important;
  width: 14px !important;
  height: 14px !important;
  background: #10b981 !important;
  clip-path: polygon(50% 100%, 0% 0%, 100% 0%) !important;
}

.dellstock-range-thumb.thumb-start {
  inset-inline-start: 0 !important;
  top: -4px !important;
}

.dellstock-range-thumb.thumb-end {
  inset-inline-end: 0 !important;
  top: -4px !important;
  transform: rotate(180deg) !important;
}

.awix-price {
  display: flex !important;
  gap: 8px !important;
}

.awix-price label {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  padding: 6px 10px !important;
  font-size: 12px !important;
  color: #64748b !important;
  flex: 1 1 0% !important;
}

.awix-price input {
  border: none !important;
  background: transparent !important;
  width: 100% !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  outline: none !important;
}