:root {
    --app-header-height: 80px; /* กำหนดความสูงของ Header */

    --rz-text-font-family: "Anuphan", sans-serif; /* กำหนด font family ของตัวอักษร */

    --rz-body-background-color: #f5eedd; /* สีพื้นหลังของ Body */
    --rz-layout-body-background-color: #ffffff; /* สีพื้นหลังของ Layout Body */

    --rz-primary: #284571 !important; /* สีพื้นหลังของ Primary */
    --rz-on-primary: #ffffff !important; /* สีตัวอักษรบน Primary */
    --rz-secondary: #48689a !important; /* สีพื้นหลังของ Secondary */
    --rz-on-secondary: white !important; /* สีตัวอักษรบน Secondary */

    /* Header Bar */
    --rz-header-color: #ffffff; /* สีตัวอักษรบน Header */
    --rz-header-background-color: #284571; /* สีพื้นหลัง Header */

    /* Footer Bar */
    --rz-footer-color: #ffffff; /* สีตัวอักษรของ Footer */
    --rz-footer-background-color: #186a91; /* สีพื้นหลังของ Footer */
    --rz-footer-padding: 1rem;
    --rz-footer-border: none;

    /* Link */
    --rz-link-color: #284571; /* สีตัวอักษรของ Link */
    --rz-link-hover-color: #1a2e4a; /* สีตัวอักษรเมื่อ mouse hover ของ Link */

    /* Input */
    --rz-input-background-color: #ffffff; /* สีพื้นหลังของ Input */
    --rz-input-hover-background-color: #f4f4f4; /* สีพื้นหลังของ Input เมื่อ mouse hover */
    --rz-input-focus-background-color: #ffffff; /* สีพื้นหลังของ Input เมื่อ focus */

    /* Grid */
    --rz-grid-header-color: black;
    --rz-grid-header-background-color: #e3ecf5; /* สีพื้นหลังของ Header Grid */
    --rz-grid-filter-color: black;
    --rz-grid-filter-background-color: #f5eedd;
    --grid-header-border-color: #ffffff;
    --grid-body-border-color: #ffffff;

    /* Check Box */
    --rz-checkbox-checked-color: black; /* สีเครื่องหมายของ Checkbox เมื่อถูกเลือก */
    --rz-checkbox-checked-background-color: #f5eedd; /* สีพื้นหลังของ Checkbox เมื่อถูกเลือก */
    --rz-checkbox-checked-hover-background-color: #f5eedd; /* สีพื้นหลังของ Checkbox เมื่อ mouse hover */

    /* Dialog */
    --rz-dialog-header-color: #000000; /* สีพื้นหลังของ Dialog */
    --rz-dialog-background-color: #ffffff; /* สีพื้นหลังของ Dialog Title */
    --rz-dialog-close-button-color: #000000; /* สีของปุ่มปิด Dialog */

    /* Panel Menu & Sidebar */
    --rz-sidebar-background-color: #eabb24; /* สีพื้นหลังของ Sidebar */
    --rz-panel-menu-item-background-color: #eabb24; /* สีพื้นหลังของ Panel Menu Item */
    --rz-panel-menu-icon-color: #284571; /* สี icon มีผลทั้ง (Menu Group) และ (Menu Item) */
    --rz-panel-menu-item-border: 0px none black; /* สี border ขอบล่างของ Menu Panel (ของแต่ละ Group) */
    --rz-panel-menu-item-border-radius: 0; /* ความโค้ง border ขอบล่างของ Menu Panel (ของแต่ละ Group) */
    --rz-panel-menu-icon-font-size: 1.5rem; /* ขนาด icon (Menu Group) */
    --rz-panel-menu-icon-width: 1rem; /* ความกว้าง icon (Menu Group) */
    --rz-panel-menu-icon-height: 1rem; /* ความสูง icon (Menu Group) */
    --rz-panel-menu-font-size: 18px; /* ขนาดของตัวอักษร (Menu Group) */
    --rz-panel-menu-font-weight: 700; /* ความหนาตัวอักษร (Menu Group) */
    --rz-panel-menu-item-color: #284571; /* สีตัวอักษร (Menu Group) */
    --rz-panel-menu-item-hover-color: #196A90; /* สีตัวอักษรเมื่อ mouse hover (Menu Group) */
    --rz-panel-menu-item-hover-background-color: transparent; /* สีพื้นหลัง mouse hover (Menu Group) */
    --rz-panel-menu-icon-2nd-level-icon-size: 1.5rem; /* ขนาด icon (Menu Item) */
    --rz-panel-menu-item-2nd-level-font-size: 14px; /* ขนาดของตัวอักษร (Menu Item) */
    --rz-panel-menu-item-2nd-level-font-weight: 400; /* ความหนาตัวอักษร (Menu Item) */
    --rz-panel-menu-item-2nd-level-color: #284571; /* สีตัวอักษร (Menu Item) */
    --rz-panel-menu-item-2nd-level-background-color: #eabb24; /* สีพื้นหลัง (Menu Item) */
    --rz-panel-menu-item-2nd-level-border-radius: 1.5rem; /* ความโค้ง boder (Menu Item) */
    --rz-panel-menu-item-2nd-level-hover-color: #ffffff; /* สีตัวอักษรเมื่อ mouse hover (Menu Item) */
    --rz-panel-menu-item-2nd-level-hover-background-color: #284571; /* สีพื้นหลัง mouse hover (Menu Item) */
    --rz-panel-menu-item-2nd-level-active-color: #196a90; /* สีตัวอักษรรายการที่ active อยู่ (Menu Item) */
    --rz-panel-menu-item-2nd-level-active-background-color: #eeddcb; /* สีพื้นหลังรายการที่ active อยู่ (Menu Item) */

    /* Hamburger Button */
    --hamburger-button-color: #ffffff; /* สีของ Hamburger Button */

    /* Circle Icon */
    --circle-icon-color: #ffffff; /* สี circle icon */
    --circle-icon-background-color: #ff9c18; /* สีพื้นหลัง circle icon */
    --circle-icon-border: 0px solid black; /* กำหนด border ให้ circle icon */
    --circle-icon-box-shadow: 0 0 2px #000000; /* กำหนดเงาให้ circle icon */

    /* Change Password Icon */
    --change-password-icon-color: #ffffff; /* สี change password icon */
    --change-password-icon-background-color: #ff9c18; /* สีพื้นหลัง change password icon */
    --change-password-icon-border: 0px solid black; /* กำหนด border ให้ change password icon */
    --change-password-icon-box-shadow: 0 0 2px #000000; /* กำหนดเงาให้ change password icon */

    /* Dialog Icon */
    --icon-info: #196a90; /* สี icon info */
    --icon-warning: #ff9c19; /* สี icon warning */
    --icon-error: #ff2327; /* สี icon error */

    /* Notification Panel */
    --noti-empty-color: #6b7280; /* สี icon empty notification */
    --noti-info-color: #2196f3; /* สี icon ข้อความแจ้งเตือนประเภท ข้อมูล */
    --noti-success-color: #4caf50; /* สี icon ข้อความแจ้งเตือนประเภท สำเร็จ */
    --noti-warning-color: #ff9800; /* สี icon ข้อความแจ้งเตือนประเภท เตือน */
    --noti-error-color: #f44336; /* สี icon ข้อความแจ้งเตือนประเภท ข้อผิดพลาด */
    --noti-remove-item-icon: #000000; /* สี icon สำหรับลบรายการแจ้งเตือน */

    --validate-color1: #ff2327; /* สีสำหรับข้อความ Validate */

    --readonly-textbox-color: #000; /* กำหนดสีตัวอักษรของ readonly textbox */
    --readonly-textbox-background-color: red !important; /* กำหนดสีพื้นหลังของ readonly textbox */
    --readonly-textbox-border: 2px solid #196a90 !important; /* กำหนดสี border ของ readonly textbox */

    --content-card-padding: 2rem; /* กำหนดระยะ padding ของ card */
    --content-card-margin: 0 0 0 0; /* กำหนดระยะ margin ของ card */
    --content-card-background-color: white; /* กำหนดสี backgrouund ของ card */
    --content-card-border: 1px solid #196A90; /* กำหนดสี border ของ card */
    --content-card-border-radius: 1.5rem; /* ปรับความโค้งมนของขอบ card */
    --content-card-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); /* กำหนดเงาให้ card */

    --dialog-background-color: white; /* กำหนดสี background ของ dialog */
    --dialog-border: 1px solid #196A90; /* กำหนดสี border ของ dialog */
    --dialog-border-radius: 1.5rem; /* กำหนดความโค้งมนของขอบ dialog */
    --dialog-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25); /* กำหนดเงาให้ dialog */

    --column-inactive-color: #bcbcbc; /* สีสำหรับคอลัมน์ที่ไม่ใช้งาน */

    /* Status text highlight */
    --status-highlight-background-color-accept: rgba(60, 203, 58, .7);
    --status-highlight-text-color-accept: white;
    --status-highlight-background-color-reject: gba(222, 18, 18, .7);
    --status-highlight-text-color-reject: white;
    --status-highlight-background-color-pending: rgba(181, 181, 181, .7);
    --status-highlight-text-color-pending: black;
}

img.layout-logo-image {
    height: 80px;
    padding: 0.75rem 0;
    margin: 2rem;
    filter: drop-shadow(0 0 5px rgba(0,0,0,0.7));
}

/*.layout-header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 70px;
    width: 100%;
    background-image: url('/images/edo/Navbar_BG5.png');
    background-repeat: no-repeat;
    background-position: right top;
    opacity: 0.4;
    z-index: -1;
}*/

.rz-textbox.rz-state-readonly input {
    background-color: red !important;
    border: 1px solid green !important;
}