/**
 * Token-based replacement for the jQuery UI 1.11.4 theme layer.
 *
 * Loads AFTER tokens.css and static/css/thirdparty/jqueryui-1.11.4/jquery-ui.structure.css
 * (which owns positioning/behavior) and BEFORE base.css (so app CSS can still
 * override widget chrome). Replaces the retired CDN "start" theme.
 *
 * Rules of this file:
 *  - single-class selectors wherever possible (keep specificity low; no !important)
 *  - never rename or drop a .ui-* class -- app code hardcodes them
 *    (CbaTabs, CbaAutoComplete, custsvc_addr_summary, cbamap views)
 *  - no background-image chrome; icons are inline-SVG masks over currentColor,
 *    replacing the sprite sheets that theme.css shipped
 */

/* == Core widget surfaces ================================================= */

.ui-widget {
	font-family: var(--font-ui);
	font-size: 1em;
}
.ui-widget .ui-widget {
	font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
	font-family: var(--font-ui);
	font-size: 1em;
}

.ui-widget-content {
	border: 1px solid var(--border-1);
	background: var(--surface-1);
	color: var(--text-1);
}
.ui-widget-content a {
	color: var(--brand-strong);
}

.ui-widget-header {
	border: 1px solid var(--border-1);
	background: var(--surface-2);
	color: var(--text-1);
	font-weight: 600;
}
.ui-widget-header a {
	color: var(--text-1);
}

/* == Interaction states =================================================== */

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button {
	border: 1px solid var(--border-2);
	background: var(--surface-1);
	font-weight: normal;
	color: var(--text-1);
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
	color: var(--text-1);
	text-decoration: none;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
	border: 1px solid var(--brand);
	background: var(--brand-soft);
	color: var(--text-1);
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
	color: var(--text-1);
	text-decoration: none;
}
.ui-visual-focus {
	box-shadow: 0 0 3px 1px var(--focus);
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	border: 1px solid var(--brand);
	background: var(--brand);
	font-weight: normal;
	color: var(--surface-0);
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: var(--surface-0);
	text-decoration: none;
}

/* Active tab: fuse with the panel and mark with a brand edge instead of the
   solid brand fill (which read poorly against the chrome) */
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	border: 1px solid var(--border-1);
	background: var(--surface-1);
	box-shadow: inset 0 3px 0 var(--brand);
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active a,
.ui-tabs .ui-tabs-nav li.ui-tabs-active a:link,
.ui-tabs .ui-tabs-nav li.ui-tabs-active a:visited {
	color: var(--text-1);
	font-weight: 600;
}

/* == Feedback states ====================================================== */

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
	border: 1px solid var(--brand);
	background: var(--brand-soft);
	color: var(--text-1);
}
.ui-state-checked {
	border: 1px solid var(--brand);
	background: var(--brand-soft);
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: var(--text-1);
}

.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 1px solid var(--danger);
	background: var(--danger-soft);
	color: var(--text-1);
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a,
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: var(--danger);
}

.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
	font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
	opacity: 0.7;
	font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: 0.45;
	background-image: none;
}

/* == Corners / overlay / shadow ========================================== */

.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: var(--radius);
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: var(--radius);
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: var(--radius);
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: var(--radius);
}

.ui-widget-overlay {
	background: rgba(10, 14, 17, 0.45);
}
.ui-widget-shadow {
	box-shadow: var(--shadow-pop);
}

/* == Per-widget chrome ==================================================== */

.ui-dialog {
	box-shadow: var(--shadow-pop);
}
.ui-dialog .ui-dialog-titlebar {
	background: var(--surface-2);
}
.ui-dialog .ui-dialog-buttonpane {
	border-top: 1px solid var(--border-1);
}

.ui-datepicker .ui-datepicker-header {
	background: var(--surface-2);
}
.ui-datepicker th {
	color: var(--text-2);
	font-weight: 600;
}

.ui-menu .ui-menu-item {
	color: var(--text-1);
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
	margin: 0;                      /* theme relied on -1px margin + border; keep flat */
	border: 1px solid var(--brand);
}

.ui-progressbar {
	background: var(--surface-2);
}
.ui-progressbar .ui-progressbar-value {
	border: none;
	background: var(--brand);
}

.ui-slider .ui-slider-range {
	background: var(--brand-soft);
}

.ui-tabs .ui-tabs-nav {
	background: var(--surface-2);
}
.ui-tabs .ui-tabs-panel {
	background: var(--surface-1);
}

/* == Icons ================================================================ */
/*
 * The sprite sheets are gone. Each glyph is an inline-SVG alpha mask filled
 * with currentColor, so icons inherit the text color of their context
 * (including .ui-state-active's inverted color) and adapt to dark mode free.
 * Only glyphs used by the app + the widgets themselves are defined; add new
 * ones here on sighting.
 */

.ui-icon {
	width: 16px;
	height: 16px;
	background-image: none;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 16px 16px;
	mask-size: 16px 16px;
}
/* structure.css positions sprites via background-position; neutralize leftovers */
.ui-state-default .ui-icon,
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-state-active .ui-icon,
.ui-state-highlight .ui-icon,
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon,
.ui-widget-content .ui-icon,
.ui-widget-header .ui-icon,
.ui-button .ui-icon {
	background-image: none;
	background-color: currentColor;
}

.ui-icon-close,
.ui-icon-closethick {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 4l8 8M12 4l-8 8' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 4l8 8M12 4l-8 8' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.ui-icon-plus,
.ui-icon-plusthick {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2.5v11M2.5 8h11' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2.5v11M2.5 8h11' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.ui-icon-minus,
.ui-icon-minusthick {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h11' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8h11' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.ui-icon-trash {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 4.5h11M6 4.5V3h4v1.5M4.2 4.5l.6 9h6.4l.6-9M6.6 7v4.5M9.4 7v4.5' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 4.5h11M6 4.5V3h4v1.5M4.2 4.5l.6 9h6.4l.6-9M6.6 7v4.5M9.4 7v4.5' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.ui-icon-info {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='8' cy='5.2' r='1' fill='black'/%3E%3Cpath d='M8 7.5v4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3Ccircle cx='8' cy='5.2' r='1' fill='black'/%3E%3Cpath d='M8 7.5v4' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}

.ui-icon-alert {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2.2L14.5 13.5h-13z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M8 6.2v3.6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='11.6' r='0.9' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 2.2L14.5 13.5h-13z' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M8 6.2v3.6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='11.6' r='0.9' fill='black'/%3E%3C/svg%3E");
}

.ui-icon-camera {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 5.5h2.6l1.2-2h3.4l1.2 2h2.6a.8.8 0 01.8.8v6.4a.8.8 0 01-.8.8h-11a.8.8 0 01-.8-.8V6.3a.8.8 0 01.8-.8z' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3Ccircle cx='8' cy='9' r='2.3' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 5.5h2.6l1.2-2h3.4l1.2 2h2.6a.8.8 0 01.8.8v6.4a.8.8 0 01-.8.8h-11a.8.8 0 01-.8-.8V6.3a.8.8 0 01.8-.8z' fill='none' stroke='black' stroke-width='1.4' stroke-linejoin='round'/%3E%3Ccircle cx='8' cy='9' r='2.3' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
}

/* datepicker prev/next (and the cbamap views that reuse these classes) */
.ui-icon-circle-triangle-w {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M10 3L5 8l5 5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M10 3L5 8l5 5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.ui-icon-circle-triangle-e {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3l5 5-5 5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3l5 5-5 5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* menu submenu caret (jQuery UI 1.11 uses carat-1-e) */
.ui-icon-carat-1-e {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 4.5L10 8l-3.5 3.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 4.5L10 8l-3.5 3.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* resizable corner grip */
.ui-icon-gripsmall-diagonal-se {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='12' cy='12' r='1.2' fill='black'/%3E%3Ccircle cx='12' cy='7.5' r='1.2' fill='black'/%3E%3Ccircle cx='7.5' cy='12' r='1.2' fill='black'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='12' cy='12' r='1.2' fill='black'/%3E%3Ccircle cx='12' cy='7.5' r='1.2' fill='black'/%3E%3Ccircle cx='7.5' cy='12' r='1.2' fill='black'/%3E%3C/svg%3E");
}