@charset "utf-8";

/* =========================================
   GUEL UI Override v2 (safe)
   - 전역 폰트 강제 제거
   - 카테고리/배지 건드리지 않음
   - 히어로/제목 계열 건드리지 않음
   - tw-* 유틸 색상 remap 중심
   ========================================= */

body.guel-renewal {
    background: var(--guel-bg);
    color: var(--guel-text);
    -webkit-tap-highlight-color: transparent;
}

body.guel-renewal *,
body.guel-renewal *::before,
body.guel-renewal *::after {
    box-sizing: border-box;
}

body.guel-renewal ::selection {
    background: rgba(12, 75, 60, 0.12);
    color: var(--guel-text);
}

body.guel-renewal a {
    color: inherit;
    text-decoration: none;
    transition: color .2s ease, border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

body.guel-renewal a:hover {
    color: var(--guel-primary);
}

body.guel-renewal img {
    max-width: 100%;
    height: auto;
}

body.guel-renewal hr {
    border: 0;
    border-top: 1px solid var(--guel-border);
}

/* ---------- shell ---------- */
body.guel-renewal #hd {
    background: rgba(248, 245, 239, 0.92);
    border-bottom: 1px solid var(--guel-border);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

body.guel-renewal #ft {
    background: transparent;
    border-top: 1px solid var(--guel-border);
    color: var(--guel-text-muted);
}

body.guel-renewal #wrapper,
body.guel-renewal #container {
    background: transparent;
    color: inherit;
}

body.guel-renewal #container_title {
    color: var(--guel-primary);
}

/* ---------- tailwind utility remap ---------- */
/* 실제 테마가 tw-* 유틸을 많이 쓰므로 여기를 잡아야 색이 바뀜 */

body.guel-renewal .tw-bg-white {
    background-color: var(--guel-surface) !important;
}

body.guel-renewal .tw-bg-gray-50,
body.guel-renewal .tw-bg-gray-100,
body.guel-renewal .tw-bg-stone-50,
body.guel-renewal .tw-bg-stone-100 {
    background-color: var(--guel-surface-2) !important;
}

body.guel-renewal .tw-text-black,
body.guel-renewal .tw-text-gray-900,
body.guel-renewal .tw-text-gray-800,
body.guel-renewal .tw-text-stone-900,
body.guel-renewal .tw-text-stone-800 {
    color: var(--guel-text) !important;
}

body.guel-renewal .tw-text-gray-700,
body.guel-renewal .tw-text-gray-600,
body.guel-renewal .tw-text-stone-700,
body.guel-renewal .tw-text-stone-600 {
    color: var(--guel-text-soft) !important;
}

body.guel-renewal .tw-text-gray-500,
body.guel-renewal .tw-text-gray-400,
body.guel-renewal .tw-text-stone-500,
body.guel-renewal .tw-text-stone-400 {
    color: var(--guel-text-muted) !important;
}

body.guel-renewal .tw-border-gray-50,
body.guel-renewal .tw-border-gray-100,
body.guel-renewal .tw-border-gray-200,
body.guel-renewal .tw-border-gray-300,
body.guel-renewal .tw-border-stone-100,
body.guel-renewal .tw-border-stone-200,
body.guel-renewal .tw-border-stone-300 {
    border-color: var(--guel-border) !important;
}

body.guel-renewal .tw-text-green-700,
body.guel-renewal .tw-text-green-800,
body.guel-renewal .tw-text-emerald-700,
body.guel-renewal .tw-text-emerald-800,
body.guel-renewal .tw-text-\[\#004433\] {
    color: var(--guel-primary) !important;
}

body.guel-renewal .tw-border-green-700,
body.guel-renewal .tw-border-green-800,
body.guel-renewal .tw-border-emerald-700,
body.guel-renewal .tw-border-emerald-800,
body.guel-renewal .tw-border-\[\#004433\] {
    border-color: var(--guel-primary) !important;
}

body.guel-renewal .tw-bg-green-700,
body.guel-renewal .tw-bg-green-800,
body.guel-renewal .tw-bg-emerald-700,
body.guel-renewal .tw-bg-emerald-800,
body.guel-renewal .tw-bg-\[\#004433\] {
    background-color: var(--guel-primary) !important;
    border-color: var(--guel-primary) !important;
    color: #fff !important;
}

/* ---------- forms ---------- */
body.guel-renewal input[type="text"],
body.guel-renewal input[type="password"],
body.guel-renewal input[type="email"],
body.guel-renewal input[type="number"],
body.guel-renewal input[type="url"],
body.guel-renewal input[type="search"],
body.guel-renewal input[type="tel"],
body.guel-renewal select,
body.guel-renewal textarea {
    border: 1px solid var(--guel-border);
    border-radius: var(--guel-radius-sm);
    background: #fff;
    color: var(--guel-text);
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

body.guel-renewal input[type="text"],
body.guel-renewal input[type="password"],
body.guel-renewal input[type="email"],
body.guel-renewal input[type="number"],
body.guel-renewal input[type="url"],
body.guel-renewal input[type="search"],
body.guel-renewal input[type="tel"],
body.guel-renewal select {
    min-height: var(--guel-input-h);
    padding: 0 14px;
}

body.guel-renewal textarea {
    min-height: 120px;
    padding: 12px 14px;
    line-height: 1.75;
    resize: vertical;
}

body.guel-renewal input::placeholder,
body.guel-renewal textarea::placeholder {
    color: #B7B0A7;
}

body.guel-renewal input[type="text"]:focus,
body.guel-renewal input[type="password"]:focus,
body.guel-renewal input[type="email"]:focus,
body.guel-renewal input[type="number"]:focus,
body.guel-renewal input[type="url"]:focus,
body.guel-renewal input[type="search"]:focus,
body.guel-renewal input[type="tel"]:focus,
body.guel-renewal select:focus,
body.guel-renewal textarea:focus {
    outline: none;
    border-color: rgba(12, 75, 60, 0.45);
    box-shadow: 0 0 0 3px var(--guel-primary-soft);
    background: #fff;
}

/* ---------- buttons ---------- */
body.guel-renewal .btn01,
body.guel-renewal .btn02,
body.guel-renewal .btn_b01,
body.guel-renewal .btn_b02,
body.guel-renewal .btn_cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--guel-btn-h-sm);
    padding: 0 14px;
    border: 1px solid var(--guel-border);
    border-radius: var(--guel-radius-pill);
    background: #fff;
    color: var(--guel-primary);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    transition: all .2s ease;
}

body.guel-renewal .btn01:hover,
body.guel-renewal .btn02:hover,
body.guel-renewal .btn_b01:hover,
body.guel-renewal .btn_b02:hover,
body.guel-renewal .btn_cancel:hover {
    border-color: var(--guel-primary);
    color: var(--guel-primary);
    background: #fff;
    box-shadow: 0 4px 14px rgba(12, 75, 60, 0.06);
}

body.guel-renewal .btn_submit,
body.guel-renewal .btn_confirm a,
body.guel-renewal .btn_confirm input[type="submit"],
body.guel-renewal .btn_confirm button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--guel-btn-h);
    padding: 0 18px;
    border: 1px solid var(--guel-primary);
    border-radius: var(--guel-radius-pill);
    background: var(--guel-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    transition: all .2s ease;
    box-shadow: var(--guel-shadow-sm);
}

body.guel-renewal .btn_submit:hover,
body.guel-renewal .btn_confirm a:hover,
body.guel-renewal .btn_confirm input[type="submit"]:hover,
body.guel-renewal .btn_confirm button:hover {
    background: var(--guel-primary-hover);
    border-color: var(--guel-primary-hover);
    color: #fff;
    box-shadow: var(--guel-shadow-md);
}

/* ---------- board / table / pagination ---------- */
body.guel-renewal .tbl_head01 table,
body.guel-renewal .tbl_frm01 table {
    border-top-color: var(--guel-border-strong);
}

body.guel-renewal .tbl_head01 th,
body.guel-renewal .tbl_head01 td,
body.guel-renewal .tbl_frm01 th,
body.guel-renewal .tbl_frm01 td {
    border-color: var(--guel-border);
}

body.guel-renewal .tbl_head01 thead th,
body.guel-renewal .tbl_frm01 th {
    background: var(--guel-surface-2);
    color: var(--guel-text-soft);
    font-weight: 700;
}

body.guel-renewal .tbl_head01 tbody tr:hover {
    background: rgba(12, 75, 60, 0.02);
}

body.guel-renewal #bo_v_title {
    color: var(--guel-text);
}

body.guel-renewal #bo_v_info,
body.guel-renewal #bo_v_info a,
body.guel-renewal .bo_v_hdinfo {
    color: var(--guel-text-muted);
}

body.guel-renewal #bo_v_atc {
    color: var(--guel-text);
    line-height: 1.9;
}

body.guel-renewal #bo_v_atc a {
    color: var(--guel-primary);
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.guel-renewal .pg_page,
body.guel-renewal .pg_current {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border: 1px solid var(--guel-border);
    border-radius: var(--guel-radius-pill);
    background: #fff;
    color: var(--guel-text-soft);
    font-size: 13px;
    font-weight: 700;
    transition: all .2s ease;
}

body.guel-renewal .pg_page:hover {
    color: var(--guel-primary);
    border-color: rgba(12, 75, 60, 0.28);
}

body.guel-renewal .pg_current {
    background: var(--guel-primary);
    border-color: var(--guel-primary);
    color: #fff;
}

@media (max-width: 768px) {
    body.guel-renewal .btn01,
    body.guel-renewal .btn02,
    body.guel-renewal .btn_b01,
    body.guel-renewal .btn_b02,
    body.guel-renewal .btn_cancel {
        padding: 0 12px;
        font-size: 12px;
    }

    body.guel-renewal .btn_submit,
    body.guel-renewal .btn_confirm a,
    body.guel-renewal .btn_confirm input[type="submit"],
    body.guel-renewal .btn_confirm button {
        padding: 0 16px;
        font-size: 13px;
    }

    body.guel-renewal .pg_page,
    body.guel-renewal .pg_current {
        min-width: 34px;
        height: 34px;
        font-size: 12px;
    }
}
/* =========================================
   ON-PRIMARY CONTRAST
   primary / blue 계열 배경 위 텍스트는 흰색
   brand-ui.css 맨 아래에 둘 것
   ========================================= */

body.guel-renewal :is(
    .tw-bg-primary-500,
    .tw-bg-primary-600,
    .tw-bg-primary-700,
    .tw-bg-blue-500,
    .tw-bg-blue-600,
    .tw-bg-blue-700,
    .tw-bg-\[\#004433\],
    .tw-bg-\[\#0C4B3C\]
) {
    color: #fff !important;
}

body.guel-renewal :is(
    .tw-bg-primary-500,
    .tw-bg-primary-600,
    .tw-bg-primary-700,
    .tw-bg-blue-500,
    .tw-bg-blue-600,
    .tw-bg-blue-700,
    .tw-bg-\[\#004433\],
    .tw-bg-\[\#0C4B3C\]
):is(
    .tw-text-black,
    .tw-text-gray-900,
    .tw-text-gray-800,
    .tw-text-gray-700,
    .tw-text-stone-900,
    .tw-text-stone-800,
    .tw-text-stone-700
) {
    color: #fff !important;
}

body.guel-renewal :is(
    .tw-bg-primary-500,
    .tw-bg-primary-600,
    .tw-bg-primary-700,
    .tw-bg-blue-500,
    .tw-bg-blue-600,
    .tw-bg-blue-700,
    .tw-bg-\[\#004433\],
    .tw-bg-\[\#0C4B3C\]
) :is(
    a,
    span,
    strong,
    em,
    small,
    b,
    i,
    p,
    div,
    button,
    label,
    li,
    dt,
    dd,
    .tw-text-black,
    .tw-text-gray-900,
    .tw-text-gray-800,
    .tw-text-gray-700,
    .tw-text-stone-900,
    .tw-text-stone-800,
    .tw-text-stone-700
) {
    color: #fff !important;
}

body.guel-renewal :is(
    .tw-bg-primary-500,
    .tw-bg-primary-600,
    .tw-bg-primary-700,
    .tw-bg-blue-500,
    .tw-bg-blue-600,
    .tw-bg-blue-700,
    .tw-bg-\[\#004433\],
    .tw-bg-\[\#0C4B3C\]
) svg {
    color: #fff !important;
}

body.guel-renewal :is(
    .tw-bg-primary-500,
    .tw-bg-primary-600,
    .tw-bg-primary-700,
    .tw-bg-blue-500,
    .tw-bg-blue-600,
    .tw-bg-blue-700,
    .tw-bg-\[\#004433\],
    .tw-bg-\[\#0C4B3C\]
) svg * {
    stroke: currentColor;
}
