:root{
     --bg:#fff2c6;
     --card:#ffffff;
     --header:#fff8e6;
     --accent:#f82b00;
     --text:#f82b00;
     --muted:#7b5d4c;
     --shadow:0 8px 22px rgba(0,0,0,.06);
}
 body.dark{
     --bg:#111;
     --card:#1b1b1b;
     --header:#202020;
     --accent:#f82b00;
     --text:#f5f5f5;
     --muted:#999;
     --shadow:0 8px 24px rgba(0,0,0,.35);
}
 *{
     margin:0;
     padding:0;
     box-sizing:border-box;
}
 html{
     scroll-behavior:smooth;
}
 body{
     font-family:"Work Sans",sans-serif;
     background-color:var(--bg);
     color:var(--text);
     transition:background-color .25s,color .25s;
     -webkit-font-smoothing:antialiased;
     text-rendering:optimizeLegibility;
}
 img{
     max-width:100%;
     display:block;
}
 a{
     color:inherit;
     text-decoration:none;
}
 header{
     position:relative;
     display:flex;
     justify-content:center;
     align-items:center;
     padding:18px 20px 10px;
     animation:fadeDown .45s ease;
}
 .header-inner{
     max-width:980px;
     margin:0 auto;
     position:relative;
}
 .container{
     max-width:980px;
     margin:0 auto 24px;
     padding:0 24px;
     animation:fadeUp .45s ease;
}
 .logo{
     width:128px;
     max-width:42vw;
     margin:0 auto;
     user-select:none;
     transition:transform .25s;
}
 .category{
     background:var(--card);
     border-radius:20px;
     margin-bottom:20px;
     overflow:hidden;
     box-shadow:var(--shadow);
     transition: transform .25s, box-shadow .25s, background .25s;
}
 .category:hover{
     transform:translateY(-2px);
     box-shadow:0 14px 30px rgba(0,0,0,.10);
}
 .category.active{
     box-shadow:0 14px 30px rgba(0,0,0,.10);
}
 body:not(.dark) .category.active .category-header{
     background:#fff0bf;
}
 body.dark .category.active .category-header{
     background:#2f2f2f;
}
 body.dark .category, body.dark .announcement{
     box-shadow:var(--shadow);
}
 .category-header{
     display:flex;
     justify-content:space-between;
     align-items:center;
     padding:20px 24px;
     background:var(--header);
     cursor:pointer;
     user-select:none;
     transition:.25s;
     border-bottom:1px solid rgba(0,0,0,.06);
     font-size:23px;
     font-weight:700;
     letter-spacing:.2px;
}
 body.dark .category-header{
     border-bottom:1px solid rgba(255,255,255,.06);
}
 .category-header:hover{
     filter:brightness(.98);
}
 body.dark .category-header:hover{
     filter:brightness(1.15);
}
 .category-header i:first-child{
     width:24px;
     color:var(--accent);
     text-align:center;
}
 .arrow{
     color:var(--accent);
}
 .category.active .arrow{
     transform:rotate(180deg);
}
 .category-content{
     max-height:0;
     overflow:hidden;
     transition:max-height .35s cubic-bezier(.4,0,.2,1);
     background:var(--card);
     will-change:max-height;
}
 .products{
     padding:14px 24px 20px;
}
 .menu-item{
     display:flex;
     flex-direction:column;
     padding:8px 0;
     border-radius:10px;
     transition: background .25s, padding-left .25s;
}
 .menu-item:hover{
     padding-left:6px;
     transform:none;
}
 body.dark .menu-item:hover{
     background:rgba(255,255,255,.04);
}
 .item-main{
     display:flex;
     align-items:baseline;
     gap:6px;
}
 .name{
     font-size:19px;
     font-weight:600;
     line-height:1.35;
}
 .dots{
     flex:1;
     margin:0 4px;
     border-bottom:2px dotted rgba(248,43,0,.35);
     position:relative;
     top:-1px;
     margin-bottom:4px;
}
 body.dark .dots{
     border-bottom-color:rgba(255,255,255,.18);
}
 .price{
     margin-left:auto;
     white-space:nowrap;
     color:var(--accent);
     font-size:20px;
     font-weight:800;
     letter-spacing:.3px;
     text-shadow: 0 1px 0 rgba(255,255,255,.15);
     min-width:54px;
     text-align:right;
}
 .desc{
     margin-top:6px;
     padding-left:0px;
     color:var(--muted);
     font-size:14px;
     line-height:1.5;
}
 .footer{
     margin-top:22px;
     padding:18px 20px 12px;
     text-align:center;
     opacity:.92;
}
 .footer p{
     display:flex;
     justify-content:center;
     align-items:center;
     gap:8px;
     margin-bottom:6px;
     line-height:1.4;
}
 .footer a{
     color:var(--muted);
}
 .footer a:hover{
     color:var(--accent);
     transition:color .2s;
}
 .footer i{
     color:var(--accent);
}
 .footer small{
     display:block;
     text-align:center;
     margin-top:10px;
     color:var(--muted);
}
 @media (max-width:700px){
     header{
         padding:18px 15px;
    }
     .container{
         padding:0 20px;
    }
     .logo{
         width:135px;
    }
     .category{
         border-radius:18px;
         margin-bottom:16px;
    }
     .category-header{
         padding:18px;
         font-size:18px;
    }
     .products{
         padding:12px 22px 18px;
    }
     .menu-item{
         padding:9px 0;
    }
     .name{
         font-size:17px;
    }
     .price{
         font-size:17px;
    }
     .desc{
         font-size:13px;
    }
}
 @media (max-width:480px){
     .container{
         padding:0 10px;
    }
     .category-header{
         width:100%;
         border:0;
         outline:0;
         background:var(--header);
         appearance:none;
    }
     .category-title{
         display:flex;
         align-items:center;
         gap:12px;
    }
     .name{
         font-size:16px;
    }
     .price{
         font-size:16px;
    }
}
 .announcement{
     display:flex;
     align-items:center;
     gap:14px;
     background:var(--card);
     border-left:4px solid var(--accent);
     border:1px solid color-mix(in srgb, var(--accent) 10%, transparent);
     border-radius:18px;
     padding:10px 18px;
     margin:10px 0 16px;
     overflow:hidden;
     position:relative;
     box-shadow:var(--shadow);
}
 .announcement:hover{
     transform:translateY(-2px);
     box-shadow:0 10px 28px rgba(0,0,0,.10);
}
 .announcement-icon{
     width:40px;
     height:40px;
     display:flex;
     align-items:center;
     justify-content:center;
     border-radius:50%;
     background:color-mix(in srgb, var(--accent) 18%, white);
     box-shadow:0 6px 16px rgba(248,43,0,.15);
     color:var(--accent);
}
 .announcement-icon i{
     display:block;
     font-size:18px;
     animation:pulse 1.8s ease-in-out infinite;
     transform-origin:center;
}
 @keyframes pulse{
     0%{
         transform:scale(1) rotate(0deg);
    }
     25%{
         transform:scale(1.12) rotate(-6deg);
    }
     50%{
         transform:scale(1.16) rotate(6deg);
    }
     75%{
         transform:scale(1.12) rotate(-6deg);
    }
     100%{
         transform:scale(1) rotate(0deg);
    }
}
 .announcement-text{
     flex:1;
}
 .announcement h3{
     margin:0;
     font-weight:700;
     letter-spacing:.2px;
     line-height:1.2;
     color:var(--accent);
}
 .announcement p{
     margin:2px 0 0;
     font-size:15px;
     line-height:1.35;
     color:var(--muted);
}
 @media(max-width:700px){
     .announcement{
         padding:12px 16px;
         gap:12px;
    }
     .announcement-icon{
         width:40px;
         height:40px;
         font-size:18px;
    }
     .announcement h3{
         font-size:18px;
    }
}
 .topbar{
     background:var(--header);
     border-bottom:1px solid rgba(0,0,0,.06);
     backdrop-filter:blur(12px);
}
 body.dark .topbar{
     border-bottom:1px solid rgba(255,255,255,.06);
}
 .topbar-inner{
     max-width:980px;
     height:48px;
     margin:auto;
     padding:0 24px;
     display:flex;
     justify-content:space-between;
     align-items:center;
}
 .theme-switch{
     display:flex;
     align-items:center;
     gap:10px;
}
 .language-switch{
     display:flex;
     align-items:center;
     gap:10px;
}
 .language-switch img{
     width:22px;
     height:22px;
     border-radius:50%;
     transition:.25s;
}
 .language-switch img:hover{
     transform:scale(1.08);
}
 .language-switch a{
     opacity:.45;
}
 .language-switch a.active{
     opacity:1;
}
 .language-switch a:hover{
     opacity:.8;
}
 .switch{
     position:relative;
     display:inline-block;
     width:44px;
     height:24px;
}
 .switch input{
     opacity:0;
     width:0;
     height:0;
}
 .slider{
     position:absolute;
     cursor:pointer;
     inset:0;
     background:#ddd;
     transition:.3s;
     border-radius:50px;
}
 body.dark .slider{
     background:#444;
}
 .slider:before{
     content:"";
     position:absolute;
     width:18px;
     height:18px;
     left:3px;
     top:3px;
     background:white;
     border-radius:50%;
     transition:.3s;
}
 .switch input:checked + .slider{
     background:var(--accent);
}
 .switch input:checked + .slider:before{
     transform:translateX(20px);
}
 .category-header, .announcement, .topbar, .footer, .category{
     transition: background .25s, color .25s, border-color .25s;
}
 .topbar-actions{
     display:flex;
     align-items:center;
     gap:14px;
}
 .wifi-btn{
     display:flex;
     align-items:center;
     justify-content:center;
     width:24px;
     height:24px;
     padding:0;
     border:0;
     background:none;
     color:var(--accent);
     cursor:pointer;
}
 .wifi-btn i{
     font-size:18px;
     line-height:1;
     transition: transform .25s, opacity .25s;
}
 .wifi-btn:hover{
     opacity:.8;
     transform:scale(1.08);
}
 .wifi-modal{
     position:fixed;
     inset:0;
     background:rgba(0,0,0,.45);
     display:none;
     align-items:center;
     justify-content:center;
     z-index:9999;
}
 .wifi-modal.show{
     display:flex;
}
 .wifi-card{
     position:relative;
     width:320px;
     max-width:90%;
     background:var(--card);
     color:var(--text);
     border-radius:18px;
     padding:28px;
     text-align:center;
     box-shadow:0 20px 40px rgba(0,0,0,.25);
}
 .wifi-icon{
     font-size:42px;
     color:var(--accent);
     margin-bottom:18px;
}
 .wifi-close{
     position:absolute;
     right:12px;
     top:12px;
     width:34px;
     height:34px;
     border:none;
     background:none;
     cursor:pointer;
     color:var(--muted);
     font-size:18px;
}
 .wifi-info{
     margin:20px 0;
}
 .wifi-info label{
     display:block;
     font-size:13px;
     color:var(--muted);
     margin-top:12px;
}
 .wifi-info strong{
     display:block;
     margin-top:4px;
     font-size:20px;
     color:var(--accent);
}
 .copy-btn{
     width:100%;
     margin-top:18px;
     padding:12px;
     border:none;
     border-radius:12px;
     background:var(--accent);
     color:#fff;
     font-weight:600;
     cursor:pointer;
     transition:.25s;
}
 .copy-btn:hover{
     filter:brightness(.95);
}
 @media (max-width:700px){
     .topbar-actions{
         align-items:center;
    }
     .wifi-btn{
         position:relative;
         top:1px;
    }
}
 .google-review{
     margin:16px 0 12px;
}
 .google-review a{
     display:inline-flex;
     align-items:center;
     justify-content:center;
     gap:8px;
     color:var(--muted);
     font-size:15px;
     font-weight:600;
     transition:.25s;
}
 .google-review a:hover{
     color:var(--accent);
}
 .review-star{
     font-size:18px;
     transition:.25s;
}
 .google-review a:hover .review-star{
     transform:rotate(-8deg) scale(1.15);
}
 .stats-grid{
     display:grid;
     grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
     gap:20px;
}
 .card{
     background:var(--card);
     border-radius:14px;
     padding:22px;
     box-shadow:var(--shadow);
}
 .card h3{
     font-size:15px;
     margin-bottom:12px;
     color:var(--muted);
}
 .card strong{
     font-size:32px;
}
 .waiter-btn{
     position:fixed;
     right:22px;
     bottom:22px;
     width:58px;
     height:58px;
     border:none;
     border-radius:50%;
     background:#f82b00;
     color:#fff;
     display:flex;
     align-items:center;
     justify-content:center;
     font-size:22px;
     cursor:pointer;
     z-index:999;
     box-shadow:0 8px 20px rgba(0,0,0,.22);
     transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
 .waiter-btn:hover{
     transform:scale(1.08);
     box-shadow:0 12px 28px rgba(0,0,0,.28);
}
 .waiter-btn:active{
     transform:scale(.95);
}
 .waiter-btn i{
     pointer-events:none;
}
 @media (max-width:700px){
     .waiter-btn{
         width:54px;
         height:54px;
         right:16px;
         bottom:16px;
         font-size:20px;
    }
}
/*---------------------------------------------------- ŞAH BAR Hatırası ----------------------------------------------------*/
 .memory-banner{
     width:100%;
     min-height:66px;
     display:flex;
     align-items:center;
     padding:0 18px;
     background:linear-gradient( 135deg, #fffdf9 0%, #fff5de 55%, #ffefcf 100% );
     border-radius:18px;
     text-decoration:none;
     box-shadow:0 10px 30px rgba(0,0,0,.08);
     overflow:hidden;
     position:relative;
     cursor:pointer;
     transition: transform .30s, box-shadow .30s;
}
 .memory-banner::before{
     content:"";
     position:absolute;
     inset:0;
     background: radial-gradient(circle at 15% 30%, rgba(248,43,0,.05) 0, transparent 30%), radial-gradient(circle at 85% 70%, rgba(248,43,0,.04) 0, transparent 28%);
     pointer-events:none;
}
 .memory-banner > *{
     position:relative;
     z-index:1;
}
 .memory-icon{
     width:48px;
     height:48px;
     display:flex;
     justify-content:center;
     align-items:center;
     flex-shrink:0;
     border-radius:50%;
     background:#ffe7df;
     transition:transform .30s;
}
 .memory-icon i{
     font-size:22px;
     color:#f82b00;
}
 .memory-content{
     margin-left:14px;
     min-width:0;
}
 .memory-content h3{
     margin:0;
     color:#f82b00;
     font-size:20px;
     font-weight:700;
     white-space:nowrap;
     overflow:hidden;
     text-overflow:ellipsis;
}
 .memory-content p{
     margin-top:3px;
     color:#876958;
     font-size:14px;
     white-space:nowrap;
     overflow:hidden;
     text-overflow:ellipsis;
}
 .memory-polaroids{
     position:relative;
     margin-left:auto;
     width:92px;
     height:66px;
     pointer-events:none;
}
 .memory-polaroids img{
     position:absolute;
     width:46px;
     border-radius:6px;
     box-shadow:0 6px 14px rgba(0,0,0,.18);
     transition:transform .30s;
}
 .memory-polaroids .summer{
     left:0;
     top:8px;
     transform:rotate(-8deg);
}
 .memory-polaroids .dj{
     right:0;
     top:3px;
     transform:rotate(9deg);
}
 .arrow{
     margin-left:18px;
     flex-shrink:0;
     color:#f82b00;
     font-size:18px;
     transition:transform .25s;
}
 @media (hover:hover){
     .memory-banner:hover{
         transform:translateY(-2px);
         box-shadow:0 16px 36px rgba(0,0,0,.12);
    }
     .memory-banner:hover .memory-icon{
         transform:rotate(-10deg);
    }
     .memory-banner:hover .summer{
         transform:rotate(-12deg) translateY(-3px);
    }
     .memory-banner:hover .dj{
         transform:rotate(12deg) translateY(-3px);
    }
     .memory-banner:hover .arrow{
         transform:translateX(4px);
    }
}
 @media (max-width:700px){
     .memory-banner{
         min-height:72px;
         padding:0 14px;
    }
     .memory-icon{
         width:42px;
         height:42px;
    }
     .memory-icon i{
         font-size:18px;
    }
     .memory-content{
         margin-left:12px;
    }
     .memory-content h3{
         font-size:17px;
    }
     .memory-content p{
         font-size:12px;
    }
     .memory-polaroids{
         width:72px;
         height:56px;
    }
     .memory-polaroids img{
         width:38px;
    }
     .arrow{
         margin-left:10px;
         font-size:16px;
    }
}
 .memory-phone{
     margin-left:auto;
     flex-shrink:0;
     display:flex;
     align-items:center;
     justify-content:center;
}
 .phone-body::before{
     content:"";
     position:absolute;
     top:5px;
     left:50%;
     transform:translateX(-50%);
     width:12px;
     height:2px;
     border-radius:2px;
     background:#777;
}
 .phone-body{
     position:relative;
     width:38px;
     height:62px;
     padding:3px;
     border-radius:10px;
     background:linear-gradient( 180deg, #5a5a5a 0%, #2a2a2a 45%, #111111 100% );
     border:1px solid rgba(255,255,255,.06);
     box-shadow: 0 8px 18px rgba(0,0,0,.18), inset 0 1px 1px rgba(255,255,255,.12);
     transform:rotate(8deg);
     transition:.30s;
}
 .phone-screen{
     width:100%;
     height:100%;
     overflow:hidden;
     border-radius:7px;
     background:#111;
     border:1px solid rgba(255,255,255,.05);
     position:relative;
}
 .phone-screen::after{
     content:"";
     position:absolute;
     inset:0;
     background:linear-gradient( 120deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.10) 50%, rgba(255,255,255,0) 65% );
     pointer-events:none;
}
 .phone-screen img{
     width:100%;
     height:100%;
     object-fit:cover;
     display:block;
}
 @media (hover:hover){
     .memory-banner:hover .phone-body{
         transform:rotate(3deg) scale(1.04);
    }
}
 @media(max-width:700px){
     .phone-body{
         width:34px;
         height:56px;
    }
}