.category-title-area {float:left;width:100%;position: relative;z-index: 0;}
.category-title-area .container {display:grid;grid-template-columns: 100px 1fr 100px;align-items:center;height:90px;}
.category-title-area h1 {float:left; width:100%; text-align:center; font-size:18px; font-weight:700; margin-top:4px; text-transform: uppercase;}
.cat-filter-btn {float:right;text-align:right;font-size:14px;cursor: pointer;}
.cat-filter-btn img {float:right; margin:4px 0 0 10px;}
.stockout-btn {float:left; font-size:12px;}


.category-product-list-area {float:left; width:100%;}
.category-product-list-area .container {grid-template-columns:1fr 1fr 1fr 1fr;grid-column-gap:15px;grid-row-gap: 50px;}
.category-product-list-area .container.double-view {grid-template-columns: 1fr 1fr;}

.category-list-filter-area {position:fixed;top:0;right:-45%;max-width:600px;width:45%;z-index:10;background:#fff;padding: 20px 20px 20px 20px;height:100vh;transition:all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);overflow-y:auto;}
.category-list-filter-area.active {right:0;transition:all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);z-index: 10;}
.category-filter-overlay {position:fixed; top:0; left:0; background:rgba(0,0,0,0.3); width:100%; height:100vh; z-index:9; opacity:0; visibility:hidden; transition:all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86)}
.category-filter-overlay.active {transition:all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);opacity:1;visibility:visible;z-index: 7;}
.category-list-filter-close {position:absolute;top: 20px;right:30px;cursor:pointer;}

.cat-list-filter-title {float:left;width:100%;text-align:center;font-size:14px;font-weight:600;margin-top:5px;padding-bottom:15px;border-bottom: 1px solid #ddd;margin-bottom: -1px;}
.cat-list-filters-wrapper {float:left;width:100%;height: calc(100vh - 132px);overflow-y: auto;}
.filter-item-wrapper {float:left;width:100%;border-top:1px solid #ddd;padding: 30px 0;}
.filter-item-wrapper h6 {float:left;width:100%;font-size:13px;letter-spacing:-0.03em;margin-bottom: 15px; text-transform: uppercase;}
.fi-title {float:left;width:100%;font-size:12px;font-weight: 400;margin: 0px 0 20px 0;letter-spacing:-0.03em;}
.filter-item-wrapper ul {float:left;width:100%;}
.filter-item-wrapper ul li {float: left; margin:0 5px 5px 0;}
.filter-item-wrapper ul li a {border:1px solid #ccc; font-size:12px; height:38px; display:inline-block; line-height:35px; padding:0 15px; font-weight:400; font-family: var(--font2);}
.filter-item-wrapper ul li a img {float:left;margin: 8px 7px 0 -6px;height: 19px;border-radius: 50%;}
.filter-item-wrapper ul li a.active {border:1px solid var(--red); color:var(--red); font-weight:500;}
.filter-item-wrapper ul li a.passive {border:1px solid #ddd; color:#aaa; background:#f3f3f3; text-decoration:line-through; cursor:not-allowed;}
.filter-clear-btn, .filter-clear-btn:hover, .filter-clear-btn:focus {position: absolute;bottom:20px;left:20px;width:calc(100% - 40px);background:var(--red);border:1px solid var(--red);color:#fff;font-size:14px;padding: 10px 0;font-weight:500;cursor:pointer;outline: none; text-align:center;}
.filter-clear-btn.passive {opacity:.3;}

.category-pagination-area {float:left; width:100%; margin-top:40px;}
.pagination {float:left; width:100%; display:flex; justify-content:center;}
.pagination li {font-weight:600; font-size:14px;}
.pagination li a {border:1px solid #aaa; width:40px; height:40px; display:flex; align-items:center; justify-content:center; margin:0 2px; border-radius:3px;}
.pagination li.active a {color:#fff !important; background:#000; border:1px solid #000;}
.pagination li a img {width:16px;}
.pagination li.firstpage img {transform:rotate(180deg);}

.category-desc-area {background:var(--pink); float:left; width:100%; padding:20px 20px 0 20px; margin-top:40px; font-family: var(--font2); font-size: 13px; line-height:1.8em;}
.category-desc-area h2 {float:left; width:100%; font-size:16px; margin-bottom:20px;}
.category-desc-area a {border-bottom:1px dashed var(--red); color:var(--red); padding-bottom:3px;}
.category-product-qtty {float:left; width:100%; text-align:center; font-size:12px; margin-top:15px; font-weight:500; font-family: var(--font2);}

.gift-wizard-steps {float:left; width:100%; height:100px; background:#FEF1F0; display:grid; justify-content:center; padding:10px 0;}
.gift-wizard-steps h1 {float:left; width:100%; font-size:15px; font-family:'Mulish'; text-align:center;}
.gw-steps {display:flex; justify-content:center;}
.gw-steps li {width:40px;height:40px;background:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;font-weight:600;margin: 0 30px;position:relative;z-index: 1;}
.gw-steps li.active {background:#00A881; color:#fff;}
.gw-steps li.active:before {background:#00A881;}
.gw-steps li:before {width: 60px;height:3px;background:#fff;position:absolute;left: -60px;top:calc(50% - 1.5px);content:"";z-index: 0;}
.gw-steps li:first-child:before {display:none;}
.gift-wizard-step {float:left; width:100%; text-align:center; margin-top:70px;}
.gift-wizard-step .gw-title {float:left; width:100%; margin-bottom:20px;}
.gift-wizard-step .gw-title h5 {float:left; width:100%; font-size:22px;}
.gift-wizard-step .gw-title p {font-family:var(--font2); font-size:13px;}
.gift-wizard-step .gift-wizard-selection {display:flex; float:left; width:100%; justify-content:center;}
.gift-wizard-step .gift-wizard-selection li {border:1px solid #ddd;width:225px;height:200px;display: grid;align-items:center;margin:0 10px;justify-content: center; padding:25px 0; cursor:pointer; transition:ease all .2s;}
.gift-wizard-step .gift-wizard-selection li.active, .gift-wizard-step .gift-wizard-selection li.active:hover {border:2px solid #00A881;}
.gift-wizard-step .gift-wizard-selection li:hover {border:1px solid #000; transition:ease all .2s;;}
.gift-wizard-step .gift-wizard-selection li picture {margin-bottom:0 !important; float:left; width:100%;}
.gift-wizard-step .gift-wizard-selection li span {float:left; width:100%; font-family:var(--font2); font-size:15px; font-weight:700;}
.gift-wizard-action-buttons {float:left; width:100%; margin-top:70px; display:flex; justify-content:center;}
.gift-wizard-action-buttons button, .gift-wizard-action-buttons a {margin:0 5px; width:170px; border:1px solid #000; background:#fff; height:44px; font-family:var(--font2); font-size:12px; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center;}
.gift-wizard-action-buttons button.next, .gift-wizard-action-buttons a.next {border:1px solid var(--red); color:#fff; background:var(--red);}
.gift-wizard-step.step-2, .gift-wizard-step.step-1 {display: none;}
.gift-wizard-step.step-2.active, .gift-wizard-step.step-1.active {display:block;}
.discount-rate {background-color: var(--red); font-size: 12px; position: absolute; padding: 7px 10px 5px 10px; margin-top: 0px; top: 10px; font-weight: 700; left: 10px; color: #fff; text-align: center; line-height: 1.1em; text-transform:uppercase; border-radius:3px;}
.legend-campaign-text {float:left;border: 1px solid var(--black);margin-top:10px;padding: 5px 10px;font-size: 12px;color: var(--black);font-family: var(--font2);font-weight: 500;}
.legend-campaign-text span {color: var(--red);font-weight: 700;}

.list-show {grid-column-start:1; grid-column-end:4; grid-row-start:2; text-align:center; font-size:13px; margin-top:-30px; font-family:var(--font2);}
.list-show span {margin:0 0px 0 6px; border-right:1px solid #ddd; padding:2px 6px 2px 0; cursor:pointer; opacity:.5; font-weight:500;}
.list-show span.active {opacity:1;}
.list-show span:last-child {border-right:0;}

.p-image {aspect-ratio: 700 / 1000;}
.p-image:has(.vimeo-embed-video) {padding: 0;}

.pd-video-area {float: left;width: 100%;display: block;background: #fff;filter: brightness(96.5%);aspect-ratio: 700 / 1000;position: relative;}
a.pd-video-link {position: absolute;top: 0; left: 0;width: 100%; height: 100%;}

.idil-bf-title {    float: left;width: 100%;font-weight: 700;font-size: 30px;text-align: center;    color: #b62a2f;}

/* TABLET YATAY */
@media screen and (min-width : 992px) and (max-width : 1199px) {

}

/* TABLET DIK */
@media screen and (min-width : 768px) and (max-width : 991px) {

}

/* TELEFON */
@media screen and (max-width :767px) {
 .category-product-list-area .container {grid-template-columns:1fr 1fr; padding:0 5px; grid-column-gap:5px;}
 .category-product-list-area .container .product-card:first-child {grid-column-start:auto;grid-column-end:auto;grid-row-start: auto;grid-row-end: auto ;}
 .category-product-list-area .container .product-card:nth-child(14) {grid-column-start:auto; grid-column-end:auto; grid-row-start: auto;grid-row-end: auto;}
 .category-product-list-area .container .product-card:nth-child(26) {grid-column-start:auto;grid-column-end:auto;grid-row-start: auto;grid-row-end: auto;}
 .category-list-filter-area {width:92%;right: -92%;}
 .category-title-area h1 {line-height: 1.2em; font-size: 15px;}
 .discount-rate {font-size:10px; padding:6px 8px 5px 8px;}
 .list-show {display:none;}
 .idil-bf-title {    font-size: 18px;}
}