/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */

/* Avatar placeholder — shown instead of a broken <img> when a user has no
   profile picture, or the file behind it has gone missing. Sized to match the
   40px navbar avatar; the profile page overrides the box and font size. */
.avatar-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #7367f0;
    color: #fff;
    font-weight: 600;
    font-size: .9rem;
    line-height: 1;
    text-transform: uppercase;
    user-select: none;
}

/* Select2 dropdowns that fit their control.

   Opt in by putting .select-fit on the <select>. The panel is appended to
   <body> rather than the card, so it cannot be reached from the page — the
   layout passes .select2-fit through dropdownCssClass, which lands on the
   panel itself.

   With dropdownAutoWidth off select2 already sizes the panel to the control;
   these rules stop a long option forcing it wider or being clipped. */
.select2-dropdown.select2-fit {
    max-width: 100vw;
}
.select2-dropdown.select2-fit .select2-results__option {
    white-space: normal;
    word-break: break-word;
}
