:root {

    /* font-size */
    --fs-10: 10px;
    --fs-12: 12px;
    --fs-13: 13px;
    --fs-14: 14px;
    --fs-15: 15px;
    --fs-16: 16px;
    --fs-17: 17px;
    --fs-18: 18px;
    --fs-20: 20px;
    --fs-22: 22px;
    --fs-24: 24px;
    --fs-28: 28px;
    --fs-30: 30px;
    --fs-32: 32px;

    /* font-weight */
    --fw-400: 400;
    --fw-500: 500;
    --fw-600: 600;
    --fw-700: 700;

    /* color */
    --c-primary:        #6f5f5e;
    --c-primary-dark:   #574c46;
    --c-accent:         #ffd400;
    --c-text:           #1a1a1a;
    --c-text-muted:     #5a5a5a;
    --c-text-light:     #706060;
    --c-gray-300:       #b3b3b3;
    --c-gray-400:       #94908c;
    --c-gray-500:       #705F5F;
    --c-gray-light:     #949494;
    --c-success:        #14ba59;
    --c-danger:         #ef4444;
    --c-border:         #e2e8f0;
    --c-border-light:   #ebebeb;
    --c-bg-page:        #e7e4e0;
    --c-bg-section:     #f5f2f0;
    --c-bg-alt:         #f8f8f8;
    --c-white:          #ffffff;
    --blue-400:         #4C4C4C;
    --c-gray-200:       #EDEDED;


    /* Border radius */
    --radius-sm: 3px;
    --radius-md: 4px;
    --radius-lg: 10px;

    /* Spacing */
    --gap-xs:  4px;
    --gap-sm:  8px;
    --gap-md:  14px;
    --gap-lg:  24px;
    --gap-xl:  32px;
}


@font-face {
    font-family: "Krungsri Condensed-Regular";
    src: url("/fonts/krungsri_con-webfont.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Krungsri Condensed-Medium";
    src: url("/fonts/krungsri_con_med-webfont.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

.font-medium { font-family: "Krungsri Condensed-Medium"!important ; }
.font-reg { font-family: "Krungsri Condensed-Regular"!important ; }


.fw-400{ font-weight : 400!important;}
.fw-500{ font-weight : 500!important;}
.fw-600{ font-weight : 600!important;}
.fw-700{ font-weight : 700!important;}

.fs-15{ font-size : 15px!important;}
.fs-18{ font-size : 18px!important;}

/* ============================================================
   Mobile (≤600px) — ลด font ทุกขนาดลง 1 step ในเซ็ต
   คุมจุดเดียว มีผลทั้ง Login + Register
   ============================================================ */
@media (max-width: 600px) {
    :root {
        --fs-12: 12px;   /* เล็กสุด คงไว้ */
        --fs-13: 12px;
        --fs-14: 13px;
        --fs-15: 14px;
        --fs-16: 15px;
        --fs-17: 16px;
        --fs-18: 17px;
        --fs-20: 18px;
        --fs-22: 20px;
        --fs-24: 22px;
        --fs-30: 24px;
        --fs-32: 30px;
    }
}