*
*:before,
*:after {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

:root {
    --green: #97d700;
    --greenhover: #3FB618;
    --orange: #FF8100;
    --blue: #0D6EFD;
    --nyablue: #1a6ecc;
    --magenta: #F70EEF;
    --magentahover: #c20bbf;
    --red: #ff0000;
    --yellow: #FAFF00;
    --cyan: #00F0FF;
    --black: #222;
    --lightgrey: #F9F9F9;
    --midgray: #9DA1A7;
    --textgrey: #51585e;
    --titlegrey: #212529;
    --border: #e5e5e5;
    --footlink: #b8d4fd;
    --babyblue: #E7F1FF;
    --radius: 6px;
    --shadow: 0 .05rem .2rem rgba(0, 0, 0, .05);
}

.color-blue {
    color: var(--blue);
}

.bg-green,
#cart-message > div.bg-success {
    background-color: var(--green) !important;
}

.btn-success:hover {
    color: white;
    border-color: var(--greenhover) !important;
    background-color: var(--greenhover) !important;
}
.btn-success,
.bg-success {
    color: white;
    border-color: var(--green) !important;
    background-color: var(--green) !important;
}

.text-success,
.color-green {
    color: var(--green) !important;
}

.color-orange {
    color: var(--orange);
}

.bg-cyan {
    background-color: var(--cyan);
}

.bg-yellow {
    background-color: var(--yellow);
}

.bg-magenta {
    background-color: var(--magenta);
}

.bg-black {
    background-color: var(--black);
}

.bg-green {
    background-color: var(--green);
}

.bg-red {
    background-color: var(--red);
}

.bg-orange {
    background-color: var(--orange);
}

.bg-multi-color {
    background: linear-gradient(135deg,
            var(--cyan),
            var(--green),
            var(--yellow),
            var(--orange),
            var(--red),
            var(--magenta));
}

@font-face {
    font-family: 'Glyphter';
    src: url('icons/Glyphter.eot');
    src: url('icons/Glyphter.eot?#iefix') format('embedded-opentype'),
        url('icons/Glyphter.woff') format('woff'),
        url('icons/Glyphter.ttf') format('truetype'),
        url('icons/Glyphter.svg#Glyphter') format('svg');
    font-weight: normal;
    font-style: normal;
}

img {
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 0;
    vertical-align: top;
    max-width: 100%;
    height: auto;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    text-rendering: optimizeLegibility;
    scroll-behavior: smooth;
    font-optical-sizing: auto;
    font-family: system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-weight: 400;
    line-height: 1.5;
    color: #505050;
    background-color: #F8F9FA;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    font-size: 18px;
}

b,
strong {
    font-weight: bold;
}

li,
p {
    line-height: 1.5;
}

/*
ul,
ol {
    padding: 0;
}

ul ul,
ul ul ul,
ol ol,
ol ol ol {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

ul li,
ol li {
    list-style-type: disc;
    margin-bottom: 0.25em;
    margin-left: 1em;
}

li > ul,
li > ol {
    margin-left: 1.5em;
}

ol {
    padding-left: 1.5em;
}

ol li {
    margin-bottom: 0.5em;
    position: relative;
    padding-left: 0.75em;
    z-index: 1;
}

ol li::marker {
    font-weight: bold;
    font-size: smaller;
    position: relative;
}
*/
blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    border: solid 1px var(--border);
}

td,
th {
    padding: 0.5rem 1rem;
    border: solid 1px var(--border);
}

th {
    background: var(--lightgrey);
    text-align: left;
}

code,
pre,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

mark {
    background: var(--yellow);
    text-decoration: none;
}

iframe {
    display: block;
    max-width: 100%;
}

a,
a:hover,
a:focus,
a:active {
    color: var(--blue);
}

a:hover {
    text-decoration: underline;
}

h1 {
    font-size: 2.5rem;
    font-weight: 600;
    margin-top: 0;
}

h2 {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

h3 {
    font-size: 1.5rem;
    font-weight: 600;
}
div.info-wrap h3 {
    min-height: 6rem;
}

h4 {
    font-size: 1.25rem;
    font-weight: 600;
}

h1 a,
h2 a,
h3 a,
h4 a {
    color: inherit;
}

address {
    margin: 0 0 1.5em;
}

hr {
    border: none !important;
    height: 2px;
    background: var(--lightgrey);
}

.xsmall {
    font-size: 0.75rem;
}

.small {
    font-size: 0.875rem;
}

.larger {
    font-size: 1.25rem;
}

dl {
    display: grid;
    grid-gap: 4px 16px;
    grid-template-columns: max-content;
}

dt {
    font-weight: bold;
}

dd {
    margin: 0;
    grid-column-start: 2;
}

/* GRID Basics */
:root {
    --gap: 24px;
}

@media only screen and (max-width: 768px) {
    :root {
        --gap: 16px;
    }
}

.container {
    max-width: 1440px;
    padding: 0 18px;
    margin: 0 auto;
}

.row {
    display: flex;
    gap: var(--gap);
    flex-wrap: wrap;
    margin: 0;
    justify-content: space-between;
}

.row > * {
    padding: 0;
    margin: 0;
}

.no-gap {
    --gap: 0px;
}

.col-1-2 {
    width: calc((100% - var(--gap)) / 2);
}

.col-1-3 {
    width: calc((100% - (2 * var(--gap))) / 3);
}

.col-2-3 {
    width: calc((100% - var(--gap)) / 3 * 2);
}

.col-1-4 {
    width: calc((100% - (3 * var(--gap))) / 4);
}

.col-3-4 {
    width: calc((100% - var(--gap)) / 4 * 3);
}

.col-1-5 {
    width: calc((100% - (4 * var(--gap))) / 5);
}

.col-2-5 {
    width: calc((100% - var(--gap)) / 5 * 2);
}

.col-3-5 {
    width: calc((100% - var(--gap)) / 5 * 3);
}

.col-4-5 {
    width: calc((100% - var(--gap)) / 5 * 4);
}

.col-1-6 {
    width: calc((100% - (5 * var(--gap))) / 6);
}

.col-5-6 {
    width: calc((100% - var(--gap)) / 6 * 5);
}

[class^="column-"] {
    display: flex;
    gap: var(--gap);
    flex-wrap: wrap;
}

.column-2 > div {
    width: calc((100% - var(--gap)) / 2);
}

.column-3 > div {
    width: calc((100% - (2 * var(--gap))) / 3);
}

.column-4 > div {
    width: calc((100% - (3 * var(--gap))) / 4);
}

.column-5 > div {
    width: calc((100% - (4 * var(--gap))) / 5);
}

.column-6 > div {
    width: calc((100% - (5 * var(--gap))) / 6);
}

.column-7 > div {
    width: calc((100% - (6 * var(--gap))) / 7);
}

.column-8 > div {
    width: calc((100% - (7 * var(--gap))) / 8);
}

.column-9 > div {
    width: calc((100% - (8 * var(--gap))) / 9);
}

.column-10 > div {
    width: calc((100% - (9 * var(--gap))) / 10);
}

.column-11 > div {
    width: calc((100% - (10 * var(--gap))) / 11);
}

.column-12 > div {
    width: calc((100% - (11 * var(--gap))) / 12);
}

@media only screen and (min-width: 769px) and (max-width: 1200px) {

    .column-5 > div,
    .column-6 > div,
    .column-7 > div,
    .column-8 > div,
    .column-9 > div {
        width: calc((100% - (3 * var(--gap))) / 4);
    }

    .column-10 > div,
    .column-11 > div,
    .column-12 > div {
        width: calc((100% - (4 * var(--gap))) / 5);
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {

    .column-3 > div,
    .column-4 > div,
    .column-5 > div {
        width: calc((100% - (1 * var(--gap))) / 2);
    }

    .column-6 > div,
    .column-7 > div,
    .column-8 > div,
    .column-9 > div {
        width: calc((100% - (2 * var(--gap))) / 3);
    }

    .column-10 > div,
    .column-11 > div,
    .column-12 > div {
        width: calc((100% - (3 * var(--gap))) / 4);
    }
}

@media only screen and (max-width: 768px) {

    [class^="col-"],
    [class*="col-"] {
        width: 100%;
    }
}

@media only screen and (max-width: 480px) {

    .column-2 > div,
    .column-3 > div,
    .column-4 > div {
        width: 100%;
    }

    .column-5 > div,
    .column-6 > div {
        width: calc((100% - var(--gap)) / 2);
    }

    .column-7 > div,
    .column-8 > div,
    .column-9 > div,
    .column-10 > div,
    .column-11 > div,
    .column-12 > div {
        width: calc((100% - (2 * var(--gap))) / 3);
    }
}

/* FORM Basics */
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    margin: 0;
}

button,
input {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

textarea {
    overflow: auto;
}

[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

:root {
    --form-padding: 0.5rem 1rem;
    --form-height: auto;
    --form-radius: 4px;
    --form-border: solid 1px #aaa;
    --form-box-shadow: none;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="time"],
input[type="month"],
input[type="week"],
input[type="url"],
input[type="number"],
input[type="search"],
input[type="file"],
select {
    padding: var(--form-padding);
    line-height: 1em;
    font-family: inherit;
    border-radius: var(--form-radius);
    background-color: var(--lightgrey);
    box-shadow: var(--form-box-shadow);
    border: var(--form-border);
    height: var(--form-height);
    margin: 0 0 0.75rem 0;
    transition: background .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

select {
    padding-right: 2rem;
    appearance: none;
    background-image: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xml:space="preserve"><path d="M2.586,7.586c0.781,-0.781 2.047,-0.781 2.828,-0l6.586,6.586l6.586,-6.586c0.781,-0.781 2.047,-0.781 2.828,-0c0.781,0.781 0.781,2.047 0,2.828l-8,8c-0.781,0.781 -2.047,0.781 -2.828,0l-8,-8c-0.781,-0.781 -0.781,-2.047 -0,-2.828Z" style="fill: rgb(80, 80, 80); fill-rule:nonzero;" /></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px 12px;
}

textarea {
    padding: var(--form-padding);
    display: block;
    margin: 0;
    height: 8rem;
    border-radius: var(--form-radius);
    background-color: var(--lightgrey);
    box-shadow: var(--form-box-shadow);
    border: var(--form-border);
    margin-bottom: 0.75rem;
    width: 100%;
}

::placeholder {
    color: #888;
    font-style: italic;
}

input:focus,
select:focus,
textarea:focus {
    outline: none !important;
    border-color: var(--blue);
}

input[type="number"] {
    appearance: textfield;
}

input[type="file"] {
    height: var(--form-height);
    padding: 0;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
    display: block;
}

input[type="file"]::-webkit-file-upload-button {
    font-family: inherit;
    font-size: inherit;
    border: none;
    background: var(--blue);
    border-radius: var(--form-radius);
    padding: 0.3rem 1rem;
    outline: none;
    white-space: nowrap;
    color: #fff;
    -webkit-user-select: none;
    cursor: pointer;
    margin: 4px 12px 4px 4px;
}

input[type="checkbox"],
input[type="radio"] {
    appearance: none;
    background-color: transparent;
    border: var(--form-border);
    border-radius: var(--form-radius);
    height: 22px;
    overflow: hidden;
    position: static;
    vertical-align: text-bottom;
    width: 22px;
    cursor: pointer;
    margin: 0 8px 0 0;
}

input[type="checkbox"] {
    border-radius: 4px;
}

input[type="radio"] {
    border-radius: 50%;
}

input[type="radio"]:checked {
    box-shadow: inset 0 0 0 5px #fff;
    background: var(--blue);
    border-color: var(--blue);
}

#aside-filter .filter-body input[type="checkbox"]:checked {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 100 100" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <g transform="matrix(0.168714,0,0,0.168714,15.8126,15.8125)"> <path d="M393.401,124.425L179.603,338.208C163.771,354.043 138.089,354.043 122.242,338.208L11.878,227.836C-3.96,212.001 -3.96,186.316 11.878,170.478C27.719,154.637 53.399,154.637 69.233,170.472L150.931,252.171L336.037,67.064C351.878,51.223 377.56,51.235 393.395,67.064C409.23,82.902 409.23,108.578 393.401,124.425Z" style="fill:white;fill-rule:nonzero;"/> </g></svg>');
    background: var(--blue);
    border-color: var(--blue);
}

input[type="range"] {
    -webkit-appearance: none;
    min-width: 250px;
    max-width: 100%;
    height: 10px;
    border-radius: 1rem;
    background: var(--lightgrey);
    box-shadow: var(--form-box-shadow);
    border: var(--form-border);
    outline: none;
    padding: 0;
    margin: 1rem 0;
}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--blue);
    border: none;
    cursor: pointer;
}

input[type="range"]::-moz-range-thumb {
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 50%;
    background: var(--blue);
    cursor: pointer;
}

input[type="range"]::-webkit-slider-thumb:hover,
input[type="range"]:active::-webkit-slider-thumb {
    background: var(--blue);
}

input[type="range"]::-moz-range-thumb:hover,
input[type="range"]:active::-moz-range-thumb {
    background: var(--blue);
}

input[name="mennyiseg"] {
    margin: 0;
}

/*  LAYOUT  */
#head, header {
    background-color: #fff;
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow);
}

main {
    padding: 1rem 0;
}

#head {
    padding: 1rem 0;
}

#head .search-form {
    margin-bottom: 0;
}

#logo a {
    display: block;
}

#logo img,
#logo svg {
    display: block;
    max-width: 240px;
}

#head .container,
#top .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

#hero .container {
    display: flex;
    flex-wrap: wrap;
}

#hero {
    transition: 0.2s;
    margin-bottom: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
    padding: 1rem;
}

#top a:hover {
    color: var(--blue);
}

#top {
    font-size: smaller;
}

.top-links,
.contact-links {
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.top-links a,
.contact-links a {
    text-decoration: none;
    color: inherit;
    padding: .75rem 1rem;
    display: inline-block;
}

/* Fejléc email/tel: bi fontikon a régi beégetett SVG helyett, így hoverre színt vált */
.contact-links a .bi {
    color: #9da1a7; /* a korábbi ikonszürke */
    margin-right: .5rem;
    transition: color .15s;
}
.contact-links a:hover,
.contact-links a:hover .bi {
    color: var(--blue);
}

.profile-menu li,
.top-links li,
.contact-links li {
    list-style-type: none;
    margin: 0;
}

.profile-menu {
    display: flex;
    list-style-type: none;
    gap: 1rem;
    margin: 0;
    padding: 0;
}

.product-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-right: -1.5rem;
}

.card-product-grid {
    flex: 0 0 auto;
    width: calc(25% - 1.5rem);
}

.card {
    transition: 0.2s;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.product-cart.card {
    text-align: center;
    padding: 1.5rem;
}

.img-wrap {
    border-bottom: 1px solid var(--border);
    text-align: center;
    overflow: hidden;
}

.img-wrap a {
    height: 220px;
    display: flex;
    align-items: center;
}

.img-wrap img {
    text-align: center;
    overflow: hidden;
    display: block;
    margin: 1.5rem auto;
}

.info-wrap {
    padding: 1.5rem 0;
}

.info-wrap .icon {
    width: 16px;
}

.info-wrap h3 {
    margin: 0 0 1rem 0;
    line-height: 1.2;
}

.info-wrap h3 a {
    color: var(--blue);
    text-decoration: none;
}

.info-wrap h3 + p {
    margin: 0 0 1rem 0;
}

.info-wrap p:last-of-type {
    margin: 0;
}

[class*=card-product] .img-wrap img {
    height: auto;
}

.cart-spinner {
    max-width: 140px;
    flex-wrap: nowrap;
    display: inline-flex;
}

.cart-spinner button {
    background: var(--lightgrey);
}

.cart-spinner .btn {
    width: 36px;
    text-align: center;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border: 1px solid var(--border);
    cursor: pointer;
    display: inline-block;
    border-radius: var(--radius);
}

.cart-spinner input {
    text-align: center;
    display: block;
    width: 54px;
    padding: .375rem .75rem;
    font-weight: 400;
    line-height: 1.5;
    font-size: inherit;
    font-family: inherit;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: 1px solid var(--border);
    border-radius: 0;
    margin: 0;
}

.cart-spinner .btn:last-of-type {
    -webkit-border-top-left-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius-bottomleft: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -1px;
}

.cart-spinner .btn:first-of-type {
    -webkit-border-top-right-radius: 0;
    -webkit-border-bottom-right-radius: 0;
    -moz-border-radius-topright: 0;
    -moz-border-radius-bottomright: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: -1px;
}

.add-to-cart {
    border-top: 1px solid var(--border);
    padding: 1.5rem 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}

.add-to-cart .button-primary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: .4rem 0.75rem;
}

#page-head {
    padding: 1.5rem;
    margin-bottom: 2rem;
}

#page-head h1 {
    margin-bottom: 1rem;
}

.product-box {
    padding: 1.5rem;
}

.product-img a {
    display: block;
    text-align: center;
}

.product-box h3 {
    margin-top: 0;
    margin-bottom: 2rem;
}

.product-box h3 a {
    color: var(--blue);
}

.productlink-items .card {
    padding: 0;
}

.product-cart {
    border-left: 1px solid var(--border);
    padding: 0 1.25rem;
    text-align: center;
}

span.product_colors {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 10px;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

ul.product-meta {
    list-style-type: none;
    padding: 0;
    margin: 0 0 1rem 0;
    display: flex;
    gap: 1rem;
}

ul.product-meta li {
    list-style-type: none;
    margin: 0;
}

.desc {
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.ul-list li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.ul-list li a {
    display: flex;
    margin: 0;
    padding: 0.5rem 0;
    border-bottom: solid 1px var(--border);
}

footer {
    background: var(--blue);
    color: #fff;
    padding: 4rem 0 1rem 0;
}

footer .col-2-3 {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}

footer .col-2-3 > div {
    min-width: 300px;
}

footer h3 {
    color: #fff;
    margin-bottom: 1.25rem;
}

footer ul,
footer li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

footer a {
    text-decoration: none;
    color: var(--babyblue);
}

footer li a {
    display: inline-block;
    padding: 0.25rem 0;
}

footer a:hover {
    text-decoration: underline;
    color: #fff;
}

footer .button-outline {
    border-color: #fff;
    color: #fff;
}

footer .row > * {
    flex-shrink: unset;
    width: auto;
    max-width: auto;
}

.foot-links .row {
    column-gap: 8rem;
}

.payment-logos {
    display: flex;
    gap: 0.75rem;
}

.payment-logos li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.payment-logos img,
.payment-logos svg {
    height: 45px !important;
}

/*  MENU  */
#main-menu ul,
#main-menu li,
.sub-menu,
.sub-menu li {
    margin: 0;
    list-style-type: none;
}

#main-menu a {
    display: block;
    color: inherit;
}

#main-menu a:hover {
    color: var(--blue);
}

header nav {
    display: flex;
    align-items: center;
    width: 100%;
    background: var(--blue);
}

#main-menu > ul {
    flex-wrap: wrap;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
}

#main-menu > ul a {
    text-decoration: none;
    display: block;
    padding: 1rem 1.5rem;
    font-weight: 400;
    color: #fff;
}

#main-menu > ul a:hover {
    background: var(--green);
    color: #fff;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid \9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.sub-menu {
    z-index: 100;
    position: absolute;
    background: #fff;
    top: auto;
    padding: 1rem 0.75rem;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
    min-width: 200px;
    width: max-content;
    border-radius: var(--radius);
}

/* 3. szint - sub-sub-menu */
.sub-menu .has-children,
.has-children .sub-menu li {
    position: relative;
}

.sub-menu .sub-menu {
    top: 0;
    left: 100%;
    margin-left: 0.25rem;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
    border-radius: var(--radius);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
    background: #fff;
    min-width: 180px;
    width: max-content;
}

.has-children .sub-menu li:hover .sub-menu {
    opacity: 1;
    visibility: visible;
}

.has-children .sub-menu .caret {
    transform: rotate(270deg);
}

.sub-menu li a,
#main-menu .sub-menu li a {
    padding: 0.4rem 1rem;
    color: inherit;
    display: block;
}

.main-cats a:hover,
.sub-menu li a:hover,
#main-menu .sub-menu li a:hover {
    background: var(--babyblue);
    color: var(--blue);
    border-radius: var(--radius);
}

.has-children {
    position: relative;
}

.has-children:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
}

.hambi-txt,
.hambi {
    display: none;
}

@media screen and (max-width: 768px) {
    #main-menu {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    #main-menu > ul {
        display: none;
        width: 100%;
        border-top: solid 1px rgba(255, 255, 255, 0.1);
    }

    #main-menu > ul a {
        padding: 0.5rem 0rem;
    }

    .hambi-txt,
    .hambi {
        color: #fff;
        height: 3rem;
        line-height: 3rem;
        display: block;
    }

    #main-menu ul.open {
        display: block;
    }
}

/* BUTTON */
.button,
button {
    display: inline-flex;
    position: relative;
    font-weight: 400;
    font-size: inherit;
    font-family: inherit;
    line-height: 1.5;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    transition: color .1s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    padding: .6rem 1rem;
    border-radius: var(--radius);
    text-decoration: none;
}

.button-primary {
    color: #fff;
    background-color: var(--blue);
    border-color: var(--blue);
}

.button-outline:hover, 
.button-outline-blue:hover {
    background-color: var(--blue);
    color: white;
    border-color: white;
}

.button-outline-blue,
.button-outline {
    color: var(--blue);
    border-color: var(--blue);
}

.button-outline-green:hover,
.button-outline-green {
    color: var(--green);
    border-color: var(--green);
}

.button-orange {
    color: #fff;
    background-color: var(--orange);
    border-color: var(--orange);
}

.button i {
    min-width: 16px;
}

.button-primary i {
    fill: #fff;
}

.button.round {
    border-radius: 3rem;
}

.button:hover {
    text-decoration: none;
}

/* EGYÉB */
.search-group {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
}

.search-group input[type=search] {
    position: relative;
    margin: 0;
    width: 650px;
    padding: .5rem 1rem;
    font-size: inherit;
    font-family: inherit;
    font-weight: 400;
    line-height: 1.5;
    color: var(--textgrey);
    background-color: var(--lightgrey);
    background-clip: padding-box;
    border: 2px solid var(--blue);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    -webkit-border-top-left-radius: var(--radius);
    -webkit-border-bottom-left-radius: var(--radius);
    -moz-border-radius-topleft: var(--radius);
    -moz-border-radius-bottomleft: var(--radius);
    border-top-left-radius: var(--radius);
    border-bottom-left-radius: var(--radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.search-group input {
    margin: 0;
    max-width: calc(100% - 52px);
}

.search-group select {
    margin-left: -2px;
    position: relative;
    display: block;
    padding: .5rem 2rem .5rem 1rem;
    font-size: inherit;
    font-family: inherit;
    font-weight: 400;
    line-height: 1.5;
    color: var(--textgrey);
    vertical-align: middle;
    background-color: var(--lightgrey);
    border: 2px solid var(--blue);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xml:space="preserve"><path d="M2.586,7.586c0.781,-0.781 2.047,-0.781 2.828,-0l6.586,6.586l6.586,-6.586c0.781,-0.781 2.047,-0.781 2.828,-0c0.781,0.781 0.781,2.047 0,2.828l-8,8c-0.781,0.781 -2.047,0.781 -2.828,0l-8,-8c-0.781,-0.781 -0.781,-2.047 -0,-2.828Z" style="fill: rgb(80, 80, 80); fill-rule:nonzero;" /></svg>');
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px 12px;
}

.search-group .button {
    position: relative;
    align-items: center;
    z-index: 2;
    border-radius: 0;
    -webkit-border-top-right-radius: var(--radius);
    -webkit-border-bottom-right-radius: var(--radius);
    -moz-border-radius-topright: var(--radius);
    -moz-border-radius-bottomright: var(--radius);
    border-top-right-radius: var(--radius);
    border-bottom-right-radius: var(--radius);
    border: 2px solid var(--blue);
    margin-left: -2px;
    outline: none;
    transition: background-color .15s, border-color .15s;
}
 
.search-group .button:focus,
.search-group .button:focus-visible {
    outline: none;
    box-shadow: none;
}
 
.search-group .button:hover {
    background-color: var(--nyablue);
    border-color: var(--nyablue);
}
 
.search-group .button i {
    margin: 0;
}

.icon,
.button .icon,
a .icon,
button .icon {
    display: inline-block;
    margin-right: .5rem;
    vertical-align: middle;
    width: 20px;
}

.icon {
    display: inline-block;
}

.button:hover .icon {
    fill: red !important;
}

.account .icon {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M256,256c70.7,0 128,-57.3 128,-128c0,-70.7 -57.3,-128 -128,-128c-70.7,0 -128,57.3 -128,128c0,70.7 57.3,128 128,128Zm89.6,32l-16.7,0c-22.2,10.2 -46.9,16 -72.9,16c-26,0 -50.6,-5.8 -72.9,-16l-16.7,0c-74.2,0 -134.4,60.2 -134.4,134.4l0,41.6c0,26.5 21.5,48 48,48l352,0c26.5,0 48,-21.5 48,-48l0,-41.6c0,-74.2 -60.2,-134.4 -134.4,-134.4Z" style="fill: rgb(157, 161, 167); fill-rule:nonzero;"/></svg>');
}

.account:hover .icon {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M256,256c70.7,0 128,-57.3 128,-128c0,-70.7 -57.3,-128 -128,-128c-70.7,0 -128,57.3 -128,128c0,70.7 57.3,128 128,128Zm89.6,32l-16.7,0c-22.2,10.2 -46.9,16 -72.9,16c-26,0 -50.6,-5.8 -72.9,-16l-16.7,0c-74.2,0 -134.4,60.2 -134.4,134.4l0,41.6c0,26.5 21.5,48 48,48l352,0c26.5,0 48,-21.5 48,-48l0,-41.6c0,-74.2 -60.2,-134.4 -134.4,-134.4Z" style="fill: rgb(121,191,0); fill-rule:nonzero;"/></svg>');
}

.cart {
    border-color: var(--green);
    color: var(--green);
}
.cart:hover {
    border-color: var(--greenhover);
    color: var(--greenhover);
}
.checkout {
    border-color: var(--magenta);
    color: var(--magenta);
}
.checkout:hover {
    border-color: var(--magentahover);
    color: var(--magentahover);
}

.cart .bi,
.checkout .bi {
    font-size: 1rem;
    line-height: 1;
}

.icon.search {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M371,63.7c-84.9,-84.9 -222.5,-84.9 -307.3,0c-84.8,84.9 -84.9,222.5 0,307.4c74.3,74.3 189,83.5 273.4,27.8l100.5,100.5c17.3,16.8 44.9,16.4 61.7,-0.9c16.5,-16.9 16.5,-43.9 -0,-60.8l-100.6,-100.7c55.8,-84.4 46.6,-199.1 -27.7,-273.3Zm-53.3,254c-55.4,55.4 -145.5,55.4 -200.9,-0c-55.4,-55.4 -55.4,-145.5 0,-200.9c55.4,-55.4 145.5,-55.4 200.9,-0c55.4,55.4 55.4,145.6 0,200.9Z" style="fill: white; fill-rule:nonzero;"/></svg>');
}

.icon.email {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 100 100" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M57.761,61.95c-2.394,1.515 -5.087,2.281 -7.78,2.281c-2.655,0 -5.311,-0.729 -7.611,-2.206l-38.393,-25.845c-0.635,-0.43 -1.477,0.019 -1.477,0.786l-0,46.284c-0,2.618 2.132,4.75 4.75,4.75l85.5,0c2.618,0 4.75,-2.132 4.75,-4.75l0,-46.284c0,-0.767 -0.842,-1.216 -1.477,-0.786l-38.262,25.77Zm-10.211,-7.873c1.44,0.916 3.441,0.916 4.993,-0.075l44.546,-29.996c0.261,-0.168 0.411,-0.468 0.411,-0.786l0,-6.47c0,-2.618 -2.132,-4.75 -4.75,-4.75l-85.5,0c-2.618,0 -4.75,2.132 -4.75,4.75l0,6.47c0,0.318 0.15,0.618 0.411,0.786l44.639,30.071Z" style="fill: rgb(157, 161, 167); fill-rule:nonzero;"/></svg>');
}

.icon.tel {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 26 26" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M22.079,17.835c-1.548,-1.324 -3.119,-2.126 -4.648,-0.804l-0.913,0.799c-0.668,0.58 -1.91,3.29 -6.712,-2.234c-4.801,-5.517 -1.944,-6.376 -1.275,-6.951l0.918,-0.8c1.521,-1.325 0.947,-2.993 -0.15,-4.71l-0.662,-1.04c-1.102,-1.713 -2.302,-2.838 -3.827,-1.515l-0.824,0.72c-0.674,0.491 -2.558,2.087 -3.015,5.119c-0.55,3.638 1.185,7.804 5.16,12.375c3.97,4.573 7.857,6.87 11.539,6.83c3.06,-0.033 4.908,-1.675 5.486,-2.272l0.827,-0.721c1.521,-1.322 0.576,-2.668 -0.973,-3.995l-0.931,-0.801Z" style="fill: rgb(157, 161, 167); fill-rule:nonzero;"/></svg>');
}

.icon.shipping {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 494 494" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M487.932,51.1c-3.613,-3.612 -7.905,-5.424 -12.847,-5.424l-292.36,0c-4.948,0 -9.233,1.812 -12.847,5.424c-3.615,3.617 -5.424,7.902 -5.424,12.85l-0,54.818l-45.683,0c-5.14,0 -10.71,1.237 -16.705,3.711c-5.996,2.478 -10.801,5.518 -14.416,9.135l-56.532,56.531c-2.473,2.474 -4.612,5.327 -6.424,8.565c-1.807,3.23 -3.14,6.14 -3.997,8.705c-0.855,2.572 -1.477,6.089 -1.854,10.566c-0.378,4.475 -0.62,7.758 -0.715,9.853c-0.091,2.092 -0.091,5.71 -0,10.85c0.096,5.142 0.144,8.47 0.144,9.995l-0,91.36c-4.947,0 -9.229,1.807 -12.847,5.428c-3.616,3.609 -5.425,7.896 -5.425,12.845c-0,2.851 0.378,5.376 1.14,7.562c0.763,2.19 2.046,3.949 3.858,5.284c1.807,1.335 3.378,2.426 4.709,3.285c1.335,0.855 3.571,1.424 6.711,1.711c3.14,0.287 5.28,0.479 6.423,0.575c1.143,0.089 3.568,0.089 7.279,0c3.715,-0.096 5.855,-0.144 6.427,-0.144l18.271,0c-0,20.17 7.139,37.397 21.411,51.674c14.277,14.274 31.501,21.413 51.678,21.413c20.175,0 37.401,-7.139 51.675,-21.413c14.277,-14.276 21.411,-31.504 21.411,-51.674l109.637,0c-0,20.17 7.139,37.397 21.412,51.674c14.271,14.274 31.498,21.413 51.675,21.413c20.181,0 37.397,-7.139 51.675,-21.413c14.277,-14.276 21.412,-31.504 21.412,-51.674c0.568,0 2.711,0.048 6.42,0.144c3.713,0.089 6.14,0.089 7.282,0c1.144,-0.096 3.289,-0.288 6.427,-0.575c3.139,-0.287 5.373,-0.855 6.708,-1.711c1.335,-0.856 2.901,-1.95 4.709,-3.285c1.81,-1.335 3.097,-3.094 3.856,-5.284c0.77,-2.187 1.143,-4.712 1.143,-7.562l-0,-292.359c0.004,-4.949 -1.803,-9.229 -5.417,-12.853Zm-334.335,349.18c-7.229,7.23 -15.797,10.854 -25.694,10.854c-9.898,0 -18.464,-3.62 -25.697,-10.854c-7.233,-7.228 -10.848,-15.797 -10.848,-25.693c-0,-9.897 3.619,-18.47 10.848,-25.701c7.232,-7.228 15.798,-10.848 25.697,-10.848c9.897,0 18.464,3.617 25.694,10.848c7.236,7.231 10.853,15.804 10.853,25.701c-0,9.896 -3.617,18.465 -10.853,25.693Zm10.853,-171.877l-109.636,0l-0,-8.562c-0,-2.475 0.855,-4.569 2.568,-6.283l55.674,-55.672c1.712,-1.714 3.809,-2.568 6.283,-2.568l45.111,0l-0,73.085Zm244.96,171.877c-7.23,7.23 -15.797,10.854 -25.693,10.854c-9.9,0 -18.47,-3.62 -25.7,-10.854c-7.231,-7.228 -10.849,-15.797 -10.849,-25.693c-0,-9.897 3.617,-18.47 10.849,-25.701c7.23,-7.228 15.8,-10.848 25.7,-10.848c9.896,0 18.463,3.617 25.693,10.848c7.231,7.235 10.852,15.804 10.852,25.701c-0,9.896 -3.614,18.465 -10.852,25.693Z" style="fill: rgb(121,191,0); fill-rule:nonzero;"/></svg>');
}

.icon.years {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 410 410" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M397.619,34.918c-8.192,-8.704 -19.814,-13.722 -31.795,-13.722l-38.144,0c0.154,-6.861 0.256,-13.926 0.256,-21.197l-246.016,0c0,7.27 0.102,14.336 0.256,21.197l-38.4,0c-11.981,0 -23.603,5.018 -31.795,13.722c-8.295,8.756 -12.595,20.736 -11.879,32.871c6.861,114.381 65.895,186.163 159.488,196.813l-18.125,63.078c-21.555,-0 -39.014,17.459 -39.014,39.014l0,42.906l205.005,-0l0,-42.906c0,-21.555 -17.459,-39.014 -39.014,-39.014l-18.125,-63.078c93.389,-10.752 152.371,-82.483 159.181,-196.813c0.716,-12.083 -3.584,-24.064 -11.879,-32.871Zm-356.608,30.413c-0.051,-1.126 0.41,-1.894 0.819,-2.304c0.768,-0.819 1.69,-0.819 1.946,-0.819l40.346,-0c6.093,80.538 23.859,126.208 41.114,152.013c-65.69,-27.546 -81.358,-101.12 -84.225,-148.89Zm243.61,148.736c17.254,-25.856 34.97,-71.475 41.062,-151.91l40.192,-0c0.307,-0 1.178,-0 1.946,0.819c0.41,0.41 0.87,1.178 0.819,2.304c-2.918,47.77 -18.534,121.139 -84.019,148.787Z" style="fill: rgb(255,129,0); fill-rule:nonzero;" /></svg>');
}

.icon.info {
    color: var(--blue);
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M256,0.499c141.015,0 255.501,114.486 255.501,255.501c0,141.015 -114.486,255.501 -255.501,255.501c-141.015,0 -255.501,-114.486 -255.501,-255.501c0,-141.015 114.486,-255.501 255.501,-255.501Zm46.908,268.929c0,-25.907 -21.001,-46.907 -46.906,-46.907l-0.002,0c-12.441,0 -24.372,4.942 -33.169,13.74c-8.797,8.796 -13.739,20.727 -13.739,33.169l0,99.864c0,12.44 4.942,24.372 13.739,33.169c8.797,8.797 20.728,13.739 33.169,13.739l0.002,0c25.905,0 46.906,-21.001 46.906,-46.906l0,-99.868Zm-46.908,-173.63c-25.889,0 -46.908,21.019 -46.908,46.908c0,25.89 21.019,46.909 46.908,46.909c25.889,0 46.908,-21.019 46.908,-46.909c0,-25.889 -21.019,-46.908 -46.908,-46.908Z" style="fill: rgb(13,110,253); fill-rule:nonzero;" /></svg>');
}

.icon.check {
    color: var(--magenta);
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 95 95" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M47.494,0c-26.207,0 -47.494,21.298 -47.494,47.506c0,26.207 21.287,47.494 47.494,47.494c26.208,0 47.506,-21.287 47.506,-47.494c-0,-26.208 -21.298,-47.506 -47.506,-47.506Zm20.882,25.948c1.741,0 3.478,0.656 4.793,1.971c2.631,2.63 2.631,6.969 0,9.6l-28.787,28.787c-2.631,2.63 -6.972,2.63 -9.602,-0l-12.79,-12.799c-2.631,-2.63 -2.631,-6.963 0,-9.593c2.631,-2.631 6.963,-2.631 9.593,-0l7.997,7.998l23.996,-23.993c1.315,-1.315 3.058,-1.971 4.8,-1.971Z" style="fill: rgb(121,191,0); fill-rule:nonzero;"/></svg>');
}

.icon.printer {
    width: 16px;
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 376 376" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M356.3,93.9l-37.5,0l0,-75c0,-10.3 -8.4,-18.8 -18.8,-18.8l-225,0c-10.3,0 -18.8,8.4 -18.8,18.8l0,75l-37.4,0c-10.3,0 -18.8,8.2 -18.8,18.8l-0,150c-0,10.3 8.4,18.8 18.8,18.8l37.5,0l-0,74.8c-0,10.3 8.4,18.8 18.8,18.8l225,0c10.3,0 18.8,-8.4 18.8,-18.8l0,-74.8l37.5,0c10.3,0 18.8,-8.4 18.8,-18.8l0,-150c-0.2,-10.5 -8.6,-18.8 -18.9,-18.8Zm-75,243.6l-187.5,0l-0,-112.3l187.5,0l-0,112.3Zm-37.5,-74.9l-112.5,0l-0,37.5l112.5,0l-0,-37.5Zm75,-93.7c-10.3,-0 -18.8,-8.4 -18.8,-18.8c-0,-10.5 8.4,-18.8 18.8,-18.8c10.3,-0 18.8,8.2 18.8,18.8c-0.1,10.4 -8.5,18.8 -18.8,18.8Zm-37.5,-75l-187.5,-0l-0,-56.3l187.5,-0l-0,56.3Z" style="fill: rgb(102,102,102); fill-rule:nonzero;"/></svg>');
}
.icon.blue-printer {
    width: 16px;
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 376 376" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M356.3,93.9l-37.5,0l0,-75c0,-10.3 -8.4,-18.8 -18.8,-18.8l-225,0c-10.3,0 -18.8,8.4 -18.8,18.8l0,75l-37.4,0c-10.3,0 -18.8,8.2 -18.8,18.8l-0,150c-0,10.3 8.4,18.8 18.8,18.8l37.5,0l-0,74.8c-0,10.3 8.4,18.8 18.8,18.8l225,0c10.3,0 18.8,-8.4 18.8,-18.8l0,-74.8l37.5,0c10.3,0 18.8,-8.4 18.8,-18.8l0,-150c-0.2,-10.5 -8.6,-18.8 -18.9,-18.8Zm-75,243.6l-187.5,0l-0,-112.3l187.5,0l-0,112.3Zm-37.5,-74.9l-112.5,0l-0,37.5l112.5,0l-0,-37.5Zm75,-93.7c-10.3,-0 -18.8,-8.4 -18.8,-18.8c-0,-10.5 8.4,-18.8 18.8,-18.8c10.3,-0 18.8,8.2 18.8,18.8c-0.1,10.4 -8.5,18.8 -18.8,18.8Zm-37.5,-75l-187.5,-0l-0,-56.3l187.5,-0l-0,56.3Z" style="fill: rgb(13,110,253); fill-rule:nonzero;"/></svg>');
}

.icon.related {
    width: 16px;
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M50.4,464c66.1,64.9 172.8,62.8 238.3,-2.7l25.8,-25.8c15.9,-15.9 15.9,-41.8 0,-57.7c-15.9,-15.9 -41.8,-15.9 -57.7,0l-26.2,26.2c-34.3,34.3 -91,34.9 -124.7,0c-32.8,-34 -32.3,-88 1.1,-121.5l27.4,-27.4c15.9,-15.9 15.9,-41.8 0,-57.7c-15.9,-15.9 -41.8,-15.9 -57.7,0l-27.4,27.3c-66.1,66.1 -65.7,173.8 1.1,239.3Zm245.6,-305.7l-137.8,137.7c-15.9,15.9 -15.9,41.8 0,57.7c15.9,15.9 41.8,15.9 57.7,0l137.9,-137.7c15.9,-15.9 15.9,-41.8 0,-57.7c-16,-16 -41.9,-16 -57.8,0Zm-72.7,-107.6l-25.8,25.8c-15.9,15.9 -15.9,41.8 0,57.7c15.9,15.9 41.8,15.9 57.7,0l26.3,-26.3c34.3,-34.3 91,-34.9 124.7,0c32.8,34 32.3,88 -1.1,121.5l-27.4,27.4c-15.9,15.9 -15.9,41.8 0,57.7c15.9,15.9 41.8,15.9 57.7,0l27.4,-27.4c66,-66 65.6,-173.6 -1.2,-239.1c-66.1,-64.8 -172.8,-62.8 -238.3,2.7Z" style="fill: rgb(102,102,102); fill-rule:nonzero;"/></svg>');
}

.icon.piggy:hover,
.icon.piggy {   
    width: 16px;
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M489.154,187.543l-37.485,0c-16.795,-37.341 -46.992,-67.535 -84.325,-84.33l0,-52.711c0,-8.425 -4.638,-16.167 -12.067,-20.144c-7.428,-3.975 -16.441,-3.54 -23.45,1.133l-85.629,57.085l-78.698,0c-92.36,0.002 -167.5,75.143 -167.5,167.504c0,53.789 25.223,103.287 68.089,134.823l0,70.596c0,12.615 10.229,22.846 22.846,22.846l91.383,0c12.617,0 22.846,-10.23 22.846,-22.846l0,-37.919l45.691,0l0,37.919c0,12.615 10.229,22.846 22.846,22.846l91.383,0c12.617,0 22.846,-10.23 22.846,-22.846l0,-63.596c27.843,-17.588 50.213,-43.334 63.727,-73.285l37.497,0c12.617,0 22.846,-10.229 22.846,-22.846l0,-91.384c0,-12.617 -10.229,-22.845 -22.846,-22.845Zm-220.81,38.109l-70.384,0c-12.617,0 -22.846,-10.23 -22.846,-22.846c0,-12.618 10.229,-22.846 22.846,-22.846l70.385,0c12.618,0 22.846,10.227 22.846,22.846c-0.001,12.616 -10.23,22.846 -22.847,22.846Z" style="fill: rgb(128,191,0); fill-rule:nonzero;" /></svg>  ');
}

.icon.diamond {
    width: 16px;
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 480 417" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M10.469,150.72l190.4,246.08c9.322,12.103 23.762,19.207 39.04,19.207c15.277,-0 29.717,-7.104 39.04,-19.207l190.4,-246.08c15.308,-19.753 13.658,-48.078 -3.84,-65.92l-70.08,-70.08c-9.335,-9.346 -21.992,-14.639 -35.2,-14.72l-240.64,0c-13.209,0.081 -25.866,5.374 -35.2,14.72l-70.08,70.08c-17.499,17.842 -19.149,46.167 -3.84,65.92Z" style="fill: rgb(13,110,253); fill-rule:nonzero;"/></svg>');
}

.cart-count {
    border-radius: 50%;
    right: -15px;
    position: absolute;
    top: -15px;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    overflow: hidden;
    font-size: 14px;
    color: #ffffff;
    background-color: var(--blue);
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid \9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.main-cats {
    list-style-type: none;
    margin: 1rem 0;
    padding: 0;
}

.main-cats li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.main-cats a {
    text-decoration: none;
    color: inherit;
    padding: .5rem 1rem;
    display: block;
}

#home-slideshow {
    background: var(--blue);
    color: #fff;
    border-radius: var(--radius);
    height: 100%;
    display: flex;
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center center;
}

#home-slideshow .item > div {
    position: absolute;
    display: flex;
    align-items: center;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

#home-slideshow .item > img {
    object-fit: cover;
    height: 100%;
    width: auto;
    opacity: 0.3;
}

#home-slideshow .item > div > div {
    padding: 3rem;
}

#home-slideshow h1 {
    color: #fff;
}

.breadcrumb {
    margin: 0px;
    padding: 8px 0;
    list-style: none;
    margin-bottom: 1rem;
}

.breadcrumb > li {
    padding: 0;
    position: relative;
    white-space: nowrap;
    font-size: smaller;
    display: inline-block;
}

.breadcrumb > li a {
    color: inherit;
    text-decoration: none;
}

.breadcrumb > li:after {
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M385.1,219.9l-185.9,-185.9c-20,-20 -52.3,-20 -72.3,0c-20,20 -20,52.3 0,72.3l149.8,149.7l-149.8,149.7c-20,20 -20,52.3 0,72.3c20,20 52.3,20 72.3,-0l185.9,-185.9c19.9,-19.9 19.9,-52.3 0,-72.2Z" style="fill: rgb(80, 80, 80); fill-rule:nonzero;"/></svg>');
    display: inline-block;
    margin: 0 4px 0 4px;
    width: 12px;
    height: 12px;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: none;
}

.breadcrumb > li a:hover {
    color: var(--blue);
}

.breadcrumb-item+.breadcrumb-item {
    padding-left: 0;
}

#aside-filter-button {
    margin-bottom: 1rem;
    align-items: center;
    display: inline-flex;
    gap: 6px;
}

#aside-filter-button svg {
    width: 16px;
    height: 16px;
}

#aside-filter-button svg path {
    fill: var(--blue);
}

#aside-filter-button:hover svg path {
    fill: white;
}

#aside-filter {
    word-wrap: break-word;
    background-color: #fff;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
    border-radius: var(--radius);
	margin-bottom: 2rem;
}

.filter-group h4 {
    padding: .625rem 1.5rem;
    margin: 0;
    background-color: var(--lightgrey);
    border-bottom: 1px solid var(--border);
    border-top: 1px solid var(--border);
}

.filter-group:first-of-type h4 {
    border-top: none;
}

.filter-group h4 i {
    margin-top: 6px;
    float: right;
    color: #9DA1A7;
}

.filter-body {
    padding: 1.5rem;
}

.filter-group label {
    display: block;
    margin-bottom: .5rem;
    font-size: 1rem;
}

#aside-filter .filter-body label:not(.checkbox-button):has(input[type="checkbox"]) {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-bottom: .5rem;
}

#aside-filter .filter-body label:not(.checkbox-button):has(input[type="checkbox"]) input {
    flex-shrink: 0;
    margin-top: 3px;
}

#aside-filter .filter-body label:not(.checkbox-button):has(input[type="checkbox"]) span {
    flex: 1;
    line-height: 1.4;
}

#aside-filter .filter-body label:not(.checkbox-button):has(input[type="checkbox"]) .badge {
    float: none !important;
    flex-shrink: 0;
    align-self: flex-start;
    margin-left: auto;
    margin-top: 2px;
}

.filter-group label .form-check-input {
    float: left;
    margin-left: -1.5em;
    width: 1em;
    height: 1em;
    margin-top: .25em;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid var(--border);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    transition: background-color .15s ease-in-out, background-position .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.badge {
    background-color: #9da1a7;
    border-radius: 50rem !important;
    display: inline-block;
    padding: .32em .7em;
    font-size: 0.83em;
    font-weight: 400;
    line-height: .9;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    float: right !important;
}

label.checkbox-button {
    display: inline-block !important;
    margin-right: 6px;
    margin-bottom: 8px;
}

input[type="checkbox"],
input[type="radio"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 1px solid var(--border);
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 1em;
    height: 22px;
    overflow: hidden;
    position: static;
    vertical-align: text-bottom;
    width: 22px;
    cursor: pointer;
    margin: 0 8px 0 0;
    display: inline-block;
}

input[type="radio"] {
    border-radius: 50%;
}

input[type="radio"]:checked:before {
    content: '';
    background: var(--blue);
    border-radius: 50%;
    cursor: pointer;
    display: block;
    height: 12px;
    margin: 4px;
    width: 12px;
}


#aside-filter .filter-body input[type="checkbox"]:checked {
    border-color: var(--blue);
}

#aside-filter .filter-body input[type="checkbox"]:checked:before {
    max-height: 22px;
    max-width: 22px;
    display: block;
    content: url('data:image/svg+xml, <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:serif="http://www.serif.com/" width="100%" height="100%" viewBox="0 0 100 100" version="1.1" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <g transform="matrix(0.168714,0,0,0.168714,15.8126,15.8125)"> <path d="M393.401,124.425L179.603,338.208C163.771,354.043 138.089,354.043 122.242,338.208L11.878,227.836C-3.96,212.001 -3.96,186.316 11.878,170.478C27.719,154.637 53.399,154.637 69.233,170.472L150.931,252.171L336.037,67.064C351.878,51.223 377.56,51.235 393.395,67.064C409.23,82.902 409.23,108.578 393.401,124.425Z" style="fill:white;fill-rule:nonzero;"/> </g></svg>');
    background: var(--blue);
}

.checkbox-button input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.checkbox-button .button {
    display: inline-block;
    color: #000;
    text-align: center;
    min-width: 52px;
    padding: .5rem 1rem;
    line-height: 1;
}

.checkbox-button .button.bg-black {
    color: #fff;
}

.checkbox-button input ~ .button {
    color: transparent;
}
.checkbox-button input:checked ~ .button {
    font-weight: bold;
    outline-offset: 2px;
    outline: 1px solid #000;
    color: green;
}

/* Szín szűrő — kör alakú swatch-ok, zöld pipa-badge kiválasztáskor */
.checkbox-button .product-color-filter {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 50% !important;
    display: block !important;
    cursor: pointer;
    position: relative;
    box-sizing: border-box !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    transition: transform .1s;
    border: none !important;
    outline: none !important;
}

.checkbox-button .product-color-filter:hover {
    transform: scale(1.08);
}

.checkbox-button input.filter-button-color:checked ~ .product-color-filter {
    outline: none !important;
    color: transparent !important;
    font-weight: normal !important;
}

.checkbox-button input.filter-button-color:checked + .product-color-filter::after {
    content: '';
    position: absolute;
    bottom: -4px;
    right: -4px;
    width: 18px;
    height: 18px;
    background: #639922;
    border-radius: 50%;
    border: 2px solid white;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
    background-size: 10px 10px;
    background-repeat: no-repeat;
    background-position: center;
}

.tabs {
    margin: 0 0 1.5rem 0;
    box-shadow: var(--shadow);
}

.tabs .nav-tabs {
    display: inline-flex;
    margin: 0;
    position: relative;
    background: var(--lightgrey);
    border-radius: var(--radius);
    padding: 12px 12px 0 12px;
    overflow: hidden;
    width: 100%;
    border: solid 1px var(--border);
    border-bottom: none;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.tabs .nav-tabs li.active {
    background-color: #fff;
    font-weight: bold;
    z-index: 2;
    border-radius: var(--radius);
    border: solid 1px var(--border);
    border-bottom: none;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.tabs .nav-tabs li {
    display: flex;
    align-items: center;
    list-style-type: none;
    margin: 0;
    padding: .5rem 1rem;
    cursor: pointer;
}

.tabs .nav-tabs li:before {
    content: none
}

.tabs .tab-content {
    background-color: #fff;
    border-radius: var(--radius);
    border: solid 1px var(--border);
    position: relative;
    transition: all ease-in-out .3s;
    -webkit-border-top-left-radius: 0;
    -webkit-border-top-right-radius: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius-topright: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.tabs .tab-panel {
    width: 100%;
    padding: 2rem;
    display: none
}

.tabs .tab-panel:first-of-type {
    display: block
}

.tabs .tab-panel table {
    width: 100%;
}

@media screen and (max-width: 1180px) {
    #head .container {
        flex-wrap: wrap;
    }

    #logo {
        width: 100%;
        display: flex;
        justify-content: center;
    }
}

@media screen and (max-width: 700px) {
    #head .container > div {
        display: flex;
        justify-content: center;
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    #top .container {
        display: block;
    }

    #aside-filter {
        display: none;
    }

    #head .search-form {
        margin-bottom: 1rem;
    }

    .search-group input[type=search] {
        width: 100% !important;
    }

    header {
        display: flex;
        flex-wrap: wrap;
    }

    header > nav {
        order: 3;
    }

    .contact-links {
        border-bottom: solid 1px #ddd;
        font-size: smaller;
        width: 100%; display: none;
    }
    
    
  .top-links  .icon {
    width: 14px;
}

.breadcrumb {
font-size: 14px;
}

    #home-slideshow .item > div > div {
        padding: 1rem;
    }

    #home-slideshow .item > img {
        aspect-ratio: 1 / 1;
    }

    .top-links a,
    .contact-links a {
        padding: .75rem 0.5rem;
    }

    .contact-links a {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .contact-links a .icon {
        display: none;
        margin-right: 0;

    }

    .tabs .nav-tabs {
        display: block;
    }
}

@media screen and (max-width: 480px) {
    .container {
        padding-right: 14px;
        padding-left: 14px;
    }

    .profile-menu {
        justify-content: space-between;
        width: 100%;
        gap: 0.75rem;
    }

    #head .button span {
        display: inline-block;
    }

    #head {
        font-size: 16px;
    }

    .main-cats {
        margin: 0;
    }

    .main-cats a {
        padding: .25rem 0;
    }

    h1 {
        font-size: 2rem;
    }

    h2 {
        font-size: 1.75rem;
    }

    h3 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1300px) {
    .search-group input[type=search] {
        width: auto;
    }
}

#account-menu:hover #account-dropdown {
    opacity: 1;
    visibility: visible;
}

#account-dropdown {
    z-index: 25100;
    overflow: hidden;
    position: absolute;
    background: #fff;
    top: auto;
    padding: 1rem 0.75rem;
    opacity: 0.9;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
    min-width: 200px;
    width: max-content;
    border-radius: var(--radius);
}

#account-dropdown form input,
#account-dropdown form label {
    font-family: inherit;
    font-size: inherit;
    color: inherit
}

#account-dropdown ul li a {
    padding: 0.4rem 1rem;
    display: block;
    color: inherit;
}

#account-dropdown ul li a:hover {
    background: var(--babyblue);
    color: var(--blue);
    border-radius: var(--radius);
}

#account-dropdown button[type="submit"] {
    width: 100%;
    margin: 1rem 0;
    text-align: center;
}

#add_product {
    display: flex;
    justify-content: center;
    gap: 1rem;
}

#add_product #input-quantity {
    margin: 0;
}

#minicart-dropdown {
    z-index: 100;
    overflow: hidden;
    position: absolute;
    background: #fff;
    top: auto;
    padding: 1rem 0.75rem;
    opacity: 0;
    visibility: hidden;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease-in-out;
    min-width: 200px;
    width: max-content;
    border-radius: var(--radius);
    font-size: smaller;
}

.profile-menu li:first-of-type:hover #minicart-dropdown {
    opacity: 1;
    visibility: visible;
}

.productgroup_link .column-3 {
    row-gap: 0.5rem;
    margin-top: 1rem;
}

.tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tags .button {
    padding: .4rem 0.75rem;
}

a[data-fslightbox="productgallery"] img,
a[data-fslightbox="mygalley"] img {
    border: 1px solid var(--border);
    padding: 1rem;
    border-radius: 4px;
}

a[data-fslightbox="productgallery"] img.main {
    margin-bottom: 1rem;
}

.cikkszam span {
    font-weight: bold;
}

h1:has(.product_color_140-ciankek) + .product-meta .cikkszam span {
    color: var(--cyan);
}

h1:has(.product_color_160-sarga) + .product-meta .cikkszam span {
    color: var(--yellow);
}

h1:has(.product_color_150-magenta) + .product-meta .cikkszam span {
    color: var(--magenta);
}

h1:has(.product_color_290-zold) + .product-meta .cikkszam span {
    color: var(--green);
}

h1:has(.product_color_280-narancssarga) + .product-meta .cikkszam span {
    color: var(--orange);
}

h1:has(.product_color_270-piros) + .product-meta .cikkszam span {
    color: var(--red);
}

h1:has(.product_color_100-fekete) + .product-meta .cikkszam span {
    color: #000;
}

h1:has(.product_color_550-fekete-ciankek-magenta-sarga) + .product-meta .cikkszam span {
    color: #000;
}

.column-4.line-grid a:first-of-type {
    aspect-ratio: 5 / 2;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--border);
    padding: 1rem;
    border-radius: 4px;
    margin-bottom: 1rem;
    background: #f9f9f9;
}

.column-4.line-grid a img {
    max-height: 60px;
    width: auto;
}

#webaruhaz2_topalert {
    margin: 0 !important;
    text-align: center;
}

#btn-back-to-top {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    background: var(--green);
    color: #fff;
    padding: 12px;
    border-radius: 50%;
}

.freedelivery {
    background: none;
    padding: 2px 10px;
    text-align: center;
    display: block;
    border-radius: 4px;
}

.stock3 {
    color: #ff8400 !important;
}

.steps-wrap .step {
    margin: 0;
    list-style-type: none;
}

.tagline {
    font-size: smaller;
    text-align: right;
    display: block;
}


section:has(.breadcrumb) {
    background: none!important; color: inherit; padding: 0;
}

section:has(.breadcrumb) a, section:has(.breadcrumb) li {
     color: #505050!important;
}


@media only screen and (min-width: 769px) {
    
 
    
.row:has(.col-lg-8),
.row:has(.col-lg-4),
.row:has(.col-lg-9),
.row:has(.col-lg-3),
.row:has(.col-xl-9),
.row:has(.col-xl-3) {
    flex-wrap: nowrap;
}
}


 
.offcanvas-end {
    width: 400px;
    max-width: 100vw;
}

.offcanvas-header {
    border-bottom: 1px solid var(--border);
    padding: .875rem 1.25rem;
}

.offcanvas-body {
    padding: 1rem 1.25rem;
    padding-bottom: 0;
    overflow-y: auto;
    max-height: calc(100vh - 230px);
}

.offcanvas-footer {
    position: sticky;
    bottom: 0;
    width: 100%;
    border-top: 1px solid var(--border);
    background: white;
    padding: .875rem 1.25rem 1rem;
}

/* Terméksor */
.cart-item {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding-bottom: .875rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: .875rem;
}

.cart-item-img-wrap {
    flex-shrink: 0;
}

.cart-item-img {
    width: 60px;
    height: 60px;
    object-fit: contain;
    border-radius: var(--radius);
    border: 1px solid var(--border);
}

.cart-item-info {
    flex: 1;
    font-size: 1rem;
    min-width: 0;
}

.cart-item-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .25rem;
}

.cart-item-name {
    font-weight: 500;
    color: var(--titlegrey);
    text-decoration: none;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cart-item-name:hover {
    color: var(--blue);
}

.cart-item-del {
    background: transparent;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    color: var(--midgray);
    padding: .15rem .4rem;
    cursor: pointer;
    font-size: .8rem;
    flex-shrink: 0;
    line-height: 1.5;
    transition: background .15s, color .15s, border-color .15s;
}

.cart-item-del:hover {
    background: #fff0f0;
    border-color: var(--red);
    color: var(--red);
}

.cart-item-sku {
    color: var(--midgray);
    font-size: .8rem;
    margin-bottom: .3rem;
}

.cart-item-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.cart-item-qty {
    color: var(--blue);
    font-size: 1rem;
}

.cart-item-discount {
    color: var(--greenhover);
    font-size: .75rem;
    font-weight: 600;
}

.cart-item-total {
    color: var(--titlegrey);
    font-size: .95rem;
    font-weight: 700;
    white-space: nowrap;
}

/* Összesítő — sorok vonallal */
.cart-summary {
    margin-bottom: .75rem;
}

.cart-summary-actions {
    display: flex !important; 
    flex-wrap: wrap !important; 
    gap: .75rem !important; 
    margin-top: .25rem !important;
}

.cart-summary-actions-button {
    flex: 1 1 160px !important; 
    margin-bottom: 0 !important;   
}

.cart-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .3rem 0;
    border-bottom: 1px solid var(--border);
    font-size: 1.1rem;
    color: var(--textgrey);
}

.cart-summary-row:last-child {
    border-bottom: none;
    padding-top: .5rem;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--titlegrey);
}

.cart-free-shipping {
    color: var(--greenhover);
    font-weight: 500;
}

.cart-limit-warning {
    color: var(--orange);
    font-size: .875rem;
    margin-bottom: .5rem;
}

/* Footer gombok */
.btn-checkout,
.btn-cart-edit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    font-weight: 600;
    border-radius: var(--radius);
    padding: .5rem 1rem;
    text-decoration: none;
    font-size: 1rem;
    transition: background .15s, color .15s, border-color .15s;
    width: 100%;
    box-sizing: border-box;
}

.btn-checkout {
    background-color: var(--green);
    border: 2px solid var(--green);
    color: white;
    margin-bottom: .5rem;
}

.btn-checkout:hover {
    background-color: var(--greenhover);
    border-color: var(--greenhover);
    color: white;
}

/* Csak a kosár oldal lábsorában lévő gomb — kék, "Tovább" felirattal */
.btn-checkout-cart {
    background-color: var(--blue) !important;
    border-color: var(--blue) !important;
    color: white !important;
}

.btn-checkout-cart i,
.btn-checkout-cart .fa,
.btn-checkout-cart .bi {
    color: white !important;
}

.btn-checkout-cart:hover {
    background-color: var(--nyablue) !important;
    border-color: var(--nyablue) !important;
    text-decoration: none !important;
}

.btn-cart-edit {
    background-color: transparent;
    border: 2px solid var(--blue);
    color: var(--blue);
}

.btn-cart-edit:hover {
    background-color: var(--blue);
    color: white;
}

@media (max-width: 480px) {
    .offcanvas-end { width: 100vw !important; }
}

/* ===================== Kosár oldal (cart.tpl) — div alapú sorok ===================== */

.cart-table-wrap {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
    margin-bottom: 1rem;
}

.cart-table {
    display: flex;
    flex-direction: column;
}

.cart-row {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem;
    border-bottom: 1px solid var(--border);
    font-size: 1.1rem;
}

.cart-row:last-child {
    border-bottom: none;
}

.cart-row-head {
    background-color: var(--lightgrey);
    color: var(--textgrey);
    font-weight: 600;
    font-size: 1rem;
    white-space: nowrap;
}

.cart-cell {
    display: flex;
    align-items: center;
    min-width: 0;
}

.cart-table-th-sub {
    display: block;
    font-weight: 400;
    font-size: .8rem;
    color: var(--midgray);
}

.cart-cell-img    { flex: 0 0 64px; }
.cart-cell-info   { flex: 1 1 auto; flex-direction: column; align-items: flex-start; min-width: 0; padding-right: .5rem; }
.cart-row-head .cart-cell-info { flex-direction: row; align-items: center; }
.cart-row-head .cart-cell-info-head { flex-direction: column; align-items: flex-start; line-height: 1.3; }
.cart-cell-qty    { flex: 0 0 130px; justify-content: center; }
.cart-cell-discount { flex: 0 0 80px; justify-content: flex-end; text-align: right; }
.cart-cell-price  { flex: 0 0 140px; justify-content: flex-end; text-align: right; }
.cart-cell-total  { flex: 0 0 140px; justify-content: flex-end; text-align: right; }
.cart-cell-del    { flex: 0 0 36px; justify-content: center; }

.cart-cell-price-head {
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.3;
}

.cart-cell-label {
    display: none;
}

.cart-table-img {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border: 1px solid var(--border);
    border-radius: var(--radius);
}

.cart-table-name {
    color: #23a1d1;
    font-weight: 500;
    text-decoration: none;
    display: block;
    margin-bottom: .2rem;
}

.cart-table-name:hover {
    color: #165ba8;
    text-decoration: underline;
}

.cart-table-meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.cart-table-sku {
    color: var(--midgray);
    font-size: .9rem;
}

.cart-table-stock {
    font-size: .85rem;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.cart-table-stock .stock-help {
    color: var(--midgray);
}

.cart-table-promo {
    color: var(--orange);
    font-size: .85rem;
    font-weight: 600;
    margin-top: .25rem;
}

.cart-table-option {
    color: var(--midgray);
    font-size: .85rem;
    margin-top: .25rem;
}

/* Mennyiség spinner — egységes input-group, csak a kosár táblázatban */
.cart-table-qty-wrap {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    flex-wrap: nowrap;
}

.cart-table-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    overflow: hidden;
}

.cart-table-qty form {
    display: contents;
}

.cart-table-qty .carteditbutton {
    background: transparent;
    border: none;
    color: var(--midgray);
    width: 2rem;
    height: 2rem;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    transition: background .15s, color .15s;
    /* FIX: az általános button szabály .6rem 1rem paddingje kinyomta a jelet a 32px-es dobozból */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0 4px; /* alsó 4px: a minus/plus glyph fontmetrika miatt ~2px-lel lejjebb ülne */
}

.cart-table-qty .carteditbutton:hover {
    background-color: var(--lightgrey);
    color: var(--blue);
}

.cart-table-qty .carteditbutton:disabled {
    opacity: .35;
    cursor: default;
}

.cart-table-qty input.carteditinput {
    width: 2.75rem;
    height: 2rem;
    text-align: center;
    border: none;
    border-left: 1px solid var(--border);
    border-right: 1px solid var(--border);
    font-size: 1rem;
    line-height: 21px;
    color: var(--titlegrey);
    padding: 0;
    min-width: 0;
}

.cart-table-unit {
    color: var(--midgray);
    font-size: .9rem;
}

.cart-table-discount {
    color: var(--greenhover);
    font-weight: 600;
}

.cart-cell-value {
    white-space: nowrap;
}

.cart-cell-total .cart-cell-value {
    color: var(--titlegrey);
}

.cart-table-netto {
    color: var(--midgray);
    font-size: .9rem;
    font-weight: 400;
    white-space: nowrap;
}

.cart-table-netto-label {
    display: none;
}

.cart-item-del {
    background: transparent;
    border: none;
    color: var(--midgray);
    cursor: pointer;
    font-size: 1.1rem;
    padding: .25rem;
    transition: color .15s;
}

.cart-item-del:hover {
    color: var(--red);
}

/* Lábsor: vásárlás folytatása + összesítő kártya */
.cart-page-footer {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-cart-continue {
    display: flex;
    align-items: center;
    gap: .4rem;
    border: 2px solid var(--border);
    color: var(--textgrey);
    border-radius: var(--radius);
    padding: .5rem 1rem;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 600;
    transition: background .15s, border-color .15s;
}

.btn-cart-continue:hover {
    background-color: var(--green);
    border-color: var(--green);
    color: #fff !important;
    text-decoration: none !important;
}

.cart-summary-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 1rem 1.25rem;
    min-width: 560px;
}

@media (max-width: 768px) {
    .cart-page-footer {
        flex-direction: column-reverse;
        align-items: stretch;
    }
    .cart-summary-card {
        min-width: 0;
    }
    .btn-cart-continue {
        justify-content: center;
    }

    /* Kosár sorok mobilon */
    .cart-row-head {
        display: none;
    }

    .cart-table-netto-label {
        display: inline;
    }

    .cart-row {
        position: relative;
        flex-wrap: wrap;
        padding: 1rem;
        border-bottom: 8px solid var(--lightgrey);
        font-size: 1rem;
    }

    .cart-row:last-child {
        border-bottom: none;
    }

    .cart-cell-img {
        flex: 0 0 64px;
        margin-right: .75rem;
    }

    .cart-cell-info {
        flex: 1 1 calc(100% - 64px - .75rem - 2.5rem);
        min-height: 64px;
        padding-right: 2rem;
    }

    .cart-cell-del {
        position: absolute;
        top: 1rem;
        right: 1rem;
        flex: 0 0 auto;
    }

    .cart-cell-qty,
    .cart-cell-discount,
    .cart-cell-price,
    .cart-cell-total {
        flex: 0 0 100%;
        justify-content: space-between;
        text-align: right;
        padding: .4rem 0;
    }

    .cart-cell-label {
        display: inline-block;
        font-weight: 600;
        font-size: .85rem;
        color: var(--textgrey);
        text-align: left;
    }

    .cart-table-netto {
        font-size: 1rem;
    }
}

.zindex-top {
    z-index: 20000;
}

.zindex-topmenu {
    z-index: 25000;
}

input.carteditinput {font-size: 17px; line-height: 21px; min-width: 32px;}

#webshoploginform .form-label { /* FIX: elírás volt: websjop → webshop */
    font-weight: bold;
}

/* Jelszó nélküli belépés blokk (login / checkout registration 2. lépés) */
.pwless-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 16px 0;
}
.pwless-divider::before,
.pwless-divider::after {
    content: "";
    flex: 1;
    border-top: 1px solid #dee2e6;
}
.pwless-divider span {
    font-size: .8rem;
    color: #8a8f94;
}
.pwless-text {
    font-size: .95rem;
    color: #212529;
    text-align: center;
    margin: 0 0 10px;
}
.pwless-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: .6rem 1rem;
    border: 2px solid var(--blue);
    border-radius: 6px;
    background: #fff;
    color: var(--blue);
    font-weight: 600;
    font-size: 1rem;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.pwless-btn:hover {
    background: #E7F1FF;
    color: #0a58ca;
    text-decoration: none;
}

.productlink-items .row.no-gap > .col-2-3 {
    flex: 0 0 60%;
    max-width: 60%;
    width: 60%;
}

.productlink-items .row.no-gap > .col-1-3 {
    flex: 0 0 40%;
    max-width: 40%;
    width: 40%;
}

.product-cart .price-block {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 1.5rem 0;
    font-size: 0.875rem;
    line-height: 1.4;
    text-align: left;
}

.product-cart .price-block .shipping-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #2d8a11;
    font-size: 1rem;
    font-weight: 700;
}

.product-cart .price-block .shipping-row svg.icon-truck {
    width: 1.5rem;
    height: 1.5rem;
    color: #2d8a11;
    fill: currentColor;
    flex-shrink: 0;
    line-height: 1;
}

.product-cart .price-block .shipping-row .icon-truck {
    width: 1.5rem;
    height: 1.5rem;
    color: #2d8a11;
    flex-shrink: 0;
    line-height: 1;
}

.product-cart .price-block .shipping-row img {
    width: 1.5rem;
    height: auto;
    flex-shrink: 0;
}

.stock-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem 0.875rem;
    font-size: 0.8125rem;
    margin-bottom: 0.125rem;
}

.stock-status {
    display: inline-flex;
    align-items: center;
    gap: 0.3125rem;
    white-space: nowrap;
    font-weight: 500;
}

.stock-status.in-stock {
    color: #3fb618;
}
.stock-status.in-stock .icon-check {
    color: #3fb618;
    font-weight: 700;
    font-size: 0.9375rem;
}

.stock-status.delay,
.stock-status.soon {
    color: #6bb1ff;
}
.stock-status.delay .icon-check,
.stock-status.soon .fa {
    color: #2780e3;
    font-weight: 700;
    font-size: 0.9375rem;
}

.stock-status.preorder,
.stock-status.order {
    color: #ff8100;
}
.stock-status.preorder .icon-check,
.stock-status.order .fa {
    color: #ff8100;
    font-weight: 700;
    font-size: 0.9375rem;
}

.stock-help {
    color: #2780e3;
    font-size: 0.8125rem;
    cursor: help;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    text-decoration: underline dotted;
    text-underline-offset: 0.125rem;
}

.info-i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    background: #2780e3;
    color: white;
    border-radius: 50%;
    font-family: Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 700;
    font-size: 0.6875rem;
    line-height: 1;
    flex-shrink: 0;
    vertical-align: middle;
}
.product-cart .price-block .price-row {
    padding: 0.5rem 0.875rem;
    display: block;
    text-align: left;
}

.product-cart .price-block .price-row * {
    text-align: left;
}

.product-cart .price-block .price-row .price-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.01875rem;
    font-weight: 500;
    margin-bottom: 0.1875rem;
    display: block;
}

.product-cart .price-block .price-row .price-main {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    flex-wrap: wrap;
    margin-bottom: 0.1875rem;
}

.product-cart .price-block .price-row .price-amount {
    font-weight: 600;
    line-height: 1.1;
    white-space: nowrap;
}

.product-cart .price-block .price-row .price-unit {
    font-size: 0.8125rem;
    font-weight: 500;
}

.product-cart .price-block .price-row .price-gross {
    font-size: 0.875rem;
    font-weight: 500;
    display: block;
}

.product-cart .price-block .price-row.price-base {
    border-left: 0.1875rem solid #D3D1C7;
}
.product-cart .price-block .price-row.price-base .price-label {
    color: #9DA1A7;
}
.product-cart .price-block .price-row.price-base .price-amount {
    font-size: 1rem;
    color: #51585e;
}
.product-cart .price-block .price-row.price-base .price-unit {
    color: #51585e;
}
.product-cart .price-block .price-row.price-base .price-gross {
    color: #51585e;
}

.product-cart .price-block .price-row.price-mid {
    border-left: 0.1875rem solid #9cc5f2;
}
.product-cart .price-block .price-row.price-mid .price-label {
    color: #2780e3;
}
.product-cart .price-block .price-row.price-mid .price-amount {
    font-size: 1.1875rem;
    color: #1a6ecc;
}
.product-cart .price-block .price-row.price-mid .price-unit {
    color: #1a6ecc;
}
.product-cart .price-block .price-row.price-mid .price-gross {
    color: #1a6ecc;
}

.product-cart .price-block .price-row.price-best {
    background: #EAF3DE;
    border-radius: 0.25rem;
    padding: 0.75rem 0.875rem;
    position: relative;
}
.product-cart .price-block .price-row.price-best .price-label {
    color: #1f6008;
    padding-right: 3.125rem;
}
.product-cart .price-block .price-row.price-best .price-amount {
    font-size: 1.625rem;
    color: #1f6008;
}
.product-cart .price-block .price-row.price-best .price-unit {
    color: #1f6008;
    font-weight: 500;
}
.product-cart .price-block .price-row.price-best .price-gross {
    color: #1f6008;
}

.product-cart .price-block .price-row.price-best .discount-badge {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    background: #A32D2D;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.1875rem 0.5rem;
    border-radius: 0.1875rem;
    letter-spacing: 0.0125rem;
}


.product-cart .price-block .quantity-discount-note {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    margin-top: 0.25rem;
    background: #f0f7ff;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    color: #1a6ecc;
    line-height: 1.45;
}

.product-cart .price-block .quantity-discount-note .info-i {
    margin-top: 0.0625rem;
    flex-shrink: 0;
}
.product-cart .price-block .cta-row {
    display: flex;
    gap: 0.375rem;
    align-items: stretch;
    margin-top: 0.375rem;
    border-top: 0.0625rem solid #e5e5e5;
    padding-top: 1rem;
}

.product-cart .price-block .qty-group {
    display: inline-flex;
    align-items: stretch;
}

.product-cart .price-block .qty-group .qty-btn,
.product-cart .price-block .qty-group .qty-input {
    box-sizing: border-box;
    height: 2.625rem;
    border: 0.0625rem solid #e5e5e5;
    margin: 0;
    padding: 0;
    font-size: 0.9375rem;
    line-height: 1;
    vertical-align: middle;
    -webkit-appearance: none;
    -moz-appearance: textfield;
    appearance: none;
}

.product-cart .price-block .qty-group .qty-btn {
    width: 2.25rem;
    background: #f8f9fa;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #51585e;
    font-size: 1.125rem;
}

.product-cart .price-block .qty-group .qty-btn:first-child {
    border-radius: 0.25rem 0 0 0.25rem;
}
.product-cart .price-block .qty-group .qty-btn:last-child {
    border-radius: 0 0.25rem 0.25rem 0;
}

.product-cart .price-block .qty-group .qty-input {
    width: 2.75rem;
    text-align: center;
    border-left: none;
    border-right: none;
    border-radius: 0;
    background: white;
    font-weight: 500;
    display: block;
}

.product-cart .price-block .qty-group .qty-input::-webkit-outer-spin-button,
.product-cart .price-block .qty-group .qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.product-cart .price-block .qty-group .qty-btn:hover {
    background: white;
}

.product-cart .price-block .cta-button {
    flex: 1;
    background: #3fb618;
    color: white;
    border: none;
    border-radius: 0.25rem;
    padding: 0 1.125rem;
    font-size: 1.0625rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    transition: background 0.15s ease-in-out;
    min-height: 2.625rem;
    line-height: 1;
}

.product-cart .price-block .cta-button:hover {
    background: #2d8a11;
}

.product-cart .price-block .cta-button svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: white;
    flex-shrink: 0;
}

.product-cart .price-block .cta-button i.fa,
.product-cart .price-block .cta-button i[class*="fa-"] {
    font-size: 1.25rem !important;
    line-height: 1;
    width: auto;
    height: auto;
    color: white !important;
    font-weight: 900 !important;
    display: inline-block;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: auto;
}

.product-cart .price-block .cta-button.btn-warning,
.product-cart .price-block .cta-button[disabled] {
    background: #ff7518;
    cursor: not-allowed;
    opacity: 0.85;
}

.product-cart .price-block .cta-button.btn-warning:hover {
    background: #d85c00;
}

.product-box .product-detail-link-wrap {
    margin-top: 0.5rem;
    width: 100%;
}

.product-box .product-detail-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 2.625rem;
    border: 0.0625rem solid #2780e3;
    border-radius: 0.375rem;
    background: transparent;
    color: #2780e3;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    box-sizing: border-box;
    transition: background 0.15s ease-in-out;
}

.product-box .product-detail-link:hover {
    background: #e6f1fb;
    color: #2780e3;
    text-decoration: none;
}

@media (max-width: 48rem) {
    .productlink-items .row.no-gap > .col-2-3,
    .productlink-items .row.no-gap > .col-1-3 {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
    }
    
    .product-cart .price-block .price-row.price-best .price-amount {
        font-size: 1.375rem;
    }
    
    .product-cart .price-block .price-row.price-mid .price-amount {
        font-size: 1.0625rem;
    }
}

.product-box .product-info dl {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: 0;
    margin: 0;
}

.product-box .product-info dt {
    font-weight: 400;
    color: #6c757d;
    padding: 0.25rem 0.5rem 0.25rem 0;
    border-bottom: 0.5px solid #f0f0f0;
    font-size: 0.875rem;
}

.product-box .product-info dd {
    font-weight: 500;
    color: #212529;
    margin: 0;
    padding: 0.25rem 0;
    border-bottom: 0.5px solid #f0f0f0;
    font-size: 0.875rem;
}

.product-box .product-info dt:last-of-type,
.product-box .product-info dd:last-child {
    border-bottom: none;
}

.cta-row {
    flex-wrap: wrap;
}

.cta-button {
    min-width: 0;
    flex: 1 1 auto;
}

.qty-group {
    flex-shrink: 0;
}

.button-outline-green:hover {
    background-color: var(--green);
    color: white;
    border-color: var(--green);
}

#page-head.product-page-head > .row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}

#page-head.product-page-head .col-2-5,
#page-head.product-page-head .col-3-5 {
    width: 100%;
    max-width: 100%;
    flex: none;
}

#page-head.product-page-head .col-3-5 {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.product-page-cart {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.col-1-1 {
    width: 100%;
    max-width: 100%;
    flex: none;
}

#page-head.product-page-head > .row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}

#page-head.product-page-head .col-2-5,
#page-head.product-page-head .col-3-5 {
    width: 100%;
    max-width: 100%;
    flex: none;
}

/* Meta pill-ek */
.product-meta-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.product-meta-pills li {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: #fff9f0;
	border: 0.5px solid #f0d9b5;
    border-radius: 1.25rem;
    padding: 0.3125rem 0.875rem;
    font-size: 0.875rem;
    color: #212529;
    font-weight: 500;
}

.product-meta-pills li span {
    color: #6c757d;
    font-weight: 400;
}

.product-page-cart {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin-top: 0.5rem;
}

.col-1-1 {
    width: 100%;
    max-width: 100%;
    flex: none;
}

.col-1-1 {
    width: 100%;
    max-width: 100%;
    flex: none;
}

@media (max-width: 768px) {
    #page-head.product-page-head > .row {
        grid-template-columns: 1fr;
    }
    #page-head.product-page-head .col-2-5 {
        order: 1;
    }
    #page-head.product-page-head .col-3-5 {
        order: 2;
    }
}

.product-page-cart .shipping-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #2d8a11;
    font-size: 1rem;
    font-weight: 700;
}

.product-page-cart .shipping-row svg.icon-truck {
    width: 1.5rem;
    height: 1.5rem;
    color: #2d8a11;
    fill: currentColor;
    flex-shrink: 0;
    line-height: 1;
}

.product-page-cart .shipping-row .icon-truck {
    width: 1.5rem;
    height: 1.5rem;
    color: #2d8a11;
    flex-shrink: 0;
    line-height: 1;
}

.product-page-cart .shipping-row img {
    width: 1.5rem;
    height: auto;
    flex-shrink: 0;
}
.info-i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    background: #2780e3;
    color: white;
    border-radius: 50%;
    font-family: Georgia, 'Times New Roman', serif;
    font-style: italic;
    font-weight: 700;
    font-size: 0.6875rem;
    line-height: 1;
    flex-shrink: 0;
    vertical-align: middle;
}

.product-page-cart .price-row {
    padding: 0.5rem 0.875rem;
    display: block;
    text-align: left;
}

.product-page-cart .price-row * {
    text-align: left;
}

.product-page-cart .price-row .price-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.01875rem;
    font-weight: 500;
    margin-bottom: 0.1875rem;
    display: block;
}

.product-page-cart .price-row .price-main {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    flex-wrap: wrap;
    margin-bottom: 0.1875rem;
}

.product-page-cart .price-row .price-amount {
    font-weight: 600;
    line-height: 1.1;
    white-space: nowrap;
}

.product-page-cart .price-row .price-unit {
    font-size: 0.8125rem;
    font-weight: 500;
}

.product-page-cart .price-row .price-gross {
    font-size: 0.875rem;
    font-weight: 500;
    display: block;
}

.product-page-cart .price-row.price-base {
    border-left: 0.1875rem solid #D3D1C7;
}
.product-page-cart .price-row.price-base .price-label {
    color: #9DA1A7;
}
.product-page-cart .price-row.price-base .price-amount {
    font-size: 1rem;
    color: #51585e;
}
.product-page-cart .price-row.price-base .price-unit {
    color: #51585e;
}
.product-page-cart .price-row.price-base .price-gross {
    color: #51585e;
}

.product-page-cart .price-row.price-mid {
    border-left: 0.1875rem solid #9cc5f2;
}
.product-page-cart .price-row.price-mid .price-label {
    color: #2780e3;
}
.product-page-cart .price-row.price-mid .price-amount {
    font-size: 1.1875rem;
    color: #1a6ecc;
}
.product-page-cart .price-row.price-mid .price-unit {
    color: #1a6ecc;
}
.product-page-cart .price-row.price-mid .price-gross {
    color: #1a6ecc;
}


/* =====================================================
   8. ÁR SOROK - Legjobb ár 3 db-tól (zöld háttér + badge)
   ===================================================== */

.product-page-cart .price-row.price-best {
    background: #EAF3DE;
    border-radius: 0.25rem;
    padding: 0.75rem 0.875rem;
    position: relative;
}
.product-page-cart .price-row.price-best .price-label {
    color: #1f6008;
    padding-right: 3.125rem;
}
.product-page-cart .price-row.price-best .price-amount {
    font-size: 1.625rem;
    color: #1f6008;
}
.product-page-cart .price-row.price-best .price-unit {
    color: #1f6008;
    font-weight: 500;
}
.product-page-cart .price-row.price-best .price-gross {
    color: #1f6008;
}

/* Discount badge - piros -X% (jobb felső sarok) */
.product-page-cart .price-row.price-best .discount-badge {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    background: #A32D2D;
    color: white;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.1875rem 0.5rem;
    border-radius: 0.1875rem;
    letter-spacing: 0.0125rem;
}


/* =====================================================
   9. MENNYISÉGI KEDVEZMÉNY MAGYARÁZAT — HALVÁNY KÉK HÁTTÉR
   ===================================================== */

.product-page-cart .quantity-discount-note {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    /* REDESIGN 2026.05.26. — kiemelőbb stílus: sötétebb háttér, border, nagyobb betű */
    padding: 0.625rem 0.875rem;
    margin-top: 0.25rem;
    margin-bottom: 0;
    background: #dceeff;
    border: 1px solid #a8d0f5;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #1256a0;
    line-height: 1.45;
}

.product-page-cart .quantity-discount-note .info-i {
    margin-top: 0.0625rem;
    flex-shrink: 0;
}

.product-page-cart .qty-group {
    display: inline-flex;
    align-items: stretch;
}

.product-page-cart .qty-group .qty-btn,
.product-page-cart .qty-group .qty-input {
    box-sizing: border-box;
    height: 2.625rem;
    border: 0.0625rem solid #e5e5e5;
    margin: 0;
    padding: 0;
    font-size: 0.9375rem;
    line-height: 1;
    vertical-align: middle;
    -webkit-appearance: none;
    -moz-appearance: textfield;
    appearance: none;
}

.product-page-cart .qty-group .qty-btn {
    width: 2.25rem;
    background: #f8f9fa;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #51585e;
    font-size: 1.125rem;
}

.product-page-cart .qty-group .qty-btn:first-child {
    border-radius: 0.25rem 0 0 0.25rem;
}
.product-page-cart .qty-group .qty-btn:last-child {
    border-radius: 0 0.25rem 0.25rem 0;
}

#page-head .product-page-cart .cta-button.btn.btn-primary {
    background-color: #3fb618 !important;
    border-color: #3fb618 !important;
    color: white !important;
    white-space: nowrap !important;
    min-height: 2.625rem !important;
    font-size: 1.0625rem !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    line-height: 1 !important;
    flex: 1 !important;
    min-width: 0 !important;
}

#page-head .product-page-cart .cta-button.btn.btn-primary:hover {
    background-color: #2d8a11 !important;
    border-color: #2d8a11 !important;
}

#page-head .product-page-cart .cta-row {
    width: 100% !important;
    margin-top: 0.5rem !important;
    padding-top: 0.75rem !important;
    border-top: 0.0625rem solid #e5e5e5 !important;
    display: flex !important;
    gap: 0.375rem !important;
    align-items: center !important;
}

#page-head .product-page-cart form {
    width: 100% !important;
}

#page-head .product-page-cart .qty-group .qty-input {
    width: 4rem !important;
}

#page-head .product-page-cart .qty-group {
    flex-shrink: 0 !important;
}

.ul-list.list-group .list-group-item {
    border: none;
    border-bottom: 0.5px solid #f0f0f0;
    padding: 0.5rem 0;
    background: transparent;
}

.ul-list.list-group .list-group-item a {
    color: #212529;
    text-decoration: none;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ul-list.list-group .list-group-item a:hover {
    color: #2780e3;
}

.icon-eredeti {
    color: #2780e3;
    font-size: 1rem;
    width: 1rem;
    text-align: center;
}

.icon-utangyartott {
    color: #3fb618;
    font-size: 1rem;
    width: 1rem;
    text-align: center;
}

.icon-check-green {
    color: #3fb618;
    font-size: 1rem;
    width: 1rem;
    text-align: center;
}

/* =====================================================
   FŐOLDAL GRID KÁRTYA ÁRBLOKK (.card-product-grid)
   ===================================================== */

.card-product-grid .price-block {
    padding: 0;
    margin-top: 0.75rem;
}

.card-product-grid .stock-row {
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.375rem 0.75rem;
}

.card-product-grid .price-row {
    padding: 0.3rem 0.5rem;
    display: block;
    border-radius: 4px;
    margin-bottom: 0.2rem;
}

.card-product-grid .price-row.price-base {
    border-left: 0.1875rem solid #D3D1C7;
    background: transparent;
    padding-left: 0.5rem;
    padding-right: 0;
    margin-bottom: 0.2rem;
}
.card-product-grid .price-row.price-base .price-label { font-size: 0.7rem; color: #9DA1A7; display: block; margin-bottom: 1px; }
.card-product-grid .price-row.price-base .price-amount { font-size: 1.05rem; font-weight: 700; color: #51585e; }
.card-product-grid .price-row.price-base .price-unit { font-size: 0.72rem; color: #51585e; }
.card-product-grid .price-row.price-base .price-gross { font-size: 0.7rem; color: #51585e; display: block; }

.card-product-grid .price-row.price-mid {
    border-left: 0.1875rem solid #9cc5f2;
    background: transparent;
    padding-left: 0.5rem;
    margin-bottom: 0.2rem;
}
.card-product-grid .price-row.price-mid .price-label { font-size: 0.7rem; color: #2780e3; display: block; margin-bottom: 1px; }
.card-product-grid .price-row.price-mid .price-amount { font-size: 1.05rem; font-weight: 700; color: #1a6ecc; }
.card-product-grid .price-row.price-mid .price-unit { font-size: 0.72rem; color: #1a6ecc; }
.card-product-grid .price-row.price-mid .price-gross { font-size: 0.7rem; color: #1a6ecc; display: block; }

.card-product-grid .price-row.price-best {
    background: #EAF3DE;
    border-radius: 0.25rem;
    padding: 0.375rem 0.5rem;
    position: relative;
}
.card-product-grid .price-row.price-best .price-label { font-size: 0.7rem; color: #1f6008; display: block; margin-bottom: 1px; padding-right: 2.5rem; }
.card-product-grid .price-row.price-best .price-amount { font-size: 1.05rem; font-weight: 700; color: #1f6008; }
.card-product-grid .price-row.price-best .price-unit { font-size: 0.72rem; color: #1f6008; }
.card-product-grid .price-row.price-best .price-gross { font-size: 0.7rem; color: #1f6008; display: block; }

.card-product-grid .price-row .price-main {
    display: flex;
    align-items: baseline;
    gap: 2px;
}

.card-product-grid .price-row.price-best .discount-badge {
    position: absolute;
    top: 0.3rem;
    right: 0.3rem;
    background: #A32D2D;
    color: white;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
}

/* Kosárba gomb — zöld, ugyanaz mint .product-cart-ban */
.card-product-grid .add-to-cart {
    flex-direction: column;
    gap: 0.75rem;
}

.card-product-grid .add-to-cart .cta-button {
    width: 100%;
    justify-content: center;
    background: #3fb618;
    color: white;
    border: none;
    border-radius: 0.25rem;
    padding: 0.5rem 1rem;
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.15s ease-in-out;
    min-height: 2.4rem;
}

.card-product-grid .add-to-cart .cta-button:hover {
    background: #2d8a11;
}

.card-product-grid .add-to-cart .cta-button svg {
    fill: white;
    flex-shrink: 0;
}

/* stock-help link a grid kártyában */
.card-product-grid .stock-help {
    color: #2780e3;
    font-size: 0.75rem;
    cursor: help;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    text-decoration: underline dotted;
    text-underline-offset: 0.1rem;
}

/* shipping-row a grid kártyában */
.card-product-grid .price-block .shipping-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #2d8a11;
    font-size: 0.8125rem;
    font-weight: 700;
    margin-bottom: 0.375rem;
}

.card-product-grid .price-block .shipping-row svg.icon-truck {
    width: 1.125rem;
    height: 1.125rem;
    color: #2d8a11;
    fill: currentColor;
    flex-shrink: 0;
}

/* quantity-discount-note a grid kártyában */
.card-product-grid .price-block .quantity-discount-note {
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
    padding: 0.4rem 0.5rem;
    margin-top: 0.25rem;
    background: #f0f7ff;
    border-radius: 0.25rem;
    font-size: 0.7rem;
    color: #1a6ecc;
    line-height: 1.4;
}

.card-product-grid .price-block .quantity-discount-note .info-i {
    margin-top: 0.0625rem;
    flex-shrink: 0;
}

/* =====================================================
   NAV JAVÍTÁS — webaruhaz2.css végéhez kell hozzáfűzni
   ===================================================== */

/* Főmenü link — ikon és szöveg egy sorban, megfelelő köz */
#main-menu > ul > li > a {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

#main-menu > ul > li > a .nav-icon {
    flex-shrink: 0;
    font-size: 14px;
    line-height: 1;
}

/* Első nav link bal paddingja igazítva a topbar Vásárlás linkhez (1rem) */
#main-menu > ul > li:first-child > a {
    padding-left: 1rem;
}

/* Mobilon visszaáll, ikonok elrejtése */
@media screen and (max-width: 768px) {
    #main-menu > ul > li:first-child > a {
        padding-left: 1.5rem;
    }
    #main-menu > ul > li > a .nav-icon {
        display: none;
    }
}

/* Logó alatti USP sor */
.logo-usp {
    display: flex;
    gap: 12px;
    margin-top: 3px;
    font-size: 11px;
    font-weight: 600;
    color: var(--green);
}

.logo-usp span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

/* Mobilon elrejtés */
@media screen and (max-width: 768px) {
    .logo-usp {
        display: none;
    }
}

/* Kosár és Pénztár hover javítás —
   a .button-outline:hover kék hátteret ad mindkettőre, ezt felülírjuk */
.cart:hover {
    background-color: transparent !important;
    border-color: var(--greenhover) !important;
    color: var(--greenhover) !important;
}

.checkout:hover {
    background-color: transparent !important;
    border-color: var(--magentahover) !important;
    color: var(--magentahover) !important;
}

/* =====================================================
   NAV JAVÍTÁS — webaruhaz2.css végéhez kell hozzáfűzni
   ===================================================== */

/* Főmenü link — ikon és szöveg egy sorban */
#main-menu > ul > li > a {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

#main-menu > ul > li > a .nav-icon {
    flex-shrink: 0;
    font-size: 14px;
    line-height: 1;
}

/* Első nav link bal paddingja igazítva a topbar linkhez */
#main-menu > ul > li:first-child > a {
    padding-left: 1rem;
}

/* Logó alatti USP sor */
.logo-usp {
    display: flex;
    gap: 12px;
    margin-top: 3px;
    font-size: 11px;
    font-weight: 600;
    color: #3fb618;
}

.logo-usp span {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

/* Mobilon */
@media screen and (max-width: 768px) {
    #main-menu > ul > li:first-child > a {
        padding-left: 1.5rem;
    }
    #main-menu > ul > li > a .nav-icon {
        display: none;
    }
    .logo-usp {
        display: none;
    }
}

/* Bootstrap Icons a kosár/pénztár/kereső/fiókom gombokon */
.cart .bi,
.checkout .bi,
.search-group .bi,
.account .bi {
    font-size: 1rem;
    line-height: 1;
    flex-shrink: 0;
}

/* Kosár összeg ne legyen félkövér */
#cart-total-currency b,
#cart-total-currency strong {
    font-weight: 400;
}

/* Bootstrap Icons igazítás a gombokon */
.button .bi {
    display: inline-flex;
    align-items: center;
    font-size: 1rem;
    line-height: 1;
    margin-right: .4rem;
    vertical-align: middle;
    flex-shrink: 0;
}

/* Gomb legyen flex hogy ikon+szöveg egy sorban legyen */
.button.cart,
.button.checkout,
.button.account {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

/* Gomb .bi ne kapjon margin-right ha gap van */
.button.cart .bi,
.button.checkout .bi,
.button.account .bi {
    margin-right: 0;
}

/* Kosár és Pénztár — egyforma magasság mint a kereső, 2px border, inverz hover */
.button.cart {
    border-width: 2px !important;
    padding: .5rem 1rem !important;
    border-color: var(--green);
    color: var(--green);
    background-color: transparent;
    transition: background-color .15s, color .15s, border-color .15s;
}

.button.cart:hover {
    background-color: var(--green) !important;
    border-color: var(--green) !important;
    color: white !important;
}

.button.cart:hover .bi {
    color: white;
}

.button.checkout {
    border-width: 2px !important;
    padding: .5rem 1rem !important;
    border-color: var(--magenta);
    color: var(--magenta);
    background-color: transparent;
    transition: background-color .15s, color .15s, border-color .15s;
}

.button.checkout:hover {
    background-color: var(--magenta) !important;
    border-color: var(--magenta) !important;
    color: white !important;
}

.button.checkout:hover .bi {
    color: white;
}

/* =====================================================
   NYOMTATÓ KERESŐ ACCORDION (#firstprinters)
   ===================================================== */

#firstprinters {
    margin: 0 0 1rem 0 !important; /* felülírja a Bootstrap m-3-at */
}

#firstprinters .accordion-item {
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    box-shadow: none !important;
    overflow: hidden;
}

#firstprinters .accordion-button {
    background: white !important;
    color: var(--titlegrey) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    padding: .875rem 1.25rem !important;
}

#firstprinters .accordion-button:not(.collapsed) {
    background: white !important;
    color: var(--titlegrey) !important;
    box-shadow: none !important;
    border-bottom: 1px solid var(--border);
}

#firstprinters .accordion-button::after {
    display: none !important;
}

#firstprinters .accordion-button .fa-printer {
    color: var(--blue);
    margin-right: 8px;
}

#firstprinters .badge.bg-green {
    background: var(--blue) !important;
    color: white !important;
    font-size: 0.8rem;
    padding: 4px 10px;
    border-radius: 20px;
    margin-right: 8px;
}

#firstprinters .accordion-body {
    padding: .75rem 1.25rem !important;
}

#firstprinters .accordion-body .col-xs-12,
#firstprinters .accordion-body .col-sm-6,
#firstprinters .accordion-body .col-md-4 {
    padding: 0 !important;
    font-size: 1rem !important;
}

#firstprinters .accordion-body a,
#firstprinters .accordion-body a.color-green {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    padding: 0.2rem 0.5rem;
    color: var(--titlegrey) !important;
    text-decoration: none;
    border-radius: var(--radius);
    font-size: 1rem !important;
    transition: background .15s, color .15s;
}

#firstprinters .accordion-body a i,
#firstprinters .accordion-body a.color-green i {
    color: var(--blue) !important;
    font-size: 0.9rem;
}

#firstprinters .accordion-body a:hover,
#firstprinters .accordion-body a.color-green:hover {
    background: var(--babyblue) !important;
    color: var(--blue) !important;
}

/* Termék lista container padding fix — keresési oldal */
.padding-y.bg-light > .container {
    padding-left: 0;
    padding-right: 0;
}

/* Ha van termék a kosárban: a gombok alapból kitöltöttek,
   hoverre visszaváltanak a sima kontúros állapotra (inverz logika).
   A fájl legvégén kell lennie, hogy a fenti .button.cart/.checkout
   szabályokat is felülírja. */
.button.cart.has-items {
    background-color: var(--green) !important;
    border-color: var(--green) !important;
    color: white !important;
}

.button.cart.has-items .bi {
    color: white !important;
}

.button.cart.has-items:hover {
    background-color: transparent !important;
    border-color: var(--green) !important;
    color: var(--green) !important;
}

.button.cart.has-items:hover .bi {
    color: var(--green) !important;
}

.button.checkout.has-items {
    background-color: var(--magenta) !important;
    border-color: var(--magenta) !important;
    color: white !important;
}

.button.checkout.has-items .bi {
    color: white !important;
}

.button.checkout.has-items:hover {
    background-color: transparent !important;
    border-color: var(--magenta) !important;
    color: var(--magenta) !important;
}

.button.checkout.has-items:hover .bi {
    color: var(--magenta) !important;
}

/* Szűrő toggle — megfordított logika */
#aside-filter .form-check-input:disabled {
    opacity: 1 !important;
}

#aside-filter .form-check-input:checked {
    background-color: #adb5bd !important;
    border-color: #adb5bd !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
    background-position: left center !important;
}

#aside-filter .form-check-input:not(:checked) {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
    background-position: right center !important;
}

#aside-filter .filter-body:has(.product-color-filter) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 20px 1.5rem;
}

#aside-filter .filter-body:has(.product-color-filter) .checkbox-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    line-height: 1;
}

h2.product-filter-type {
    scroll-margin-top: 120px;
}

@media (max-width: 768px) {
    h2.product-filter-type {
        scroll-margin-top: 235px;
    }
}

@media (max-width: 768px) {
    #page-head .button-outline-green,
    #page-head .button-outline-blue {
        margin-bottom: 0.5rem;
    }
}

@keyframes inkBounce {
    0%, 100% { transform: translateY(0); opacity: 0.4; }
    50% { transform: translateY(-10px); opacity: 1; }
}

.ink-drop-wrap {
    display: inline-block;
    animation: inkBounce 1.2s ease-in-out infinite;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] {
    -moz-appearance: textfield;
}

/* ===== Fiók áttekintés (account) kártyás elrendezés ===== */
.acc-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1rem;
}
.acc-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--border);
    padding-bottom: 10px;
    margin-bottom: 14px;
}
.acc-card-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
}
.acc-card-title i {
    color: #9da1a7;
}
.acc-card-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.acc-card-actions .button {
    padding: .35rem .85rem;
    font-size: .9rem;
}
.acc-name {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
}
.acc-email {
    margin: 2px 0 0;
    color: #6c757d;
}
.acc-meta {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
    border-top: 1px solid var(--border);
    margin-top: 14px;
    padding-top: 12px;
}
.acc-meta-item span {
    display: block;
    color: #6c757d;
    font-size: .85rem;
}
.acc-address-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}
.acc-address { margin-bottom: 0; }
.acc-address-value { margin: 0; }
.acc-shipping-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}
.acc-shipping-item {
    position: relative;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px 14px;
}
.acc-shipping-item .acc-delete-form {
    position: absolute;
    top: 10px;
    right: 10px;
    margin: 0;
}
.acc-shipping-item .acc-default-form {
    position: absolute;
    top: 10px;
    right: 50px;
    margin: 0;
}

.acc-shipping-name {
    margin: 0 0 6px;
    padding-right: 5.5rem;
}
.acc-shipping-item p {
    display: flex;
    gap: 8px;
    align-items: baseline;
    margin: 0 0 4px;
}
.acc-shipping-item p i {
    color: #9da1a7;
    width: 16px;
    text-align: center;
}

.acc-address-name {
    margin: 0 0 4px;
    font-weight: 600;
}
.acc-address-meta {
    margin: 6px 0 0;
    color: #6c757d;
}

/* Checkout lépésváltó gombok mobilon: egymás alatt, teljes szélességben */
@media (max-width: 576px) {
    main .btn.btn-lg {
        float: none !important;
        display: block;
        width: 100%;
        margin: .5rem 0 0;
    }
}

/* FIX: a checkout kártya (card-body zindex-topmenu) a sticky fejléc fölé emelkedett,
   görgetésnél a tartalom a fejléc ELŐTT úszott - visszaállítjuk normál rétegre */
.card-body.zindex-topmenu {
    z-index: auto;
}

/* Szállítási/fizetési mód dobozok: az árcímke float-ja kilógott a keretből mobilon */
@media (max-width: 576px) {
    .box-check .form-check-label small.float-end {
        float: none !important;
        display: block;
        text-align: right;
        margin-top: 2px;
    }
}

/* GLS térképes választó gomb a csomagpont keresőnél */
.gls-map-btn {
    width: 100%;
    justify-content: center;
    gap: 8px;
    margin-bottom: 1rem;
}

/* FIX: outline gombok natív <button>-ként szürke UA-hátteret kaptak - fehér alap, a hover (kék/zöld) marad */
.button-outline,
.button-outline-blue,
.button-outline-green {
    background-color: #fff;
}

/* ===== GLS csomagpont: saját kereső ===== */
/* A natív select vizuálisan rejtve, de a required validációhoz fókuszálható marad */
select.gls-native-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
}
.gls-search-wrap {
    position: relative;
}
.gls-search-wrap .form-control {
    height: 44px;
    padding-right: 56px;
}
.gls-search-icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 44px;
    height: 44px;
    background: var(--blue);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 6px 6px 0;
    pointer-events: none;
}
#gls-search-results {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 50;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 0 0 6px 6px;
    max-height: 280px;
    overflow-y: auto;
    box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.gls-search-item {
    padding: 10px 12px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
}
.gls-search-item:hover {
    background: #E7F1FF;
}

.gls-search-item .gls-item-name {
    display: block;
    font-weight: 600;
}
.gls-search-item .gls-item-addr {
    display: block;
    color: #6c757d;
    font-size: .9rem;
}

/* Fiók: számla/rendelés táblázatok utolsó (letöltés ikonos) oszlopa ne csússzon ki */
.table-stack td:last-child,
.table-stack th:last-child {
    white-space: nowrap;
    min-width: 56px;
    text-align: center;
}

/* btn-light (Vissza gombok): a bootstrap szürke-fekete hover helyett site-kék hover */
main .btn-light {
    background-color: #fff;
    border-color: #ced4da;
}
main .btn-light:hover,
main .btn-light:focus {
    background-color: var(--babyblue);
    border-color: var(--blue);
    color: var(--blue);
}

/* ===== Checkout 4: elfogadó blokk ===== */
/* "Tudomásul veszem" sáv: meleg pasztell a termékoldali pillek színeivel, nem hiba-narancs */
#checkout-alert-warning {
    background: #fff9f0;
    border: 1px solid #f0d9b5;
    color: #212529;
}
#checkout-alert-warning .fa-exclamation-circle {
    color: var(--orange);
}
/* A checkboxok alaphelyzetben semlegesek (az is-invalid piros helyett), pipálva zöldek */
#order-confirm-form .form-check-input {
    width: 1.2em;
    height: 1.2em;
    margin-top: .15em;
}
#order-confirm-form .form-check-input.is-invalid {
    border-color: #ced4da;
}
#order-confirm-form .form-check-input.is-invalid ~ .form-check-label {
    color: #212529;
}
#order-confirm-form .form-check-input:checked {
    background-color: var(--greenhover);
    border-color: var(--greenhover);
}
#order-confirm-form .form-check-input:checked ~ .form-check-label,
#order-confirm-form .form-check-input.is-valid ~ .form-check-label {
    color: rgb(0, 165, 36);
}
/* Dokumentum-megnyitó link a checkbox sor végén */
.consent-open {
    margin-left: .5rem;
    font-size: .9rem;
    white-space: nowrap;
}

/* ===== Fiók táblázatok (Rendeléseim, Számláim): mobilon kártyás nézet, nincs vízszintes görgetés ===== */
@media (max-width: 576px) {
    .table-stack thead {
        display: none;
    }
    .table-stack tbody tr {
        display: block;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        margin-bottom: .75rem;
        padding: .25rem .75rem;
        background-color: #fff;
    }
    .table-stack tbody td {
        display: flex;
        align-items: center;
        gap: .75rem;
        border: 0;
        padding: .45rem 0;
        white-space: normal;
        text-align: right;
    }
    .table-stack tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: #495057;
        margin-right: auto;
        text-align: left;
    }
    .table-stack tbody td + td {
        border-top: 1px solid #f0f0f0;
    }
}

/* Fiók: szállítási cím törlésgomb - csendes gomb, hoverre piros */
.acc-default-form .btn,
.acc-delete-form .btn-danger {
    background: #fff;
    border: 1px solid #ced4da;
    color: #495057;
    padding: .2rem .5rem;
}
.acc-delete-form .btn-danger:hover,
.acc-delete-form .btn-danger:focus {
    background: #fff0f0;
    border-color: var(--red);
    color: var(--red);
}

/* ===== Termék "fontos figyelmeztetés" sáv (product-important-note) ===== */
/* A kék quantity-discount-note testvére meleg pasztell színnel; szövege DB-ből töltendő (fejlesztői feladat) */
.product-important-note {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    margin-top: 0.25rem;
    background: #fff9f0;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    color: #8a5a1e;
    line-height: 1.45;
}
.product-important-note .warn-i {
    color: var(--orange);
    flex-shrink: 0;
    margin-top: 1px;
}
/* grid termékkártyán kicsit kompaktabb, mint a kék note */
.card-product-grid .product-important-note {
    gap: 0.375rem;
    padding: 0.4rem 0.5rem;
    font-size: 0.7rem;
    line-height: 1.4;
}

/* ===== GLS kereső: kiválasztott állapot (readonly + törlés gomb) ===== */
/* A beírt/kiválasztott szöveg sötét, csak a placeholder szürke */
.gls-search-wrap .form-control {
    color: #212529;
}
.gls-search-wrap .form-control[readonly] {
    background-color: #fff;
}
.gls-clear-btn {
    display: none;
    position: absolute;
    top: 1px;
    right: 1px;
    width: 44px;
    height: 42px;
    border: none;
    border-left: 1px solid #ced4da;
    background: #fff;
    color: #495057;
    border-radius: 0 5px 5px 0;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}
.gls-clear-btn:hover {
    background: #fff0f0;
    color: var(--red);
}
.gls-has-selection .gls-search-icon {
    display: none;
}
.gls-has-selection .gls-clear-btn {
    display: flex;
}

/* Alapértelmezett szállítási cím: aktív csillag + kártyakiemelés (krém-narancs), beállító csillag hover */
.acc-default-form .btn-dark,
.acc-default-form .btn-dark:disabled {
    background: #fff9f0;
    border-color: #f0d9b5;
    color: var(--orange);
    opacity: 1;
}
.acc-default-form .btn-info:hover,
.acc-default-form .btn-info:focus {
    background: #fff9f0;
    border-color: var(--orange);
    color: var(--orange);
}
.acc-shipping-item.border-dark {
    border-color: #f0d9b5 !important;
    background: #fffdf9;
}

/* Checkout szállítási/fizetési mód: ingyenes = zöld pirula, fizetős ár = szürke */
.box-check .form-check-label small.text-success b,
.box-check .form-check-label small .text-success {
    color: #fff !important;
    background: #2d8a11;
    display: inline-flex;
    align-items: center;
    line-height: 1;
    padding: .25rem .6rem;
    border-radius: 999px;
    font-weight: 700;
}
.box-check .form-check-label small.text-danger b,
.box-check .form-check-label small.text-danger,
.box-check .form-check-label small .text-danger {
    color: #6c757d !important;
    font-weight: 600;
    background: none;
}

/* Checkout összesítő thumbnail: a resize='xy' négyzetre vágja a képet - object-fit-tel a teljes termék látszik */
.itemside .aside img.img-sm {
    object-fit: contain !important;
    background: #fff;
}

/* =================================================================== */
/* "Fizetés indítása" gomb (checkout 5. lépés / raiffeisen_payment.tpl) */
/* A Pénztár gomb magenta színéhez igazítva, nagyobb, jól látható.       */
/* Ezt a blokkot a webaruhaz2.css VÉGÉRE illeszd be.                     */
/* =================================================================== */
.btn-pay-start {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    background-color: var(--magenta);
    border: 2px solid var(--magenta);
    color: #fff;
    font-weight: 600;
    font-size: 1.15rem;
    line-height: 1.2;
    padding: .75rem 2rem;
    border-radius: var(--radius);
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(247, 14, 239, .25);
    transition: background .15s, border-color .15s, box-shadow .15s;
}

.btn-pay-start:hover,
.btn-pay-start:focus {
    background-color: var(--magentahover);
    border-color: var(--magentahover);
    color: #fff;
    box-shadow: 0 3px 12px rgba(194, 11, 191, .35);
}

.btn-pay-start i,
.btn-pay-start .fa,
.btn-pay-start .bi {
    color: #fff;
}

/* Checkout: Áttekintés + Összesítés elrendezés */
.checkout-summary-layout {
    flex-wrap: nowrap;
    align-items: flex-start;
}
.checkout-summary-layout .checkout-review-col { 
    flex: 1 1 320px !important; 
    min-width: 0 !important;
}
@media (max-width: 992px) {
    .checkout-summary-layout {
        flex-direction: column-reverse;
        align-items: stretch;
    }
    .checkout-summary-layout .cart-summary-card {
        width: 100%;
        min-width: 0;
    }
    .checkout-summary-layout .checkout-review-col {
        width: 100%;
        flex: 1 1 auto;
    }
}