:root {
    --color-1: #e83e8c;  /* สี 1 */
    --color-2: #28a745;  /* สี 2 */
    --color-3: #007bff;  /* สี 3 */
    --color-4: #6610f2;  /* สี 4 */
    --color-5: #8e44ad;  /* สี 5 */
    --color-6: #e67e22;  /* สี 6 */
    --color-7: #2ecc71;  /* สี 7 */
    --color-8: #3498db;  /* สี 8 */
    --color-9: #1abc9c;  /* สี 9 */
    --color-10: #9b59b6; /* สี 10 */
    --color-11: #2c3e50; /* สี 11 */
    --color-12: #34495e; /* สี 12 */
    --color-13: #ff1900; /* สี 13 */
    --color-14: #ecf0f1; /* สี 14 */
    --color-15: #bdc3c7; /* สี 15 */
    --color-16: #95a5a6; /* สี 16 */
    --color-17: #d35400; /* สี 17 */
    --color-18: #c0392b; /* สี 18 */
    --color-19: #f312b0; /* สี 19 */
    --color-20: #16a085; /* สี 20 */
    --color-21: #2980b9; /* สี 21 */
    --color-22: #8e44ad; /* สี 22 */
    --color-23: #ddc916; /* สี 23 */
    --color-24: #000000; /* สี 24 */
    --color-25: #2ecc71; /* สี 25 */
    --color-26: #3498db; /* สี 26 */
    --color-27: #1abc9c; /* สี 27 */
    --color-28: #9b59b6; /* สี 28 */
    --color-29: #2c3e50; /* สี 29 */
    --color-30: #34495e; /* สี 30 */
    --color-31: #e67e22; /* สี 31 */
    --color-32: #d35400; /* สี 32 */
    --color-33: #bec02b; /* สี 33 */
    --color-34: #f39c12; /* สี 34 */
    --color-35: #16a085; /* สี 35 */
    --color-36: #2980b9; /* สี 36 */
    --color-37: #8e44ad; /* สี 37 */
    --color-38: #e74c3c; /* สี 38 */
    --color-39: #f1c40f; /* สี 39 */
    --color-40: #2ecc71; /* สี 40 */
    --color-41: #3498db; /* สี 41 */
    --color-42: #1abc9c; /* สี 42 */
    --color-43: #9b59b6; /* สี 43 */
    --color-44: #2c3e50; /* สี 44 */
    --color-45: #34495e; /* สี 45 */
    --color-46: #e67e22; /* สี 46 */
    --color-47: #d35400; /* สี 47 */
    --color-48: #523a1f; /* สี 48 */
    --color-49: #dc3545; /* สี 49 */
    --color-50: #2b6682; /* สี 50 */
    --color-51: #0b5731; /* สี 51 */
    --color-52: #3357FF;
    --color-53: #B0E0E6;
    --color-54: #FF7F50;
    --color-55: #DA70D6;
    --color-56: #FFB6C1;
}

.custom-bg-1 { background-color: var(--color-1); }
.custom-bg-2 { background-color: var(--color-2); }
.custom-bg-3 { background-color: var(--color-3); }
.custom-bg-4 { background-color: var(--color-4); }
.custom-bg-5 { background-color: var(--color-5); }
.custom-bg-6 { background-color: var(--color-6); }
.custom-bg-7 { background-color: var(--color-7); }
.custom-bg-8 { background-color: var(--color-8); }
.custom-bg-9 { background-color: var(--color-9); }
.custom-bg-10 { background-color: var(--color-10); }
.custom-bg-11 { background-color: var(--color-11); }
.custom-bg-12 { background-color: var(--color-12); }
.custom-bg-13 { background-color: var(--color-13); }
.custom-bg-14 { background-color: var(--color-14); }
.custom-bg-15 { background-color: var(--color-15); }
.custom-bg-16 { background-color: var(--color-16); }
.custom-bg-17 { background-color: var(--color-17); }
.custom-bg-18 { background-color: var(--color-18); }
.custom-bg-19 { background-color: var(--color-19); }
.custom-bg-20 { background-color: var(--color-20); }
.custom-bg-21 { background-color: var(--color-21); }
.custom-bg-22 { background-color: var(--color-22); }
.custom-bg-23 { background-color: var(--color-23); }
.custom-bg-24 { background-color: var(--color-24); }
.custom-bg-25 { background-color: var(--color-25); }
.custom-bg-26 { background-color: var(--color-26); }
.custom-bg-27 { background-color: var(--color-27); }
.custom-bg-28 { background-color: var(--color-28); }
.custom-bg-29 { background-color: var(--color-29); }
.custom-bg-30 { background-color: var(--color-30); }
.custom-bg-31 { background-color: var(--color-31); }
.custom-bg-32 { background-color: var(--color-32); }
.custom-bg-33 { background-color: var(--color-33); }
.custom-bg-34 { background-color: var(--color-34); }
.custom-bg-35 { background-color: var(--color-35); }
.custom-bg-36 { background-color: var(--color-36); }
.custom-bg-37 { background-color: var(--color-37); }
.custom-bg-38 { background-color: var(--color-38); }
.custom-bg-39 { background-color: var(--color-39); }
.custom-bg-40 { background-color: var(--color-40); }
.custom-bg-41 { background-color: var(--color-41); }
.custom-bg-42 { background-color: var(--color-42); }
.custom-bg-43 { background-color: var(--color-43); }
.custom-bg-44 { background-color: var(--color-44); }
.custom-bg-45 { background-color: var(--color-45); }
.custom-bg-46 { background-color: var(--color-46); }
.custom-bg-47 { background-color: var(--color-47); }
.custom-bg-48 { background-color: var(--color-48); }
.custom-bg-49 { background-color: var(--color-49); }
.custom-bg-50 { background-color: var(--color-50); }
.custom-bg-51 { background-color: var(--color-51); }
.custom-bg-52 { background-color: var(--color-52); }
.custom-bg-53 { background-color: var(--color-53); }
.custom-bg-54 { background-color: var(--color-54); }
.custom-bg-55 { background-color: var(--color-55); }
.custom-bg-56 { background-color: var(--color-56); }