@import url('https://fonts.googleapis.com/icon?family=Material+Icons+Outlined');
@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@300&display=swap');
/*@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css');*/

@import url('https://fonts.googleapis.com/icon?family=Material+Icons+Outlined');
@import url('https://fonts.cdnfonts.com/css/digital-numbers');
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
input,
button {
    font-family: 'Prompt', sans-serif;
}

.tb-widget-container {
    font-family: 'Prompt', sans-serif;
}

.tb-dashboard-toolbar {
    background-image: linear-gradient(to bottom, #006D3D, transparent);
}

.state-entry.ng-star-inserted:hover {
    /*background-color: #e0e0e0;*/
    color:grey;
    /* เปลี่ยนสีพื้นหลังเมื่อผู้ใช้เลื่อนเมาส์ไปบนข้อมูล */
    transition: background-color 0.3s ease;
    /* การเปลี่ยนแปลงจะใช้เวลา 0.3 วินาที โดยมีการเร่งช้า (ease) */
    font-family: 'Prompt', sans-serif;
}

.state-entry.ng-star-inserted {
    /*background-color: #f0f0f0;*/
    /* สีพื้นหลังเทาอ่อน */
    /*border: 1px solid #e0e0e0;*/
    /* สีขอบเทาเข้มขึ้นนิดหน่อย */
    /*border-radius: 50px;*/
    /* ลบมุมกลมออก และ มุมมีรัศมี 10px */
    /*box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);*/
    /* แสงเงาเบา */
    color: white;
    /* สีตัวอักษรเทาเข้ม */
    font-size: 16px;
    /* ระยะห่างขอบภายนอก */
    /*width:200px;*/
    /*text-align: center;*/
    font-family: 'Prompt', sans-serif;
}
/* Icon Button Styling */
.mdc-icon-button.mat-mdc-icon-button.mat-unthemed.mat-mdc-button-base .ng-star-inserted {
    color: #006d32 !important;
}

/* Image Animation */
img {
    /*animation: bounce 5s linear infinite;*/
}
[_nghost-ng-c67465218] .tb-login-content[_ngcontent-ng-c67465218] {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding: 0px 0 !important;
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-15px);
    }
    60% {
        transform: translateY(-7px);
    }
}

/* Login Content Background */
.tb-login-content {
    background-color: #1e2a38 !important;
    background-image: url("/api/images/public/51nONPMbyI15xON9zYLZQqDfQtz8bAnz");
    color: rgba(0, 0, 0, 0.87);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* Text Field Labels */
.tb-dark .mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label,
.tb-default .mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label {
    color: #333;
}

/* Icon Button Touch Target */
.mat-mdc-icon-button .mat-mdc-button-touch-target {
    color: #333;
}

/* Text Field Input Styling */
.tb-dark .mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input {
    color: #333;
}

/* Form Field Background */
.mat-mdc-form-field-flex {
    background: #f2f2f2;
    border-radius: 10px;
    padding: 10px;
}

/* Card Styling */
.tb-dark .mat-mdc-card {
    position: absolute;  /* ทำให้สามารถกำหนดตำแหน่งได้อิสระ */
    left: 5%;  /* ย้ายไปทางซ้าย 5% ของหน้าจอ */
    top: 50%;  /* จัดให้อยู่ตรงกลางแนวตั้ง */
    transform: translateY(-50%);  /* ปรับให้ Card อยู่กึ่งกลางที่แท้จริง */
    border-radius: 20px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    background: rgba(255, 255, 255, 0.9);
    transition: transform 0.3s ease-in-out;
}


/* Button Styling */
.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent {
    text-transform: uppercase;
    letter-spacing: 1.3px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(90deg, rgba(129, 230, 217, 1) 0%, rgba(79, 209, 197, 1) 100%);
    border: none;
    border-radius: 50px;
    box-shadow: 0 8px 24px rgba(79, 209, 197, 0.64);
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    outline: none;
    padding: 12px 24px;
    position: relative;
}

.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent:hover,
.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent:focus {
    color: #313133;
    background: linear-gradient(90deg, rgba(79, 209, 197, 1) 0%, rgba(129, 230, 217, 1) 100%);
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(79, 209, 197, 0.64);
}

/* Toolbar Icon Padding */
.tb-default .mat-toolbar.mat-mdc-table-toolbar .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-icon-prefix>.mat-icon, 
.tb-default .mat-toolbar.mat-mdc-table-toolbar .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-icon-suffix>.mat-icon, 
.tb-dark .mat-toolbar.mat-mdc-table-toolbar .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-icon-prefix>.mat-icon, 
.tb-dark .mat-toolbar.mat-mdc-table-toolbar .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-icon-suffix>.mat-icon {
    padding-bottom: 12px !important;
}

/* Button Hover Effects */
.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent:hover::before,
.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent:focus::before {
    opacity: 1;
}

.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent:hover::after,
.tb-dark.dark-foreground .mat-mdc-raised-button.mat-accent:focus::after {
    animation: none;
}



.login-logo[_nghost-ng-c3298074073] img.tb-logo-title[_ngcontent-ng-c3298074073], .login-logo [_nghost-ng-c3298074073] img.tb-logo-title[_ngcontent-ng-c3298074073] {
 width: 230px !important;
  height: 100px !important;
  pointer-events: none !important;
  cursor: default !important;
}
.tb-powered-by-footer {
    display: none !important;
}
.tb-default .mat-toolbar.mat-primary {
    --mat-toolbar-container-background-color: #919191 !important;
    --mat-toolbar-container-text-color: #0f161d !important;
}
[_nghost-ng-c3326577745] mat-sidenav.tb-site-sidenav[_ngcontent-ng-c3326577745] .tb-nav-header[_ngcontent-ng-c3326577745] .tb-nav-header-toolbar[_ngcontent-ng-c3326577745] > div[_ngcontent-ng-c3326577745] .tb-logo-title[_ngcontent-ng-c3326577745] {
    height: 150px !important;

}
a[href="/home"] {
    display: none !important;
}
body > tb-root > tb-login > div > mat-card > mat-card-content > form > fieldset > div.layout-padding.flex.flex-col > div.forgot-password.flex.items-center.justify-end{
 display: none !important;
}
body > tb-root > tb-login > div > mat-card > mat-card-content > form > fieldset > div.layout-padding.flex.flex-col > span{
  display: none !important;
}