body{
margin:0;
font-family: 'Segoe UI';
background:#0f0f11;
color:#fff;
}

.login-body{
display:flex;
justify-content:center;
align-items:center;
height:100vh;
}

.login-box{
background:#1a1a1f;
padding:40px;
border-radius:20px;
box-shadow:0 0 30px rgba(200,164,77,0.2);
text-align:center;
}

input, select{
width:100%;
padding:12px;
margin:8px 0;
background:#121214;
border:1px solid #333;
color:#fff;
border-radius:12px;
}

button{
background:#c8a44d;
border:none;
padding:12px;
border-radius:12px;
font-weight:bold;
cursor:pointer;
}

.card{
background:#1a1a1f;
padding:20px;
border-radius:18px;
margin:15px 0;
transition:.3s;
}

/* ===== PREMIUM RESERVATION CARD ===== */

.card{
    background:linear-gradient(145deg,#1c1c22,#141418);
    padding:22px;
    border-radius:20px;
    margin:18px 0;
    transition:all .3s ease;
    border:1px solid rgba(200,164,77,0.15);
    position:relative;
}

.card:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 25px rgba(0,0,0,0.5);
    border:1px solid rgba(200,164,77,0.35);
}

/* Üst Bilgi Alanı */
.card h3{
    margin:0 0 8px 0;
    font-size:18px;
    color:#fff;
}

.card p{
    margin:4px 0;
    color:#bdbdbd;
    font-size:14px;
}

/* STATUS BADGE */
.status-badge{
    position:absolute;
    top:18px;
    right:18px;
    padding:6px 14px;
    border-radius:20px;
    font-size:12px;
    font-weight:600;
    letter-spacing:.5px;
}

.badge-geldi{
    background:rgba(31,143,58,0.15);
    color:#1f8f3a;
    border:1px solid rgba(31,143,58,0.4);
}

.badge-gelmedi{
    background:rgba(179,38,30,0.15);
    color:#ff4d4d;
    border:1px solid rgba(179,38,30,0.4);
}

.badge-beklemede{
    background:rgba(200,164,77,0.15);
    color:#c8a44d;
    border:1px solid rgba(200,164,77,0.4);
}
/* ===== STATUS BUTTONS ===== */

.status-actions{
    margin-top:15px;
    display:flex;
    gap:10px;
}

.status-actions a{
    flex:1;
    text-align:center;
    padding:8px 0;
    border-radius:12px;
    font-size:13px;
    font-weight:600;
    text-decoration:none;
    transition:.3s;
    border:1px solid transparent;
}

/* Geldi */
.btn-geldi{
    background:rgba(31,143,58,0.15);
    color:#1f8f3a;
}

.btn-geldi:hover{
    background:#1f8f3a;
    color:#fff;
    box-shadow:0 0 12px rgba(31,143,58,0.6);
}

/* Gelmedi */
.btn-gelmedi{
    background:rgba(179,38,30,0.15);
    color:#ff4d4d;
}

.btn-gelmedi:hover{
    background:#b3261e;
    color:#fff;
    box-shadow:0 0 12px rgba(179,38,30,0.6);
}

/* İptal */
.btn-iptal{
    background:rgba(200,164,77,0.15);
    color:#c8a44d;
}

.btn-iptal:hover{
    background:#c8a44d;
    color:#111;
    box-shadow:0 0 12px rgba(200,164,77,0.6);
}

/* ===== KART İÇİ YEMEK LİSTESİ ===== */

.meal-list{
    margin-top:12px;
    padding-top:10px;
    border-top:1px solid rgba(200,164,77,0.2);
}

.meal-item{
    display:flex;
    justify-content:space-between;
    padding:4px 0;
    font-size:14px;
    color:#d6d6d6;
}

.meal-item strong{
    color:#c8a44d;
    font-weight:600;
}


/* ===== PREMIUM TOP NAV ===== */

.nav{
    position:sticky;
    top:0;
    z-index:1000;
    display:flex;
    justify-content:center;
    gap:20px;
    padding:18px 0;
    background:rgba(20,20,22,0.85);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(200,164,77,0.2);
}

.nav a{
    color:#c8a44d;
    text-decoration:none;
    padding:10px 18px;
    border-radius:30px;
    font-weight:600;
    letter-spacing:.5px;
    transition:all .3s ease;
    border:1px solid transparent;
}

.nav a:hover{
    background:#c8a44d;
    color:#111;
    box-shadow:0 0 15px rgba(200,164,77,0.6);
    transform:translateY(-2px);
}

.meal-row{
display:flex;
gap:10px;
margin-bottom:10px;
}

.meal-row input[type="text"]{
flex:2;
padding:8px;
font-size:14px;
}

.meal-row input[type="number"]{
flex:1;
padding:8px;
font-size:14px;
}

/* ===== YEMEK SATIRLARI ===== */

.meal-row{
    display:flex;
    gap:12px;
    align-items:center;
    margin-bottom:10px;
}

.meal-row select{
    flex:2;
    padding:10px;
    border-radius:6px;
    border:1px solid #ccc;
}

.meal-row input{
    width:100px;
    padding:10px;
    border-radius:6px;
    border:1px solid #ccc;
    text-align:center;
}

.delete-meal{
    background:#ff4d4d;
    color:white;
    border:none;
    padding:10px 12px;
    cursor:pointer;
    border-radius:6px;
    font-weight:bold;
}

.delete-meal:hover{
    background:#cc0000;
}

.add-meal-btn{
    margin-top:10px;
    padding:10px 16px;
    background:#4CAF50;
    color:white;
    border:none;
    border-radius:6px;
    cursor:pointer;
}

.add-meal-btn:hover{
    background:#3e8e41;
}
@media(max-width:600px){
    .meal-row{
        flex-direction:column;
        align-items:stretch;
    }

    .meal-row input{
        width:100%;
    }
}
@media(max-width:600px){
    .meal-row{
        flex-direction:column;
        align-items:stretch;
    }

    .meal-row input{
        width:100%;
    }
}
/* ===== MOBİL NAV 2x2 GRID ===== */

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

    .nav{
        display:grid;
        grid-template-columns: 1fr 1fr;
        gap:10px;
        padding:15px;
    }

    .nav a{
        display:flex;
        justify-content:center;
        align-items:center;
        padding:14px 0;
        font-size:15px;
        border-radius:14px;
        background:rgba(200,164,77,0.08);
        border:1px solid rgba(200,164,77,0.25);
        text-align:center;
    }

    .nav a:active{
        transform:scale(0.97);
    }
}