/* =========================================================
   ap-oc.css — MOSTEK ARBEITSWELT-SHOP.DE <-> standardowe szablony OpenCart
   Stylizuje generyczny markup OC (breadcrumb, formularze, panele,
   przyciski, tabele, menu konta) na wyglad AP — bez przepisywania
   kazdego szablonu z osobna. Zmienne (--red itd.) z ap/css/style.css.
   ========================================================= */

/* ---------- Neutralizacja bootstrapowych marginesow na chrome AP ----------
   (bootstrap dodaje np. ul{margin-bottom:10px}, p{margin-bottom:10px} — na
   podstronach psulo to wysrodkowanie topbara/nav/stopki; na home bootstrapa nie ma) */
.topbar ul, .topbar li, .topbar p,
.header ul, .header li, .nav__list, .nav__list li,
.site-footer ul, .site-footer li, .site-footer p,
.footer__contact, .footer__legal, .footer__pay-icons { margin: 0; }

/* ---------- Obszar tresci pod sticky header ---------- */
body.ap-body > .container {
    max-width: 1320px;
    padding-top: 34px;
    padding-bottom: 48px;
    min-height: 50vh;
}
#content { margin-bottom: 24px; }

/* ---------- Breadcrumb ---------- */
.breadcrumb {
    display: flex; flex-wrap: wrap; align-items: center;
    list-style: none; margin: 20px 0 26px; padding: 10px 16px;
    background: var(--gray); border-radius: 10px; font-size: 13px;
}
.breadcrumb > li { display: flex; align-items: center; }
.breadcrumb > li + li::before { content: "/"; margin: 0 8px; color: #b6bcc7; }
.breadcrumb a { color: var(--navy); font-weight: 500; }
.breadcrumb a:hover { color: var(--red); }

/* ---------- Naglowki tresci ---------- */
#content h1, #content h2, #content h3, #content h4, #content legend {
    font-family: var(--font-head); font-weight: 700; color: var(--navy);
    line-height: 1.15; letter-spacing: .3px;
}
#content h1 { font-size: 34px; margin: 0 0 18px; }
#content h2 { font-size: 26px; margin: 26px 0 14px; }
#content h3 { font-size: 20px; margin: 22px 0 12px; }
#content h4 { font-size: 17px; margin: 18px 0 10px; }
legend {
    width: 100%; font-size: 20px; padding-bottom: 10px; margin-bottom: 18px;
    border-bottom: 2px solid var(--gray); font-family: var(--font-head);
    font-weight: 700; color: var(--navy);
}

/* ---------- Karty / panele / well ---------- */
.panel, .panel-default, .well {
    background: var(--white); border: 1px solid #e6e8ec; border-radius: 14px;
    box-shadow: 0 1px 2px rgba(20,22,27,.04); margin-bottom: 20px;
}
.panel-heading { padding: 14px 18px; border-bottom: 1px solid #eef0f3; font-family: var(--font-head); font-weight: 600; }
.panel-body { padding: 18px; }
.well { padding: 18px; }
.panel-title { margin: 0; font-size: 16px; }
.panel-title a { color: var(--navy); }
.img-thumbnail { border: 1px solid #e6e8ec; border-radius: 12px; padding: 4px; background: #fff; }

/* ---------- Formularze ---------- */
.form-group { margin-bottom: 18px; }
label, .control-label {
    font-weight: 600; color: var(--navy); font-size: 14px;
    margin-bottom: 6px; display: inline-block;
}
#content .form-control,
#content input[type="text"], #content input[type="email"], #content input[type="password"],
#content input[type="tel"], #content input[type="number"], #content input[type="date"],
#content textarea, #content select {
    width: 100%; height: auto; padding: 11px 14px; font-size: 15px;
    font-family: var(--font-body); color: var(--text); background: var(--white);
    border: 1.5px solid #d7dae1; border-radius: 10px; line-height: 1.4;
    transition: border-color .15s, box-shadow .15s;
}
#content .form-control:focus, #content input:focus, #content textarea:focus, #content select:focus {
    outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(216,0,27,.12);
}
#content textarea.form-control, #content textarea { min-height: 120px; resize: vertical; }
.input-group { display: flex; }
.form-group.required > label::after,
.form-group.required > .control-label::after { content: " *"; color: var(--red); }
.text-danger { color: var(--red); font-size: 13px; margin-top: 5px; display: block; }
.text-success { color: #0a7d32; }
.text-muted { color: var(--muted); }
.help-block { font-size: 13px; color: #8a909c; margin-top: 5px; }
.checkbox, .radio { margin: 8px 0; }
.checkbox input, .radio input { width: auto; margin-right: 8px; }

/* ---------- Przyciski (OC uzywa .btn.btn-primary; AP chrome uzywa .btn--primary — brak kolizji) ---------- */
.btn {
    display: inline-flex; align-items: center; gap: 8px; justify-content: center;
    padding: 11px 22px; font-family: var(--font-head); font-weight: 600; font-size: 15px;
    letter-spacing: .4px; text-transform: uppercase; border-radius: 10px;
    border: 1.5px solid transparent; cursor: pointer; line-height: 1;
    transition: background .15s, border-color .15s, color .15s; text-decoration: none;
}
.btn-primary { background: var(--red); border-color: var(--red); color: #fff; }
.btn-primary:hover, .btn-primary:focus { background: var(--red-dark); border-color: var(--red-dark); color: #fff; }
.btn-default { background: #fff; border-color: #d7dae1; color: var(--navy); }
.btn-default:hover { border-color: var(--navy); color: var(--navy); }
.btn-info, .btn-primary.btn-info { background: var(--navy); border-color: var(--navy); color: #fff; }
.btn-info:hover { background: #0f1830; color: #fff; }
.btn-danger { background: var(--red); border-color: var(--red); color: #fff; }
.btn-success { background: #0a7d32; border-color: #0a7d32; color: #fff; }
.btn-lg { padding: 14px 28px; font-size: 16px; }
.btn-sm { padding: 8px 14px; font-size: 13px; }
.btn-block { display: flex; width: 100%; }
.buttons { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin-top: 22px; }
.buttons .pull-right { margin-left: auto; }

/* ---------- Tabele ---------- */
.table { width: 100%; border-collapse: collapse; margin-bottom: 20px; background: #fff; }
.table > thead > tr > th, .table th {
    text-align: left; padding: 12px 14px; font-family: var(--font-head); font-weight: 600;
    color: var(--navy); background: var(--gray); border-bottom: 2px solid #e6e8ec; font-size: 14px;
}
.table > tbody > tr > td, .table td {
    padding: 12px 14px; border-bottom: 1px solid #eef0f3; font-size: 14px; vertical-align: middle;
}
.table-hover > tbody > tr:hover { background: #faf7f7; }
.table-bordered, .table-bordered td, .table-bordered th { border: 1px solid #eef0f3; }
.table-responsive { overflow-x: auto; }

/* ---------- Menu konta / list-group ---------- */
.list-group { border: 1px solid #e6e8ec; border-radius: 14px; overflow: hidden; margin-bottom: 20px; }
.list-group-item {
    display: block; padding: 12px 16px; border-bottom: 1px solid #eef0f3;
    color: var(--navy); font-weight: 500; background: #fff;
}
.list-group-item:last-child { border-bottom: none; }
.list-group-item:hover { background: var(--gray); color: var(--red); }
.list-group-item.active { background: var(--red); color: #fff; border-color: var(--red); }

/* ---------- Alerty ---------- */
.alert { padding: 14px 18px; border-radius: 10px; margin-bottom: 18px; border: 1px solid transparent; font-size: 14px; }
.alert-success { background: #e9f7ef; border-color: #bfe6cd; color: #0a7d32; }
.alert-danger { background: #fdeaec; border-color: #f4c2c8; color: var(--red-dark); }
.alert-info { background: #eaf0fb; border-color: #c5d4f2; color: var(--blue); }
.alert-warning { background: #fff6e6; border-color: #f3ddb0; color: #8a5a00; }

/* ---------- Linki w tresci ---------- */
#content a:not(.btn):not(.acc-btn):not(.list-group-item):not(.img-thumbnail) { color: var(--red); }
#content a:not(.btn):not(.acc-btn):not(.list-group-item):hover { text-decoration: underline; }

/* ---------- Drobne bootstrapowe pomocniki ---------- */
.pull-right { float: right; }
.pull-left { float: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.required > .control-label { position: relative; }
h1 small, h2 small { color: var(--muted); font-weight: 400; }
address { font-style: normal; line-height: 1.7; color: var(--text); }
hr { border: none; border-top: 1px solid #e6e8ec; margin: 22px 0; }

/* ---------- Paginacja OC (bootstrap) w stylu AP ---------- */
.ap-pagination { margin-top: 32px; display: flex; justify-content: center; }
.ap-pagination .pagination { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; }
.ap-pagination .page-item .page-link,
.ap-pagination .pagination > li > a,
.ap-pagination .pagination > li > span {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 40px; height: 40px; padding: 0 12px;
    border: 1px solid #d7dae1; border-radius: 9px; background: #fff;
    color: var(--navy); font-family: var(--font-head); font-weight: 600; font-size: 15px; text-decoration: none;
}
.ap-pagination .page-item .page-link:hover,
.ap-pagination .pagination > li > a:hover { border-color: var(--red); color: var(--red); }
.ap-pagination .page-item.active .page-link,
.ap-pagination .pagination > li.active > span {
    background: var(--red); border-color: var(--red); color: #fff;
}

/* ==== Filtr pojazdu (baner nad listingiem, z findera Navigationsbaum) ==== */
.veh-filterbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:#0d1b2a;color:#fff;border-radius:12px;padding:12px 16px;margin:0 0 16px}
.veh-filterbar .ico{width:22px;height:22px;flex:0 0 auto;fill:none;stroke:#e63946;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.veh-filterbar__txt{font-size:15px}
.veh-filterbar__txt strong{color:#ffd166}
.veh-filterbar__clear{margin-left:auto;color:#fff;background:rgba(255,255,255,.12);
  border-radius:999px;padding:6px 14px;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.veh-filterbar__clear:hover{background:#e63946}

/* ==== Pasek kategorii glownych (dzialy) na gorze strony kategorii ==== */
.deptbar{background:#fff;border-bottom:1px solid #e6e9ee}
.deptbar__inner{display:flex;align-items:center;gap:14px;padding:12px 0;flex-wrap:wrap}
.deptbar__label{font-weight:700;color:#0d1b2a;font-size:14px;flex:0 0 auto}
.deptbar__list{display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.deptbar__chip{display:inline-flex;align-items:center;gap:7px;background:#f2f4f7;color:#0d1b2a;
  border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;text-decoration:none;
  border:1px solid transparent;transition:.15s}
.deptbar__chip span{background:#dbe0e7;color:#334;border-radius:999px;padding:1px 8px;font-size:11px}
.deptbar__chip:hover{background:#e63946;color:#fff}
.deptbar__chip:hover span{background:rgba(255,255,255,.25);color:#fff}
.deptbar__chip.is-active{background:#0d1b2a;color:#fff}
.deptbar__chip.is-active span{background:#e63946;color:#fff}

/* ==== cathero: eyebrow (nad H1) + logo w trybie contain ==== */
.cathero__eyebrow{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:#e63946;margin-bottom:8px}
.cathero__media--contain{background:#fff;display:flex;align-items:center;justify-content:center;padding:16px}
.cathero__media--contain img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}

/* ============================================================
   WARENKORB (checkout/cart) — czysty, minimalistyczny, responsywny
   ============================================================ */
.cathero--slim { padding: 26px 0 22px; }
.cathero--slim h1 { margin: 8px 0 0; }
.cartsec { padding: 26px 0 60px; background: #f4f6f9; min-height: 40vh; }

.cart-msg { padding: 12px 16px; border-radius: 10px; margin-bottom: 16px; font-size: 14px; font-weight: 500; }
.cart-msg--info { background: #eef4ff; border: 1px solid #cdddff; color: #1c3d7a; }
.cart-msg--ok   { background: #ecfdf3; border: 1px solid #b6e2c2; color: #15803d; }
.cart-msg--warn { background: #fff4e5; border: 1px solid #ffd9a8; color: #9a5b00; }

.cart__grid { display: grid; grid-template-columns: 1fr 360px; gap: 26px; align-items: start; }

.cart__items { background: #fff; border: 1px solid #e6e9ee; border-radius: 16px; overflow: hidden; }
.cart-item { display: flex; gap: 18px; padding: 20px; border-bottom: 1px solid #eef0f3; }
.cart-item:last-of-type { border-bottom: 0; }
.cart-item--out { background: #fffaf7; }
.cart-item__media { flex: 0 0 92px; width: 92px; height: 92px; border-radius: 12px; background: #f5f6f8; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.cart-item__media img { max-width: 100%; max-height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.cart-item__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.cart-item__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.cart-item__name { font-weight: 700; color: var(--navy, #16233d); line-height: 1.35; font-size: 15px; text-decoration: none; }
.cart-item__name:hover { color: var(--red, #0b1a2b); }
.cart-item__total { font-weight: 800; font-size: 16px; color: var(--navy, #16233d); white-space: nowrap; text-align: right; }
.cart-item__old { display: block; font-size: 12px; font-weight: 600; color: #9aa0ac; text-decoration: line-through; }
.cart-item__brand { font-size: 12.5px; color: var(--muted, #8a909c); }
.cart-item__opts { list-style: none; margin: 0; padding: 0; font-size: 12.5px; color: #6b7280; }
.cart-item__warn { font-size: 12.5px; font-weight: 600; color: #0b1a2b; }
.cart-item__controls { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 6px; }
.cart-item__unit { font-size: 13px; color: #6b7280; }
.cart-item__gratis { font-weight: 800; color: #15803d; }
.cart-item__remove { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; padding: 0; margin-left: auto; color: #9aa0ac; font-size: 13px; font-weight: 600; cursor: pointer; }
.cart-item__remove svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cart-item__remove:hover { color: #0b1a2b; }

.cart-qty { display: inline-flex; align-items: center; border: 1px solid #dfe3e9; border-radius: 10px; overflow: hidden; background: #fff; }
.cart-qty__btn { width: 34px; height: 38px; border: 0; background: #f7f8fa; color: var(--navy, #16233d); font-size: 18px; line-height: 1; cursor: pointer; }
.cart-qty__btn:hover { background: #eceff3; color: var(--red, #0b1a2b); }
.cart-qty__input { width: 44px; height: 38px; border: 0; border-left: 1px solid #eceff3; border-right: 1px solid #eceff3; text-align: center; font-size: 14px; font-weight: 700; color: var(--navy, #16233d); }
.cart-qty__input:focus { outline: none; }

.cart__continue { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; color: var(--navy, #16233d); font-weight: 600; font-size: 14px; text-decoration: none; }
.cart__continue svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cart__continue:hover { color: var(--red, #0b1a2b); }

.cart__aside { position: sticky; top: 20px; }
.cart-summary { background: #fff; border: 1px solid #e6e9ee; border-radius: 16px; padding: 22px; }
.cart-summary h2 { font-size: 18px; margin: 0 0 16px; color: var(--navy, #16233d); }
.cart-summary__totals { margin: 0 0 16px; }
.cart-summary__row { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; font-size: 14px; color: #4b5563; }
.cart-summary__row dt, .cart-summary__row dd { margin: 0; }
.cart-summary__row--grand { margin-top: 6px; padding-top: 14px; border-top: 1px solid #eef0f3; font-size: 18px; font-weight: 800; color: var(--navy, #16233d); }
.cart-summary__checkout { width: 100%; justify-content: center; font-size: 15px; padding: 14px; }
.cart-summary__checkout svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cart-summary__checkout.is-disabled { opacity: .5; pointer-events: none; }
.cart-summary__lock { font-size: 13px; color: #9a5b00; background: #fff4e5; border: 1px solid #ffd9a8; padding: 9px 12px; border-radius: 9px; margin: 0 0 12px; }
.cart-summary__trust { list-style: none; margin: 16px 0 0; padding: 16px 0 0; border-top: 1px solid #eef0f3; display: flex; flex-direction: column; gap: 10px; }
.cart-summary__trust li { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: #4b5563; }
.cart-summary__trust svg { width: 18px; height: 18px; flex: none; fill: none; stroke: #15803d; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.cart-empty { text-align: center; padding: 60px 20px; background: #fff; border: 1px solid #e6e9ee; border-radius: 16px; }
.cart-empty__ico { width: 56px; height: 56px; margin: 0 auto 16px; display: block; fill: none; stroke: #c7ccd4; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cart-empty h2 { font-size: 22px; color: var(--navy, #16233d); margin: 0 0 8px; }
.cart-empty p { color: #6b7280; margin: 0 0 22px; }

@media (max-width: 900px) {
  .cart__grid { grid-template-columns: 1fr; }
  .cart__aside { position: static; }
}
@media (max-width: 520px) {
  .cart-item { gap: 14px; padding: 16px; }
  .cart-item__media { flex-basis: 68px; width: 68px; height: 68px; }
  .cart-item__head { flex-direction: column; gap: 4px; }
  .cart-item__total { text-align: left; }
  .cart-item__unit { width: 100%; order: 5; }
  .cart-item__remove { margin-left: 0; }
}

/* Pasek zaufania (topbar) — chowamy na mobile, inaczej nie miesci sie i robi poziomy scroll */
@media (max-width: 767px) { .topbar { display: none; } }

/* ============================================================
   CHECKOUT — minimalne dopasowanie kolorystyczne do koszyka (AP)
   ============================================================ */
#checkout-checkout { padding: 26px 0 60px; }
.checkout-background { background: #f4f6f9; }
/* karty krokow + summary jak w koszyku */
#checkout-checkout .checkout-option,
#checkout-checkout #rem-checkout-confirm,
.checkout-right .cart_summary {
  background: #fff; border: 1px solid #e6e9ee; border-radius: 16px;
}
.checkout-right { position: sticky; top: 20px; }
.checkout-right .cart_summary { padding: 20px; }
#checkout-checkout h4 { color: var(--navy, #16233d); font-weight: 700; }
/* przyciski checkout -> AP red */
#checkout-checkout .btn-primary,
#checkout-checkout .btn-checkout,
.btn-summary {
  background: var(--red, #0b1a2b); border-color: var(--red, #0b1a2b); color: #fff;
  border-radius: 10px; font-weight: 700;
}
#checkout-checkout .btn-primary:hover,
#checkout-checkout .btn-checkout:hover,
.btn-summary:hover { background: var(--red-dark, #081827); border-color: var(--red-dark, #081827); }
/* suma total */
.checkout-right .summary-price,
.checkout-right .ci-total { color: var(--navy, #16233d); font-weight: 800; }
/* pola formularza spojne z reszta AP (ap-oc.css juz stylizuje .form-control) */
@media (max-width: 991px) {
  .checkout-right { position: static; margin-top: 20px; }
}
/* checkout: Bootstrap .row ujemne marginesy powodowaly ~12px overflow */
#checkout-checkout .row { margin-left: 0; margin-right: 0; }