/* ============================================= */
/* ==       ไฟล์ style.css ฉบับสมบูรณ์        == */
/* ============================================= */


/* ส่วนที่ 1: สไตล์สำหรับ Drag & Drop Zone (ที่คุณมีอยู่แล้ว) */
/* ======================================================= */

.border-dashed {
    border: 2px dashed #ced4da;
    border-radius: .5rem;
    transition: all .2s ease-in-out;
}

.drop-zone-active {
    border-color: #0d6efd; /* สีน้ำเงินของ Bootstrap */
    background-color: #e9ecef;
}


[data-bs-theme="dark"] {
    /* -- สีพื้นหลัง -- */
    --bs-body-bg: #1e293b; /* สีกรมท่า-เทาเข้ม (Slate 800) */
    --bs-tertiary-bg: #334155; /* สีพื้นหลังรองที่สว่างขึ้น (Slate 700) */
    --bs-body-secondary-bg: #334155;

    /* -- สีตัวอักษร -- */
    --bs-body-color: #e2e8f0; /* สีเทา-ขาว สบายตา (Slate 200) */
    --bs-body-secondary-color: #94a3b8; /* สีเทาสำหรับข้อความรอง (Slate 400) */
    --bs-emphasis-color: #f8fafc; /* สีขาวสำหรับข้อความเน้น (Slate 50) */

    /* -- สีเส้นขอบ -- */
    --bs-border-color: #475569; /* สีเส้นขอบที่สว่างขึ้น (Slate 600) */
    --bs-border-color-translucent: rgba(255, 255, 255, 0.15);

    /* -- สีของลิงก์ -- */
    --bs-link-color: #60a5fa; /* สีฟ้าสว่าง (Blue 400) */
    --bs-link-hover-color: #93c5fd; /* สีฟ้าสว่างขึ้นเมื่อ Hover */
    
    /* -- สีของตาราง -- */
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.03); /* สีสลับแถวที่นุ่มนวล */
    --bs-table-border-color: var(--bs-border-color);
}


/* ส่วนที่ 2: แก้ไขสีของปุ่ม Outline ที่ถูก Disabled ให้เข้ากับ Theme ใหม่ */
/* ===================================================================== */

[data-bs-theme="dark"] .btn-outline-secondary:disabled,
[data-bs-theme="dark"] .btn-outline-secondary.disabled {
    color: #64748b; /* สีเทาที่สว่างขึ้น (Slate 500) */
    border-color: #475569;
}

[data-bs-theme="dark"] .btn-outline-primary:disabled,
[data-bs-theme="dark"] .btn-outline-primary.disabled {
    color: #436da5;
    border-color: #3b5a8a;
}


/* ส่วนที่ 3: สไตล์สำหรับปุ่มสลับ Theme (เหมือนเดิม) */
/* ==================================================== */

/* ซ่อนไอคอนทั้งสองไว้เป็นค่าเริ่มต้น */
#theme-toggler .bi {
    display: none;
}
/* แสดงเฉพาะไอคอนที่มีคลาส .theme-icon-active */
#theme-toggler .theme-icon-active {
    display: inline-block;
}


/* ส่วนที่ 4: สไตล์สำหรับ Drag & Drop Zone (เหมือนเดิม) */
/* ======================================================= */

.border-dashed {
    border: 2px dashed #475569; /* ปรับสีให้เข้ากับ theme ใหม่ */
    border-radius: .5rem;
    transition: all .2s ease-in-out;
}

/* ทำให้โซนสว่างขึ้นเมื่อลากไฟล์มาเหนือโซนใน dark mode */
[data-bs-theme="dark"] .drop-zone-active {
    border-color: var(--bs-link-color);
    background-color: var(--bs-tertiary-bg);
}