/*
Theme Name: Phenthai
Author: Phranakornsoft
Author URI: http://www.phranakornsoft.com
Description: Phenthai Phase3
Version: 2.0.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: phenthai
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100..900&display=swap');

@import "tailwindcss";

@plugin "flowbite/plugin";
@source "./node_modules/flowbite";
@source "./node_modules/flowbite-datepicker";

@plugin "daisyui" {
   themes: false;
   include: modal, loading, steps, table;
}

@theme {
   --font-noto: 'Noto Sans Thai', sans-serif;
   --color-blue: #2B3674;
   --color-sky: #17A2FF;
   --color-red: #D20000;
   --color-gray: #9E9E9E;
   --color-gray-text: #5B5B5B;
   --color-green: #009F64;
   --color-green-hover: #3CD856;
   --color-border: #C3D3E2;
   --color-login-f: #1B3B63;
   --color-login-t: #003093;
}

body{
   font-family: var(--font-noto);
}

h1, h2, h3, h4, h5, h6, a, button, input, b, strong, span, nav, p{
   font-family: var(--font-noto);
}

select:required:invalid {
   color: var(--color-gray)
}

select option:first-child {
   color: var(--color-gray);
}

select {
   color: var(--color-blue);
}

select option:not(:first-child){
   color: var(--color-blue);
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
   color: var(--color-gray);
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: var(--color-gray);
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: var(--color-gray);
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: var(--color-gray);
}
::-ms-input-placeholder { /* Microsoft Edge */
   color: var(--color-gray);
}

::placeholder { /* Most modern browsers support this now. */
   color: var(--color-gray);
}

.steps .step{
   grid-template-rows: 20px 1fr !important;
}

.steps .step::after{
   grid-row-start: 2;
   outline: 2px solid var(--color-gray);
   width: 1.4rem;
   height: 1.4rem;
}

.steps .step::before{
   grid-row-start: 2;
   height: 0;
   border-color: var(--color-gray) !important;
   width: 70% !important;
}

.steps .step-active::after{
   background-color: var(--color-sky) !important;
   width: 0.5rem !important;
   height: 0.5rem !important;
   outline: 2px solid var(--color-sky);
   outline-offset: 7px;
}

.steps .step-active::before{
   border-color: var(--color-sky) !important;
}

.steps .step-submit::after{
   content: url("/wp-content/themes/phenthai/assets/images/check.svg");
   padding-top: 3px;
   width: 1.54rem;
   height: 1.54rem;
   background-color: var(--color-sky);
   outline-color: var(--color-sky);
   outline-offset: -1px;
}
.steps .step-submit::before{
   border-color: var(--color-sky) !important;
}

.table tr:nth-child(even){
   background-color: white;
}

.table tr:nth-child(odd){
   background-color: #F4F7FE;
}

.table th{
   background-color: #F9F9F9;
}

[role="tooltip"] > [data-popper-arrow]::after{
   border-color: #333 !important;
}

[role="tooltip"] > [data-popper-arrow]::before{
   border-color: #333 !important;
}

.textTime span:not(:first-child){
   padding-left: 7.2rem;
   margin-top: -1.4rem;
   display: block;
}
.textTime span:nth-child(3){
   margin-top: 0 !important;
}