$base-color: #a5cde8;
$text-color: #151923;
$icon-color: $text-color;

$meta-text-color: #474c57;

$notification-color: #9d2f4d;

$highlight-color: #5c98c8;

$button-color: #22466d;
$button-text-color: #fff;

$secondary-button-color: $button-color;
$secondary-button-text-color: $button-color;

$link: $button-color;
$link-focus: lighten($link, 10%);

$menu-bubble-text: #fff;
$menu-bubble-current-background: $notification-color;
$menu-bubble-current-text: $menu-bubble-text;

$menu-highlight-background: #dae9f3;

$menu-submenu-text: $text-color;
$menu-submenu-focus-text: $text-color;
$menu-submenu-background: #b5d3e8;
$menu-submenu-background-alt: $menu-submenu-background;

$form-checked: $notification-color;

@import "../admin";


/**
 * There's not enough contrast between regular submenu items & hovered items,
 * so we'll add an underline here.
 */

#adminmenu .wp-submenu a,
#adminmenu .wp-has-current-submenu .wp-submenu a,
.folded #adminmenu .wp-has-current-submenu .wp-submenu a,
#adminmenu a.wp-has-current-submenu:focus + .wp-submenu a,
#adminmenu .wp-has-current-submenu.opensub .wp-submenu a {

	&:focus,
	&:hover {
		text-decoration: underline;
	}
}

#adminmenu .wp-submenu li.current a,
#adminmenu a.wp-has-current-submenu:focus + .wp-submenu li.current a,
#adminmenu .wp-has-current-submenu.opensub .wp-submenu li.current a {

	&:hover,
	&:focus {
		text-decoration: underline;
	}
}

#wpadminbar .quicklinks .menupop ul li a:hover,
#wpadminbar .quicklinks .menupop ul li a:focus,
#wpadminbar .quicklinks .menupop ul li a:hover strong,
#wpadminbar .quicklinks .menupop ul li a:focus strong,
#wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a,
#wpadminbar .quicklinks .menupop.hover ul li a:hover,
#wpadminbar .quicklinks .menupop.hover ul li a:focus,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
#wpadminbar .quicklinks li a:hover .blavatar,
#wpadminbar .quicklinks li a:focus .blavatar,
#wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a .blavatar,
#wpadminbar #wp-admin-bar-user-info a:hover .display-name {
	text-decoration: underline;
}

/**
 * Can't change the background color here with variables, need to override it.
 */

// Admin menu bar hovers.
#wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
#wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus,
#wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
#wpadminbar.nojs .ab-top-menu > li.menupop:hover > .ab-item,
#wpadminbar .ab-top-menu > li.menupop.hover > .ab-item {
	background: $menu-highlight-background;
}

// Admin menu bar dropdowns.
#wpadminbar .menupop .ab-sub-wrapper {
	background: $menu-highlight-background;
}

/* Themes */

.theme-browser .theme.active .theme-name,
.theme-browser .theme.add-new-theme a:hover::after,
.theme-browser .theme.add-new-theme a:focus::after {
	background: $menu-submenu-background;
	color: $text-color;
}

.theme-browser .theme.add-new-theme a:focus .theme-name,
.theme-browser .theme.add-new-theme a:hover .theme-name {
	color: $text-color;
}

.theme-browser .theme.add-new-theme a:focus span::after,
.theme-browser .theme.add-new-theme a:hover span::after {
	color: lighten($text-color, 20%);
}

.theme-browser .theme.active .theme-actions {
	background: transparent;
}

.theme-overlay .theme-header .left,
.theme-overlay .theme-header .right,
.theme-overlay .theme-header .close::before {
	color: $meta-text-color;
}

.theme-overlay .theme-version,
.theme-overlay .theme-tags {
	color: $meta-text-color;
}

/* Add New Theme: Theme Filters */

.wp-filter {
	color: $meta-text-color;
}

.filter-links li > a {
	color: $meta-text-color;
}

.filter-count .count,
.title-count {
	background: $button-color;
	color: $button-text-color;
}

.filter-links li > a:focus,
.filter-links li > a:hover,
.show-filters .filter-links a.current:focus,
.show-filters .filter-links a.current:hover {
	color: $link-focus;
	text-decoration: underline;
}

.wp-filter .button.drawer-toggle {

	&::before {
		// Necessary for removing underline on hover.
		display: inline-block;
	}

	&:focus {
		border-color: transparent;
		box-shadow:
			0 0 0 1px #fff,
			0 0 0 3px $button-color;
	}

	&:hover,
	&:focus {
		background-color: transparent;
		color: $text-color;
		text-decoration: underline;

		&::before {
			color: $text-color;
			text-decoration: none;
		}
	}
}

.show-filters .wp-filter .button.drawer-toggle {
	background: $menu-submenu-background;
	color: $text-color;

	&::before {
		color: $text-color;
	}

	&:hover,
	&:focus {
		background: $menu-submenu-background;
	}
}

/* Add New buttons */
.wrap .page-title-action,
.wrap .page-title-action:active {
	border: 1px solid $button-color;
	color: $button-color;
}

.wrap .page-title-action:hover {
	color: $text-color;
	border-color: $text-color;
	background: $menu-submenu-background;
}

.wrap .page-title-action:focus {
	color: $text-color;
	border-color: $text-color;
	background: $menu-submenu-background;
	box-shadow: 0 0 0 2px $menu-submenu-background;
}

/* Dashboard welcome icons */
[class*="welcome-panel-icon"] {
	background-color: $notification-color;
}
