/* Background Styles - Modifier ce fichier pour changer le background de toutes les pages */

body::before {
    content: '';
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image:
        url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080"><defs><linearGradient id="skyGrad" x1="0%" y1="0%" x2="0%" y2="100%"><stop offset="0%" style="stop-color:%23f8f9fa;stop-opacity:1" /><stop offset="100%" style="stop-color:%23e9ecef;stop-opacity:1" /></linearGradient></defs><rect width="1920" height="1080" fill="url(%23skyGrad)"/><g opacity="0.15"><rect x="80" y="500" width="120" height="580" fill="%23adb5bd"/><rect x="220" y="350" width="140" height="730" fill="%23989aa2"/><rect x="380" y="420" width="110" height="660" fill="%23adb5bd"/><rect x="510" y="280" width="160" height="800" fill="%23868e96"/><rect x="690" y="380" width="130" height="700" fill="%23adb5bd"/><rect x="840" y="320" width="150" height="760" fill="%23989aa2"/><rect x="1010" y="450" width="120" height="630" fill="%23adb5bd"/><rect x="1150" y="200" width="180" height="880" fill="%23868e96"/><rect x="1350" y="380" width="140" height="700" fill="%23adb5bd"/><rect x="1510" y="300" width="160" height="780" fill="%23989aa2"/><rect x="1690" y="480" width="110" height="600" fill="%23adb5bd"/></g><g opacity="0.2"><rect x="100" y="520" width="25" height="25" fill="%236366f1"/><rect x="135" y="520" width="25" height="25" fill="%236366f1"/><rect x="100" y="555" width="25" height="25" fill="%236366f1"/><rect x="135" y="555" width="25" height="25" fill="%236366f1"/><rect x="100" y="590" width="25" height="25" fill="%236366f1"/><rect x="135" y="590" width="25" height="25" fill="%236366f1"/><rect x="240" y="370" width="25" height="25" fill="%238b5cf6"/><rect x="275" y="370" width="25" height="25" fill="%238b5cf6"/><rect x="310" y="370" width="25" height="25" fill="%238b5cf6"/><rect x="240" y="405" width="25" height="25" fill="%238b5cf6"/><rect x="275" y="405" width="25" height="25" fill="%238b5cf6"/><rect x="310" y="405" width="25" height="25" fill="%238b5cf6"/><rect x="240" y="440" width="25" height="25" fill="%238b5cf6"/><rect x="275" y="440" width="25" height="25" fill="%238b5cf6"/><rect x="310" y="440" width="25" height="25" fill="%238b5cf6"/><rect x="530" y="300" width="25" height="25" fill="%236366f1"/><rect x="565" y="300" width="25" height="25" fill="%236366f1"/><rect x="600" y="300" width="25" height="25" fill="%236366f1"/><rect x="635" y="300" width="25" height="25" fill="%236366f1"/><rect x="530" y="335" width="25" height="25" fill="%236366f1"/><rect x="565" y="335" width="25" height="25" fill="%236366f1"/><rect x="600" y="335" width="25" height="25" fill="%236366f1"/><rect x="635" y="335" width="25" height="25" fill="%236366f1"/><rect x="530" y="370" width="25" height="25" fill="%236366f1"/><rect x="565" y="370" width="25" height="25" fill="%236366f1"/><rect x="600" y="370" width="25" height="25" fill="%236366f1"/><rect x="635" y="370" width="25" height="25" fill="%236366f1"/><rect x="1170" y="220" width="25" height="25" fill="%238b5cf6"/><rect x="1205" y="220" width="25" height="25" fill="%238b5cf6"/><rect x="1240" y="220" width="25" height="25" fill="%238b5cf6"/><rect x="1275" y="220" width="25" height="25" fill="%238b5cf6"/><rect x="1170" y="255" width="25" height="25" fill="%238b5cf6"/><rect x="1205" y="255" width="25" height="25" fill="%238b5cf6"/><rect x="1240" y="255" width="25" height="25" fill="%238b5cf6"/><rect x="1275" y="255" width="25" height="25" fill="%238b5cf6"/><rect x="1170" y="290" width="25" height="25" fill="%238b5cf6"/><rect x="1205" y="290" width="25" height="25" fill="%238b5cf6"/><rect x="1240" y="290" width="25" height="25" fill="%238b5cf6"/><rect x="1275" y="290" width="25" height="25" fill="%238b5cf6"/><rect x="1170" y="325" width="25" height="25" fill="%238b5cf6"/><rect x="1205" y="325" width="25" height="25" fill="%238b5cf6"/><rect x="1240" y="325" width="25" height="25" fill="%238b5cf6"/><rect x="1275" y="325" width="25" height="25" fill="%238b5cf6"/></g></svg>'),
        radial-gradient(circle at 20% 30%, rgba(99, 102, 241, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(139, 92, 246, 0.08) 0%, transparent 50%);
    background-size: cover, cover, cover, cover;
    background-position: center bottom, center, center, center;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    pointer-events: none;
    z-index: 0;
    animation: subtlePulse 20s ease-in-out infinite;
}

@keyframes subtlePulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.8;
    }
}

/* Nuages désactivés - Supprimé à la demande de l'utilisateur */

/* Taille de police standard rétablie */
html {
    font-size: 100% !important;
}

/* Réduction des paddings et margins */
* {
    box-sizing: border-box;
}

/* Navigation */
.nav-container,
nav .nav-container {
    padding: 1.2rem 1.6rem !important;
}

.logo {
    font-size: 1.2rem !important;
}

.nav-links {
    gap: 2rem !important;
}

.nav-links a {
    font-size: 0.8rem !important;
}

.nav-cta {
    padding: 0.6rem 1.2rem !important;
    font-size: 0.85rem !important;
}

/* Hero Section */
.hero {
    padding-top: 64px !important;
}

.hero h1 {
    font-size: clamp(1.76rem, 4.8vw, 3.2rem) !important;
    margin-bottom: 1.2rem !important;
}

.hero p {
    font-size: clamp(0.76rem, 1.6vw, 0.88rem) !important;
    margin-bottom: 2rem !important;
}

/* Buttons */
.btn {
    padding: 0.8rem 2rem !important;
    font-size: 0.85rem !important;
}

/* Sections */
section {
    padding: 3.6rem 1.6rem !important;
}

.section-title {
    font-size: clamp(2.5rem, 6vw, 4rem) !important;
    margin-bottom: 1.5rem !important;
    font-weight: 800 !important;
}

.section-subtitle {
    font-size: 0.8rem !important;
    margin-bottom: 2.8rem !important;
}

/* Services */
.services-grid {
    gap: 1.6rem !important;
    margin-top: 2.4rem !important;
}

.service-card {
    padding: 1.6rem !important;
}

.service-icon {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 1.2rem !important;
}

.service-icon svg {
    width: 25.6px !important;
    height: 25.6px !important;
}

.service-card h3 {
    font-size: 1.04rem !important;
    margin-bottom: 0.6rem !important;
}

.service-card p {
    font-size: 0.72rem !important;
}

/* Stats */
.stats-grid {
    gap: 2.4rem !important;
}

.stat-item h3 {
    font-size: clamp(1.6rem, 3.2vw, 2.4rem) !important;
}

.stat-item p {
    font-size: 0.76rem !important;
}

/* About */
.about-content {
    gap: 3.2rem !important;
    margin-top: 2.4rem !important;
}

.about-text {
    font-size: 0.8rem !important;
}

.about-image {
    height: 320px !important;
}

/* Testimonials */
.testimonials-grid {
    gap: 1.6rem !important;
    margin-top: 2.4rem !important;
}

.testimonial-card {
    padding: 1.6rem !important;
}

.testimonial-quote {
    font-size: 2.4rem !important;
    top: 0.8rem !important;
    left: 1.2rem !important;
}

.testimonial-text {
    font-size: 0.76rem !important;
}

.author-avatar {
    width: 40px !important;
    height: 40px !important;
}

.author-info h4 {
    font-size: 0.8rem !important;
}

.author-info p {
    font-size: 0.72rem !important;
}

/* CTA */
.cta-section {
    padding: 4rem 1.6rem !important;
}

.cta-content h2 {
    font-size: clamp(1.6rem, 4vw, 2.4rem) !important;
    margin-bottom: 1.2rem !important;
}

.cta-content p {
    font-size: 0.8rem !important;
    margin-bottom: 2rem !important;
}

/* Footer */
footer {
    padding: 2.4rem 1.6rem 1.6rem !important;
}

.footer-content {
    gap: 2.4rem !important;
    margin-bottom: 1.6rem !important;
}

.footer-section h4 {
    font-size: 0.88rem !important;
    margin-bottom: 0.8rem !important;
}

.footer-section ul li {
    margin-bottom: 0.6rem !important;
}

.footer-section a,
.footer-section p {
    font-size: 0.72rem !important;
}

.footer-bottom {
    font-size: 0.72rem !important;
    padding-top: 1.6rem !important;
}

/* Modals */
.modal-header {
    margin-bottom: 25.6px !important;
}

.modal-header h2 {
    font-size: 22.4px !important;
}

.login-modal {
    padding: 38.4px 32px !important;
}

.signup-modal {
    padding: 32px !important;
}

.login-logo-icon {
    width: 51.2px !important;
    height: 51.2px !important;
}

.login-logo-icon svg {
    width: 25.6px !important;
    height: 25.6px !important;
}

.form-group {
    margin-bottom: 19.2px !important;
}

.form-group label {
    font-size: 11.2px !important;
    margin-bottom: 8px !important;
}

.form-group input,
.form-group select {
    padding: 11.2px 12.8px 11.2px 35.2px !important;
    font-size: 12px !important;
}

.remember-forgot {
    margin-bottom: 19.2px !important;
    font-size: 11.2px !important;
}

.btn-primary,
.btn-secondary {
    padding: 11.2px 19.2px !important;
    font-size: 0.85rem !important;
}

.signup-link {
    font-size: 11.2px !important;
    margin-top: 19.2px !important;
}

/* Chatbot */
.chatbot-toggle {
    width: 48px !important;
    height: 48px !important;
    bottom: 1.6rem !important;
    right: 1.6rem !important;
}

.chatbot-toggle svg {
    width: 22.4px !important;
    height: 22.4px !important;
}

.chatbot-container {
    width: 304px !important;
    height: 480px !important;
    bottom: 72px !important;
}

.chatbot-header {
    padding: 1rem 1.2rem !important;
}

.chatbot-header h3 {
    font-size: 0.88rem !important;
}

.chatbot-messages {
    padding: 1.2rem !important;
}

.chatbot-avatar {
    width: 28.8px !important;
    height: 28.8px !important;
}

.chatbot-text {
    font-size: 0.72rem !important;
    padding: 0.6rem 0.8rem !important;
}

.chatbot-input-container {
    padding: 0.8rem 1.2rem !important;
}

.chatbot-input {
    padding: 0.6rem 0.8rem !important;
    font-size: 0.72rem !important;
}

.chatbot-send {
    width: 35.2px !important;
    height: 35.2px !important;
}

.chatbot-send svg {
    width: 16px !important;
    height: 16px !important;
}

.chatbot-quick-actions {
    padding: 0.8rem 1.2rem !important;
}

.chatbot-quick-btn {
    padding: 0.4rem 0.8rem !important;
    font-size: 0.68rem !important;
}

/* Main Container */
.main-container {
    padding: 4.8rem 1.6rem 1.6rem !important;
}

.welcome-section h1,
.page-header h1 {
    font-size: clamp(1.6rem, 4vw, 2.4rem) !important;
}

.welcome-section p,
.page-header p {
    font-size: 0.88rem !important;
}

/* Apps Grid */
.apps-grid {
    gap: 1.2rem !important;
}

.app-card {
    padding: 1.6rem !important;
}

.app-icon {
    width: 48px !important;
    height: 48px !important;
    margin-bottom: 1.2rem !important;
}

.app-icon svg {
    width: 25.6px !important;
    height: 25.6px !important;
}

.app-card h3 {
    font-size: 1.04rem !important;
    margin-bottom: 0.6rem !important;
}

.app-card p {
    font-size: 0.72rem !important;
}

/* Dashboard */
.dashboard-grid {
    gap: 1.6rem !important;
}

.sidebar {
    padding: 1.6rem !important;
}

.sidebar-menu a {
    padding: 0.6rem 0.8rem !important;
    font-size: 0.8rem !important;
}

.content-area {
    padding: 2rem !important;
}

.section-title {
    font-size: 1.4rem !important;
    margin-bottom: 1.2rem !important;
}

/* Profile */
.profile-avatar {
    width: 96px !important;
    height: 96px !important;
    font-size: 2rem !important;
}

.profile-avatar-large {
    width: 96px !important;
    height: 96px !important;
    font-size: 2rem !important;
}

.profile-name {
    font-size: 1.2rem !important;
}

.profile-info h2 {
    font-size: 1.4rem !important;
}

/* Forms */
.form-group {
    margin-bottom: 1.2rem !important;
}

.form-group label {
    font-size: 0.72rem !important;
    margin-bottom: 0.4rem !important;
}

.form-group input,
.form-group select,
.form-group textarea {
    padding: 0.7rem 0.8rem !important;
    font-size: 0.76rem !important;
}

.form-grid {
    gap: 1.2rem !important;
}

.form-actions {
    gap: 0.8rem !important;
    margin-top: 1.6rem !important;
}

/* Info Cards */
.info-grid {
    gap: 1.2rem !important;
}

.info-card {
    padding: 1.2rem !important;
}

.info-card-label {
    font-size: 0.68rem !important;
}

.info-card-value {
    font-size: 1rem !important;
}

/* Overview Cards */
.overview-grid {
    gap: 1.2rem !important;
}

.overview-card {
    padding: 1.2rem !important;
}

.overview-card-title {
    font-size: 0.72rem !important;
}

.overview-card-icon {
    width: 32px !important;
    height: 32px !important;
}

.overview-card-value {
    font-size: 1.4rem !important;
}

.overview-card-change {
    font-size: 0.68rem !important;
}

/* Responsive */
@media (max-width: 768px) {
    section {
        padding: 3.2rem 1.2rem !important;
    }

    .nav-container {
        padding: 1.2rem 1.2rem !important;
    }

    .hero {
        padding-top: 56px !important;
    }

    .main-container {
        padding: 4rem 1.2rem 1.6rem !important;
    }
}