/* Thème sombre sobre avec contraste suffisant */
:root {
    --bg-body: #0f1115;
    --bg-surface: #161a22;
    --bg-surface-2: #1c2230;
    --text-primary: #e6e6e6;
    --text-secondary: #a8b0bd;
    --border-color: #2a2f3a;
    --link: #8bb4ff;
    --link-hover: #b2ceff;
    --focus-ring: rgba(110, 168, 254, 0.45);

    /* Couleurs Mécaniques */
    --accent-orange: #ff6b35; /* Orange industriel */
    --accent-blue: #2d5bff;   /* Bleu garage professionnel */
    --metal-light: #4e5561;
    --metal-dark: #2a2f3a;
}

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&family=Roboto:wght@400;700&display=swap');

html, body {
    height: 100%;
}

body {
    background-color: var(--bg-body);
    color: var(--text-primary);
    font-family: 'Roboto', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, .navbar-brand, .btn, .nav-link {
    font-family: 'Roboto Condensed', sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Liens */
a { color: var(--link); }
a:hover, a:focus { color: var(--link-hover); }

/* Accessibilité focus */
*:focus-visible {
    outline: 2px solid var(--link);
    outline-offset: 2px;
    box-shadow: 0 0 0 .25rem var(--focus-ring);
}

/* Surfaces Bootstrap fréquemment utilisées dans le site */
.bg-light { background-color: var(--bg-surface) !important; }
.bg-white { background-color: var(--bg-surface-2) !important; }
.text-secondary { color: var(--text-secondary) !important; }

/* Séparateurs et bordures */
.border, .border-top, .border-bottom, .border-start, .border-end,
.card, .card-header, .navbar, .form-control, .form-select {
    border-color: var(--border-color) !important;
}

/* Navbar (le template utilise navbar-light bg-light) */
.navbar-light { background-color: var(--bg-surface) !important; }
.navbar-light .navbar-brand,
.navbar-light .navbar-nav .nav-link,
.navbar-light .navbar-text {
    color: var(--text-primary) !important;
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
    color: var(--link) !important;
}
.navbar-light .navbar-toggler {
    border-color: var(--border-color);
}
.navbar-light .navbar-toggler-icon {
    filter: invert(85%);
}

/* Cartes */
.card {
    background-color: var(--bg-surface-2);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.card:hover {
    border-color: var(--accent-blue);
    transform: translateY(-5px);
}

.card-header {
    background-color: var(--bg-surface);
    color: var(--text-primary);
    font-weight: bold;
    border-bottom: 2px solid var(--accent-blue);
}

.card-body i {
    color: var(--accent-orange);
    margin-bottom: 1rem;
}
.card .text-secondary { color: var(--text-secondary) !important; }

/* Boutons */
.btn-primary {
    background-color: var(--accent-blue);
    border-color: var(--accent-blue);
}
.btn-primary:hover {
    background-color: #1a46e6;
    border-color: #1a46e6;
}
.btn-success {
    background-color: #28a745;
    border-color: #28a745;
}

/* Badges (pour s'assurer d'un contraste lisible sur fond sombre générique) */
.badge.text-bg-primary { background-color: var(--accent-blue) !important; color: #fff !important; }
.badge.text-bg-secondary { background-color: var(--metal-light) !important; color: #fff !important; }

/* Sections spécifiques */
#hero {
    background-color: var(--bg-surface-2) !important;
    border-bottom: 2px solid var(--accent-blue);
}
#services { background-color: var(--bg-surface) !important; }
#process {
    background-color: var(--bg-body);
}
#process .badge {
    font-size: 1.2rem;
    padding: 0.5rem 0.8rem;
    border-radius: 4px;
    background-color: var(--accent-orange) !important;
}
/* Pricing */
#pricing .card {
    border-width: 2px;
}
#pricing .card-header {
    text-align: center;
    font-size: 1.25rem;
}
#pricing .btn {
    border-radius: 0;
    font-weight: bold;
}

/* Témoignages */
#testimonials {
    background: linear-gradient(135deg, var(--bg-surface-2) 0%, var(--bg-body) 100%) !important;
}

/* Footer & Contact */
#contact {
    border-top: 3px solid var(--accent-orange);
}

/* Formulaires */
.form-label { color: var(--text-primary); }
.form-control,
.form-select,
textarea,
input[type="text"],
input[type="tel"],
input[type="email"] {
    color: var(--text-primary);
    background-color: #0f141d; /* légèrement plus clair que body pour différencier */
    border-color: var(--border-color);
}

.form-control::placeholder { color: #7f8896; }
.form-control:focus,
.form-select:focus,
textarea:focus,
input:focus {
    color: var(--text-primary);
    background-color: #111723;
    border-color: #4d6bfe;
    box-shadow: 0 0 0 .25rem var(--focus-ring);
}

/* Boutons outline pour lisibilité sur fond sombre */
.btn-outline-primary {
    color: #9bbcff;
    border-color: #4d6bfe;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
    color: #fff;
    background-color: #4d6bfe;
    border-color: #4d6bfe;
}

/* Blockquote et citations */
.blockquote { color: var(--text-primary); }
.blockquote-footer { color: var(--text-secondary); }

/* Carousel contrôles visibles sur sombre */
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: invert(90%);
}
