:root {
  --l1: #ffad33;
  --l2: #ffc266;
  --l3: #ffd699;
  --l4: #ffebcc;
  --l5: #fff9f0;
  --d1: #e68a00;
  --d4: #995c00;
}
.w3-theme-l5 {
  color: #000 !important;
  background-color: #fff9f0 !important;
}
.w3-theme-l4 {
  color: #000 !important;
  background-color: #ffebcc !important;
}
.w3-theme-l3 {
  color: #000 !important;
  background-color: #ffd699 !important;
}
.w3-theme-l2 {
  color: #000 !important;
  background-color: #ffc266 !important;
}
.w3-theme-l1 {
  color: #000 !important;
  background-color: #ffad33 !important;
}
.w3-theme-d1 {
  color: #fff !important;
  background-color: #e68a00 !important;
}
.w3-theme-d2 {
  color: #fff !important;
  background-color: #cc7a00 !important;
}
.w3-theme-d3 {
  color: #fff !important;
  background-color: #b36b00 !important;
}
.w3-theme-d4 {
  color: #fff !important;
  background-color: #995c00 !important;
}
.w3-theme-d5 {
  color: #fff !important;
  background-color: #804d00 !important;
}

.w3-theme-light {
  color: #000 !important;
  background-color: #fff9f0 !important;
}
.w3-theme-dark {
  color: #fff !important;
  background-color: #804d00 !important;
}
.w3-theme-action {
  color: #fff !important;
  background-color: #804d00 !important;
}

.w3-theme {
  color: #000 !important;
  background-color: #ff9800 !important;
}
.w3-text-theme {
  color: #ff9800 !important;
}
.w3-border-theme {
  border-color: #ff9800 !important;
}

.w3-hover-theme:hover {
  color: #000 !important;
  background-color: #ff9800 !important;
}
.w3-hover-text-theme:hover {
  color: #ff9800 !important;
}
.w3-hover-border-theme:hover {
  border-color: #ff9800 !important;
}
/* ชุดที่ 1 (Header / Navbar / Banner) */
.w3-theme-gradient1 {
  color: #000 !important;
  background: linear-gradient(
    to bottom,
    var(--l3) 0%,
    /* l3 */ var(--l1) 40%,
    /* l1 */ var(--d1) 100% /* d1 */
  );
}

/* ชุดที่ 2 (Footer / Hero / Admin) */
.w3-theme-gradient2 {
  color: #000 !important;
  background: linear-gradient(
    to bottom,
    var(--l2) 0%,
    /* l2 */ var(--d1) 45%,
    /* d1 */ var(--d4) 100% /* d4 */
  );
}

/* ชุดที่ 3 (Content / Page Background) */
.w3-theme-gradient3 {
  color: #000 !important;
  background: linear-gradient(
    to bottom,
    var(--l5) 0%,
    /* l5 */ var(--l4) 45%,
    /* l4 */ var(--l3) 100% /* l3 */
  );
}