/*
 * @desc Improving the userpages' design to adapt to any theme and making it esthetically appealing
 * @author [[User:GreenWithin]]
 * @version 1.0.4.2
 * @changes Text color is ugly, links are cool
*/
/** Importing font **/
@font-face {
  font-family: 'FANDOM-Icons';
  src: url('https://vignette.wikia.nocookie.net/dev/images/b/b4/FANDOM-Icons.woff2/revision/latest') format('woff2'), url('https://vignette.wikia.nocookie.net/dev/images/e/ee/FANDOM-Icons.woff/revision/latest') format('woff');
  font-weight: normal;
  font-style: normal;
}

/** Tags **/
#userProfileApp .user-identity-header__tag {
    background: rgba(var(--theme-link-color--rgb), 0.20);
    border: 1px solid var(--theme-link-color);
}

/** Buttons **/
#userProfileApp .user-identity-header__actions .wds-button {
    background-color: rgba(var(--theme-link-color--rgb), 0.20);
    border: 1px solid var(--theme-link-color);
    color: var(--theme-link-color);
}

/** Avatar **/
#userProfileApp .user-identity-avatar img {
    border: 2px solid var(--theme-link-color) !important;
    padding: 5px;
}

/** Navigational links **/
#userProfileApp .user-profile-navigation__link {
    border-radius: 3px;
    margin-right: 5px;
    padding: 8px !important;
    margin: 5px 5px 5px 0px;
    text-align: center;
    font-weight: bold !important;
    text-transform: unset !important;
    border: 1px solid var(--theme-link-color) !important;
    background: rgba(var(--theme-link-color--rgb), 0.20);
}

#userProfileApp .user-profile-navigation__link a {
   color: var(--theme-link-color) !important;
}

#userProfileApp .user-profile-navigation {
    border-bottom-color: var(--theme-link-color);
}

/** Header (nickname display)**/
#userProfileApp .user-identity-header :is(h1) {
    background-image: linear-gradient(to top, rgba(var(--theme-link-color--rgb), 0.3) 40%, transparent 40%, transparent 100%);
    line-height: normal;
    color: var(--theme-link-color);
}

/** Profile editor **/
/*** "Save" button ***/
.modal-wrapper__header .modal-wrapper__cta-button {
    background-color: rgba(var(--theme-link-color--rgb), 0.15);
    border: 1px solid var(--theme-link-color);
    color: var(--theme-link-color);
}

/*** Modal ***/
#userProfileApp .modal-wrapper {
    background: none;
}

/** Icons for navigational links **/
#userProfileApp .user-profile-navigation__link:not(.is-active):hover {
	opacity: 1;
	transition: .2s;
}

#userProfileApp .user-profile-navigation__link:before {
    font-family: Fandom-Icons;
    color: var(--theme-link-color);
}

#userProfileApp .user-profile-navigation__link:nth-child(1):before {
    content: 'avatar ';
}

#userProfileApp .user-profile-navigation__link:nth-child(2):before {
    content: 'comment ';
}

#userProfileApp .user-profile-navigation__link:nth-child(3):before {
    content: 'book ';
}

#userProfileApp .user-profile-navigation__link:nth-child(4):before {
    content: 'pencil ';
}

#userProfileApp .user-profile-navigation__link:nth-child(5):before {
    content: 'grid ';
}