/* === Minimalist Theme Overrides === */

/* 1. กำหนดชุดสีหลัก (Core Color Scheme) */
:root { 
  --bs-primary: #0071e3;  /* สีหลัก (ฟ้า Apple) */
  --bs-secondary: #868e96; /* สีรอง (เทาอ่อน) */
  --bs-body-color: #1d1d1f; /* สีตัวอักษรหลัก (ดำเข้ม) */
  --bs-body-bg: #fff;      /* สีพื้นหลัง (ขาว) */
  --bs-border-color: #d2d2d7; /* สีเส้นขอบ */
  --bs-link-color: #06c;   /* สีลิงก์ (ฟ้า) */
  --bs-link-hover-color: #000; /* สีลิงก์เมื่อเมาส์ชี้ (ดำ) */
}

/* 2. ทำให้องค์ประกอบเรียบง่ายและสะอาดตา */
.bg-gradient {
  background-image: none !important; /* ลบพื้นหลังแบบไล่สี */
}

.card {
  box-shadow: none; /* ลบเงาของ card */
}

.btn {
    border-radius: 0; /* ลบมุมโค้งมนของปุ่ม */
}

/* 3. ปรับ Header ให้เข้ากับธีม */
header.bg-primary {
  background-color: #f5f5f7 !important; /* เปลี่ยนสีพื้นหลัง Header เป็นเทาอ่อนมาก */
}
header .text-white {
  color: var(--bs-body-color) !important; /* เปลี่ยนตัวอักษรใน Header เป็นสีดำ */
}
header .text-white-50 {
  color: #6e6e73 !important; /* เปลี่ยนตัวอักษรรองใน Header เป็นสีเทา */
}
header .btn-outline-light {
  --bs-btn-color: var(--bs-dark);
  --bs-btn-border-color: var(--bs-dark);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-dark);
  --bs-btn-hover-border-color: var(--bs-dark);
}

/* 4. ปรับสีปุ่มและ Badge ให้เป็นสีฟ้า */
.btn-primary, .btn-danger {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #0077ed;  /* สีฟ้าเข้มขึ้นเมื่อ hover */
  --bs-btn-hover-border-color: #0077ed;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #545b62;
  --bs-btn-active-border-color: #545b62;
}

.text-bg-primary {
    background-color: #6c757d !important;
}

hr.text-success, hr.text-primary, hr.text-danger {
    border: 0;
    border-top: 1px solid var(--bs-border-color);
    opacity: 1;
}

/* 5. ปรับสีกล่องข้อความ (Alert) */
.alert-success, .alert-primary, .alert-danger {
    --bs-alert-bg: #e9ecef;
    --bs-alert-color: var(--bs-body-color);
    --bs-alert-border-color: #dee2e6;
}

/* 6. Promotion Banner */
.promotion-banner {
    background-color: #1d1d1f; /* Apple-like dark background */
    padding: 3rem 0;
}

.promotion-banner .badge.bg-secondary {
    background-color: #515154 !important;
}

.promotion-banner .text-white-50 {
    color: #a1a1a6 !important;
}

.price-promo {
    padding: 2rem 1rem;
    border: 1px solid #424245;
    border-radius: 12px;
    height: 100%;
    background-color: #000;
}

.price-strike {
    text-decoration: line-through;
    color: #a1a1a6;
    font-size: 1.25rem;
}
.price-new {
    color: #6bf273; /* Apple-like promotion green */
    font-size: 2rem;
    font-weight: 600;
}

/* 8. "คลิกทดลองใช้งาน" Button */
.btn-outline-light {
    --bs-btn-color: #fff;        /* กำหนดสีตัวอักษรปกติเป็นสีขาว */
    --bs-btn-border-color: #000; /* สีขอบปุ่มเป็นสีดำ */
    --bs-btn-bg: #000;           /* สีพื้นหลังปุ่มเป็นสีดำ */
    --bs-btn-hover-color: #fff;  /* กำหนดสีตัวอักษรเมื่อเมาส์ชี้เป็นสีขาว */
    --bs-btn-hover-bg: #333;     /* สีพื้นหลังปุ่มเมื่อเมาส์ชี้ */
    border-radius: 0.5rem;       /* เพิ่มความโค้งมน */
}

/* 9. Carousel Image Sizing */
#programScreenshots .carousel-inner {
    /* กำหนดความสูงคงที่สำหรับพื้นที่สไลด์ (ปรับค่าได้ตามต้องการ) */
    height: 550px; 
    background-color: #f5f5f7; /* สีพื้นหลังเผื่อรูปมีขนาดไม่พอดี */
}

#programScreenshots .carousel-item {
    height: 100%;
}

#programScreenshots .carousel-item img {
    object-fit: contain; /* ทำให้รูปภาพแสดงผลเต็มโดยไม่ถูกตัด */
    height: 100%;
}

/* 10. Carousel Controls Color */
.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* 11. Carousel Indicators Color */
.carousel-indicators [data-bs-target] {
    background-color: #000;
}