// ==========================================================================
// A nested map of all of our z-index values.
//
// Please add new values relative to their parent stacking context. For
// example the values of 'root' are elements with a stacking context that have no
// parents with a stacking context, other than the default html root.
//
// A Stacking Context is created when:
// 1. It's the root element (HTML)
// 2. Has a position other than static, with a z-index value
// 3. position:fixed
// 4. Has one of the following css properties: (transform, opacity<1, mix-blend-mode, filter)
// 5. isolation:isolate
// 6: -webkit-overflow-scrolling: touch
//
// So before adding a new z-index:
// 1. You'll want to make sure the element actually creates a stacking context
// 2. Look up what its parent stacking context is
// There's a Chrome devtools extension that can help you find both:
// https://chrome.google.com/webstore/detail/z-context/jigamimbjojkdgnlldajknogfgncplbh
//
// For readability please sort values from lowest to highest.
//
// Usage:
// .environment-badge {
//     z-index: z-index("root", ".environment-badge");
// }
//
// For a refresher on stacking contexts see:
// https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context
// ==========================================================================

$z-layers: (
	"root": (
		".NuxWelcome:before": -1,
		".is-group-editor::before": -1,
		".is-group-gutenberg::before": -1,
		".app-banner__circle": -1,
		".site-icon.is-blank .gridicon": 0,
		".chart__bar-section.is-spacer": 0,
		".reader__featured-post": 0,
		".search-stream__input-card": 0,
		".reader-search-card": 0,
		".reader-featured-image": 0,
		".reader-post-card__title": 0,
		".tag-stream__header-follow": 0,
		".reader-feed-header": 0,
		".reader-feed-header__back-and-follow": 0,
		".reader-related-card.card": 0,
		".reader-full-post__sidebar-comment-like": 1,
		".list-stream__header-follow": 0,
		".form-text-input-with-affixes .form-text-input": 1,
		".is-section-signup": 1,
		".sidebar__skip-navigation": 1,
		".media-library .search.is-expanded-to-container": 1,
		".ribbon": 1,
		".reader__featured-post-title": 1,
		".reader-list-gap__button": 1,
		".reader-following-search": 1,
		".following-manage__url-follow": 1,
		".post-trends__title": 1,
		".post-trends__scroll": 1,
		".plugin-item__label": 1,
		".wp-editor-tools": 1,
		".plan .gridicons-checkmark-circle": 1,
		".plan-discount-message": 1,
		".chart__empty": 2,
		".chart__bar-marker": 1,
		".module-content-table::after": 1,
		".stats-popular__empty": 1,
		".accessible-focus .current-theme__button:focus": 1,
		".accessible-focus .theme__more-button button:focus": 1,
		".domain-suggestion.is-clickable:hover": 1,
		".thank-you-card__header": 1,
		".card.comment.is-bulk-mode:hover": 1,
		".card.comment.accessible-focus:focus": 1,
		".web-preview__loading-message-wrapper": 1,
		".comment-detail.card.is-collapsed:hover": 1,
		".comment-detail.card.accessible-focus:focus": 1,
		".comments__form .button:not(.components-button)": 1,
		".web-preview__inner .spinner-line": 1,
		".is-section-purchases .search": 1,
		".checklist__task": 1,
		".people-list-item .card__link-indicator": 2,
		".page__shadow-notice-cover": 2,
		".chart__bar-section": 2,
		".module-content-table tbody th:first-child": 2,
		"ul.module-header-actions .module-header-action-link": 2,
		".stats-module.is-loading .module-header-title::after": 2,
		"ul.module-content-list-item-action-submenu": 2,
		"ul.module-content-list-item-actions": 2,
		".site-indicator__button": 3,
		"ul.module-content-list-item-actions.collapsed": 3,
		".jetpack-connect__password-form .gridicon": 3,
		".jetpack-connect__creds-form-footer .jetpack-connect__creds-form-spinner": 3,
		".stream__init-overlay-enabled": 10,
		".site-selector": 10,
		".layout__secondary .site-selector": 10,
		".range__label": 10,
		".categories__menu .components-popover": 10,
		".sticky-panel.is-sticky .sticky-panel__content": 20,

		".main": 20,
		".jpcom-masterbar": 21,
		".search": 22,
		".reader-update-notice": 22,
		".search-stream__sort-picker": 23,
		".billing-history-page .filter-popover-content": 23,
		".reader-mobile-sidebar": 23,
		".checkout-modal": 30,
		".community-translator": 99,
		".author-selector__popover.popover": 100,
		".feature-example__gradient": 170,
		".select-dropdown.is-open .select-dropdown__container": 170,
		".accessible-focus .select-dropdown.is-open .select-dropdown__container": 170,
		".sites-dropdown.is-open .sites-dropdown__wrapper": 170,
		".floating-help": 176,
		".layout__secondary": 176,
		".popover.comment__author-more-info-popover": 178,
		".screen-options-tab": 178,
		".global-notices": 179,
		".masterbar": 180,
		".legal-updates-banner": 185,
		".detail-page__backdrop": 190,
		".layout__loader": 200,
		".app-banner": 1000,
		".module-overlay": 1000,
		".drop-zone": 1000,
		".popover": 1000,
		".drawer": 1000,
		".sharing-buttons-preview-buttons__more": 1000,
		".sortable-list__item.is-draggable.is-active": 1000,
		".chart__tooltip": 1000,
		".drop-zone__content": 1010,
		".tooltip.popover": 100000,
		".tooltip.popover.page-modules-settings-popover": 175,
		".tooltip.popover.highlight-card__settings-tooltip": 170,
		".fullscreen-overlay": 100005,
		"#wp_editbtns": 100020,
		"#wp-fullscreen-body": 100010,
		".wp-fullscreen-wrap": 100015,
		"#wp-fullscreen-statusbar": 100020,
		"#fullscreen-topbar": 100020,
		".wp-fullscreen-active #TB_overlay": 100050,
		".wp-fullscreen-active #TB_window": 100051,
		"div.mce-inline-toolbar-grp": 100100,
		".dialog__backdrop": 100200,
		".theme-preview-modal": 100200,
		".wplink__dialog.dialog.card": 100200,
		".web-preview": 100200,
		// TODO: remove after /plugins/manage details doesn't use Dialog
		".is-section-plugins .components-modal__screen-overlay": 100201,
		".is-section-jetpack-cloud-plugin-management .components-modal__screen-overlay": 100201,
		".theme-site-selector-modal": 100201,
		".is-section-theme .global-notices": 100201,
		".popover.ellipsis-menu__menu": 100201,
		".popover.plugin-action__disabled-info": 100202,
		".design-picker__premium-badge-tooltip": 100300,
		".design-preview__sidebar-action-buttons": 100300,
		".popover.gallery__order-popover": 100300,
		"popover.is-dialog-visible": 100300,
		".popover.info-tooltip__container": 100300,
		".popover.info-popover__tooltip.plugin-action__disabled-info": 100300,
		"body .webui-popover": 100300,
		".reauth-required__dialog-body .masterbar__section--left": 100300,
		".fullscreen-fader": 200000,
		".guided-tours__overlay": 200050,
		".guided-tours__step": 201000,
		".support-article-dialog__base.dialog__backdrop": 201001,
		".commands-commands-menu__overlay": 201100,

		".wpcom-site__global-noscript": 300000,

		".is-section-woocommerce .global-notices": 999999,
		".people-list-item.card.is-compact:focus": 1,
		".reader-join-conversation-dialog__overlay": 10000001,
	),
	".is-section-signup": (
		".is-section-signup::before": -1,
		".layout__primary::before": -1,
	),
	".is-section-stepper": (
		".step-container__navigation.action-buttons": 30,
		".design-preview__sticky-variations": 30,
	),
	".ribbon": (
		".ribbon__title::before": -1,
		".ribbon__title::after": -1,
	),
	".masterbar": (
		".reader-back": 99999,
		".reader-visit-site": 99999,
		".reader-profile": 100000,
	),
	".detail-page__backdrop": (
		".detail-page__action-buttons": 200,
	),
	".popover": (
		".input-chrono__input": 1,
		".popover .popover__arrow": 1,
		".post-schedule__header": 1,
		".date-picker__nav-bar": 2,
		".search-filters__popover": 179,
	),
	".search": (
		".search__input": 10,
		".search.is-searching .spinner": 20,
		".search .search__open-icon": 20,
		".search .search__close-icon": 20,
	),
	".profile-gravatar__edit-label-wrap": (
		".profile-gravatar__edit-label-wrap:after": 0,
		".profile-gravatar__edit-label": 1000,
	),
	".media-library__list-item": (
		".media-library__list-item.is-selected::after": 10,
		".media-library__list-item.is-transient .media-library__list-item-figure::after": 10,
		".media-library__list-item-selected-icon .gridicon": 20,
		".media-library__list-item-spinner": 20,
		".media-library__list-item-progress": 20,
	),
	".dialog__backdrop": (
		".editor-media-modal .section-nav": 10,
		".editor-media-modal .calypso-notice": 10,
		".editor-media-modal-gallery__preview-toggle": 100,
		".confirm-modal": 100300,
		".memberships__dialog-section.is-visible": 2,
	),
	".site-settings__taxonomies": (
		".card__link-indicator": 1,
	),
	".reader-feed-header": (
		".reader-feed-header__site": 0,
		".reader-feed-header__follow": 1,
	),
	".reader-feed-header__back-and-follow": (
		".card.header-cake": 1,
		".reader-feed-header__follow": 1,
	),
	".reader-full-post__sidebar-comment-like": (
		".reader-full-post .back-button": 2,
		".author-compact-profile__follow .follow-button": 2,
		".reader-full-post__visit-site-container": 2,
	),
	".reader-related-card.card": (
		".reader-related-card__meta": 1,
	),
	".reader-related-card__meta": (
		".follow-button": 1,
	),
	".reader-notifications": (
		".wpnc__single-view": 1,
		".wpnc__note-list": 2,
	),
	".list-stream__header-follow": (
		".follow-button": 1,
	),
	".stats-post-summary": (
		".section-nav": 1,
	),
	".thank-you-card__header": (
		".thank-you-card__background-icons .gridicon": 1,
		".thank-you-card__main-icon": 2,
		".thank-you-card__header-detail": 2,
	),
	".theme-preview-modal": (
		".theme-preview-modal__navigation": 30,
	),
	".upwork-banner": (
		".button.upwork-banner__cta": 2,
		".button.upwork-banner__close": 4,
	),
	".checklist__task": (
		".checklist__task::before": 10,
		".checklist__task-icon": 20,
	),


	"icon-parent":
	(
		".sidebar__menu .gridicon.gridicons-external": 1,
	),
	"screen-reader-text-parent": (
		".screen-reader-text:focus": 100000,
	),
	"button-group-parent": (
		".button-group .button:focus": 1,
	),
	"progress-indicator-parent": (
		".progress-indicator .is-success": 2,
	),
	"section-nav-tabs__dropdown-parent": (
		".section-nav-tabs__dropdown": 3,
		".section-nav-tabs__dropdown.is-open": 4,
	),
	"reader-card-follow-button-parent": (
		".reader__card.card .follow-button": 1,
	),
	".tag-stream__header-follow": (
		".follow-button": 1,
	),
	"user-profile-header": (
		".user-profile-header__bio-desc-fader": 1,
		".user-profile-header__bio-desc-link": 2,
	),
);

// allows us to do a nested fetch
@function map-deep-get( $map, $keys... ) {
	@each $key in $keys {
		@if not map-has-key( $map, $key ) {
			@warn "No layer found for `#{$key}` of `[#{ $keys }]` in $z-layers map. Property omitted.";
			@return map-get( $map, $key );
		}
		$map: map-get($map, $key);
	}
	@return $map;
}

@function z-index( $keys... ) {
	@return map-deep-get( $z-layers, $keys... );
}
