/* ============================================
   CSS VARIABLES - Skill Empire India
   Global color palette - applies everywhere
   ============================================ */

:root {
    /* Brand Colors */
    --color-primary:    #F7B32B;
    --color-secondary:  #140F2D;
    --color-accent:     #FFD700;
    --color-green:      #7AC74F;
    --color-danger:     #FF2E00;
    --color-white:      #FDFFFC;

    /* Gradients */
    --golden-gradient:  linear-gradient(135deg, #F7B32B, #FFD700);

    /* Backgrounds */
    --bg-body:          #F6F8FF;
    --bg-admin:         #F1F3F5;
    --bg-card:          #FDFFFC;

    /* Text */
    --text-dark:        #140F2D;
    --text-muted:       #888888;
    --text-light:       rgba(253, 255, 252, 0.65);

    /* Borders */
    --border-light:     rgba(247, 179, 43, 0.12);
    --border-primary:   rgba(247, 179, 43, 0.35);

    /* Shadows */
    --shadow-sm:        0 3px 12px rgba(0,0,0,0.04);
    --shadow-md:        0 8px 25px rgba(0,0,0,0.08);
    --shadow-primary:   0 12px 30px rgba(247, 179, 43, 0.20);

    /* Transitions */
    --transition:       all 0.3s ease;
    --transition-bounce: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* Border Radius */
    --radius-sm:        8px;
    --radius-md:        14px;
    --radius-lg:        20px;
    --radius-pill:      50px;
}

/* ========== GLOBAL RESET HELPERS ========== */
*, *::before, *::after { box-sizing: border-box; }

/* Consistent button base */
.btn-sei {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--color-primary); color: var(--color-white);
    border: none; border-radius: var(--radius-pill);
    padding: 10px 22px; font-size: 14px; font-weight: 600;
    cursor: pointer; text-decoration: none;
    transition: var(--transition); font-family: 'Inter', sans-serif;
}
.btn-sei:hover { background: var(--color-secondary); color: var(--color-primary); }
.btn-sei-outline {
    display: inline-flex; align-items: center; gap: 8px;
    background: transparent; color: var(--color-primary);
    border: 2px solid var(--color-primary); border-radius: var(--radius-pill);
    padding: 10px 22px; font-size: 14px; font-weight: 600;
    cursor: pointer; text-decoration: none; transition: var(--transition);
    font-family: 'Inter', sans-serif;
}
.btn-sei-outline:hover { background: var(--color-primary); color: var(--color-white); }

/* Consistent card */
.card-sei {
    background: var(--bg-card); border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm); border: 1px solid var(--border-light);
    transition: var(--transition-bounce);
}
.card-sei:hover {
    transform: translateY(-6px) scale(1.01);
    box-shadow: var(--shadow-primary); border-color: var(--color-primary);
}

/* Badge system */
.badge-sei-green   { background: #e8f5e9; color: #2e7d32;   padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.badge-sei-orange  { background: #fff3e0; color: #e65100;   padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.badge-sei-red     { background: #ffebee; color: #c62828;   padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.badge-sei-yellow  { background: #fffde7; color: #f9a825;   padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }
.badge-sei-primary { background: rgba(122,199,79,0.15); color: var(--color-primary); padding: 4px 10px; border-radius: 20px; font-size: 11px; font-weight: 600; }
