/* ========== hesabim.css ========== */
/* Hesabım Ana Sayfa ve Siparişlerim Sayfası Stilleri */

.hesabim-page {
    padding: 40px 0;
    background: #f8f9fa;
    min-height: calc(100vh - 200px);
}

.hesabim-header {
    margin-bottom: 30px;
}

.hesabim-title {
    font-size: 28px;
    font-weight: 600;
    color: #333;
    margin-bottom: 5px;
}

.hesabim-welcome {
    color: #666;
    font-size: 16px;
}

.hesabim-welcome strong {
    color: #667eea;
}

.hesabim-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 30px;
}

/* ========== SOL MENÜ ========== */
.hesabim-menu {
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    overflow: hidden;
    height: fit-content;
}

.menu-header {
    padding: 25px 20px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    display: flex;
    align-items: center;
    gap: 15px;
}

.menu-avatar {
    font-size: 50px;
    line-height: 1;
}

.menu-avatar .avatar-img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid white;
}

.menu-bilgi h4 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 5px;
}

.menu-bilgi p {
    font-size: 12px;
    opacity: 0.9;
    margin: 0;
    word-break: break-all;
}

.google-badge {
    display: inline-block;
    background: rgba(255, 255, 255, 0.2);
    padding: 3px 8px;
    border-radius: 20px;
    font-size: 10px;
    margin-top: 5px;
}

.google-badge i {
    margin-right: 3px;
}

.menu-liste {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu-liste li {
    border-bottom: 1px solid #f0f0f0;
}

.menu-liste li:last-child {
    border-bottom: none;
}

.menu-liste li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 20px;
    color: #555;
    text-decoration: none;
    transition: all 0.3s;
    position: relative;
}

.menu-liste li a i {
    width: 20px;
    color: #888;
    font-size: 16px;
}

.menu-liste li:hover a {
    background: #f8f9fa;
    color: #667eea;
}

.menu-liste li:hover a i {
    color: #667eea;
}

.menu-liste li.active a {
    background: #f0f0f0;
    color: #667eea;
    border-left: 3px solid #667eea;
}

.menu-liste li.active a i {
    color: #667eea;
}

.menu-liste li.menu-cikis a {
    color: #dc3545;
}

.menu-liste li.menu-cikis a i {
    color: #dc3545;
}

.menu-liste li.menu-cikis:hover a {
    background: #dc3545;
    color: white;
}

.menu-liste li.menu-cikis:hover a i {
    color: white;
}

.menu-badge {
    position: absolute;
    right: 20px;
    background: #667eea;
    color: white;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 10px;
    min-width: 20px;
    text-align: center;
}

/* ========== SAĞ İÇERİK ========== */
.hesabim-icerik {
    flex: 1;
}

/* İstatistik Kartları */
.istatistik-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 30px;
}

.istatistik-card {
    background: white;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    gap: 15px;
    transition: all 0.3s;
}

.istatistik-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.istatistik-icon {
    width: 50px;
    height: 50px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
}

.istatistik-bilgi {
    flex: 1;
}

.istatistik-label {
    display: block;
    color: #888;
    font-size: 12px;
    margin-bottom: 5px;
}

.istatistik-value {
    display: block;
    font-size: 20px;
    font-weight: 600;
    color: #333;
}

/* ========== PROFİL WIDGET ========== */
.profil-widget {
    background: white;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.profil-widget-header {
    margin-bottom: 20px;
}

.profil-widget-header h3 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.profil-widget-body {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.profil-avatar-buyuk {
    position: relative;
    width: 120px;
    text-align: center;
}

.avatar-buyuk-img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #667eea;
}

.avatar-placeholder {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 60px;
}

.avatar-kaynak {
    position: absolute;
    bottom: 0;
    right: 0;
    background: white;
    border-radius: 20px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 600;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.avatar-kaynak.google {
    background: #4285f4;
    color: white;
}

.avatar-kaynak.sistem {
    background: #f8f9fa;
    color: #333;
}

.avatar-kaynak i {
    margin-right: 3px;
}

.profil-detay {
    flex: 1;
}

.detay-row {
    display: flex;
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
}

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

.detay-label {
    width: 120px;
    color: #888;
    font-size: 14px;
}

.detay-value {
    flex: 1;
    color: #333;
    font-weight: 500;
}

.google-bilgi .detay-value {
    color: #4285f4;
}

.profil-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 200px;
}

.btn-profil-duzenle,
.btn-google-bagla {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s;
}

.btn-profil-duzenle {
    background: #667eea;
    color: white;
}

.btn-profil-duzenle:hover {
    background: #5a67d8;
    transform: translateY(-2px);
}

.btn-google-bagla {
    background: #4285f4;
    color: white;
}

.btn-google-bagla:hover {
    background: #357ae8;
    transform: translateY(-2px);
}

/* ========== SON SİPARİŞLER ========== */
.son-siparisler {
    background: white;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.son-siparisler-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.son-siparisler-header h3 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.tumunu-gor {
    color: #667eea;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
}

.tumunu-gor:hover {
    text-decoration: underline;
}

.siparis-listesi {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.siparis-item {
    display: flex;
    align-items: center;
    padding: 15px;
    background: #f8f9fa;
    border-radius: 8px;
    gap: 15px;
}

.siparis-no {
    flex: 2;
}

.siparis-no .label {
    display: block;
    color: #888;
    font-size: 11px;
    margin-bottom: 3px;
}

.siparis-no .value {
    font-weight: 600;
    color: #333;
    font-size: 14px;
}

.siparis-tarih {
    flex: 1;
    color: #666;
    font-size: 13px;
}

.siparis-tarih i {
    margin-right: 5px;
    color: #888;
}

.siparis-tutar {
    flex: 1;
    font-weight: 600;
    color: #333;
    font-size: 15px;
}

.siparis-durum {
    flex: 1;
}

.durum-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

.durum-hazırlanıyor {
    background: #fff3cd;
    color: #856404;
}

.durum-kargoda {
    background: #d1ecf1;
    color: #0c5460;
}

.durum-tamamlandı {
    background: #d4edda;
    color: #155724;
}

.durum-iptal {
    background: #f8d7da;
    color: #721c24;
}

.siparis-detay-link a {
    color: #667eea;
    font-size: 16px;
    padding: 5px 10px;
    border-radius: 4px;
    transition: all 0.3s;
}

.siparis-detay-link a:hover {
    background: #667eea;
    color: white;
}

/* ========== SİPARİŞLERİM SAYFASI ========== */
.siparislerim-page {
    padding: 50px 0;
    background: linear-gradient(135deg, #f5f7fa 0%, #e9ecef 100%);
    min-height: calc(100vh - 200px);
}

.siparislerim-header {
    margin-bottom: 40px;
}

.siparislerim-title {
    font-size: 32px;
    font-weight: 700;
    color: #2d3748;
    margin-bottom: 10px;
    position: relative;
    padding-bottom: 15px;
}

.siparislerim-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60px;
    height: 4px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 2px;
}

.siparislerim-count {
    color: #4a5568;
    font-size: 16px;
}

.siparislerim-count strong {
    color: #667eea;
    font-weight: 600;
}

.siparislerim-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.siparis-card {
    background: white;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.08);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.5);
    backdrop-filter: blur(5px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.siparis-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 40px rgba(102,126,234,0.15);
}

.siparis-header {
    padding: 20px 25px;
    background: linear-gradient(135deg, #f8fafc 0%, #edf2f7 100%);
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}

.siparis-header-left {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
    align-items: center;
}

.siparis-no {
    display: flex;
    flex-direction: column;
}

.siparis-no .label {
    font-size: 11px;
    color: #718096;
    margin-bottom: 3px;
}

.siparis-no .value {
    font-size: 15px;
    font-weight: 600;
    color: #2d3748;
    font-family: monospace;
}

.siparis-tarih {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #718096;
    font-size: 14px;
}

.siparis-tarih i {
    color: #667eea;
    font-size: 14px;
}

.siparis-durum {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 15px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 500;
    background: white;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.siparis-durum.durum-hazırlanıyor {
    background: #fef3c7;
    color: #92400e;
}

.siparis-durum.durum-kargoda {
    background: #e0f2fe;
    color: #0369a1;
}

.siparis-durum.durum-tamamlandı {
    background: #dcfce7;
    color: #166534;
}

.siparis-durum.durum-iptal {
    background: #fee2e2;
    color: #991b1b;
}

.siparis-durum i {
    font-size: 14px;
}

.siparis-body {
    padding: 20px 25px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.siparis-ozet {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}

.ozet-item {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.ozet-label {
    font-size: 11px;
    color: #718096;
    display: flex;
    align-items: center;
    gap: 5px;
}

.ozet-label i {
    color: #667eea;
    font-size: 12px;
}

.ozet-value {
    font-size: 14px;
    font-weight: 500;
    color: #2d3748;
}

.ozet-value.takip-no {
    color: #667eea;
    font-weight: 600;
}

.siparis-tutar {
    text-align: right;
}

.tutar-label {
    display: block;
    font-size: 11px;
    color: #718096;
    margin-bottom: 3px;
}

.tutar-value {
    font-size: 20px;
    font-weight: 700;
    color: #2d3748;
}

.siparis-footer {
    padding: 15px 25px;
    background: #f8fafc;
    border-top: 1px solid #edf2f7;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.btn-siparis-detay,
.btn-kargo-takip,
.btn-yorum-yap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    cursor: pointer;
}

.btn-siparis-detay {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    box-shadow: 0 4px 15px rgba(102,126,234,0.2);
}

.btn-siparis-detay:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(102,126,234,0.3);
}

.btn-kargo-takip {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%);
    color: white;
    box-shadow: 0 4px 15px rgba(40,167,69,0.2);
}

.btn-kargo-takip:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(40,167,69,0.3);
}

.btn-yorum-yap {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%);
    color: #2d3748;
    box-shadow: 0 4px 15px rgba(255,193,7,0.2);
}

.btn-yorum-yap:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255,193,7,0.3);
}

/* ========== BOŞ SİPARİŞ ========== */
.siparislerim-empty,
.siparis-yok {
    background: white;
    border-radius: 20px;
    padding: 60px 20px;
    text-align: center;
    box-shadow: 0 10px 40px rgba(0,0,0,0.08);
    border: 1px solid rgba(255,255,255,0.5);
}

.siparis-yok {
    padding: 40px;
    color: #888;
}

.siparis-yok i {
    font-size: 50px;
    margin-bottom: 15px;
    color: #ddd;
}

.empty-icon {
    font-size: 80px;
    color: #cbd5e0;
    margin-bottom: 20px;
}

.siparislerim-empty h2 {
    font-size: 24px;
    font-weight: 600;
    color: #2d3748;
    margin-bottom: 10px;
}

.siparislerim-empty p {
    color: #718096;
    font-size: 15px;
    margin-bottom: 25px;
}

.btn-alisverise-basla,
.btn-alisveris {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 35px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    text-decoration: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 500;
    transition: all 0.3s;
    box-shadow: 0 4px 15px rgba(102,126,234,0.2);
}

.btn-alisveris {
    padding: 10px 25px;
    font-size: 14px;
    border-radius: 6px;
}

.btn-alisverise-basla:hover,
.btn-alisveris:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(102,126,234,0.3);
}

/* ========== SAYFALAMA ========== */
.siparislerim-pagination {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.pagination-prev,
.pagination-next {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: white;
    color: #667eea;
    text-decoration: none;
    border-radius: 12px;
    font-size: 16px;
    transition: all 0.3s;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.pagination-prev:hover,
.pagination-next:hover {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(102,126,234,0.2);
}

.pagination-numbers {
    display: flex;
    gap: 8px;
}

.pagination-number {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    background: white;
    color: #4a5568;
    text-decoration: none;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.pagination-number:hover {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    transform: translateY(-2px);
}

.pagination-number.active {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    box-shadow: 0 8px 20px rgba(102,126,234,0.2);
}

.pagination-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    color: #718096;
    font-size: 14px;
}

/* ========== HIZLI İŞLEMLER ========== */
.hizli-islemler {
    background: white;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.hizli-islemler h3 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}

.islem-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.islem-card {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    color: #555;
    text-decoration: none;
    transition: all 0.3s;
    border: 1px solid transparent;
}

.islem-card:hover {
    background: white;
    border-color: #667eea;
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(102,126,234,0.2);
}

.islem-card i {
    font-size: 24px;
    color: #667eea;
    margin-bottom: 10px;
}

.islem-card span {
    display: block;
    font-size: 13px;
    font-weight: 500;
}

/* ========== RESPONSIVE ========== */
@media (max-width: 992px) {
    .hesabim-grid {
        grid-template-columns: 1fr;
    }
    
    .istatistik-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .islem-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .profil-widget-body {
        flex-direction: column;
        align-items: center;
    }
    
    .profil-detay {
        width: 100%;
    }
    
    .profil-actions {
        width: 100%;
    }
    
    .siparis-header-left {
        gap: 15px;
    }
    
    .siparis-ozet {
        gap: 20px;
    }
}

@media (max-width: 768px) {
    .hesabim-page,
    .siparislerim-page {
        padding: 30px 0;
    }
    
    .siparislerim-title {
        font-size: 28px;
    }
    
    .siparis-item {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .siparis-no {
        flex: 100%;
    }
    
    .siparis-tarih,
    .siparis-tutar,
    .siparis-durum {
        flex: 1;
    }
    
    .siparis-header {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .siparis-header-left {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        width: 100%;
    }
    
    .siparis-body {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .siparis-ozet {
        flex-direction: column;
        gap: 15px;
        width: 100%;
    }
    
    .ozet-item {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    
    .siparis-tutar {
        text-align: left;
        width: 100%;
    }
    
    .siparis-footer {
        justify-content: center;
    }
    
    .btn-siparis-detay,
    .btn-kargo-takip,
    .btn-yorum-yap {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .istatistik-grid {
        grid-template-columns: 1fr;
    }
    
    .islem-grid {
        grid-template-columns: 1fr;
    }
    
    .siparis-footer {
        flex-direction: column;
    }
    
    .btn-siparis-detay,
    .btn-kargo-takip,
    .btn-yorum-yap {
        width: 100%;
    }
    
    .pagination-numbers {
        gap: 5px;
    }
    
    .pagination-number {
        min-width: 35px;
        height: 35px;
        font-size: 13px;
    }
}

/* ========== SİPARİŞLERİM SAYFASI (siparis.css'ten taşınan stiller) ========== */

/* Filtreler */
.siparis-filtreler {
    background: white;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    align-items: center;
}

.filter-group {
    flex: 1;
    min-width: 200px;
}

.filter-group label {
    display: block;
    margin-bottom: 5px;
    font-size: 13px;
    color: #666;
    font-weight: 500;
}

.filter-select {
    width: 100%;
    padding: 10px 15px;
    border: 2px solid #e1e1e1;
    border-radius: 8px;
    font-size: 14px;
    color: #333;
    transition: all 0.3s;
}

.filter-select:focus {
    border-color: #667eea;
    outline: none;
}

.filter-temizle {
    padding: 10px 20px;
    background: #f0f0f0;
    color: #666;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    transition: all 0.3s;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.filter-temizle:hover {
    background: #e0e0e0;
    color: #333;
}

/* ========== SİPARİŞ DETAY SAYFASI ========== */
.siparis-detay-page {
    padding: 40px 0;
    background: #f8f9fa;
}

.siparis-detay-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.siparis-detay-title {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.btn-geri {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: white;
    color: #667eea;
    text-decoration: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    border: 2px solid #667eea;
    transition: all 0.3s;
}

.btn-geri:hover {
    background: #667eea;
    color: white;
}

.siparis-durum-card {
    background: white;
    border-radius: 12px;
    padding: 20px 30px;
    margin-bottom: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.durum-bilgi {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.durum-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.durum-icon.hazırlanıyor {
    background: #fff3cd;
    color: #856404;
}

.durum-icon.kargoda {
    background: #d1ecf1;
    color: #0c5460;
}

.durum-icon.tamamlandı {
    background: #d4edda;
    color: #155724;
}

.durum-icon.iptal {
    background: #f8d7da;
    color: #721c24;
}

.durum-text {
    display: flex;
    flex-direction: column;
}

.durum-label {
    font-size: 12px;
    color: #888;
    margin-bottom: 3px;
}

.durum-value {
    font-size: 18px;
    font-weight: 600;
}

.durum-value.hazırlanıyor {
    color: #856404;
}

.durum-value.kargoda {
    color: #0c5460;
}

.durum-value.tamamlandı {
    color: #155724;
}

.durum-value.iptal {
    color: #721c24;
}

.durum-tarih {
    color: #666;
    font-size: 14px;
}

.durum-tarih i {
    margin-right: 5px;
    color: #888;
}

/* ========== ADRESLERİM SAYFASI (profil-duzenle.php ve adreslerim.php için) ========== */

/* Adreslerim Header */
.adresler-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
}

.adresler-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.btn-yeni-adres {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 25px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s;
}

.btn-yeni-adres:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(102,126,234,0.4);
}

/* Boş Adres */
.adres-yok {
    background: white;
    border-radius: 12px;
    padding: 60px 20px;
    text-align: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.adres-yok i {
    font-size: 60px;
    color: #ddd;
    margin-bottom: 15px;
}

.adres-yok p {
    color: #666;
    font-size: 16px;
    margin-bottom: 20px;
}

.btn-adres-ekle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 30px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s;
}

.btn-adres-ekle:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(102,126,234,0.4);
}

/* Adres Grid */
.adresler-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.adres-card {
    background: white;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    border: 2px solid transparent;
    transition: all 0.3s;
    position: relative;
}

.adres-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.adres-card.varsayilan {
    border-color: #667eea;
    background: linear-gradient(135deg, #f8faff 0%, #ffffff 100%);
}

.varsayilan-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #667eea;
    color: white;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
}

.varsayilan-badge i {
    font-size: 12px;
}

.adres-tip {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    color: #667eea;
    font-size: 14px;
    font-weight: 500;
}

.adres-tip i {
    font-size: 16px;
}

.adres-baslik {
    margin-bottom: 10px;
}

.adres-baslik strong {
    font-size: 16px;
    color: #333;
}

.adres-detay p {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 15px;
}

.adres-telefon {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
}

.adres-telefon i {
    color: #667eea;
}

.adres-actions {
    display: flex;
    gap: 8px;
    margin-top: 15px;
    justify-content: flex-end;
}

.btn-varsayilan {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 15px;
    background: #f0f0f0;
    color: #333;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-varsayilan:hover {
    background: #667eea;
    color: white;
}

.btn-duzenle,
.btn-sil {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s;
    text-decoration: none;
}

.btn-duzenle {
    background: #e3f2fd;
    color: #1976d2;
}

.btn-duzenle:hover {
    background: #1976d2;
    color: white;
}

.btn-sil {
    background: #ffebee;
    color: #dc3545;
}

.btn-sil:hover {
    background: #dc3545;
    color: white;
}

/* ========== PROFİL DÜZENLEME FORMU ========== */
.profil-form-kutu {
    background: white;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.profil-form {
    max-width: 600px;
}

.alert {
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.alert-error {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

.alert-success {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.form-group {
    margin-bottom: 20px;
}

.form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.form-row .form-group {
    flex: 1;
    margin-bottom: 0;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

.form-group .required {
    color: #dc3545;
}

.form-control {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #e1e1e1;
    border-radius: 8px;
    font-size: 14px;
    transition: all 0.3s;
}

.form-control:focus {
    border-color: #667eea;
    outline: none;
    box-shadow: 0 0 0 3px rgba(102,126,234,0.1);
}

.form-control[readonly],
.form-control[disabled] {
    background: #f8f9fa;
    cursor: not-allowed;
}

.form-text {
    display: block;
    margin-top: 5px;
    font-size: 12px;
}

.text-muted {
    color: #888;
}

.checkbox-group {
    margin-bottom: 10px;
}

.checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.checkbox-text {
    font-size: 14px;
    color: #666;
}

.form-actions {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}

.btn-kaydet {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 35px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-kaydet:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(102,126,234,0.4);
}

/* ========== MODAL ========== */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.modal-content {
    background: white;
    border-radius: 12px;
    max-width: 400px;
    width: 90%;
    animation: modalSlideIn 0.3s;
}

@keyframes modalSlideIn {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header {
    padding: 20px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h3 {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.modal-close {
    background: none;
    border: none;
    font-size: 24px;
    color: #888;
    cursor: pointer;
    transition: all 0.3s;
}

.modal-close:hover {
    color: #333;
}

.modal-body {
    padding: 20px;
}

.modal-body p {
    color: #666;
    font-size: 15px;
    margin-bottom: 10px;
}

.modal-uyari {
    color: #dc3545 !important;
    font-size: 13px !important;
    font-weight: 500;
}

.modal-footer {
    padding: 20px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.btn-iptal,
.btn-onayla {
    padding: 10px 25px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s;
}

.btn-iptal {
    background: #f0f0f0;
    color: #666;
}

.btn-iptal:hover {
    background: #e0e0e0;
    color: #333;
}

.btn-onayla {
    background: #dc3545;
    color: white;
}

.btn-onayla:hover {
    background: #c82333;
    transform: translateY(-2px);
}

/* ========== RESPONSIVE EKLENTİLER ========== */
@media (max-width: 768px) {
    .adresler-grid {
        grid-template-columns: 1fr;
    }
    
    .siparis-detay-header {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
    
    .siparis-durum-card {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .durum-bilgi {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .profil-form {
        max-width: 100%;
    }
    
    .form-row {
        flex-direction: column;
        gap: 15px;
    }
    
    .btn-kaydet {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .adresler-header {
        flex-direction: column;
        gap: 15px;
        align-items: flex-start;
    }
    
    .btn-yeni-adres {
        width: 100%;
        justify-content: center;
    }
    
    .adres-actions {
        flex-wrap: wrap;
    }
    
    .btn-varsayilan {
        flex: 1;
        justify-content: center;
    }
    
    .modal-footer {
        flex-direction: column;
    }
    
    .btn-iptal,
    .btn-onayla {
        width: 100%;
    }
}