/* =========================================================
   SHIROCARRENT – DARK RED THEME (child_classic override)
   FINAL VERSION – CLEAN, FIXED, OPTIMIZED
   ========================================================= */

/* -------------------------------------
   PALETA KOLORÓW + WYSOKOŚĆ HEADERA
-------------------------------------- */
:root {
  --shiro-bg-main: #05030b;
  --shiro-bg-alt: #0b0714;
  --shiro-bg-soft: #151022;
  --shiro-bg-card: #1b1428;
  --shiro-bg-elevated: #23152b;

  --shiro-border-subtle: #33213e;
  --shiro-border-strong: #ff2b3b;

  --shiro-accent: #ff2b3b;
  --shiro-accent-soft: #ff4c4c;
  --shiro-accent-dark: #c21426;

  --shiro-text-main: #f5f5f7;
  --shiro-text-muted: #a2a0c0;
  --shiro-text-soft: #7f7ca2;
  --shiro-text-contrast: #ffffff;

  --shiro-badge-new-bg: #12b886;

  /* wysokość headera dla modali / podglądów */
  --header-height: 110px;
}

/* -------------------------------------
   GLOBALNE TŁO / TEKST
-------------------------------------- */
html,
body {
  background: radial-gradient(circle at top, #25112b 0, #05030b 45%, #020109 100%) fixed;
  color: var(--shiro-text-main) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* usuwamy jasne tła i cienie z core */
#wrapper,
#content,
.page-content,
section,
.container,
div,
.card,
.block,
.panel,
.box,
.content,
.form-group,
.alert {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.bg-white,
.bg-light,
.white-background {
  background: transparent !important;
  color: var(--shiro-text-main) !important;
}

body,
p,
span,
li,
strong,
b,
a,
td,
th {
  color: #f0eef5 !important;
}

a:hover {
  color: var(--shiro-accent-soft) !important;
}

/* -------------------------------------
   FIX – przerwa nad headerem
-------------------------------------- */
#wrapper,
#content,
#main,
.page-content,
.container,
#columns,
#product,
#product #main,
#product .row,
.breadcrumb,
.page-header,
.page-title {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* -------------------------------------
   HEADER / NAVBAR
-------------------------------------- */
#header,
#header .header-top,
#header .header-nav {
  background: #000 !important;
  border-bottom: none !important;
}

#header:before,
#header:after,
.header-top:after,
.header-nav:after {
  display: none !important;
}

#header {
  position: relative !important;
  z-index: 9999 !important;
}

/* logo – stały rozmiar */
#header .logo img,
#_desktop_logo img,
#header .header-top .logo img {
  max-height: 52px !important;
  height: 52px !important;
  width: auto !important;
  object-fit: contain !important;
}

#_desktop_logo {
  display: flex !important;
  align-items: center !important;
}

/* linki w headerze */
#header a,
.top-menu a {
  color: #fff !important;
}

/* kategorie jako zaokrąglone przyciski */
.top-menu li a {
  background: #1b1b1b !important;
  padding: 8px 18px;
  border-radius: 40px;
  border: 1px solid var(--shiro-accent) !important;
  transition: 0.2s;
}
.top-menu li a:hover {
  background: var(--shiro-accent) !important;
  color: #fff !important;
}

/* dropdown język / waluta */
.dropdown-menu,
.language-selector .dropdown-menu,
.currency-selector .dropdown-menu {
  background: #000 !important;
  border: 1px solid var(--shiro-accent) !important;
}
.dropdown-menu a {
  color: #fff !important;
}
.dropdown-menu a:hover {
  background: var(--shiro-accent) !important;
  color: #fff !important;
}

/* search bar w headerze */
#header .search-widget input.form-control {
  background: var(--shiro-accent) !important;
  color: #fff !important;
  border: none !important;
}
#header .search-widget input::placeholder {
  color: #ffe1e1 !important;
}

/* -------------------------------------
   MINIATURY PRODUKTÓW (karty)
-------------------------------------- */
.product-miniature {
  background: linear-gradient(180deg, #120c1c 0%, #0a0711 100%) !important;
  border-radius: 12px !important;
  padding: 0 !important;
  overflow: hidden !important;
  transition: 0.2s ease;
  box-shadow: 0 0 18px rgba(255, 0, 60, 0.15) !important;
}

.product-miniature:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 25px rgba(255, 20, 80, 0.25) !important;
}

/* usunięcie białych ramek z obrazków w kartach */
.product-miniature .thumbnail-container,
.product-miniature .thumbnail-container .product-thumbnail,
.product-miniature .thumbnail-container .product-thumbnail img {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* stały rozmiar miniatur */
.product-miniature .thumbnail-container img {
  width: 100% !important;
  height: 260px !important;        /* możesz zmienić wysokość */
  object-fit: cover !important;
  display: block !important;
}

/* tło podstawowe pod obrazkiem (gdy brak zdjęcia) */
.product-miniature img {
  background: #1a1528 !important;
}

/* nazwa + cena */
.product-miniature .product-title a {
  color: #fff !important;
  font-weight: 600 !important;
}

.product-miniature .price {
  color: var(--shiro-accent) !important;
  font-weight: 700 !important;
}

/* -------------------------------------
   KARTA PRODUKTU (PDP)
-------------------------------------- */
#product .product-information {
  background: transparent !important;
  border: none !important;
}

#product h1 {
  font-size: 34px !important;
  font-weight: 700 !important;
}

#product .current-price span {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: var(--shiro-accent) !important;
}

/* zakładki opis/szczegóły */
.nav-tabs {
  border-bottom: none !important;
}
.nav-tabs .nav-link {
  background: #1a1125 !important;
  color: #ddd !important;
}
.nav-tabs .nav-link.active {
  background: var(--shiro-accent) !important;
  color: #fff !important;
}

.tabs .tab-pane {
  background: transparent !important;
  color: #fff !important;
}

/* CZAS WYNAJMU – czerwone ramki */
.product-variants .radio-label,
.product-variants .radio-label > span {
  background: transparent !important;
  border: 1px solid var(--shiro-accent) !important;
  color: #fff !important;
  padding: 6px 14px !important;
  border-radius: 6px !important;
}
.product-variants .radio-label:hover,
.product-variants input:checked + span {
  background: var(--shiro-accent) !important;
  color: #fff !important;
}

/* -------------------------------------
   TOUCHSPIN – ilość sztuk
-------------------------------------- */
.bootstrap-touchspin .input-group-btn-vertical {
  margin-left: 6px !important;
}

.bootstrap-touchspin .input-group-btn-vertical > .btn {
  padding: 4px !important;
  height: 22px !important;
  width: 26px !important;
  font-size: 10px !important;
  border-radius: 6px !important;
  background: var(--shiro-accent) !important;
  border-color: var(--shiro-accent-dark) !important;
  color: #fff !important;
}

/* -------------------------------------
   PRZYCISK "DODAJ DO KOSZYKA"
-------------------------------------- */
#add-to-cart,
.product-add-to-cart .btn {
  background: var(--shiro-accent) !important;
  color: #fff !important;
  border-radius: 40px !important;
  padding: 10px 25px !important;
  border: 1px solid var(--shiro-accent-dark) !important;
}
#add-to-cart:hover {
  background: var(--shiro-accent-soft) !important;
}

/* =====================================
   MODAL – DODANO DO KOSZYKA (NOWY DESIGN)
===================================== */

/* tło pod headerem – modal nie wchodzi pod navbar */
#blockcart-modal {
  position: fixed !important;
  top: var(--header-height) !important;
  left: 0 !important;
  width: 100% !important;
  height: calc(100% - var(--header-height)) !important;
  background: rgba(0, 0, 0, 0.82) !important;
  z-index: 9000 !important;
  overflow-y: auto !important;
  padding: 28px 0 !important;
  margin: 0 !important;
}

/* okno modala */
#blockcart-modal .modal-dialog {
  margin: 0 auto !important;
  max-width: 1100px !important;
}

#blockcart-modal .modal-content {
  background: radial-gradient(circle at top, #ff4c4c 0, var(--shiro-accent) 55%, #e21929 100%) !important;
  border-radius: 22px !important;
  padding: 26px 32px 28px !important;
  border: none !important;
  box-shadow: 0 26px 55px rgba(0, 0, 0, 0.6) !important;
  position: relative;
}

/* przycisk zamknięcia (X) */
#blockcart-modal .close {
  position: absolute;
  top: 14px;
  right: 18px;
  opacity: 1 !important;
  text-shadow: none !important;
  color: #ffffff !important;
}

/* nagłówek "Produkt dodany poprawnie..." */
#blockcart-modal .modal-body > p:first-child,
#blockcart-modal .modal-header,
#blockcart-modal .modal-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 4px 0 22px 0 !important;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.22);
  font-size: 18px;
  font-weight: 700;
  color: #ffffff !important;
}

/* ikonka przy komunikacie */
#blockcart-modal .modal-body > p:first-child i,
#blockcart-modal .modal-header i {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 2px solid #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

/* globalnie tekst w modalu – biały */
#blockcart-modal,
#blockcart-modal .modal-body,
#blockcart-modal .modal-body * {
  color: #ffffff !important;
}

/* lewa kolumna – zdjęcie */
#blockcart-modal .product-image {
  border-radius: 14px;
  overflow: hidden;
}
#blockcart-modal .product-image img {
  background: #120a18 !important;
}

/* prawa kolumna – podsumowanie */
#blockcart-modal .cart-content {
  background: rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  padding: 16px 18px;
}

/* nagłówki w podsumowaniu */
#blockcart-modal .cart-content .label,
#blockcart-modal .cart-content .value,
#blockcart-modal .cart-content span {
  font-size: 14px;
}

/* ALERT "Produkt dodany..." – zawsze biały */
#blockcart-modal .alert,
#blockcart-modal .alert-success {
  background: transparent !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 0 8px 0 !important;
}

#blockcart-modal .alert *,
#blockcart-modal .alert svg,
#blockcart-modal .alert img {
  color: #ffffff !important;
  fill: #ffffff !important;
  filter: brightness(0) invert(1) !important;
}

/* wiersz "Razem (brutto)" – biały pasek z czarnym tekstem */
#blockcart-modal .cart-content .cart-summary-line.cart-total {
  background: #ffffff !important;
  border-radius: 8px !important;
  padding: 8px 14px !important;
  margin: 10px 0 12px 0 !important;
}

#blockcart-modal .cart-content .cart-summary-line.cart-total,
#blockcart-modal .cart-content .cart-summary-line.cart-total * {
  color: #000000 !important;
}

/* przyciski w modalu – dół */
#blockcart-modal .cart-content-btn {
  margin-top: 18px;
  display: flex;
  gap: 16px;
}

/* "kontynuuj zakupy" – ciemny obrys */
#blockcart-modal .cart-content-btn .btn-secondary,
#blockcart-modal .cart-content-btn .btn-outline-secondary {
  background: transparent !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.85) !important;
  color: #ffffff !important;
  padding: 11px 26px !important;
  text-transform: none;
  font-weight: 600;
}
#blockcart-modal .cart-content-btn .btn-secondary:hover,
#blockcart-modal .cart-content-btn .btn-outline-secondary:hover {
  background: rgba(0, 0, 0, 0.18) !important;
}

/* "Przejdź do realizacji zamówienia" – biały, mocny */
#blockcart-modal .cart-content-btn .btn-primary {
  background: #ffffff !important;
  color: #000000 !important;
  border-radius: 999px !important;
  border: none !important;
  padding: 11px 32px !important;
  font-weight: 700 !important;
  text-transform: none;
}
#blockcart-modal .cart-content-btn .btn-primary:hover {
  background: #f0f0f0 !important;
}

/* fallback – gdyby gdzieś jeszcze był .btn-primary w modalu */
#blockcart-modal .btn-primary {
  background: #fff !important;
  color: #000 !important;
  border-radius: 30px !important;
  padding: 12px 26px !important;
  font-weight: 600 !important;
  border: none !important;
}
#blockcart-modal .btn-primary:hover {
  background: #e6e6e6 !important;
}

/* -------------------------------------
   FORMULARZE
-------------------------------------- */
.form-control,
textarea,
select,
input {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}
.form-control::placeholder {
  color: rgba(255, 255, 255, 0.55) !important;
}

/* nagłówki sekcji */
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--shiro-accent) !important;
  font-weight: 600 !important;
}

/* etykiety pól */
form label,
.contact-form label,
.form-group label {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* podpowiedzi / małe teksty */
.help-block,
.form-text,
.form-control-comment,
small {
  color: #ffffff !important;
  opacity: 0.85 !important;
}

/* checkboxy RODO */
input[type="checkbox"] + span,
.custom-checkbox label {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* podsumowanie koszyka (poza modalem) */
.cart-summary-line,
.cart-summary-line span,
.cart-summary-line strong {
  color: #ffffff !important;
}

/* -------------------------------------
   NEWSLETTER
-------------------------------------- */
.block_newsletter input[type="email"] {
  background: #1a1125 !important;
  border: 1px solid var(--shiro-accent) !important;
  color: #fff !important;
}

/* -------------------------------------
   STOPKA
-------------------------------------- */
#footer,
#footer p,
#footer a {
  color: #d8d4e6 !important;
}

/* -------------------------------------
   PLACEHOLDER IMG
-------------------------------------- */
img[src*="no-image"],
img[src*="no_image"],
.product-cover img {
  background: #120a18 !important;
  filter: brightness(0.65) !important;
}

/* ============================================
   ZDJĘCIA PRODUKTÓW – PODGLĄD / ZOOM
============================================ */

/* główne zdjęcie na stronie produktu – skaluje się ładnie */
#product .product-cover,
#product .product-cover img,
#product .images-container,
#product .js-qv-product-cover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#product .product-cover img,
#product .js-qv-product-cover {
  width: 100% !important;
  height: auto !important;
  max-height: 520px !important; /* możesz podbić do 600–700px */
  object-fit: cover !important;
}

/* modal z dużym zdjęciem */
#product-modal,
#product-modal .modal,
.modal.quickview {
  background: rgba(0, 0, 0, 0.75) !important;
  padding-top: var(--header-height) !important;
}

/* środek modala – bez białej kartki */
#product-modal .modal-dialog,
.modal.quickview .modal-dialog {
  margin: 20px auto !important;
}

#product-modal .modal-content,
.modal.quickview .modal-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* obraz w podglądzie */
#product-modal img,
.modal.quickview img {
  display: block !important;
  margin: 0 auto !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  max-height: calc(100vh - var(--header-height) - 80px) !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}