/* SpoonLabs 브랜드 가이드라인에 맞춘 기본 스타일 */

/* 색상 변수 */
:root {
    /* 기본 색상 */
    --labs-black: #000000;
    --labs-white: #FFFFFF;
    --labs-dark-grey: #3E3E3E;
    --labs-light-grey: #F7F6F9;
    
    /* 브랜드 색상 */
    --spoon-gradient-start: #FF6600;
    --spoon-gradient-mid: #FF570B;
    --spoon-gradient-end: #FF6600;
    --labs-gradient-start: #00FFD0;
    --labs-gradient-mid: #6C9FFF;
    --labs-gradient-end: #FF6600;
    --vigloo-mint: #00FFD0;
    --alive-orange: #FF6600;
    
    /* 지역별 색상 (대시보드 기능 유지를 위함) */
    --region-kr-color: var(--spoon-gradient-start);
    --region-jp-color: var(--labs-gradient-mid);
    --region-tw-color: var(--vigloo-mint);
    
    /* 방송 타입 색상 */
    --high-quality-color: var(--vigloo-mint);
    --livecall-color: var(--alive-orange);
    
    /* 텍스트 색상 */
    --text-dark: var(--labs-black);
    --text-light: var(--labs-white);
    --text-muted: var(--labs-dark-grey);
}

/* 전체 레이아웃 스타일 */
body {
    font-family: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    background-color: var(--labs-white);
    color: var(--labs-black);
    line-height: 1.5;
}

/* 헤더 스타일 */
header {
    background-color: var(--labs-black);
    color: var(--labs-white);
    padding: 1.5rem;
    border-radius: 0.5rem;
    margin-bottom: 2rem;
}

header h1 {
    font-weight: bold;
    margin-bottom: 0.5rem;
}

/* 카드 스타일 */
.dashboard-card {
    border-radius: 12px;
    overflow: hidden;
    background-color: var(--labs-white);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border: none;
    transition: all 0.3s ease;
}

.dashboard-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
}

.dashboard-card .card-header {
    background-color: var(--labs-black);
    color: var(--labs-white);
    border-bottom: none;
    padding: 1rem 1.25rem;
    font-weight: 600;
}

.dashboard-card .card-body {
    padding: 1.25rem;
}

/* 버튼 스타일 */
.btn {
    border-radius: 8px;
    font-weight: 600;
    padding: 0.5rem 1rem;
    transition: all 0.2s ease;
}

.btn-primary {
    background: linear-gradient(to right, var(--labs-gradient-start), var(--labs-gradient-mid));
    border: none;
}

.btn-primary:hover {
    background: linear-gradient(to right, var(--labs-gradient-start), var(--labs-gradient-end));
    transform: translateY(-2px);
}

.btn-success {
    background-color: var(--vigloo-mint);
    border: none;
    color: var(--labs-black);
}

.btn-danger {
    background-color: var(--alive-orange);
    border: none;
}

/* 폼 컨트롤 스타일 */
.form-select, .form-control {
    border-radius: 8px;
    border: 1px solid var(--labs-light-grey);
    padding: 0.5rem 1rem;
    font-size: 0.95rem;
}

.form-select:focus, .form-control:focus {
    border-color: var(--vigloo-mint);
    box-shadow: 0 0 0 0.2rem rgba(0, 255, 208, 0.2);
}

/* 상태 표시 스타일 */
.collection-status {
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0.35rem 0.8rem;
    border-radius: 6px;
}

.collection-status.running {
    background-color: var(--vigloo-mint);
    color: var(--labs-black);
}

.collection-status.stopped {
    background-color: var(--alive-orange);
    color: var(--labs-white);
}

/* 헤더 액션 영역 */
.header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-actions .form-select {
    min-width: 120px;
    max-width: 150px;
}