/* ═══════════════════════════════════════════════════
   TrendShop — Trendyol Stili UI System
   ═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
  --or:#F27A1A;--or2:#e06c0f;--dark:#1D1D1D;--gray:#F3F3F3;--gray2:#E9E9E9;
  --border:#DBDBDB;--text:#1D1D1D;--muted:#7B7B7B;--green:#008000;--red:#E74C3C;
  --white:#fff;--font:'Inter',sans-serif;--rad:8px;--shadow:0 2px 12px rgba(0,0,0,.08);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--font);background:#F0F0F0;color:var(--text);font-size:14px;-webkit-font-smoothing:antialiased}
main{position:relative;z-index:1}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
button{font-family:var(--font);cursor:pointer}

/* ── Utilities ── */
.container{max-width:1340px;margin:0 auto;padding:0 16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:11px 22px;border-radius:var(--rad);font-weight:700;font-size:14px;border:none;cursor:pointer;transition:all .18s;font-family:var(--font)}
.btn-primary{background:var(--or);color:#fff}.btn-primary:hover{background:var(--or2)}
.btn-outline{background:#fff;color:var(--or);border:2px solid var(--or)}.btn-outline:hover{background:var(--or);color:#fff}
.btn-danger{background:var(--red);color:#fff}.btn-sm{padding:7px 14px;font-size:12px}
.btn-lg{padding:13px 28px;font-size:15px}
.badge{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:700}
.badge-success{background:#e6f4e6;color:var(--green)}
.badge-danger{background:#fde8e8;color:var(--red)}
.badge-warning{background:#fff8e1;color:#b8860b}
.badge-primary{background:#fff0e6;color:var(--or)}
.card{background:#fff;border-radius:var(--rad);overflow:hidden}
.form-group{margin-bottom:14px}
.form-label{display:block;font-weight:600;margin-bottom:5px;font-size:13px}
.form-control{width:100%;padding:10px 14px;border:1.5px solid var(--border);border-radius:var(--rad);font-size:14px;font-family:var(--font);outline:none;transition:border-color .18s;background:#fff}
.form-control:focus{border-color:var(--or)}
.form-control.is-invalid{border-color:var(--red)}
.invalid-feedback{color:var(--red);font-size:12px;margin-top:3px}
.alert{padding:12px 16px;border-radius:var(--rad);margin-bottom:14px;font-size:13px}
.alert-success{background:#e6f4e6;color:#155724;border:1px solid #b8ddb8}
.alert-danger{background:#fde8e8;color:#721c24;border:1px solid #f5c6cb}
.alert-info{background:#e8f4fd;color:#0c5460;border:1px solid #bee5eb}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--border)}
.table th{background:#fafafa;font-weight:700;font-size:11px;text-transform:uppercase;color:var(--muted)}
.table tbody tr:hover{background:#fafafa}
.pagination{display:flex;gap:5px;justify-content:center;margin-top:20px}
.page-link{padding:8px 13px;border:1.5px solid var(--border);border-radius:var(--rad);color:var(--text);font-weight:600;font-size:13px;transition:all .15s}
.page-link:hover,.page-link.active{background:var(--or);color:#fff;border-color:var(--or)}
.text-primary{color:var(--or)!important}.text-muted{color:var(--muted)!important}
.text-success{color:var(--green)!important}.text-danger{color:var(--red)!important}
.fw-bold{font-weight:700!important}
.d-flex{display:flex}.align-items-center{align-items:center}.justify-content-between{justify-content:space-between}
.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}
.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mt-5{margin-top:20px}
.mb-1{margin-bottom:4px}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.mb-5{margin-bottom:20px}
.p-3{padding:12px}.p-4{padding:16px}.p-5{padding:20px}
.text-center{text-align:center}.text-right{text-align:right}
.w-100{width:100%}.rounded{border-radius:var(--rad)}.shadow{box-shadow:var(--shadow)}

/* ── Toast ── */
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:#222;color:#fff;padding:11px 22px;border-radius:24px;font-size:13px;font-weight:600;z-index:9999;opacity:0;transition:all .28s;white-space:nowrap;pointer-events:none}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── Flash ── */
.flash-msg{position:fixed;top:80px;right:20px;z-index:9999;min-width:260px}
@keyframes slideIn{from{transform:translateX(110%);opacity:0}to{transform:translateX(0);opacity:1}}

/* ── Product images ── */
.product-main-img{width:100%;height:100%;object-fit:contain;display:block}
.related-img{width:100%;height:130px;object-fit:cover;display:block;transition:transform .3s}
a:hover .related-img{transform:scale(1.04)}

/* ════════════════════════════════════════════════════
   NAVBAR — Trendyol tarzı
   ════════════════════════════════════════════════════ */

/* Utility bar */
.ty-util{background:#F27A1A;color:#fff;font-size:11.5px;font-weight:500}
.ty-util-in{max-width:1340px;margin:0 auto;padding:0 16px;height:34px;display:flex;align-items:center;justify-content:space-between}
.ty-util-left{display:flex;align-items:center;gap:16px}
.ty-util-left span{display:flex;align-items:center;gap:4px;opacity:.95}
.ty-util-right{display:flex;align-items:center;gap:4px}
.ty-ulink{color:rgba(255,255,255,.85);padding:4px 9px;border-radius:5px;font-size:11.5px;font-weight:600;transition:all .15s}
.ty-ulink:hover{background:rgba(255,255,255,.2);color:#fff}
.ty-ulink.bold{color:#fff;font-weight:800}
.ty-usep{color:rgba(255,255,255,.4);padding:0 2px}

/* Main header */
.ty-header{background:#fff;box-shadow:0 1px 0 #e8e8e8,0 2px 12px rgba(0,0,0,.06);position:sticky;top:0;z-index:9995}
.ty-header-in{max-width:1340px;margin:0 auto;padding:0 16px;height:68px;display:flex;align-items:center;gap:16px}

/* Logo */
.ty-logo{font-size:24px;font-weight:900;letter-spacing:-.5px;color:var(--dark);text-decoration:none;flex-shrink:0;display:flex;align-items:center;gap:0}
.ty-logo span{color:var(--or)}
.ty-logo-badge{background:var(--or);color:#fff;font-size:7.5px;font-weight:800;padding:2px 5px;border-radius:4px;margin-left:5px;margin-bottom:10px;letter-spacing:.05em}

/* Search */
.ty-search{flex:1;max-width:680px;display:flex;align-items:stretch;background:#F3F3F3;border:2px solid transparent;border-radius:var(--rad);overflow:hidden;height:46px;transition:border-color .18s,background .18s}
.ty-search:focus-within{background:#fff;border-color:var(--or)}
.ty-search-cat{appearance:none;background:transparent;border:none;border-right:1.5px solid #ddd;padding:0 28px 0 14px;font-family:var(--font);font-size:12px;font-weight:700;color:#444;cursor:pointer;outline:none;min-width:130px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23aaa' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.ty-search-inp{flex:1;border:none;background:transparent;padding:0 14px;font-family:var(--font);font-size:14px;color:var(--dark);outline:none}
.ty-search-inp::placeholder{color:#aaa}
.ty-search-btn{width:50px;background:var(--or);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0}
.ty-search-btn:hover{background:var(--or2)}
.ty-search-btn svg{color:#fff}

/* Right actions */
.ty-actions{display:flex;align-items:center;gap:2px;margin-left:auto;flex-shrink:0}
.ty-action{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 12px;border-radius:var(--rad);color:#444;transition:all .15s;border:none;background:none;font-family:var(--font);text-decoration:none}
.ty-action:hover{background:var(--gray);color:var(--or)}
.ty-action-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;position:relative}
.ty-action-label{font-size:10px;font-weight:700;white-space:nowrap;color:inherit}
.ty-badge{position:absolute;top:-5px;right:-7px;background:var(--or);color:#fff;font-size:9px;font-weight:800;min-width:17px;height:17px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 3px;border:2px solid #fff;line-height:1}
.ty-badge.hidden{display:none}

/* Account dropdown */
.ty-acc{position:relative}
.ty-acc-menu{position:absolute;top:calc(100% + 6px);right:0;background:#fff;border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.14);border:1px solid #eee;padding:6px;min-width:200px;display:none;z-index:700}
.ty-acc:hover .ty-acc-menu{display:block}
.ty-acc-hd{padding:8px 12px 3px;font-size:10px;font-weight:800;color:#bbb;text-transform:uppercase;letter-spacing:.07em}
.ty-acc-item{display:flex;align-items:center;gap:9px;padding:8px 12px;border-radius:8px;color:var(--dark);font-size:13px;font-weight:500;transition:background .12s}
.ty-acc-item:hover{background:var(--gray);color:var(--or)}
.ty-acc-item.red{color:var(--red)}.ty-acc-item.red:hover{background:#fde8e8}
.ty-acc-div{height:1px;background:#f0f0f0;margin:5px 4px}

/* Cart button */
.ty-cart{display:flex;align-items:center;gap:8px;padding:9px 16px;background:var(--or);color:#fff;border:none;border-radius:var(--rad);cursor:pointer;font-family:var(--font);font-weight:700;font-size:13px;text-decoration:none;transition:background .15s;flex-shrink:0;position:relative}
.ty-cart:hover{background:var(--or2);color:#fff}
.ty-cart-count{background:rgba(255,255,255,.25);border-radius:5px;padding:1px 7px;font-size:12px;font-weight:800;min-width:20px;text-align:center}

/* Kargo dropdown */
.ty-ship-wrap{position:relative}
.ty-ship-wrap:hover .ty-ship-dd{opacity:1;visibility:visible;transform:translateY(0)}
.ty-ship-dd{position:absolute;top:100%;left:0;width:340px;background:#fff;border-radius:0 0 12px 12px;box-shadow:0 16px 48px rgba(0,0,0,.13);padding:4px;z-index:999;opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .18s ease;border-top:3px solid var(--or)}
.ty-ship-hd{padding:9px 14px 5px;font-size:9.5px;font-weight:800;color:#bbb;text-transform:uppercase;letter-spacing:.08em}
.ty-ship-row{display:flex;align-items:center;gap:11px;padding:8px 14px;border-radius:8px;transition:background .1s}
.ty-ship-row:hover{background:#fafafa}
.ty-ship-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.ty-ship-name{font-size:12.5px;font-weight:700;color:#111}
.ty-ship-desc{font-size:11px;color:#999;margin-top:1px}
.ty-ship-price{margin-left:auto;text-align:right}
.ty-ship-price b{font-size:13px;font-weight:800;color:var(--dark)}
.ty-ship-free{font-size:10px;color:var(--green);font-weight:600}

/* Category nav */
.ty-catnav{background:#fff;border-top:1px solid #f0f0f0;border-bottom:1px solid #e8e8e8;position:sticky;top:68px;z-index:9990}
.ty-catnav-in{max-width:1340px;margin:0 auto;padding:0 16px;height:44px;display:flex;align-items:center;gap:2px}

/* Mega menu */
.ty-mega{position:relative;flex-shrink:0}
.ty-mega-btn{display:flex;align-items:center;gap:7px;padding:6px 14px;border-radius:7px;background:var(--or);border:1.5px solid var(--or);color:#fff;font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap;font-family:var(--font);height:32px;transition:all .15s}
.ty-mega-btn svg{color:#fff}
.ty-mega:hover .ty-mega-dd{opacity:1;visibility:visible;transform:translateY(0)}
.ty-mega-dd{position:absolute;top:100%;left:0;width:800px;background:#fff;border-radius:0 12px 12px 12px;box-shadow:0 16px 48px rgba(0,0,0,.2);padding:20px;z-index:9999;opacity:0;visibility:hidden;transform:translateY(-5px);transition:all .18s ease;border-top:3px solid var(--or);display:grid;grid-template-columns:repeat(4, 1fr);gap:20px}
.ty-mega-grid{display:contents}
.ty-mega-col{display:flex;flex-direction:column;gap:8px}
.ty-mega-col-title{font-size:13px;font-weight:800;color:var(--dark);margin-bottom:4px;text-transform:uppercase;border-bottom:1px solid #f0f0f0;padding-bottom:4px}
.ty-mega-item{font-size:12px;color:#555;transition:color .1s;white-space:nowrap}
.ty-mega-item:hover{color:var(--or)}
.ty-mega-foot{display:none} /* Removed foot tags for exact Trendyol match */

/* Cat links */
.ty-cl{display:flex;align-items:center;gap:5px;padding:6px 13px;border-radius:7px;color:#444;font-size:12.5px;font-weight:700;white-space:nowrap;transition:all .15s;height:32px;position:relative}
.ty-cl:hover{color:var(--or)}
.ty-cl.active{color:var(--or)!important}
.ty-cl-sep{display:none}
.ty-flash{margin-left:auto;display:flex;align-items:center;gap:5px;padding:6px 14px;border-radius:7px;background:linear-gradient(135deg,var(--or),#ff9a42);color:#fff!important;font-size:12px;font-weight:800;white-space:nowrap;flex-shrink:0;animation:fpl 2.5s ease-in-out infinite}
@keyframes fpl{0%,100%{box-shadow:0 0 0 0 rgba(242,122,26,.4)}50%{box-shadow:0 0 0 6px rgba(242,122,26,0)}}

/* Flash mesajlar */
.ty-flash-alerts{max-width:1340px;margin:10px auto 0;padding:0 16px}

/* ════════════════════════════════════════════════════
   ANASAYFA — Trendyol tarzı
   ════════════════════════════════════════════════════ */

/* Hero */
.ty-hero{background:linear-gradient(135deg,#1a1a2e 0%,#2d1b69 55%,#1a1a2e 100%);padding:44px 0;color:#fff}
.ty-hero h1{font-size:36px;font-weight:900;line-height:1.15;margin-bottom:10px}
.ty-hero h1 em{color:var(--or);font-style:normal}
.ty-hero p{font-size:14px;opacity:.85;margin-bottom:22px;max-width:480px}
.ty-hero-btns{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.ty-hero-stats{display:flex;gap:24px}
.ty-hero-stat-num{font-size:20px;font-weight:900;color:var(--or)}
.ty-hero-stat-lbl{font-size:10.5px;opacity:.7}

/* Perks */
.ty-perks{background:#fff;border-bottom:1px solid #eee}
.ty-perks-in{max-width:1340px;margin:0 auto;padding:14px 16px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ty-perk{display:flex;align-items:center;gap:10px}
.ty-perk-icon{font-size:22px;flex-shrink:0}
.ty-perk-title{font-size:12px;font-weight:700;color:var(--dark)}
.ty-perk-sub{font-size:11px;color:var(--muted)}

/* Sections */
.ty-section{padding:20px 0}
.ty-sec-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.ty-sec-title{font-size:18px;font-weight:900;color:var(--dark)}
.ty-sec-title em{color:var(--or);font-style:normal}
.ty-sec-all{font-size:12.5px;font-weight:700;color:var(--or)}
.ty-sec-all:hover{text-decoration:underline}

/* Kategori scroll — yuvarlak Trendyol stili */
.ty-cat-scroll{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:4px 2px 8px}
.ty-cat-scroll::-webkit-scrollbar{display:none}
.ty-cat-pill{flex-shrink:0;text-align:center;text-decoration:none;width:76px}
.ty-cat-circle{width:68px;height:68px;border-radius:50%;overflow:hidden;margin:0 auto 7px;border:2.5px solid transparent;background:var(--gray);display:flex;align-items:center;justify-content:center;transition:border-color .18s,transform .18s}
.ty-cat-pill:hover .ty-cat-circle{border-color:var(--or);transform:translateY(-2px)}
.ty-cat-circle img{width:100%;height:100%;object-fit:cover}
.ty-cat-circle-icon{font-size:26px}
.ty-cat-pill-name{font-size:11px;font-weight:600;color:var(--dark);line-height:1.3}

/* Ürün kartı — Trendyol birebir */
.ty-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.ty-card{background:#fff;border-radius:var(--rad);overflow:hidden;position:relative;transition:box-shadow .2s;display:flex;flex-direction:column}
.ty-card:hover{box-shadow:0 4px 20px rgba(0,0,0,.13)}
.ty-card-img{position:relative;aspect-ratio:1/1;overflow:hidden;background:#f9f9f9;flex-shrink:0}
.ty-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.ty-card:hover .ty-card-img img{transform:scale(1.06)}
.ty-card-disc{position:absolute;top:8px;left:8px;background:var(--or);color:#fff;font-size:11px;font-weight:800;padding:2px 7px;border-radius:4px;z-index:1}
.ty-card-new{position:absolute;top:8px;left:8px;background:var(--green);color:#fff;font-size:11px;font-weight:800;padding:2px 7px;border-radius:4px;z-index:1}
.ty-card-fav{position:absolute;top:8px;right:8px;width:28px;height:28px;background:rgba(255,255,255,.85);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;border:none;cursor:pointer;z-index:1;backdrop-filter:blur(4px)}
.ty-card-body{padding:10px 10px 0;flex:1}
.ty-card-brand{font-size:11.5px;font-weight:800;color:var(--dark);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ty-card-name{font-size:11.5px;color:var(--muted);margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4;min-height:30px}
.ty-card-price-new{font-size:16px;font-weight:900;color:var(--or)}
.ty-card-price-old{font-size:11px;color:#bbb;text-decoration:line-through;margin-left:4px}
.ty-card-cargo{font-size:10.5px;color:var(--green);font-weight:600;margin-top:3px;margin-bottom:8px}
.ty-card-btn{width:100%;background:#fff;color:var(--or);border:1.5px solid var(--or);padding:9px;font-size:12.5px;font-weight:700;cursor:pointer;border-radius:0 0 var(--rad) var(--rad);transition:all .15s;font-family:var(--font);margin-top:auto}
.ty-card-btn:hover,.ty-card:hover .ty-card-btn{background:var(--or);color:#fff}

/* Bannerlar */
.ty-banners{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:4px}
.ty-banner{border-radius:var(--rad);padding:22px 20px;color:#fff;min-height:136px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;text-decoration:none;transition:transform .18s}
.ty-banner:hover{transform:translateY(-2px)}
.ty-banner-ico{position:absolute;top:-8px;right:-8px;font-size:78px;opacity:.15;transform:rotate(-12deg)}
.ty-banner h3{font-size:17px;font-weight:900;margin-bottom:3px}
.ty-banner p{font-size:12px;opacity:.85;margin-bottom:9px}
.ty-banner-cta{background:rgba(255,255,255,.22);color:#fff;padding:5px 12px;border-radius:7px;font-size:12px;font-weight:700;width:fit-content;backdrop-filter:blur(4px)}

/* ════════════════════════════════════════════════════
   ÜRÜNLER SAYFASI
   ════════════════════════════════════════════════════ */
.ty-sidebar{width:220px;flex-shrink:0}
.ty-products-layout{display:flex;gap:16px;align-items:flex-start}

/* ════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════ */
@media(max-width:1200px){
  .ty-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:1024px){
  .ty-grid{grid-template-columns:repeat(3,1fr)}
  .ty-banners{grid-template-columns:1fr 1fr}
  .ty-perks-in{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  /* Utility bar — gizle */
  .ty-util{display:none!important}

  /* Header - Minimal and Stacked for Responsive Trendyol Style */
  .ty-header-in{height:auto!important;padding:8px 12px!important;flex-wrap:wrap;gap:10px!important}
  .ty-logo{font-size:22px!important;width:50%}
  .ty-logo-badge{display:none!important}
  
  .ty-actions{width:50%;justify-content:flex-end}
  .ty-action{padding:5px 7px!important}
  .ty-action-label{display:none!important}
  
  /* Arama - Full width on next line in mobile */
  .ty-search{width:100%;height:40px!important;border-radius:8px!important;order:3;max-width:100%}
  .ty-search-cat{display:none!important}
  .ty-search-inp{font-size:14px!important;padding:0 12px!important}
  .ty-search-btn{width:44px!important}

  /* Sepet küçük */
  .ty-cart{width:38px!important;height:38px!important;padding:0!important;border-radius:7px!important;justify-content:center;background:transparent!important;color:#444!important}
  .ty-cart:hover{color:var(--or)!important}
  .ty-cart>svg{display:block;color:currentColor}
  .ty-cart-count{position:absolute;top:-2px;right:-2px;background:var(--or)!important;color:#fff!important;min-width:16px;height:16px;padding:0;font-size:10px;line-height:16px;border-radius:10px}
  .ty-cart>span:not(.ty-cart-count){display:none!important}

  /* Cat nav - Mobile Mega Menu Fix */
  .ty-catnav{display:block!important;position:static;border-bottom:none;background:transparent}
  .ty-catnav-in{flex-wrap:wrap;padding:0 12px!important;height:auto!important}
  
  .ty-cl, .ty-flash{display:none!important} /* Hide individual categories */
  
  .ty-mega{width:100%}
  .ty-mega-btn{width:100%;justify-content:center;background:#fff!important;color:#444!important;border:1px solid #e8e8e8!important;border-radius:8px!important;margin-bottom:10px}
  .ty-mega-btn svg{color:#444!important}
  
  .ty-mega:hover .ty-mega-dd{display:none} /* Disable hover on mobile */
  .ty-mega.active .ty-mega-dd{display:grid;opacity:1;visibility:visible;transform:none;position:static;width:100%;box-shadow:none;border-radius:8px;border:1px solid #e8e8e8;padding:12px;margin-top:4px}
  .ty-mega-dd{grid-template-columns:1fr!important;gap:12px!important}
  .ty-mega-col-title{font-size:12px!important;margin-bottom:2px!important}
  .ty-mega-item{font-size:13px!important;padding:4px 0}

  /* Perks 2x2 */
  .ty-perks-in{grid-template-columns:repeat(2,1fr)!important;gap:8px!important;padding:10px!important}
  .ty-perk-icon{font-size:18px!important}
  .ty-perk-title{font-size:11px!important}
  .ty-perk-sub{font-size:10px!important}

  /* Hero */
  .ty-hero{padding:24px 0!important}
  .ty-hero h1{font-size:22px!important}
  .ty-hero p{font-size:12.5px!important;margin-bottom:16px!important}
  .ty-hero-btns{gap:8px!important}
  .ty-hero-btns .btn{padding:9px 14px!important;font-size:12px!important}
  .ty-hero-stats{gap:14px!important}
  .ty-hero-stat-num{font-size:17px!important}

  /* Kategoriler — yuvarlak scroll */
  .ty-cat-pill{width:62px!important}
  .ty-cat-circle{width:54px!important;height:54px!important}
  .ty-cat-circle-icon{font-size:22px!important}
  .ty-cat-pill-name{font-size:10px!important}

  /* Ürün grid 2 kolon - Tam Trendyol Mobil Stili (Bitişik, küçük) */
  .ty-grid{grid-template-columns:repeat(2,1fr)!important;gap:4px!important}

  /* Kart */
  .ty-card{border-radius:4px!important;box-shadow:none!important;border:1px solid #f0f0f0}
  .ty-card-body{padding:6px 6px 0!important}
  .ty-card-brand{font-size:10px!important;margin-bottom:0}
  .ty-card-name{font-size:10px!important;min-height:24px!important;line-height:1.2;margin-bottom:4px}
  .ty-card-price-new{font-size:13px!important;font-weight:800}
  .ty-card-price-old{font-size:9px!important}
  .ty-card-cargo{font-size:9px!important;margin-top:0;margin-bottom:4px}
  .ty-card-btn{padding:6px!important;font-size:11px!important;border-radius:0 0 4px 4px}
  .ty-card-disc,.ty-card-new{font-size:9px!important;padding:2px 4px!important;top:4px!important;left:4px!important}
  .ty-card-fav{top:4px!important;right:4px!important;width:24px!important;height:24px!important;font-size:12px!important}

  /* Bannerlar — alt alta */
  .ty-banners{grid-template-columns:1fr!important;gap:8px!important}
  .ty-banner{min-height:100px!important;padding:14px 16px!important}
  .ty-banner h3{font-size:15px!important}

  /* Section */
  .ty-section{padding:14px 0!important}
  .ty-sec-title{font-size:15px!important}
  .ty-sec-hd{margin-bottom:10px!important}

  /* Container */
  .container,.ty-container{padding:0 10px!important}

  /* Products layout — sidebar gizle */
  .ty-products-layout{flex-direction:column!important}
  .ty-sidebar{display:none!important}
  .ty-sidebar.visible{display:block!important;width:100%!important}

  /* Footer */
  footer>div>div[style*="grid"]{grid-template-columns:1fr 1fr!important;gap:16px!important}
}

@media(max-width:400px){
  .ty-hero h1{font-size:20px!important}
  .ty-grid{gap:6px!important}
}