/* Overrides for built-in PrimeFaces components and theme/layout styles.
   Load before custom.css so application-specific styles take precedence. */

/* Status/type badges get a thin outline in their own text color. */
.customer-badge { border: 1px solid currentColor; }

.customer-badge-avi { border: 1px solid #FFA500; }

.customer-badge-cbc { border: 1px solid #0000FF; }

/* Scheme classes live on the .layout-wrapper div, NOT <body>. */
.layout-wrapper.layout-dark { --l2p-surface-card: #1e1e1e; }
.layout-wrapper.layout-dim  { --l2p-surface-card: #1f2d40; }

body,
body .ui-widget {
  font-family: 'l2p-font', -apple-system, blinkmacsystemfont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
}

body .ui-widget .ui-menu .ui-button  {
  font-family: 'l2p-font', -apple-system, blinkmacsystemfont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
  font-weight: 500;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;

}

/* Keep growl messages at a higher level than the modal layer */
.ui-growl {
    z-index: 1500 !important;
}

/* This fixes toggleSwitch not centering icons correctly in the button */
.ui-toggleswitch-handler {
	position: absolute !important;
}

/*This fixes text editor not displaying icons properly in Primefaces 14 - 08/12/2024 - fm*/
.ui-texteditor .ui-editor-toolbar.ql-snow .ql-stroke {
  stroke: #818181 !important;
}
.ui-texteditor .ui-editor-toolbar.ql-snow .ql-picker .ql-picker-label {
  color: #818181 !important;
}
.ui-texteditor .ui-editor-toolbar.ql-snow .ql-fill {
  fill: #818181 !important;
}

.ui-columntoggler-all {
	height: 35px;
}
.ui-columntoggler .ui-columntoggler-all .ui-chkbox {
	margin-top: -15px !important;
}

/* "Display All" label for the column toggler's built-in select-all checkbox.
   Scoped like the theme's own .ui-columntoggler-item rules on purpose: the theme
   takes the item rows' checkboxes out of absolute positioning but has no rule for
   the all row, so these have to outrank base components.css instead of tying with
   it and being decided by stylesheet order. */
body .ui-columntoggler .ui-columntoggler-items .ui-columntoggler-all {
	display: flex;
	align-items: center;
	padding: 0.5rem 1rem;
}
body .ui-columntoggler .ui-columntoggler-items .ui-columntoggler-all .ui-chkbox {
	position: static;
	margin-top: 0 !important;
	margin-right: 0.5rem;
}
body .ui-columntoggler .ui-columntoggler-items .ui-columntoggler-all::after {
	content: "Display All";
}

/* This fixes tabmenu items having too small of a click area in diamond layout - 11/24 Skyler */
body .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem {
	padding: 0;
}
body .ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem a {
	padding: 1rem;
}

/* This fixes command links having a higher font weight (700) than command buttons, which have weight 400. */
span.ui-linkbutton {
	font-weight: 400;
}

/*
    This fixes command links and links in datatables becoming hard to see if the row is selected (especially in dark blue theme).
    The "not" rule means the new colors will only be applied to links without child elements: https://stackoverflow.com/a/76079959
    This is required to ensure icons in links are still visible. - 1/25 Skyler
*/
body .ui-datatable .ui-datatable-data > tr > td a.ui-commandlink:not(:has(*)),
body .ui-datatable .ui-datatable-data > tr > td a.ui-link:not(:has(*)) {
    color: #2196F3;
}
body .ui-datatable .ui-datatable-data > tr.ui-state-highlight > td a.ui-commandlink:not(:has(*)),
body .ui-datatable .ui-datatable-data > tr.ui-state-highlight > td a.ui-link:not(:has(*)) {
    color: #ffffff;
}
/* This fixes command links and links that are NOT in datatables */
a.ui-commandlink:not(:has(*)),
a.ui-link:not(:has(*)) {
	color: #2196F3;
}

body .ui-datatable .ui-datatable-header {
	background: none;
	padding-left: 0;
	padding-right: 0;
}
/* A header facet holding only the hidden global-filter input renders as an empty bar */
body .ui-datatable .ui-datatable-header:has(> input[id$="globalFilter"]:only-child) {
	display: none;
}
body .ui-datatable,
body .ui-datatable .ui-datatable-header {
    overflow: visible !important;
}

/* Dark/dim cards keep a heavier shadow — the shadcn float shadow is nearly
   invisible on a dark background. Radius/border are set by the .card rules
   in the design-layer section at the end of this file. */
.layout-dark .card,
.layout-dim .card {
    box-shadow: 0 0.25rem 1.125rem 0 rgba(0, 0, 0, 0.3);
}

.layout-menu ul a  {
  font-size: 1.1rem !important;
}

body .ui-button.ui-button-icon-only .ui-icon {
	margin-left: -0.73rem;
	font-size: 1.2rem !important;
}

body .ui-menu.ui-menubar {
    background: #ffffff !important;
}

/* SCROLLBAR */
/* Dark & Dim Sidebars -> Global Dark Mode */
.layout-sidebar-dark .layout-menu-container,
.layout-sidebar-dim .layout-menu-container,
html:has(.layout-sidebar-dark),
html:has(.layout-sidebar-dim) {
    color-scheme: dark;
}

/* Light & Colorful Sidebars -> Global Light Mode */
.layout-sidebar-light .layout-menu-container,
.layout-sidebar-white .layout-menu-container,
.layout-sidebar-blue .layout-menu-container,
.layout-sidebar-bluegray .layout-menu-container,
.layout-sidebar-purple .layout-menu-container,
.layout-sidebar-indigo .layout-menu-container,
html:has(.layout-sidebar-light),
html:has(.layout-sidebar-white),
html:has(.layout-sidebar-purple),
html:has(.layout-sidebar-indigo),
html:has(.layout-sidebar-blue),
html:has(.layout-sidebar-bluegray) {
    color-scheme: light;
}

/* This applies to the Main Page and the White Sidebar by default */
* {
    scroll-behavior: smooth;
}

/* Keep the viewport width stable; scrollbar-color provides Firefox styling. */
html {

    scrollbar-gutter: stable;
    scrollbar-color: rgba(0, 0, 0, 0.25) transparent; /* Dark Grey Thumb */
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    /* Default: Dark Grey (Visible on White pages) */
    background: rgba(0, 0, 0, 0.25);
    border-radius: 10px;
}

/* If the sidebar is Dark/Dim, make EVERYTHING (Main page + Sidebar) White */
html:has(.layout-sidebar-dark) ::-webkit-scrollbar-thumb,
html:has(.layout-sidebar-dim) ::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
}

html:has(.layout-sidebar-dark),
html:has(.layout-sidebar-dim) {
    scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

/* The page is technically "Light Mode", but the sidebar background is Dark Blue/Purple.
   Therefore, the Sidebar Scrollbar MUST be White (Light) to be visible.
*/

.layout-sidebar-blue .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-bluegray .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-brown .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-cyan .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-darkgray .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-deeppurple .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-green .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-indigo .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-orange .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-pink .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-purple .layout-menu-container::-webkit-scrollbar-thumb,
.layout-sidebar-teal .layout-menu-container::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.25) !important;
}

/* Firefox support for the Colorful Sidebar specific containers */
.layout-sidebar-blue .layout-menu-container,
.layout-sidebar-bluegray .layout-menu-container,
.layout-sidebar-brown .layout-menu-container,
.layout-sidebar-cyan .layout-menu-container,
.layout-sidebar-darkgray .layout-menu-container,
.layout-sidebar-deeppurple .layout-menu-container,
.layout-sidebar-green .layout-menu-container,
.layout-sidebar-indigo .layout-menu-container,
.layout-sidebar-orange .layout-menu-container,
.layout-sidebar-pink .layout-menu-container,
.layout-sidebar-purple .layout-menu-container,
.layout-sidebar-teal .layout-menu-container {
    scrollbar-color: rgba(255, 255, 255, 0.25) transparent !important;
}

/* Ensure the sidebar menu handles overflow */
.layout-menu-container {
    overflow-y: auto;
}

/* --- Global Custom Glow (Powered by JS Theme Sniffer) --- */
body .ui-inputfield.ui-state-focus,
body .ui-inputfield:focus,
body .ui-selectonemenu.ui-state-focus:not(.ui-state-error),
body .ui-selectcheckboxmenu.ui-state-focus:not(.ui-state-error),
body .ui-autocomplete-multiple-container.ui-state-focus,
body .ui-chips.ui-state-focus > ul {

    /* Match theme specificity; primefaces-overrides.css is loaded after the theme. */
    border-width: 1px;
    border-color: var(--active-theme-color);
    outline: 0 none;

    /* Apply the exact color to the gradient shadow math */
    box-shadow:
        0 0 5px 1px color-mix(in sRGB, var(--active-theme-color) 40%, transparent),
        0 0 10px 2px color-mix(in sRGB, var(--active-theme-color) 15%, transparent);
}
body .ui-selectonemenu .ui-inputfield,
body .ui-selectcheckboxmenu .ui-inputfield {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    margin-top: 0 !important; /* <--- Resets the margin so the text stays perfectly centered! */
}

/*
	Pushes the input down just enough to clear the shadow. Only applies to items not in
	in inputgroups, and to the inputgroup container itself.
*/
body .p-field .ui-inputgroup {
	margin-top: 0.2rem;
}
body .p-field:not(:has(.ui-inputgroup)) {
	.ui-inputfield,
	.ui-selectonemenu,
	.ui-selectcheckboxmenu,
	.ui-chips,
	.ui-datepicker-trigger {
    	margin-top: 0.2rem;
	}
}

/* Keep that offset on the autocomplete as a whole, not between its parts. */
body .p-field:not(:has(.ui-inputgroup)) .ui-autocomplete:has(> .ui-autocomplete-dropdown.ui-button) {
    margin-top: 0.2rem;
}
body .p-field:not(:has(.ui-inputgroup)) .ui-autocomplete > .ui-inputfield,
body .p-field:not(:has(.ui-inputgroup)) .ui-autocomplete > .ui-autocomplete-multiple-container,
body .p-field:not(:has(.ui-inputgroup)) .ui-autocomplete > .ui-autocomplete-dropdown.ui-button {
    margin-top: 0;
}

/* Standard Outlined Buttons */
body .ui-button.outlined-button:not(.secondary-button):hover,
body .ui-button.outlined-button:not(.secondary-button):focus {
    box-shadow:
        inset 0 0 0 9999px var(--active-theme-color),
        0 0 5px 1px color-mix(in sRGB, var(--active-theme-color) 40%, transparent),
        0 0 10px 2px color-mix(in sRGB, var(--active-theme-color) 15%, transparent) !important;
    border-color: var(--active-theme-color) !important;
    transition: box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

/* Danger Outlined Buttons */
body .ui-button.outlined-button:is(.help-button, .info-button, .success-button, .warning-button, .danger-button):hover,
body .ui-button.outlined-button:is(.help-button, .info-button, .success-button, .warning-button, .danger-button):focus {
    box-shadow:
        inset 0 0 0 9999px currentColor,
        0 0 5px 1px color-mix(in sRGB, currentColor 40%, transparent),
        0 0 10px 2px color-mix(in sRGB, currentColor 15%, transparent) !important;
	border-color: currentColor !important;
}
body .ui-button.outlined-button:not(.secondary-button):hover *,
body .ui-button.outlined-button:not(.secondary-button):focus * {
    color: #fff !important;
}

/* Overrides to use Font Awesome icons in Datatable Row Editors */

body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-pencil,
body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-check,
body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-close {
  font-family: "Font Awesome 7 Pro" !important;
  font-weight: 400 !important;
  background-image: none !important;
  text-indent: 0 !important;
  font-size: 1.2rem;
}

body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-pencil:before {
  content: "\f044" !important; /* Unicode font value for fa-pen-to-square */
}

body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-check:before {
  content: "\f00c" !important; /* Unicode font value for fa-check */
}

body .ui-datatable .ui-datatable-data > tr .ui-row-editor .ui-icon.ui-icon-close:before {
  content: "\f00d" !important; /* Unicode font value for fa-xmark */
}

/* Structure overrides: radius, shadows, spacing, and hairline borders.
   Colors remain owned by the Diamond theme; borders and muted text derive
   from currentColor so they adapt to every scheme. */

/* ---- Cards: hairline border + soft shadow + larger radius ----------- */
.card {
    border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
    border-radius: var(--l2p-radius-lg) !important; /* beat the earlier .card 6px !important */
    box-shadow: var(--l2p-shadow-float); /* even shadow, matches topbar + dialog */
    margin-bottom: 1rem; /* halve Diamond's 2rem card-to-card gap */
}

/* ---- Buttons: medium weight + 6px radius (keep theme/severity color)  */
body .ui-button:not(.ui-avatar):not(.rounded-button):not(.ui-button-rounded):not(.ui-paginator-page) {
    border-radius: var(--l2p-radius-md);
    font-weight: 500;
}
/* Split buttons are two adjacent .ui-buttons; the rule above re-rounds all
   four corners of each segment, so the pair renders as two touching rounded
   buttons. Square the inner corners again so it reads as one control.
   !important to beat that rule's higher specificity. */
body .ui-splitbutton > .ui-button:first-child {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
body .ui-splitbutton > .ui-button.ui-splitbutton-menubutton {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

/* ---- Status badges: full pill (demo-*.css ships them at 2px) -------- */
/* inline-block is required — inline <span> badges render rounded-corner
   backgrounds jagged, with the row/cell color bleeding through the curve. */
body .order-badge,
body .product-badge,
body .customer-badge {
    border-radius: 999px;
    display: inline-block;
}

/* ---- Inputs: 6px radius + neutral hairline border ------------------- */
body .ui-inputtext,
body .ui-inputfield,
body .ui-selectonemenu,
body .ui-selectcheckboxmenu,
body .ui-dropdown,
body .ui-multiselect,
body .ui-chips > ul {
    border-radius: var(--l2p-radius-md);
}

/* ---- PrimeFaces date picker input + trigger: one connected control --- */
body .ui-calendar.ui-trigger-calendar {
    display: inline-flex;
    align-items: stretch;
    vertical-align: middle;
}

body .ui-calendar.ui-trigger-calendar > input.ui-inputfield {
    flex: 1 1 auto;
    min-width: 0;
    border-radius: var(--l2p-radius-md) 0 0 var(--l2p-radius-md) !important;
}

body .ui-calendar.ui-trigger-calendar > .ui-datepicker-trigger.ui-button {
    position: relative;
    right: auto;
    flex: 0 0 auto;
    margin-left: -1px;
    border-radius: 0 var(--l2p-radius-md) var(--l2p-radius-md) 0 !important;
}

/* ---- Autocomplete input + dropdown: one connected control ----------- */
body .ui-autocomplete:has(> .ui-autocomplete-dropdown.ui-button) {
    display: inline-flex;
    align-items: stretch;
    vertical-align: middle;
}

body .ui-autocomplete > .ui-autocomplete-input.ui-autocomplete-dd-input,
body .ui-autocomplete > .ui-autocomplete-multiple-container.ui-autocomplete-dd-multiple-container {
    flex: 1 1 auto;
    min-width: 0;
    border-radius: var(--l2p-radius-md) 0 0 var(--l2p-radius-md) !important;
}

body .ui-autocomplete > .ui-autocomplete-dropdown.ui-button {
    position: relative;
    right: auto;
    flex: 0 0 auto;
    margin-left: -1px;
    border-radius: 0 var(--l2p-radius-md) var(--l2p-radius-md) 0 !important;
}

/* ---- Input groups: remove curves and double borders at inner seams -- */
body .ui-inputgroup > :not(:last-child),
body .ui-inputgroup > :not(:last-child) .ui-inputfield {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

body .ui-inputgroup > :not(:first-child) {
    margin-left: -1px;
}

body .ui-inputgroup > :not(:first-child),
body .ui-inputgroup > :not(:first-child) .ui-inputfield {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

body .ui-inputgroup > :first-child,
body .ui-inputgroup > :first-child .ui-inputfield {
    border-top-left-radius: var(--l2p-radius-md) !important;
    border-bottom-left-radius: var(--l2p-radius-md) !important;
}

body .ui-inputgroup > :last-child,
body .ui-inputgroup > :last-child .ui-inputfield {
    border-top-right-radius: var(--l2p-radius-md) !important;
    border-bottom-right-radius: var(--l2p-radius-md) !important;
}

/* ---- Paginator page numbers: JetBrains Mono via the l2p-font composite.
        The links are <button>/<a>, which do not inherit font-family from body —
        without this they render in the UA default (Arial). Their content is pure
        digits, so every glyph resolves to the JetBrains Mono unicode-range in custom.css.
        Family only: Diamond sizes these buttons in em (line-height/min-width/
        height 2.286em) off font-size, which font-family does not change, so the
        button box stays exactly as the theme draws it. */
body .ui-paginator .ui-paginator-pages .ui-paginator-page {
    font-family: 'l2p-font', monospace;
}

/* ---- Paginator rows-per-page dropdown (20/30/50): structure only.
        Diamond only sets margin/display on it (bare native <select>). No
        color/background here — the browser + theme paint it automatically. */
body .ui-paginator .ui-paginator-rpp-options {
    padding: 0.35rem 0.25rem 0.35rem 0.5rem;
    border-radius: var(--l2p-radius-md);
    font-family: inherit;
    font-size: 0.875rem;
    cursor: pointer;
    border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
    transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
/* Same active-theme glow as the global input focus glow above */
body .ui-paginator .ui-paginator-rpp-options:hover,
body .ui-paginator .ui-paginator-rpp-options:focus {
    border-color: var(--active-theme-color);
    outline: 0 none;
    box-shadow:
        0 0 5px 1px color-mix(in sRGB, var(--active-theme-color) 40%, transparent),
        0 0 10px 2px color-mix(in sRGB, var(--active-theme-color) 15%, transparent);
}
/* The popup list of a native <select> ignores CSS; opt into the styleable
   picker (Chromium 134+; other browsers keep the native popup). */
body .ui-paginator .ui-paginator-rpp-options,
body .ui-paginator .ui-paginator-rpp-options::picker(select) {
    appearance: base-select;
}
/* base-select renders the value and the arrow as separate elements; lay the
   closed button out as a single row (Diamond's inline-block lets them stack). */
@supports (appearance: base-select) {
    body .ui-paginator .ui-paginator-rpp-options {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        white-space: nowrap;
    }
}
body .ui-paginator .ui-paginator-rpp-options::picker(select) {
    border: 1px solid color-mix(in srgb, currentColor 12%, transparent);
    border-radius: var(--l2p-radius-md);
    box-shadow:
        0 0 5px 1px color-mix(in sRGB, var(--active-theme-color) 40%, transparent),
        0 0 10px 2px color-mix(in sRGB, var(--active-theme-color) 15%, transparent);
    padding: 0.25rem;
    margin-top: 0.25rem;
}
body .ui-paginator .ui-paginator-rpp-options option {
    padding: 0.35rem 0.75rem;
    border-radius: calc(var(--l2p-radius-md) - 2px);
    cursor: pointer;
}
body .ui-paginator .ui-paginator-rpp-options option:hover {
    background: color-mix(in sRGB, var(--active-theme-color) 15%, transparent);
}

/* ---- Dialog + topbar: matching floating-surface style (radius/border/shadow) */
body .ui-dialog {
    border: 1px solid color-mix(in srgb, currentColor 12%, transparent) !important;
    border-radius: var(--l2p-radius-lg) !important;
    box-shadow: var(--l2p-shadow-float) !important;
}
/* Round the inner sections so their backgrounds follow the 20px corners,
   otherwise the square titlebar/content corners poke past the border. */
body .ui-dialog .ui-dialog-titlebar {
    border-top-left-radius: var(--l2p-radius-lg);
    border-top-right-radius: var(--l2p-radius-lg);
}
body .ui-dialog .ui-dialog-content:last-child {
    border-bottom-left-radius: var(--l2p-radius-lg);
    border-bottom-right-radius: var(--l2p-radius-lg);
}

body .ui-dialog .ui-dialog-footer {
    border-bottom-left-radius: var(--l2p-radius-lg);
    border-bottom-right-radius: var(--l2p-radius-lg);
}

/* ---- Content: gap between the topbar and the first row -------------- */
/* Diamond sets `.layout-content { padding: 2rem }` all around; that top gap
   sits under the floating topbar. Trim it (sides/bottom stay at 2rem). */
.layout-content {
    padding-top: 1.5rem;
}

/* ---- Dashboard: stat numbers use the accent (matches mockup) -------- */
body a.deal-stat-num {
    color: var(--active-theme-color);
}

/* ---- Card grids: symmetric gutters --------------------------------- */
/* PrimeFlex columns ship with 1rem left/right but ZERO top/bottom padding,
   so stacked card rows touch vertically while having wide horizontal gaps.
   For any grid whose columns hold a card (directly OR wrapped in a form /
   panelGroup), reset to symmetric 0.5rem gutters (~1rem gap in every
   direction) and let the grid own the spacing. Grids without cards (forms,
   etc.) and nogutter grids are left untouched. */
.p-grid:not(.p-nogutter):has(> [class*="p-col"] .card) {
    margin: -0.5rem;
}
.p-grid:not(.p-nogutter):has(> [class*="p-col"] .card) > [class*="p-col"] {
    padding: 0.5rem;
}
[class*="p-col"] > .card:only-child {
    margin-bottom: 0;
}
/*
 * Sidebar logo sizing.
 */
.layout-sidebar .logo img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;

}

/* The Diamond theme files never styled p:skeleton. PrimeFaces core CSS ships only the shimmer animation, so without these the bars are transparent.
   currentColor makes the bar a touch darker than the background on the light scheme and a touch lighter on dark and dim, with no per-scheme rules. */
.ui-skeleton {
    background-color: color-mix(in srgb, currentColor 15%, transparent);
    border-radius: 4px;
}
.ui-skeleton:after {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
}

/* Make default datePicker buttons smaller */
body .ui-datepicker .ui-datepicker-buttonpane button,
body .ui-datepicker .ui-datepicker-buttonbar button {
	padding: 0;
}