/* Kasa SalesCRM bellastyle.salescrm.pl: wygląd spójny z nowym frontem (bellastyle-www).
   Wklej w panelu SalesCRM: Konfiguracja > Wygląd koszyka > Własny CSS.
   Kolor główny w panelu: #c8126f. Fonty z podglądu; po przepięciu domeny podmień adres w @font-face. */

@font-face { font-family: 'Titan One'; font-display: swap; src: url(https://bellastyle-www.pages.dev/assets/fonts/titan-one-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: 'Titan One'; font-display: swap; src: url(https://bellastyle-www.pages.dev/assets/fonts/titan-one-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02AF; }
@font-face { font-family: 'Lexend'; font-display: swap; font-weight: 100 900; src: url(https://bellastyle-www.pages.dev/assets/fonts/lexend-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+2000-206F, U+20AC; }
@font-face { font-family: 'Lexend'; font-display: swap; font-weight: 100 900; src: url(https://bellastyle-www.pages.dev/assets/fonts/lexend-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02AF; }

:root:root {
  --main-color: #c8126f;
  --main-color-hover: #a30e5a;
  --main-color-light: #fde3ef;
  --bs-atrament: #24236b;
  --bs-tekst-2: #4a4a86;
  --bs-niebo: #d4eefc;
  --bs-niebo-jasne: #eef8fe;
  --bs-slonce: #ffd23f;
  --bs-linia: #d9dcf0;
}

body { font-family: 'Lexend', system-ui, sans-serif !important; color: var(--bs-atrament) !important; background: #fff; }
.cart-v2, .cart-v2 input, .cart-v2 select, .cart-v2 textarea, .cart-v2 button, .cart-v2 label { font-family: 'Lexend', system-ui, sans-serif !important; }
::selection { background: var(--bs-slonce); color: var(--bs-atrament); }

/* pasek SSL i nagłówek z logo */
.protection-info { background: var(--bs-atrament) !important; color: #fff !important; }
.orders-path-header { background: var(--bs-niebo) !important; border-bottom: 0 !important; padding: 10px 0 !important; }
.orders-path-header .logo img { max-height: 76px !important; max-width: 100% !important; width: auto !important; }

/* nagłówki kroków */
.cart-v2 .subtitle, .cart-v2 h3.subtitle { font-family: 'Titan One', system-ui, sans-serif !important; font-weight: 400 !important; font-size: 24px !important; line-height: 1.2 !important; color: var(--bs-atrament) !important; letter-spacing: 0 !important; }
.cart-v2 h4 { font-weight: 600 !important; color: var(--bs-atrament) !important; }
.cart-v2 .subtitle a, .cart-v2 .step-one-toggle { color: var(--main-color) !important; }

/* dostawa i płatność: karty jak na stronie */
#delivery-types, #payment-types { border: 2px solid var(--bs-linia) !important; border-radius: 18px !important; overflow: hidden; }
#delivery-and-payment hr { border: 0 !important; margin: 14px 0 !important; }
.cart-v2 .radio { border-radius: 14px !important; transition: background-color .2s, box-shadow .25s; }
.cart-v2 .radio:has(input:checked) { background: #fff8fb !important; box-shadow: inset 0 0 0 2.5px var(--main-color), 0 0 0 4px var(--main-color-light) !important; }
.cart-v2 .radio label { font-size: 15px !important; color: var(--bs-atrament) !important; font-weight: 500; }
.cart-v2 .radio label .price { color: var(--bs-atrament) !important; font-weight: 700 !important; }
.cart-v2 .radio label:before { border: 2px solid var(--bs-linia) !important; border-radius: 50% !important; }
.cart-v2 .point-selector { background: var(--bs-atrament) !important; color: #fff !important; border-radius: 999px !important; font-size: 13px !important; max-width: 280px; }
.cart-v2 .point-selector:hover { background: #34339a !important; }

/* pola formularza */
.cart-v2 .floating-label .input-group { border: 2px solid var(--bs-linia) !important; border-radius: 12px !important; background: #fff; }
.cart-v2 .floating-label .input-group:focus-within { border-color: var(--bs-atrament) !important; box-shadow: 0 0 0 4px rgb(255 210 63 / .55) !important; }
.cart-v2 .floating-label label { color: var(--bs-tekst-2) !important; }
.cart-v2 .checkbox label { color: var(--bs-atrament) !important; }
.cart-v2 .checkbox label a, .cart-v2 .terms a { color: var(--main-color) !important; }
.cart-v2 .checkbox label:before { border: 2px solid var(--bs-linia) !important; border-radius: 6px !important; }

/* przycisk „Zamawiam i płacę” */
#main-submit-btn, #extra-submit-btn {
  --border-radius: 999px;
  background: var(--main-color) !important; color: #fff !important; border-radius: 999px !important;
  font-family: 'Lexend', system-ui, sans-serif !important; font-weight: 700 !important; letter-spacing: 0 !important;
  box-shadow: 0 8px 20px -8px rgb(200 18 111 / .65) !important; transition: transform .25s cubic-bezier(.16, 1, .3, 1), background-color .2s !important;
}
#main-submit-btn:hover, #extra-submit-btn:hover { background: var(--main-color-hover) !important; transform: translateY(-2px); }

/* pasek boczny „Twoje zakupy” */
.order-sidebar { background: var(--bs-niebo-jasne) !important; border-color: var(--bs-linia) !important; }
.order-list .order-item-fields { border-bottom: 2px dotted var(--bs-linia) !important; }
.order-list td.photo { border: 0 !important; }
.order-list .photo img { background: var(--bs-niebo); border-radius: 12px !important; border: 0 !important; padding: 4px; }
.order-list .name { color: var(--bs-atrament) !important; font-weight: 600 !important; }
.order-list .price { color: var(--bs-atrament) !important; font-weight: 700 !important; }
.order-list .count .flex { border: 2px solid var(--bs-linia) !important; border-radius: 999px !important; background: #fff; overflow: hidden; }
.order-list .quantity-change { color: var(--bs-atrament) !important; border: 0 !important; background: transparent !important; }
.order-list .quantity-change:hover { background: var(--bs-niebo) !important; }
.order-list .cart-items { border: 0 !important; background: transparent !important; color: var(--bs-atrament) !important; font-weight: 600; }
.order-list-summary { color: var(--bs-tekst-2); margin-bottom: 20px !important; padding-bottom: 0 !important; border-bottom: 0 !important; }
.order-list-summary .row { margin-bottom: 10px !important; }
.order-list-summary hr { border: 0 !important; border-top: 2px dotted var(--bs-linia) !important; margin: 16px 0 14px !important; }
.order-list-summary .row.summary { padding-top: 0 !important; }
.order-list-summary .summary { color: var(--bs-atrament) !important; }
.order-list-summary .summary .right, .order-list-summary .summary .left { font-family: 'Titan One', system-ui, sans-serif !important; font-weight: 400 !important; font-size: 24px !important; }
.order-comment { margin-bottom: 0 !important; padding-top: 18px; border-top: 2px dotted var(--bs-linia); }
.order-comment-link { color: var(--main-color) !important; }

/* „Twoje dane są bezpieczne” */
.cart-trust { margin-top: 24px !important; }
.cart-trust__seal { margin-top: 0 !important; background: #fff; border: 2px solid var(--bs-linia); border-radius: 18px; padding: 20px 18px 22px; }
.cart-trust__seal-title { font-family: 'Titan One', system-ui, sans-serif !important; font-weight: 400 !important; font-size: 20px !important; color: var(--bs-atrament) !important; margin: 0 0 12px !important; }
.cart-trust__lock { border: 0 !important; border-radius: 999px !important; background: #e7f6ee !important; padding: 9px 18px !important; gap: 8px !important; }
.cart-trust__lock svg { width: 20px; height: 20px; }
.cart-trust__lock span { color: #16834a !important; font-weight: 600 !important; letter-spacing: .02em !important; text-transform: none !important; font-size: 15px !important; }
.cart-trust__title { color: var(--main-color) !important; }
.cart-trust__text { color: var(--bs-tekst-2) !important; }
.order-comment textarea { border: 2px solid var(--bs-linia) !important; border-radius: 12px !important; }

/* stopka kasy */
.copyright, .copyright a { color: var(--bs-tekst-2) !important; }

@media (max-width: 600px) {
  .orders-path-header .logo img { max-height: 58px !important; }
  .cart-v2 .subtitle, .cart-v2 h3.subtitle { font-size: 20px !important; }
  .order-list-summary .summary .right, .order-list-summary .summary .left { font-size: 21px !important; }
}

/* „‹ Wróć do sklepu” w nagłówku (gdy klient przyszedł ze sklepu) */
.orders-path-header .back-link {
  --border-radius: 999px;
  background: #fff !important; color: var(--bs-atrament) !important; border: 2.5px solid var(--bs-atrament) !important; border-radius: 999px !important;
  font-family: 'Lexend', system-ui, sans-serif !important; font-weight: 600 !important; font-size: 14px !important; text-decoration: none !important;
  transition: background-color .2s, color .2s;
}
.orders-path-header .back-link:hover { background: var(--bs-atrament) !important; color: #fff !important; }

/* punkty bloku zaufania */
.cart-trust__item { background: #fff; border: 2px solid var(--bs-linia); border-radius: 16px; padding: 14px 16px; margin-bottom: 10px !important; align-items: center !important; }
.cart-trust__title { font-family: 'Lexend', system-ui, sans-serif !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: 700 !important; font-size: 15px !important; color: var(--bs-atrament) !important; margin: 0 0 2px !important; }
.cart-trust__text { font-size: 14px !important; line-height: 1.45 !important; }
.cart-trust__icon svg { width: 24px; height: 24px; }
.cart-trust__seal { margin-top: 14px !important; }

/* ikonki przy nagłówkach kroków, w kółku jak na stronie */
.cart-v2 .subtitle { justify-content: flex-start !important; gap: 12px !important; }
.cart-v2 .subtitle a { margin-left: auto; }
.cart-v2 #order-summary .subtitle { display: flex !important; align-items: center; }
.cart-v2 .step-one .subtitle::before, .cart-v2 .step-two .subtitle::before, .cart-v2 .step-three .subtitle::before, .cart-v2 #order-summary .subtitle::before { content: ''; display: block; flex: none; width: 42px; height: 42px; border-radius: 50%; background: var(--bs-niebo) center / 22px 22px no-repeat; }
.cart-v2 .step-one .subtitle::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23c8126f'%3E%3Cpath d='M255.14,115.54l-14-35A19.89,19.89,0,0,0,222.58,68H196V64a12,12,0,0,0-12-12H32A20,20,0,0,0,12,72V184a20,20,0,0,0,20,20H46.06a36,36,0,0,0,67.88,0h44.12a36,36,0,0,0,67.88,0H236a20,20,0,0,0,20-20V120A21.7,21.7,0,0,0,255.14,115.54ZM196,92h23.88l6.4,16H196ZM80,204a12,12,0,1,1,12-12A12,12,0,0,1,80,204Zm92-41.92A36.32,36.32,0,0,0,158.06,180H113.94a36,36,0,0,0-67.88,0H36V140H172ZM172,116H36V76H172Zm20,88a12,12,0,1,1,12-12A12,12,0,0,1,192,204Zm40-24h-6.06A36.09,36.09,0,0,0,196,156.23V132h36Z'/%3E%3C/svg%3E"); }
.cart-v2 .step-two .subtitle::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23c8126f'%3E%3Cpath d='M128,60a44,44,0,1,0,44,44A44.05,44.05,0,0,0,128,60Zm0,64a20,20,0,1,1,20-20A20,20,0,0,1,128,124Zm0-112a92.1,92.1,0,0,0-92,92c0,77.36,81.64,135.4,85.12,137.83a12,12,0,0,0,13.76,0,259,259,0,0,0,42.18-39C205.15,170.57,220,136.37,220,104A92.1,92.1,0,0,0,128,12Zm31.3,174.71A249.35,249.35,0,0,1,128,216.89a249.35,249.35,0,0,1-31.3-30.18C80,167.37,60,137.31,60,104a68,68,0,0,1,136,0C196,137.31,176,167.37,159.3,186.71Z'/%3E%3C/svg%3E"); }
.cart-v2 .step-three .subtitle::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23c8126f'%3E%3Cpath d='M68,100A12,12,0,0,1,80,88h96a12,12,0,0,1,0,24H80A12,12,0,0,1,68,100Zm12,52h96a12,12,0,0,0,0-24H80a12,12,0,0,0,0,24ZM236,56V208a12,12,0,0,1-17.37,10.73L192,205.42l-26.63,13.31a12,12,0,0,1-10.74,0L128,205.42l-26.63,13.31a12,12,0,0,1-10.74,0L64,205.42,37.37,218.73A12,12,0,0,1,20,208V56A20,20,0,0,1,40,36H216A20,20,0,0,1,236,56Zm-24,4H44V188.58l14.63-7.31a12,12,0,0,1,10.74,0L96,194.58l26.63-13.31a12,12,0,0,1,10.74,0L160,194.58l26.63-13.31a12,12,0,0,1,10.74,0L212,188.58Z'/%3E%3C/svg%3E"); }
.cart-v2 #order-summary .subtitle::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256' fill='%23c8126f'%3E%3Cpath d='M216,36H40A20,20,0,0,0,20,56V200a20,20,0,0,0,20,20H216a20,20,0,0,0,20-20V56A20,20,0,0,0,216,36Zm-4,160H44V60H212ZM76,88a12,12,0,0,1,24,0,28,28,0,0,0,56,0,12,12,0,0,1,24,0A52,52,0,0,1,76,88Z'/%3E%3C/svg%3E"); }
@media (max-width: 600px) { .cart-v2 .step-one .subtitle::before, .cart-v2 .step-two .subtitle::before, .cart-v2 .step-three .subtitle::before, .cart-v2 #order-summary .subtitle::before { width: 36px; height: 36px; background-size: 19px 19px; } }

/* „Twoje zakupy” jedzie razem z przewijaniem na komputerze */
@media (min-width: 1025px) {
  .order-sidebar > .wrapper { position: sticky !important; top: 24px; }
}
