/* assets/css/led-calculator.css */



/* General Container */

.led-calculator-container {

    background-color: #f0f4f8;

    padding: 20px;

    border-radius: 10px;

    max-width: 100%;

    font-family: Arial, sans-serif;

    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);

}



.led-title {

    font-size: 18px;

    color: #333;

    margin-bottom: 15px;

}



/* Form Layout - Horizontal */

.led-form-wrapper {

    display: flex;

    justify-content: space-between;

    gap: 15px;

    margin-bottom: 15px;

}



.led-input-group {

    flex: 1;

}



.led-input-group label {

    display: block;

    font-weight: bold;

    color: #333;

    margin-bottom: 5px;

    font-size: 14px;

}



.led-input-group input,

.led-input-group select {

    width: 100%;

    padding: 10px;

    border: 1px solid #ddd;

    border-radius: 5px;

    background-color: #fff;

    font-size: 14px;

    box-sizing: border-box;

}



/* Button Wrapper */

.led-button-wrapper {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 20px;

}



#calculate-btn {

    background: linear-gradient(to right, #00b4d8, #0077b6);

    color: white;

    border: none;

    padding: 12px 24px;

    border-radius: 25px;

    cursor: pointer;

    font-weight: bold;

    font-size: 14px;

    transition: opacity 0.3s;

}



#calculate-btn:hover {

    opacity: 0.9;

}



.led-rule {

    font-size: 12px;

    color: #666;

    flex: 1;

}



/* Results Section */

#led-results {

    background-color: #fff;

    padding: 15px;

    border-radius: 10px;

    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.05);

}



.led-estimation {

	color: #333;

	margin-bottom: 25px;

	text-align: center;

	font-size: x-large;

}



.led-motif,

.led-message {

    font-size: 14px;

    color: #333;

    margin-bottom: 15px;

}



/* Results Row for Eligibility and Economies */

.led-results-row {

    display: flex;

    gap: 15px;

    margin-bottom: 15px;

    align-items: stretch;

}



.led-eligibility {

    padding: 8px 16px;

    border-radius: 25px;

    font-weight: bold;

    font-size: 14px;

    text-align: center;

    min-width: 150px;

    display: flex;

    align-items: center;

    justify-content: center;

}



.eligible {

    background-color: #d4edda;

    color: #155724;

}



.non-eligible {

    background-color: #f8d7da;

    color: #721c24;

}



/* Economy Cards */

.led-economie {

    background-color: #f8f9fa;

    padding: 15px;

    border-radius: 10px;

    text-align: center;

    flex: 1;

    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);

}



.led-economie-title {

    font-size: 12px;

    text-transform: uppercase;

    color: #666;

    margin-bottom: 5px;

}



.led-economie-desc {

    font-size: 12px;

    color: #333;

    margin-bottom: 5px;

}



.led-economie-amount {

    font-size: 28px;

    font-weight: bold;

    color: #0077b6;

}



/* RDV Button */

.led-rdv-btn {

    background: linear-gradient(to right, #00b4d8, #0077b6);

    color: white;

    border: none;

    padding: 12px 24px;

    border-radius: 25px;

    cursor: pointer;

    font-weight: bold;

    font-size: 14px;

    display: block;

    margin: 0 auto 15px;

    transition: opacity 0.3s;

}



.led-rdv-btn:hover {

    opacity: 0.9;

}



/* Warning */

.led-warning {

    font-size: 12px;

    color: #e67700;

    display: flex;

    align-items: center;

    gap: 5px;

    text-align: center;

}



.led-warning::before {

    content: '⚠️';

    font-size: 14px;

}

/* Support dynamique des styles Elementor */

.led-calculator-container * {

    box-sizing: border-box;

}



/* Évite les conflits */

.led-form-wrapper,

.led-button-wrapper,

.led-results-row {

    display: flex;

    flex-wrap: wrap;

}



/* Responsive inputs */

@media (max-width: 768px) {

    .led-form-wrapper {

        flex-direction: column;

    }

    .led-input-group {

        margin-bottom: 15px;

    }

    .led-button-wrapper {

        flex-direction: column;

        align-items: stretch;

    }

    .led-rule {

        margin-top: 10px;

        text-align: center;

    }

}

/* assets/css/led-calculator.css */

.led-calculator-container {

    font-family: system-ui, -apple-system, sans-serif;

    line-height: 1.5;

}



.led-title {

    font-size: 1.25rem;

    font-weight: 600;

    margin-bottom: 1rem;

}



.led-form-wrapper {

    display: flex;

    gap: 1rem;

    flex-wrap: wrap;

    margin-bottom: 1rem;

}



.led-input-group {

    flex: 1;

    min-width: 150px;

}



.led-input-group label {

    display: block;

    font-weight: 600;

    margin-bottom: 0.375rem;

    font-size: 0.875rem;

}



.led-input-group input,

.led-input-group select {

    width: 100%;

    padding: 0.625rem;

    font-size: 0.9375rem;

    border: 1px solid #e0e0e0;

    border-radius: 0.375rem;

    transition: border 0.2s;

}



.led-button-wrapper {

    display: flex;

    align-items: center;

    gap: 1rem;

    flex-wrap: wrap;

}



#calculate-btn,

.led-rdv-btn {

    padding: 0.75rem 1.5rem;

    font-weight: 600;

    border: none;

    cursor: pointer;

    transition: all 0.3s;

}



.led-rule {

    font-size: 0.75rem;

    color: #666;

}



#led-results {

    margin-top: 1.5rem;

}



.led-badge {

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

    padding: 0.5rem 1rem;

    font-weight: 600;

    font-size: 0.875rem;

    border-radius: 1.5rem;

    border: 1px solid;

}



.led-badge::before {

    font-weight: 900;

    font-family: "Font Awesome 5 Free", sans-serif;

}







.led-results-row {

    display: flex;

    gap: 1rem;

    flex-wrap: wrap;

    margin: 1rem 0;

}



.led-economy-box {

    flex: 1;

    min-width: 140px;

    padding: 1rem;

    text-align: center;

    border: 1px solid #dee2e6;

    border-radius: 0.5rem;

    background: #f8f9fa;

}



.led-economy-title {

    font-size: 0.75rem;

	font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 0.05em;

    color: #114B8C;

    margin-bottom: 0.25rem;

}



.led-economy-desc {

    font-size: 0.875rem;

    color: #444;

    margin-bottom: 0.5rem;

}



.led-economy-amount {

    font-size: 1.75rem;

    font-weight: 700;

    color: #0077b6;

}



.led-rdv-btn {

    display: block;

    margin: 1.5rem auto 0;

    width: fit-content;

}



.led-warning {

    font-size: 0.75rem;

    color: #e67700;

    display: flex;

    align-items: center;

    gap: 0.375rem;

    margin-top: 1rem;

}



.led-warning::before {

    content: "Warning";

    font-size: 1rem;

}



/* Responsive */

@media (max-width: 640px) {

    .led-form-wrapper,

    .led-results-row {

        flex-direction: column;

    }

    .led-button-wrapper {

        flex-direction: column;

        align-items: stretch;

    }

    .led-rule { text-align: center; margin-top: 0.5rem; }

}

/* assets/css/led-calculator.css */

.led-badge i {

    margin-right: 0.5rem;

    font-size: 1rem;

}



.led-warning i {

    margin-right: 0.375rem;

    font-size: 0.875rem;

}

.led-badge i,

.led-warning i {

    vertical-align: middle;

}