/* AGRO MARKET PREMIUM DIZAYN (YASHIL AGRO) - Toliq o'zgartirildi */
:root {
    --agro-bg: #f4f5f7; 
    --agro-white: #ffffff; 
    --agro-text: #1d1d1f; 
    --agro-gray: #8a92a6; 
    --agro-primary: #00B96B; 
    --agro-primary-light: #e8f5e9; 
    --agro-border: #eaebf0;
    --vip-gold: #f1c40f; 
    --vip-silver: #bdc3c7; 
    --vip-bronze: #cd7f32;
}

* { 
    box-sizing: border-box; 
    -webkit-tap-highlight-color: transparent; 
}
body { 
    font-family: 'Inter', sans-serif; 
    background: var(--agro-bg); 
    margin: 0; 
    padding: 0; 
    color: var(--agro-text); 
}

.desktop-container {
    max-width: 100%; 
    width: 100%;
    margin: 0 auto;
    background: var(--agro-bg);
    min-height: 100vh;
    position: relative;
    padding-bottom: 90px;
    overflow-x: hidden;
}

/* Menyular dizayni */
.milliy-menu-item { 
    display: flex; 
    align-items: center; 
    padding: 16px 20px; 
    border-bottom: 1px solid var(--agro-border); 
    cursor: pointer; 
    background: var(--agro-white); 
    transition: background 0.1s; 
}
.milliy-menu-item:active { background: #f8f9fa; }
.milliy-menu-item i:first-child { 
    font-size: 24px; 
    margin-right: 15px; 
    color: var(--agro-text); 
}
.milliy-menu-item span { 
    font-size: 15px; 
    font-weight: 600; 
    color: var(--agro-text); 
    flex: 1;
}
.milliy-menu-item .arrow { 
    margin-left: auto; 
    font-size: 22px; 
    color: var(--agro-gray); 
}

/* Kichik Modallar */
.modal-overlay { 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0,0,0,0.6); 
    z-index: 9999; 
    display: none; 
    align-items: center; 
    justify-content: center; 
    opacity: 0; 
    transition: opacity 0.2s; 
    backdrop-filter: blur(2px); 
}
.modal-content { 
    background: var(--agro-white); 
    padding: 25px; 
    border-radius: 20px; 
    box-shadow: 0 10px 30px rgba(0,0,0,0.15); 
    width: 90%; 
    max-width: 400px; 
    transform: translateY(20px); 
    transition: transform 0.2s; 
    max-height: 85vh; 
    display: flex; 
    flex-direction: column; 
    overflow-y:auto;
} 
.modal-input { 
    width: 100%; 
    padding: 14px 16px; 
    border-radius: 12px; 
    border: 1px solid var(--agro-border); 
    font-size: 14px; 
    outline: none; 
    margin-bottom: 15px; 
    background: #fafafa; 
}
.modal-input:focus { 
    border-color: var(--agro-primary); 
    background: white; 
    box-shadow: 0 0 0 3px rgba(0,185,107,0.1); 
}

.btn-primary { 
    background: var(--agro-primary); 
    color: white; 
    border: none; 
    padding: 14px; 
    border-radius: 12px; 
    font-weight: 700; 
    width: 100%; 
    cursor: pointer; 
    transition: 0.1s; 
    font-size: 15px;
}
.btn-primary:active { transform: scale(0.98); }
.btn-secondary { 
    background: #f4f5f7; 
    color: var(--agro-gray); 
    border: none; 
    padding: 14px; 
    border-radius: 12px; 
    font-weight: 700; 
    width: 100%; 
    cursor: pointer; 
    transition: 0.1s; 
    margin-top: 10px; 
    font-size: 15px;
}

/* Pastki menyu */
.bottom-nav { 
    display: flex; 
    justify-content: space-around; 
    padding: 10px 0; 
    background: rgba(255,255,255,0.98); 
    position: fixed; 
    bottom: 0; 
    left:0; 
    width: 100%; 
    box-shadow: 0 -5px 15px rgba(0,0,0,0.05); 
    z-index: 100; 
    border-top: 1px solid #f1f2f6; 
}
.nav-item { 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    color: var(--agro-gray); 
    font-size: 11px; 
    font-weight: 600; 
    cursor: pointer; 
    text-decoration: none; 
    transition: color 0.2s; 
    position: relative; 
}
.nav-item i { font-size: 24px; margin-bottom: 4px; }
.nav-item.active { color: var(--agro-primary); }

/* ==============================================================
   100% FULL SCREEN MODALLAR (ORQA QORA FONSIZ)
   ============================================================== */
.modal-full-screen {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; 
    background: var(--agro-bg); 
    z-index: 10000; align-items: flex-start; justify-content: center;
    opacity: 0; transition: opacity 0.3s ease;
    display: none;
}
.modal-full-screen.open { opacity: 1; }

.modal-full-content {
    background: var(--agro-bg); 
    width: 100%; height: 100%; 
    max-width: 100%; 
    border-radius: 0; 
    display: flex; flex-direction: column;
    transition: transform 0.3s ease-out;
    position: relative; box-shadow: none;
    overflow: hidden;
    transform: translateX(100%);
}
.modal-full-screen.open .modal-full-content { transform: translateX(0); }

.edit-profile-header { 
    background: var(--agro-white); 
    padding: 15px 20px; 
    border-bottom: 1px solid var(--agro-border); 
    display: flex; 
    align-items: center; 
    gap: 15px; 
    position: sticky; 
    top: 0; 
    z-index: 10; 
    box-shadow: 0 2px 10px rgba(0,0,0,0.03); 
}
.edit-profile-header i { font-size: 28px; cursor: pointer; color: var(--agro-text); }
.edit-profile-header h3 { margin: 0; font-size: 18px; font-weight: 800; flex: 1; text-align: left; color: var(--agro-text); }

.edit-form-container { padding: 20px; flex: 1; overflow-y: auto; background: var(--agro-bg); }
.edit-form-group { margin-bottom: 18px; }
.edit-form-label { display: block; font-size: 14px; font-weight: 700; color: #555; margin-bottom: 8px; margin-left: 5px; }
.edit-form-input { 
    width: 100%; 
    padding: 15px 16px; 
    border-radius: 14px; 
    border: 1px solid var(--agro-border); 
    font-size: 16px; 
    background: white; 
    font-family: 'Inter', sans-serif; 
    box-shadow: 0 4px 10px rgba(0,0,0,0.03); 
    outline: none; 
    transition: 0.2s; 
    font-weight: 600; 
    color: var(--agro-text); 
}
.edit-form-input:focus { border-color: var(--agro-primary); box-shadow: 0 4px 15px rgba(0,185,107, 0.1); }

.edit-gender-switch { display: flex; background: white; border-radius: 14px; padding: 5px; box-shadow: 0 4px 10px rgba(0,0,0,0.03); }
.edit-gender-btn { flex: 1; text-align: center; padding: 12px; font-size: 15px; font-weight: 700; cursor: pointer; border-radius: 10px; color: var(--agro-gray); transition: 0.2s; }
.edit-gender-btn.active { background: var(--agro-bg); color: var(--agro-text); box-shadow: 0 2px 5px rgba(0,0,0,0.05); }

.edit-delete-btn { 
    color: #e74c3c; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    gap: 8px; 
    padding: 15px; 
    width: 100%; 
    font-weight: 700; 
    font-size: 16px; 
    margin-top: 20px; 
    cursor: pointer; 
    background: transparent; 
    border: none; 
}

/* Tungi rejim tugmasi stili */
.switch-mini { position: relative; display: inline-block; width: 44px; height: 24px; margin-left: auto; }
.switch-mini input { opacity: 0; width: 0; height: 0; }
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #cbd5e1; transition: .4s; border-radius: 34px; }
.slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
input:checked + .slider { background-color: var(--agro-primary); }
input:checked + .slider:before { transform: translateX(20px); }

/* Yordam (Info) sahifasining menyulari uchun dizayn */
.info-menu-item { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--agro-border); font-size: 15px; font-weight: 600; color: var(--agro-text); cursor: pointer; background: white; margin-bottom: 8px; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.02);}
.info-menu-item i { color: var(--agro-gray); font-size: 20px; }
.faq-text-content h4 { margin: 0 0 10px 0; font-size: 16px; color: var(--agro-primary); }
.faq-text-content p { font-size: 14px; color: #555; line-height: 1.6; margin-bottom: 15px; }

/* CHAT DIZAYNI */
.chat-container { display: flex; flex-direction: column; height: 100%; background: #e5ddd5; }
.chat-messages { flex: 1; padding: 20px; overflow-y: auto; display: flex; flex-direction: column; gap: 15px; }
.msg-bubble { max-width: 80%; padding: 12px 16px; border-radius: 16px; font-size: 14px; line-height: 1.4; position: relative; }
.msg-admin { background: white; color: var(--agro-text); align-self: flex-start; border-bottom-left-radius: 4px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.msg-user { background: #dcf8c6; color: #1d1d1f; align-self: flex-end; border-bottom-right-radius: 4px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.chat-input-area { background: #f0f0f0; padding: 15px; display: flex; gap: 10px; align-items: center; }
.chat-input { flex: 1; border: none; padding: 14px 20px; border-radius: 30px; font-size: 15px; outline: none; }
.chat-send-btn { width: 45px; height: 45px; background: var(--agro-primary); color: white; border: none; border-radius: 50%; font-size: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: 0.2s; box-shadow: 0 4px 10px rgba(0,185,107,0.3); }
.chat-send-btn:active { transform: scale(0.9); }

/* VIP BADGE */
.vip-badge {
    background: linear-gradient(135deg, #f1c40f, #f39c12);
    color: white; padding: 4px 10px; border-radius: 12px; font-size: 10px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 1px; box-shadow: 0 4px 10px rgba(241,196,15,0.4);
    display: inline-flex; align-items: center; gap: 4px; margin-top: 5px; border: 1px solid rgba(255,255,255,0.5);
}

/* YANGLIK: Agro Chat Bot Suzuvchi tugmasi (FAB) */
.agro-chat-fab {
    position: fixed;
    bottom: 90px; 
    right: 20px;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #00B96B, #00995c);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 0 10px 25px rgba(0, 185, 107, 0.4);
    cursor: pointer;
    z-index: 999;
    transition: transform 0.2s;
}
.agro-chat-fab:active { transform: scale(0.95); }
.agro-chat-badge {
    position: absolute;
    top: 0;
    right: 0;
    background: #e74c3c;
    color: white;
    font-size: 11px;
    font-weight: 800;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid var(--agro-bg);
}

/* QO'SHILDI: Google Translate xunuk panellari va bo'shliqlarni yo'q qilish uchun CSS */
body { top: 0px !important; position: static !important; }
.skiptranslate iframe { display: none !important; }
.goog-te-banner-frame { display: none !important; }
.goog-tooltip { display: none !important; }
.goog-tooltip:hover { display: none !important; }
.goog-text-highlight { background-color: transparent !important; border: none !important; box-shadow: none !important; }

/* QO'SHILDI: Tablar uchun dizayn */
.tab-container {
    display: flex;
    background: var(--agro-white);
    border-radius: 12px;
    padding: 5px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    margin-bottom: 20px;
}
.tab-btn {
    flex: 1;
    text-align: center;
    padding: 12px;
    font-size: 15px;
    font-weight: 600;
    color: var(--agro-gray);
    cursor: pointer;
    border-radius: 8px;
    transition: 0.3s;
}
.tab-btn.active {
    background: var(--agro-primary-light);
    color: var(--agro-primary);
}
.tab-content { display: none; }
.tab-content.active { display: block; }

/* QO'SHILDI: Buyurtmalar tabi dizayni */
.orders-tabs {
    display: flex;
    background: white;
    padding: 5px;
    border-radius: 12px;
    margin-bottom: 20px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.03);
    border: 1px solid var(--agro-border);
}
.order-tab-btn {
    flex: 1;
    text-align: center;
    padding: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    border-radius: 8px;
    color: var(--agro-gray);
    transition: 0.2s;
}
.order-tab-btn.active {
    background: var(--agro-primary-light);
    color: var(--agro-primary);
}
.orders-content { display: none; }
.orders-content.active { display: block; }