@import url("https://fonts.googleapis.com/css2?family=Google+Sans:ital,opsz,wght@0,17..18,400..700;1,17..18,400..700&display=swap");

body, table, td, th, input, select, textarea, .btn, h1, h2, h3, h4, h5, h6, .opac-main {
    font-family: 'Google Sans', 'Sarabun', sans-serif !important;
}

/* === BEGIN: Koha Intranet Theme Overrides === */
:root {
    --color-primary: #688A29;
    --color-primary-dark: #2D5016;
    --color-primary-hover: #547421;
    --color-secondary: #206C9D;
    --color-border-light: #6EA57A;
    --color-cream: #FAF7F2;
    --color-text-dark: #3A3A3A;
    --color-text-muted: #666666;
}

/* 1. Global Links & Typography */
a {
    color: var(--color-primary-dark);
}
a:hover, a:focus {
    color: var(--color-primary-hover);
    text-decoration: underline;
}

/* 2. Top Navigation Bar (#header / .navbar) */
div#header,
.navbar.bg-dark,
.navbar-dark {
    background-color: var(--color-primary-dark) !important;
    /* border-bottom: 2px solid var(--color-border-light) !important; */
}
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 0.9) !important;
}
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
    background-color: var(--color-primary-hover) !important;
    color: #ffffff !important;
}
.navbar-dark .navbar-nav .show > .nav-link,
.navbar-dark .navbar-nav .active > .nav-link,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .nav-link.active {
    background-color: var(--color-primary) !important;
    color: #ffffff !important;
}

/* 3. Search Banner (#header_search) */
#header_search {
    /* background-color: var(--color-primary) !important; */
    border-bottom: 2px solid var(--color-primary-dark) !important;
}
/* #header_search .nav-tabs > li > a {
    background-color: var(--color-primary) !important;
    border: 2px solid var(--color-primary) !important;
    color: #ffffff !important;
    opacity: 0.85;
    transition: all 0.15s ease-in-out;
} */
/* #header_search .nav-tabs > li > a:hover,
#header_search .nav-tabs > li > a:focus {
    background-color: var(--color-primary-hover) !important;
    border-color: var(--color-primary-hover) !important;
    opacity: 1;
    text-decoration: none !important;
} */
/* #header_search .nav-tabs > li > a.active {
    background-color: var(--color-primary-dark) !important;
    border-color: var(--color-primary-dark) !important;
    border-bottom: 2px solid #ffffff !important;
    color: #ffffff !important;
    opacity: 1;
} */
/* #header_search .nav-tabs > li > a.active:hover {
    background-color: var(--color-primary-dark) !important;
    border-color: var(--color-primary-dark) !important;
    border-bottom: 2px solid #ffffff !important;
} */
#header_search input,
#header_search select {
    border-radius: 6px !important;
}
/* #header_search input:focus,
#header_search select:focus {
    border-color: var(--color-primary-dark) !important;
    box-shadow: 0 0 0 0.2rem rgba(45, 80, 22, 0.25) !important;
} */
#header_search button[type="submit"],
#header_search input[type="submit"] {
    background-color: var(--color-primary-dark) !important;
    border: none !important;
    border-radius: 0 4px 4px 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    margin-left: -16px !important;
    height: 31px !important;
    padding-left: calc(0.7em + 16px) !important;
    padding-right: 0.9em !important;
}
/* #header_search button[type="submit"]:hover,
#header_search input[type="submit"]:hover {
    background-color: var(--color-primary-hover) !important;
    border: none !important;
    box-shadow: none !important;
} */

/* 4. Sidebar Navigation */
#navmenu a.current,
#navmenu a.active,
.navmenu a.active,
.navmenu a.current,
.patron-menu a.active,
.patron-menu a.current {
    background-color: var(--color-primary) !important;
    color: #ffffff !important;
    border-radius: 6px !important;
}
#navmenu a:hover,
.navmenu a:hover,
.patron-menu a:hover {
    background-color: var(--color-cream) !important;
    color: var(--color-primary-dark) !important;
    border-radius: 6px;
}

/* 5. Main Dashboard Big Links (Homepage Grid Modules) */
ul.biglinks-list li a {
    background-color: var(--color-cream) !important;
    border: 1px solid var(--color-border-light) !important;
    border-radius: 8px !important;
    color: var(--color-primary-dark) !important;
    transition: all 0.2s ease-in-out !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.02) !important;
}
ul.biglinks-list li a:hover {
    background-color: var(--color-primary) !important;
    color: #ffffff !important;
    border-color: var(--color-primary) !important;
    box-shadow: 0 4px 10px rgba(104, 138, 41, 0.15) !important;
}

/* 6. Buttons */
.btn-primary,
.btn-warning,
input[type="submit"],
button[type="submit"],
.btn-yellow,
#searchsubmit,
#saverecord,
.submit,
input.submit,
button.submit,
input.save,
button.save,
.action input,
.action button,
.btn-toolbar .btn,
.btn-toolbar input,
.btn-toolbar button,
input[value="Search"],
input[value="Save"] {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    background-image: none !important;
    color: #ffffff !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
    transition: all 0.2s ease-in-out !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-warning:hover, .btn-warning:focus, .btn-warning:active,
input[type="submit"]:hover, button[type="submit"]:hover,
.btn-yellow:hover, #searchsubmit:hover, #saverecord:hover,
.submit:hover, input.submit:hover, button.submit:hover,
input.save:hover, button.save:hover,
.action input:hover, .action button:hover,
.btn-toolbar .btn:hover, .btn-toolbar input:hover, .btn-toolbar button:hover,
input[value="Search"]:hover, input[value="Save"]:hover {
    background-color: var(--color-primary-hover) !important;
    border-color: var(--color-primary-hover) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 10px rgba(104, 138, 41, 0.2) !important;
}

/* Secondary & Cancel Buttons */
.btn-toolbar .btn-link,
.btn-link,
.btn-toolbar .btn.cancel,
.btn-toolbar a.cancel,
.btn-toolbar .btn-default,
.btn-toolbar .btn-secondary,
.btn-toolbar .btn-outline-secondary,
.cancel,
a.cancel,
.btn-secondary,
.btn-default,
.btn-outline-secondary {
    background-color: transparent !important;
    border: 1px solid transparent !important;
    color: var(--color-primary-dark) !important;
    background-image: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    border-radius: 6px !important;
    transition: all 0.2s ease-in-out !important;
}
.btn-toolbar .btn-link:hover,
.btn-link:hover,
.btn-toolbar .btn.cancel:hover,
.btn-toolbar a.cancel:hover,
.btn-toolbar .btn-default:hover,
.btn-toolbar .btn-secondary:hover,
.btn-toolbar .btn-outline-secondary:hover,
.cancel:hover,
a.cancel:hover,
.btn-secondary:hover,
.btn-default:hover,
.btn-outline-secondary:hover {
    background-color: var(--color-cream) !important;
    color: var(--color-primary-hover) !important;
    border-color: var(--color-border-light) !important;
}

/* 7. Breadcrumbs */
#breadcrumbs, .breadcrumb {
    /* background-color: var(--color-cream) !important; */
    /* border: 1px solid var(--color-border-light) !important; */
    border-radius: 6px !important;
    padding: 8px 12px !important;
}
.breadcrumb-item a {
    color: var(--color-primary-dark) !important;
}
.breadcrumb-item.active {
    color: var(--color-text-muted) !important;
}

/* 8. Tables */
.table th, table.dataTable thead th {
    background-color: var(--color-cream) !important;
    color: var(--color-primary-dark) !important;
    border-bottom: 2px solid var(--color-border-light) !important;
}

/* 9. Pagination */
.dt-paging-button.active,
.dt-paging-button.current,
.paginate_button.active,
.paginate_button.current {
    background: var(--color-primary) !important;
    color: #ffffff !important;
    border-color: var(--color-primary) !important;
}
.dt-paging-button:hover, .paginate_button:hover {
    background: var(--color-cream) !important;
    color: var(--color-primary-dark) !important;
    border-color: var(--color-border-light) !important;
}
/* === END: Koha Intranet Theme Overrides === */


#login .submit {
    text-align: center;
}
#login #submit-button {
    background: transparent !important;
    border: unset;
}