/* Цветовая схема (Темная тема) - Фирменный красный */

:root {
    --dark-bg: #0f172a; /* slate-900 */
    --dark-surface: #1e293b; /* slate-800 */
    --dark-border: #334155; /* slate-700 */
    --dark-text-primary: #e2e8f0; /* slate-200 */
    --dark-text-secondary: #94a3b8; /* slate-400 */
    --brand-accent: #b91c1c; /* red-700 */
    --brand-accent-hover: #991b1b; /* red-800 */
}

body {
    background-color: var(--dark-bg) !important;
    color: var(--dark-text-primary) !important;
}

/* Стили для "бенто-боксов" */
.bento-box {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-border) !important;
}

/* Стили для контейнера карты */
#map-container {
    border-color: var(--dark-border) !important;
}

/* Стили для ползунков калькулятора */
input[type=range] {
    background: var(--dark-border) !important;
}

input[type=range]::-webkit-slider-thumb {
    background: var(--brand-accent) !important;
}

input[type=range]::-moz-range-thumb {
    background: var(--brand-accent) !important;
}

/* Навигация */
/* Этот блок стилей специально переопределяет класс .bg-white/80 из HTML.
   Мы используем более конкретный селектор (nav.sticky), чтобы повысить
   приоритет этого стиля над стилями Tailwind и применить темный фон. */
nav.sticky {
    background-color: rgba(15, 23, 42, 0.8) !important; /* slate-900 с прозрачностью */
    border-bottom: 1px solid var(--dark-border) !important;
}

nav a.nav-link,
#mobile-menu a {
    color: var(--dark-text-secondary) !important;
}

nav a.nav-link:hover,
#mobile-menu a:hover {
    color: white !important;
}

/* Стили для новой кнопки переключения темы */
nav button.nav-link {
    color: var(--dark-text-secondary) !important;
}
nav button.nav-link:hover {
    color: white !important;
}


nav .border-l {
    border-color: var(--dark-border) !important;
}

nav .text-slate-800 {
    color: var(--dark-text-primary) !important;
}

nav .bg-red-700,
#mobile-menu .bg-red-700 {
    background-color: var(--brand-accent) !important;
    color: white !important;
}
nav .bg-red-700:hover,
#mobile-menu .bg-red-700:hover {
    background-color: var(--brand-accent-hover) !important;
}

/* Главный экран */
#hero {
    background-image: linear-gradient(to bottom right, #7f1d1d, #0f172a) !important; /* from-red-800 to-slate-900 */
    color: white !important;
}
#hero p {
    color: #fca5a5 !important; /* red-200 */
}
#hero-contact-btn {
    background-color: white !important;
    color: #7f1d1d !important; /* red-800 */
}
#hero-contact-btn:hover {
    background-color: #f1f5f9 !important; /* slate-100 */
}


/* Факты о компании */
.bento-box.bg-red-700 {
    background-color: var(--brand-accent) !important;
    color: white !important;
}
.bento-box.bg-slate-700 {
    background-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}
.bento-box.bg-stone-200 {
    background-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}

.bento-box .text-slate-800 {
    color: var(--dark-text-primary) !important;
}

/* Партнеры */
section.bento-box h2 {
    color: var(--dark-text-primary) !important;
}
.partner-name {
    color: var(--dark-text-secondary) !important;
}

/* Калькулятор */
#calculator label {
    color: var(--dark-text-primary) !important;
}
#calculator .border-b {
    border-color: var(--dark-border) !important;
}
.tab-btn.border-red-700 {
    border-color: var(--brand-accent) !important;
    color: var(--brand-accent) !important;
}
.tab-btn {
    color: var(--dark-text-secondary) !important;
}
.tab-btn:hover {
    color: var(--dark-text-primary) !important;
    border-color: var(--dark-border) !important;
}
#ff-orders-input, #ff-weight-input, #ff-storage-input,
#pickup-count-input, #return-count-input, #storage-area-input,
#transport-distance-input, #transport-weight-input,
#cargo-weight-input, #cargo-volume-input {
    color: var(--brand-accent) !important;
    background-color: var(--dark-surface) !important;
}
#storage-type, #delivery-type {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}
#storage-type:focus, #delivery-type:focus {
    --tw-ring-color: #ef4444 !important; /* ring-red-500 */
}
#calculator .bg-stone-100 { /* Правая часть калькулятора */
    background-color: var(--dark-bg) !important;
}
#estimated-cost {
    color: var(--dark-text-primary) !important;
}
#estimated-cost + p {
    color: #64748b !important; /* slate-500 */
}
#get-quote-btn {
    background-color: var(--brand-accent) !important;
    color: white !important;
}
#get-quote-btn:hover {
    background-color: var(--brand-accent-hover) !important;
}
#learn-more-btn {
    color: var(--dark-text-secondary) !important;
}
#learn-more-btn:hover {
    color: var(--brand-accent) !important;
}

/* Преимущества, Миссия */
#advantages {
    background-color: var(--dark-surface) !important;
    color: white !important;
}
.bento-box h3, .bento-box h3.text-slate-800 {
    color: var(--dark-text-primary) !important;
}
.bento-box p, .bento-box h3 + p, .bento-box .text-slate-600 {
    color: var(--dark-text-secondary) !important;
}

/* Процесс и Отзывы */
#process .flex-shrink-0.bg-stone-100 {
    background-color: var(--dark-bg) !important;
}
#process .flex-shrink-0 .text-slate-800 {
    color: var(--dark-text-primary) !important;
}
#process h4, #process .text-slate-900 {
    color: var(--dark-text-primary) !important;
}
#process .text-slate-500 {
    color: var(--dark-text-secondary) !important;
}
#testimonials h3, #testimonials .text-slate-800 {
    color: var(--dark-text-primary) !important;
}
#testimonials .bg-white {
    background-color: var(--dark-surface) !important;
}
#testimonials .text-slate-400 {
    color: var(--dark-text-secondary) !important;
}
#testimonials blockquote p, #testimonials .text-slate-700 {
    color: var(--dark-text-primary) !important;
}
#testimonials blockquote footer, #testimonials .text-slate-500 {
    color: var(--dark-text-secondary) !important;
    font-weight: 500 !important;
}

/* Отзывы партнеров */
.testimonial-card {
    background-color: var(--dark-bg) !important;
    padding: 1rem !important;
    border-radius: 0.75rem !important;
    border: 1px solid var(--dark-border) !important;
}


/* Карусель */
#prev-btn, #next-btn {
    color: var(--dark-text-secondary) !important;
}
#prev-btn:hover, #next-btn:hover {
    color: var(--brand-accent) !important;
}
#carousel-dots button {
    background-color: var(--dark-border) !important;
}
#carousel-dots button.bg-red-700 {
    background-color: var(--brand-accent) !important;
}
#team-carousel .text-slate-800 {
    color: var(--dark-text-primary) !important;
}
#team-carousel .text-slate-600 {
    color: var(--dark-text-secondary) !important;
}

/* Вакансии */
#careers a {
    background-color: var(--brand-accent) !important;
    color: white !important;
}
#careers a:hover {
    background-color: var(--brand-accent-hover) !important;
}

/* Карта */
#city-list li {
    color: var(--dark-text-secondary) !important;
}
#city-list li:hover {
    color: var(--brand-accent) !important;
}

/* FAQ */
details {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-border) !important;
}
details[open] {
    background-color: var(--dark-bg) !important;
}
details > summary {
    color: var(--dark-text-primary) !important;
}

/* Контакты */
#contact {
    background-image: linear-gradient(to bottom right, #1e293b, #0f172a) !important;
    color: white !important;
}
#contact h2 {
    color: var(--dark-text-primary) !important;
}
#contact input, #contact textarea {
    background-color: #0f172a !important; /* slate-900 */
    border-color: var(--dark-border) !important;
    color: white !important;
}
#contact input::placeholder,
#contact textarea::placeholder {
  color: var(--dark-text-secondary) !important;
}
#contact input:focus, #contact textarea:focus {
    --tw-ring-color: #ef4444 !important; /* ring-red-500 */
}
#contact-email-error, #contact-phone-error {
    color: #f87171 !important; /* red-400 */
}
#contact button {
    background-color: var(--brand-accent) !important;
}
#contact button:hover {
    background-color: var(--brand-accent-hover) !important;
}

/* Футер */
footer .text-red-400 {
    color: #f87171 !important;
}
footer .text-slate-400 {
    color: var(--dark-text-secondary) !important;
}
footer a.text-slate-400:hover {
    color: white !important;
}
footer .text-slate-300 {
    color: #d1d5db !important;
}
footer .text-slate-500 {
    color: #64748b !important;
}
footer .text-slate-500 a:hover {
    color: white !important;
}

/* Модальные окна */
.modal-overlay {
    background-color: rgba(0, 0, 0, 0.7) !important;
}
.modal-content {
    background-color: var(--dark-surface) !important;
}
#modal-title, .modal-content h2, #city-modal-title {
    color: var(--dark-text-primary) !important;
}
.modal-close-btn {
    color: var(--dark-text-secondary) !important;
}
.modal-close-btn:hover {
    color: var(--dark-text-primary) !important;
}
#modal-description, .modal-content p, #city-modal-content {
    color: var(--dark-text-secondary) !important;
}
.modal-content .border-t {
    border-color: var(--dark-border) !important;
}
.modal-content form input, .modal-content form textarea {
    background-color: var(--dark-bg) !important;
    border-color: var(--dark-border) !important;
    color: var(--dark-text-primary) !important;
}
.modal-content form input:focus, .modal-content form textarea:focus {
    --tw-ring-color: #ef4444 !important; /* ring-red-500 */
}
#service-email-error, #service-phone-error,
#partnership-email-error, #partnership-phone-error {
    color: #ef4444 !important; /* red-500 */
}
.modal-content form button {
    background-color: var(--brand-accent) !important;
    color: white !important;
}
.modal-content form button:hover {
    background-color: var(--brand-accent-hover) !important;
}
#city-modal-content p strong {
    color: var(--dark-text-primary) !important;
}

/* Уведомление */
#notification.bg-green-500 {
    background-color: #22c55e !important;
    color: white !important;
}
#notification.bg-red-500 {
    background-color: #ef4444 !important;
    color: white !important;
}