/* ==========================================================================
   KAMPAM FOODS - Global Brand Styles (kampam.css)
   Premium Indian FMCG Design System
   ========================================================================== */

:root {

    /* ===============================
       🌿 PRIMARY BRAND (Forest Green)
       =============================== */
    --cy-primary: #234C34;
    --cy-primary-dark: #183523;
    --cy-primary-hover: #2D6242;
    --cy-primary-light: #EEF5EF;

    /* ===============================
       🌱 SECONDARY GREEN
       =============================== */
    --cy-secondary: #4F8A52;
    --cy-secondary-light: #DDEBDD;

    /* ===============================
       🏆 PREMIUM GOLD
       =============================== */
    --cy-gold: #C9A34E;
    --cy-gold-dark: #A67C2E;
    --cy-gold-light: #F7EBCB;

    /* ===============================
       🌾 EARTH TONES
       =============================== */
    --cy-wheat: #E6D3A6;
    --cy-beige: #F8F3E7;
    --cy-brown: #7A5830;
    --cy-brown-dark: #4D3419;

    /* ===============================
       🍃 PRODUCT COLORS
       =============================== */
    --cy-tea: #315E3B;
    --cy-spices: #A7462B;
    --cy-pulses: #B88A35;
    --cy-dryfruits: #4B3556;
    --cy-grains: #A67C52;
    --cy-honey: #D88B1E;

    /* ===============================
       🎨 STATUS COLORS
       =============================== */
    --cy-success: #3F8F5B;
    --cy-warning: #D99B21;
    --cy-danger: #C44A3D;
    --cy-info: #4F8A52;

    /* ===============================
       🧱 BACKGROUNDS
       =============================== */
    --cy-bg: #F9F7F2;
    --cy-surface: #FFFFFF;
    --cy-surface-soft: #F3EFE5;
    --cy-border: #E3DAC6;

    /* ===============================
       📝 TYPOGRAPHY
       =============================== */
    --cy-text-main: #2A241A;
    --cy-text-muted: #7A6A58;
    --cy-text-light: #FFFFFF;

    /* ===============================
       ✨ UI ELEMENTS
       =============================== */
    --cy-radius: 8px;
    --cy-radius-lg: 18px;

    --cy-shadow:
        0 12px 30px rgba(35,76,52,.12);

    --cy-shadow-soft:
        0 4px 12px rgba(35,76,52,.08);

    /* ===============================
       🌈 GRADIENTS
       =============================== */

    --cy-gradient-primary:
        linear-gradient(135deg,#183523,#2D6242);

    --cy-gradient-gold:
        linear-gradient(135deg,#A67C2E,#E5C979);

    --cy-gradient-premium:
        linear-gradient(135deg,#183523,#234C34,#C9A34E);

    --cy-gradient-earth:
        linear-gradient(135deg,#F8F3E7,#E6D3A6);

}

/* ==========================================================================
   GLOBAL
   ========================================================================== */

body{
    background:var(--cy-bg);
    color:var(--cy-text-main);
    font-family:'Inter',system-ui,-apple-system,sans-serif;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.cy-card{

    background:var(--cy-surface);

    border:1px solid var(--cy-border);

    border-radius:var(--cy-radius-lg);

    box-shadow:var(--cy-shadow);

    padding:1.5rem;

    margin-bottom:1.5rem;
}

/* ==========================================================================
   PRIMARY BUTTON
   ========================================================================== */

.btn-cy-primary{

    background:var(--cy-primary);

    color:#fff;

    border:none;

    border-radius:8px;

    padding:.65rem 1.25rem;

    font-weight:600;

    transition:.25s;
}

.btn-cy-primary:hover{

    background:var(--cy-primary-hover);

    color:#fff;

    box-shadow:
        0 8px 20px rgba(35,76,52,.25);
}

/* ==========================================================================
   GOLD BUTTON
   ========================================================================== */

.btn-cy-gold{

    background:var(--cy-gradient-gold);

    color:#fff;

    border:none;

    border-radius:8px;

    padding:.65rem 1.25rem;

    font-weight:600;

    transition:.25s;
}

.btn-cy-gold:hover{

    transform:translateY(-2px);

    color:#fff;

    box-shadow:
        0 10px 24px rgba(201,163,78,.35);
}

/* ==========================================================================
   PREMIUM BUTTON
   ========================================================================== */

.btn-cy-premium{

    background:var(--cy-gradient-premium);

    color:#fff;

    border:none;

    border-radius:8px;

    padding:.65rem 1.25rem;

    font-weight:600;

    transition:.25s;
}

.btn-cy-premium:hover{

    opacity:.95;

    color:#fff;
}

/* ==========================================================================
   BRAND TEXT
   ========================================================================== */

.cy-brand-text{

    background:var(--cy-gradient-premium);

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

    font-weight:800;

    letter-spacing:1px;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.cy-header{

    background:var(--cy-gradient-primary);

    color:#fff;
}

/* ==========================================================================
   SIDEBAR
   ========================================================================== */

.cy-sidebar{

    background:#183523;

    color:#fff;
}

/* ==========================================================================
   TABLE
   ========================================================================== */

.cy-table thead{

    background:var(--cy-primary);

    color:#fff;
}

.cy-table tbody tr:hover{

    background:var(--cy-primary-light);
}

/* ==========================================================================
   FORM
   ========================================================================== */

.form-control:focus{

    border-color:var(--cy-gold);

    box-shadow:
        0 0 0 .2rem rgba(201,163,78,.20);
}

/* ==========================================================================
   BADGES
   ========================================================================== */

.badge-kp{

    background:var(--cy-gradient-premium);

    color:#fff;

    border-radius:50px;

    padding:.45rem .8rem;
}