@charset "utf-8";

:root {
    --color-main: #0267FF;   /* 메인 포인트 컬러 */
    --color-main-bg: #E9F3FF;   /* 메인 컬러 백그라운드 */
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-pink: #F1516C;
    --color-red: #ff1139;
    --color-orange: #ff8926;

    --border-light: #E9E9E9;    /* 연한 테두리 */
    --border-dark: #DDD;        /* 일반 테두리 */

    --text-primary: #444;       /* 기본 텍스트 */
    --text-secondary: #666;     /* 보조 텍스트 */
    --text-tertiary: #898989;      /* 흐린 텍스트 */
    --text-disabled: #acacac;      /* 비활성화 텍스트 */

    /* === Neutral / Gray === */
    --gray-20:  #F9F9F9;  /* 가장 연한 회색, 페이지 전체 기본 배경 */
    --gray-50:  #F6F6F6;  /* 가장 연한 회색, 페이지 전체 기본 배경 */
    --gray-100: #F4F4F6;  /* 밝은 회색, 카드·컨테이너 배경 */
    --gray-200: #F0F0F0; /* 중간 밝기의 연한 회색, 서브 배경 또는 구분선 */

    /* === Blue 계열 === */
    --blue-50:  #F1F6FA;  /* 아주 연한 블루톤, 섹션 구분 */
    --blue-100: #F5F7FF;  /* 은은한 블루+보라톤 강조 배경 */
    --blue-200: #E0EFFD;  /* 정보성 배경, 알림 카드 등 */

    /* === Red 계열 === */
    --red-50:   #FEECEC;  /* 에러 알림 배경 */

    /* === Yellow 계열 === */
    --yellow-50: #FCFAE7; /* 경고·주의 배경 */

 }