/* ==========================================================================
   INTER AI — bootstrap-reskin.css
   โหลดต่อจาก bootstrap.min.css เสมอ
   แก้เฉพาะ SECTION 1 (สี) ต่อโปรเจกต์ — SECTION 2 ลงไปห้ามแก้รายโปรเจกต์
   ========================================================================== */

/* ==========================================================================
   SECTION 1 — COLOR STRATEGY (แก้ได้เฉพาะส่วนนี้)
   แนวคิด: โกดังเหล็ก — เทาอมน้ำเงินเย็น + น้ำเงินเหล็กเป็นสีหลัก
   อำพันใช้กับ "ค้าง/ใกล้หมด" และเขียวใช้กับ "สำเร็จ" เท่านั้น ไม่ใช้พร่ำเพรื่อ
   ========================================================================== */
:root {
    --ia-ink:        oklch(0.24 0.020 250);
    --ia-ink-soft:   oklch(0.38 0.018 250);
    --ia-muted:      oklch(0.54 0.015 250);
    --ia-line:       oklch(0.90 0.008 250);
    --ia-line-soft:  oklch(0.945 0.006 250);
    --ia-surface:    oklch(0.975 0.004 250);
    --ia-panel:      #ffffff;

    --ia-primary:      oklch(0.52 0.110 248);
    --ia-primary-dark: oklch(0.44 0.110 248);
    --ia-primary-soft: oklch(0.955 0.022 248);

    --ia-amber:      oklch(0.74 0.140 72);
    --ia-amber-soft: oklch(0.965 0.045 82);
    --ia-green:      oklch(0.58 0.130 155);
    --ia-green-soft: oklch(0.960 0.040 158);
    --ia-red:        oklch(0.55 0.180 25);
    --ia-red-soft:   oklch(0.962 0.035 25);

    --ia-radius:     8px;
    --ia-radius-sm:  6px;
    --ia-shadow:     0 1px 2px oklch(0.24 0.02 250 / 0.06), 0 8px 24px oklch(0.24 0.02 250 / 0.06);

    /* map เข้าตัวแปรของ Bootstrap */
    --bs-primary:      var(--ia-primary);
    --bs-primary-rgb:  47, 92, 148;
    --bs-body-color:   var(--ia-ink);
    --bs-body-bg:      var(--ia-surface);
    --bs-border-color: var(--ia-line);
    --bs-border-radius: var(--ia-radius);
    --bs-font-sans-serif: "Sarabun", system-ui, -apple-system, "Segoe UI", sans-serif;
    --bs-link-color: var(--ia-primary);
    --bs-link-hover-color: var(--ia-primary-dark);
}

/* ==========================================================================
   SECTION 2 — CONTROLS (ใช้ร่วมกันทุกโปรเจกต์ ห้ามแก้รายโปรเจกต์)
   ========================================================================== */
body {
    font-family: var(--bs-font-sans-serif);
    color: var(--ia-ink);
    background: var(--ia-surface);
    font-size: 0.9375rem;
    -webkit-font-smoothing: antialiased;
}

.btn {
    --bs-btn-padding-y: 0.4rem;
    --bs-btn-padding-x: 0.9rem;
    --bs-btn-font-weight: 500;
    --bs-btn-border-radius: var(--ia-radius-sm);
    letter-spacing: -0.005em;
}

.btn-primary {
    --bs-btn-bg: var(--ia-primary);
    --bs-btn-border-color: var(--ia-primary);
    --bs-btn-hover-bg: var(--ia-primary-dark);
    --bs-btn-hover-border-color: var(--ia-primary-dark);
    --bs-btn-active-bg: var(--ia-primary-dark);
    --bs-btn-disabled-bg: var(--ia-primary);
    --bs-btn-disabled-border-color: var(--ia-primary);
}

.btn-outline-secondary {
    --bs-btn-color: var(--ia-ink-soft);
    --bs-btn-border-color: var(--ia-line);
    --bs-btn-hover-bg: var(--ia-line-soft);
    --bs-btn-hover-color: var(--ia-ink);
    --bs-btn-hover-border-color: var(--ia-line);
}

.form-control, .form-select {
    border-color: var(--ia-line);
    border-radius: var(--ia-radius-sm);
    padding: 0.42rem 0.7rem;
    font-size: 0.9375rem;
}

.form-control:focus, .form-select:focus {
    border-color: var(--ia-primary);
    box-shadow: 0 0 0 3px var(--ia-primary-soft);
}

.form-label {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--ia-ink-soft);
    margin-bottom: 0.25rem;
}

.form-text { font-size: 0.75rem; color: var(--ia-muted); }

.form-check-input:checked {
    background-color: var(--ia-primary);
    border-color: var(--ia-primary);
}

.form-switch .form-check-input:focus { box-shadow: 0 0 0 3px var(--ia-primary-soft); }

.modal-content {
    border: none;
    border-radius: var(--ia-radius);
    box-shadow: var(--ia-shadow);
}

.modal-header, .modal-footer { border-color: var(--ia-line-soft); }

.table { --bs-table-color: var(--ia-ink); margin-bottom: 0; }

.table > :not(caption) > * > * { padding: 0.6rem 0.75rem; }

.table thead th {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ia-muted);
    background: var(--ia-line-soft);
    border-bottom: 1px solid var(--ia-line);
    white-space: nowrap;
}

.table tbody tr { border-bottom: 1px solid var(--ia-line-soft); }
.table tbody tr:hover { background: var(--ia-primary-soft); }

.page-link { color: var(--ia-ink-soft); border-color: var(--ia-line); }
.page-item.active .page-link { background: var(--ia-primary); border-color: var(--ia-primary); }

.invalid-feedback { font-size: 0.75rem; }
.was-validated .form-control:invalid, .form-control.is-invalid { border-color: var(--ia-red); }