/* * 파일경로: /assets/css/ll-base.css
 * 파일역할: Global Base Styles & Dark Mode Variables (Ver 4.0 - Dark Mode Support)
 * * [수정됨] body.dark-mode 선택자를 통한 CSS 변수 오버라이딩 추가
 */

:root {
    /* --- Brand Colors --- */
    --ll-color-primary: #4b7bec;
    --ll-color-primary-dark: #3867d6;
    --ll-color-primary-soft: #e5edff;
    --ll-color-secondary: #20bf6b;
    --ll-color-danger: #eb3b5a;
    --ll-color-warning: #fa8231;
    --ll-color-info: #45aaf2;
    
    /* --- Light Mode Defaults --- */
    --ll-bg-body: #f5f6fa;
    --ll-bg-card: #ffffff;
    --ll-bg-input: #f1f2f6;
    --ll-bg-overlay: rgba(0, 0, 0, 0.6);
    --ll-border-color: #f1f2f6;
    
    /* --- Typography --- */
    --ll-text-main: #1e272e;
    --ll-text-sub: #808e9b;
    --ll-text-muted: #d2dae2;
    
    --ll-font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ll-font-size-base: 16px;
    --ll-font-size-sm: 14px;
    --ll-font-size-xs: 12px;
    
    /* --- Spacing & Layout --- */
    --ll-spacing-xs: 4px;
    --ll-spacing-sm: 8px;
    --ll-spacing-md: 16px;
    --ll-spacing-lg: 24px;
    --ll-spacing-xl: 32px;
    
    /* --- Borders & Radius --- */
    --ll-radius-sm: 8px;
    --ll-radius-md: 16px;
    --ll-radius-lg: 24px;
    
    /* --- Effects --- */
    --ll-shadow-card: 0 2px 8px rgba(0, 0, 0, 0.05);
    --ll-shadow-float: 0 4px 16px rgba(0, 0, 0, 0.1);
    --ll-anim-speed: 0.3s;
    
    /* --- Navigation --- */
    --ll-nav-height: 60px;
}

/* --- Dark Mode Overrides --- */
body.dark-mode {
    /* Backgrounds */
    --ll-bg-body: #1e272e;      /* 짙은 남색 계열 */
    --ll-bg-card: #2d3436;      /* 카드 배경 */
    --ll-bg-input: #485460;     /* 입력창/버튼 배경 */
    --ll-border-color: #485460;
    
    /* Typography */
    --ll-text-main: #f5f6fa;    /* 메인 텍스트 (흰색에 가까운 회색) */
    --ll-text-sub: #b2bec3;     /* 서브 텍스트 */
    --ll-text-muted: #636e72;
    
    /* Shadows (다크모드에선 그림자를 줄이거나 밝게 처리) */
    --ll-shadow-card: 0 2px 8px rgba(0, 0, 0, 0.3);
    --ll-shadow-float: 0 4px 16px rgba(0, 0, 0, 0.5);
    
    /* Brand Colors Adaptation (필요시 조정) */
    --ll-color-primary-soft: #2c3e50; /* 너무 밝은 배경색 조정 */
}

/* Base Reset */
.ll-app {
    font-family: var(--ll-font-main);
    font-size: var(--ll-font-size-base);
    color: var(--ll-text-main);
    background-color: var(--ll-bg-body);
    line-height: 1.5;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    min-height: 100vh;
    padding-bottom: calc(var(--ll-nav-height) + 20px); /* Safe area for Tabbar */
    transition: background-color 0.3s, color 0.3s; /* 테마 전환 애니메이션 */
}

.ll-app *, .ll-app *::before, .ll-app *::after {
    box-sizing: inherit;
}

/* Common Buttons */
.ll-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    border-radius: var(--ll-radius-lg);
    border: none;
    background: var(--ll-color-primary);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: background var(--ll-anim-speed), transform 0.1s;
    text-decoration: none;
    font-size: 15px;
}

.ll-btn:hover {
    background: var(--ll-color-primary-dark);
}

.ll-btn:active {
    transform: scale(0.98);
}

.ll-btn-ghost {
    background: transparent;
    color: var(--ll-text-sub);
    padding: 8px 12px;
}

.ll-btn-ghost:hover {
    background: rgba(0,0,0,0.05);
    color: var(--ll-text-main);
}

.ll-btn-secondary {
    background: var(--ll-bg-input);
    color: var(--ll-text-main);
}

.ll-btn-full {
    width: 100%;
}

.ll-icon {
    font-size: 1.2em;
    margin-right: 6px;
}

/* Utility Classes */
.ll-hidden { display: none !important; }
.ll-text-center { text-align: center; }
.ll-mt-md { margin-top: var(--ll-spacing-md); }

/* ------------------------------------------------------- */
/* [App Mode Force Styles] 워드프레스 기본 UI 강제 숨김       */
/* ------------------------------------------------------- */

/* 1. 상단 어드민 바 숨김 */
#wpadminbar { display: none !important; }
html { margin-top: 0 !important; }

/* 2. 테마(TwentyTwentyFive 등)의 헤더/푸터/제목 숨김 */
header.site-header, 
footer.site-footer,
header.wp-block-template-part, 
footer.wp-block-template-part,
h1.wp-block-site-title,
.wp-site-blocks > header, 
.wp-site-blocks > footer,
.wp-block-post-title { 
    display: none !important; 
}

/* 3. 테마의 기본 여백/패딩 제거 */
body.page-template-default, 
.wp-site-blocks, 
.wp-block-group.has-global-padding {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}

.entry-content {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
}

/* ------------------------------------------------------- */
/* Dark Mode Specific Component Overrides (Optional)       */
/* ------------------------------------------------------- */
body.dark-mode .ll-header,
body.dark-mode .ll-tabbar,
body.dark-mode .ll-modal-header-bar,
body.dark-mode .ll-feed-header-sticky {
    background-color: var(--ll-bg-card);
    border-color: var(--ll-border-color);
}

body.dark-mode .ll-card,
body.dark-mode .ll-feed-card,
body.dark-mode .ll-summary-card,
body.dark-mode .ll-write-trigger-card {
    background-color: var(--ll-bg-card);
    border-color: var(--ll-border-color);
    color: var(--ll-text-main);
}

body.dark-mode input,
body.dark-mode textarea {
    background-color: var(--ll-bg-input);
    color: var(--ll-text-main);
    border-color: var(--ll-border-color);
}

body.dark-mode .ll-filter-chip {
    background-color: var(--ll-bg-card);
    color: var(--ll-text-sub);
    border-color: var(--ll-border-color);
}
body.dark-mode .ll-filter-chip.active {
    background-color: var(--ll-text-main);
    color: var(--ll-bg-card);
}