/* 1. ПЕРЕМЕННЫЕ И ТЕМЫ */
:root { 
    --bg: #f8fafc; --text: #0f172a; --card: #ffffff; --border: #e2e8f0; --primary: #2563eb; 
}
[data-theme="dark"] { 
    --bg: #0f172a; --text: #f8fafc; --card: #1e293b; --border: #334155; --primary: #6366f1; 
}
[data-theme="blind"] { 
    --bg: #000; --text: #ff0; --card: #000; --border: #fff; --primary: #fff; 
}

/* Принудительный желтый для слабовидящих */
[data-theme="blind"] * { color: #ff0 !important; }
[data-theme="blind"] button, [data-theme="blind"] .admin-btn, [data-theme="blind"] .t-btn, [data-theme="blind"] .tag,
[data-theme="blind"] .file-label, [data-theme="blind"] .btn-pub, [data-theme="blind"] .btn-del {
    background: #000 !important; color: #ff0 !important; border: 2px solid #fff !important;
}

/* 2. БАЗОВЫЕ СТИЛИ (ПК - 1.1rem) */
* { 
    box-sizing: border-box; margin: 0; padding: 0; 
    font-family: system-ui, -apple-system, sans-serif; 
    transition: background 0.3s, color 0.3s; 
    font-size: 1.1rem; 
    -webkit-tap-highlight-color: transparent;
}

body { background: var(--bg); color: var(--text); line-height: 1.4; overflow-x: hidden; }
.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* 3. ШАПКА */
.navbar { background: var(--card); height: 75px; display: flex; align-items: center; border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 1000; }
.navbar .container { display: flex; justify-content: space-between; width: 100%; align-items: center; }
.logo { font-weight: 800; text-decoration: none; color: var(--text); font-size: 1.3rem; }
.theme-switch { display: flex; gap: 5px; }
.t-btn { background: var(--border); border: none; padding: 8px 12px; border-radius: 8px; cursor: pointer; color: var(--text); }
.admin-btn { border: 2px solid var(--primary); padding: 8px 18px; border-radius: 20px; text-decoration: none; color: var(--primary); font-weight: bold; font-size: 1rem; }

/* 4. СЛАЙДЕР */
.slider-box { position: relative; height: 500px; overflow: hidden; background: #000; }
.slide { position: absolute; inset: 0; opacity: 0; transition: 1s; display: flex; align-items: center; justify-content: center; }
.slide.active { opacity: 1; }
.slide-img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: fill; z-index: 1; }

.slide-content { 
    position: relative; text-align: center; color: white; background: rgba(0,0,0,0.5); padding: 30px; 
    border-radius: 20px; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); max-width: 70%; 
    border: 1px solid rgba(255,255,255,0.1); z-index: 2; 
}
.slide-content h1 { font-size: 2.2rem; }

/* Стрелки (ПК) */
.arrow { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.2); border: none; color: white; font-size: 40px; width: 60px; height: 60px; border-radius: 50%; cursor: pointer; z-index: 10; display: flex; align-items: center; justify-content: center; outline: none; }
.arrow:hover { background: var(--primary); }
.prev { left: 20px; } .next { right: 20px; }

/* 5. КОНТЕНТ */
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; padding: 40px 0; }
.card { background: var(--card); padding: 30px; border-radius: 20px; border: 1px solid var(--border); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); }
.tag { background: var(--primary); color: white; display: inline-block; padding: 3px 10px; border-radius: 6px; font-size: 0.85rem; margin-bottom: 10px; font-weight: bold; }

/* 6. АДМИНКА */
.admin-container { max-width: 850px; margin: 30px auto; background: var(--card); padding: 30px; border-radius: 25px; border: 1px solid var(--border); box-shadow: 0 20px 40px rgba(0,0,0,0.1); }
.admin-header { display: flex !important; justify-content: space-between !important; align-items: center !important; width: 100% !important; margin-bottom: 25px; }

.up-zone { border: 2px dashed var(--primary); padding: 25px; text-align: center; border-radius: 20px; background: var(--bg); margin-bottom: 25px; }
.file-label { display: inline-block; padding: 12px 25px; background: var(--primary); color: #fff; border-radius: 12px; cursor: pointer; font-weight: bold; margin-bottom: 10px; font-size: 1rem; }
#fInput { display: none; }
/* Изменили font-weight с 900 на bold для соответствия file-label */
.btn-pub { width: 100%; max-width: 280px; padding: 14px; background: var(--primary); color: #fff; border: none; border-radius: 12px; cursor: pointer; font-weight: bold; font-size: 1rem; }

.admin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 15px; }
.admin-item { border-radius: 12px; overflow: hidden; background: #000; border: 1px solid var(--border); transition: 0.2s; }
.admin-item img { width: 100%; height: 100px; object-fit: cover; display: block; }
.btn-del { background: #ef4444; color: #fff; border: none; width: 100%; padding: 10px; cursor: pointer; font-weight: bold; font-size: 0.8rem; }

/* 7. МОБИЛЬНЫЕ ПРАВКИ (0.85rem) */
@media (max-width: 768px) {
    * { font-size: 0.85rem !important; }

    /* Убираем блюр и фон текста в слайдере */
    .slide-content { 
        background: transparent !important; 
        backdrop-filter: none !important; 
        -webkit-backdrop-filter: none !important; 
        border: none !important;
        padding: 0;
        text-shadow: 2px 2px 4px rgba(0,0,0,0.8); 
    }
    .slide-content h1 { font-size: 1.35rem !important; }

    /* Фикс стрелок: тапаем - появляется круг, потом плавно гаснет */
    .arrow { 
        width: 35px !important; height: 35px !important; 
        font-size: 18px !important; background: transparent !important; 
        transition: background 1s ease !important; 
    }
    .arrow:active { background: rgba(255, 255, 255, 0.3) !important; transition: background 0s !important; }
    .arrow:hover { background: transparent !important; }

    .admin-btn { position: relative; left: 5px; }
    .navbar { height: 65px; }
    .slider-box { height: 260px; }
    
    .admin-container { margin: 10px; padding: 15px; }
    .admin-grid { grid-template-columns: 1fr 1fr; }
}