/* Modern Color System for Tendzien Wedding Planning Website */

:root {
    /* Primary Color Palette - Polish Rose */
    --primary-color: #b76e79;
    --primary-dark: #8d4a56;
    --primary-light: #d19ca5;
    
    /* Secondary Color Palette - Complementary Rose */
    --secondary-color: #a35a68;
    --secondary-dark: #7a434e;
    --secondary-light: #c288a0;
    
    /* Accent Colors */
    --accent-color: #d18a96;
    --accent-dark: #9c5562;
    --accent-light: #e8b5c1;
    
    /* Success Colors */
    --success-color: #27ae60;
    --success-dark: #1e8449;
    --success-light: #7dcea0;

    --greeen-packages: #4c00e4;
    --greeen-packages1: #1d4329;
    --greeen-packages2: #9401bd;
    
    /* Neutral Colors */
    --white: #ffffff;
    --light-gray: #f8f9fa;
    --medium-gray: #5a6873;
    --dark-gray: #343a40;
    --black: #2c3e50;
    
    /* Gradients */
    --primary-gradient: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
    --secondary-gradient: linear-gradient(135deg, var(--secondary-color) 0%, var(--secondary-dark) 100%);
    --hero-gradient: transparent;
    --card-gradient: linear-gradient(145deg, var(--white) 0%, var(--light-gray) 100%);
    
    /* Overlays */
    --dark-overlay: rgba(0, 0, 0, 0.5);
    --light-overlay: rgba(255, 255, 255, 0.8);
    
    /* Shadows */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/* Color Application Classes */
.bg-primary { background-color: var(--primary-color); }
.bg-secondary { background-color: var(--secondary-color); }
.bg-accent { background-color: var(--accent-color); }
.bg-success { background-color: var(--success-color); }
.bg-light { background-color: var(--light-gray); }
.bg-dark { background-color: var(--dark-gray); }

.text-primary { color: var(--primary-color); }
.text-secondary { color: var(--secondary-color); }
.text-accent { color: var(--accent-color); }
.text-success { color: var(--success-color); }
.text-light { color: var(--light-gray); }
.text-dark { color: var(--dark-gray); }

.gradient-primary { background: var(--primary-gradient); }
.gradient-secondary { background: var(--secondary-gradient); }
.gradient-hero { background: var(--hero-gradient); }

/* Button Colors */
.btn {
    background: var(--primary-gradient);
    color: var(--white);
    box-shadow: var(--shadow-md);
}

.btn:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-secondary {
    background: var(--secondary-gradient);
}

.btn-accent {
    background: linear-gradient(135deg, var(--accent-color) 0%, var(--accent-dark) 100%);
}

.btn-success {
    background: linear-gradient(135deg, var(--success-color) 0%, var(--success-dark) 100%);
}

.btn-outline {
    background: transparent;
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
}

.btn-outline:hover {
    background: var(--primary-gradient);
    color: var(--white);
}

/* Navigation Active Link */
nav ul li a.active {
    background: var(--primary-gradient) !important;
    color: var(--white) !important;
    font-weight: 700 !important;
    box-shadow: var(--shadow-md) !important;
    border: 2px solid var(--primary-color) !important;
}

/* Section Titles */
.section-title h2::after {
    background: var(--primary-gradient);
}

/* Cards and Containers */
.card {
    background: var(--card-gradient);
    box-shadow: var(--shadow-md);
}

.card:hover {
    box-shadow: var(--shadow-lg);
}

/* Footer */
footer {
    background-color: var(--secondary-color);
    color: var(--white);
}

/* Form Elements */
input:focus, textarea:focus, select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 2px rgba(183, 110, 121, 0.25);
}