PYRSS-Website/apps/static/css/index.css

@charset "UTF-8";

:root, 
[data-bs-theme="light"] {
    --border-colour: var(--bs-light-border-subtle);
}
[data-bs-theme="dark"] {
    --border-colour: var(--bs-dark-border-subtle)
}

/* Select 2 */

.select2-selection {
    border: 1px solid var(--border-colour) !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    font-size: 1rem !important;
    background-color: var(--bs-body-bg) !important;
    padding: 0.375rem 0.75rem !important;
}

.select2-container--bootstrap .select2-selection--single {
    line-height: 1.5 !important;
    height: fit-content !important;
}

.select2-selection__rendered {
    color: var(--bs-body-color) !important;
}

.select2-selection:focus {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
    -webkit-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

.select2-dropdown {
    border: 1px solid var(--border-colour) !important;
    /* box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important; */
}

.select2-selection__choice {
  display: flex;
  align-items: center;
  padding-left: 3px !important;
}

.select2-selection__choice > button {
  border: none;
  background-color: var(--bs-white-rgb);
}

.select2-results__option--selected { display: none; }

/* CK Editor */

.ck-editor .ck.ck-editor__top .ck-toolbar {
  border-top-left-radius: 0.375rem !important;
  border-top-right-radius: 0.375rem !important;
}

.ck-editor .ck.ck-editor__main {
  overflow: hidden;
}

.ck-editor .ck.ck-editor__main > div {
  border-bottom-left-radius: 0.375rem !important;
  border-bottom-right-radius: 0.375rem !important;
}

.ck-editor__editable[role="textbox"] {
  /* editing area */
  min-height: 200px;
  max-height: 200px;
}

.bg-none {
    background: none;
}

.border-none {
    border: none
}

a {
  text-decoration: none;
}

body {
  font-family: Roboto, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  color: #72777a;
  line-height: 1.5;
  letter-spacing: 0.2px;
  overflow-x: hidden;
}

.bd {
    border: 1px solid var(--border-colour) !important;
}

.bdT {
    border-top: 1px solid var(--border-colour) !important;
}

.bdB {
    border-bottom: 1px solid var(--border-colour) !important;
}

.bdR {
    border-right: 1px solid var(--border-colour) !important;
}

.bdL {
    border-left: 1px solid var(--border-colour) !important;
}

.w-fc {
    width: fit-content;
}

.h-fc {
    height: fit-content;
}

.loading .email-list-item {
    cursor: progress;
}


/* Tickets Side Nav */

.email-app .email-side-nav {
    border-right: 1px solid var(--border-colour);
}

.email-app .email-side-nav .nav-item .nav-link {
    color: var(--bs-tertiary-color);
}

.email-app .email-wrapper {
    min-height: 0;
}

@media screen and (min-width: 992px) {
    .email-app .email-wrapper .email-list {
        border-right: 1px solid var(--border-colour);
    }
}


/* Base Sidebar Navigation */

.sidebar-menu {
    border-right: 1px solid var(--border-colour);
}

.sidebar-logo {
    border-right: none !important;
    border-bottom: 1px solid var(--border-colour);
}


/* Top Navigation */

.header {
    border-bottom: 1px solid var(--border-colour);
}

/* Animated Button Borders */

.draw-border-success:hover {
    color: var(--bs-success);
}
.draw-border-success:hover::before, .draw-border-success:hover::after {
    border-color: var(--bs-success);
}

.draw-border-primary:hover {
    color: var(--bs-primary);
}
.draw-border-primary:hover::before, .draw-border-primary:hover::after {
    border-color: var(--bs-primary);
}

.draw-border-secondary:hover {
    color: var(--bs-secondary);
}
.draw-border-secondary:hover::before, .draw-border-secondary:hover::after {
    border-color: var(--bs-secondary);
}

.draw-border-danger:hover {
    color: var(--bs-danger);
}
.draw-border-danger:hover::before, .draw-border-danger:hover::after {
    border-color: var(--bs-danger);
}

.draw-border {
    box-shadow: inset 0 0 0 1px var(--border-colour);
    color: var(--bs-body-color);
    transition: color 0.15s 0.0833333333s;
    position: relative;
}
.draw-border::before, .draw-border::after {
    border: 0 solid transparent;
    box-sizing: border-box;
    content: '';
    pointer-events: none;
    position: absolute;
    width: 0;
    height: 0;
    bottom: 0;
    right: 0;
}
.draw-border::before {
    border-bottom-width: 1px;
    border-left-width: 1px;
}
.draw-border::after {
    border-top-width: 1px;
    border-right-width: 1px;
}
.draw-border:hover::before, .draw-border:hover::after {
    transition: border-color 0s, width 0.15s, height 0.15s;
    width: 100%;
    height: 100%;
}
.draw-border:hover::before {
    transition-delay: 0s, 0s, 0.15s;
}
.draw-border:hover::after {
    transition-delay: 0s, 0.15s, 0s;
}


/* Toasts */

.toast {
    z-index: 2 !important;
}

.toast .progress-bar {
    border-radius: 0;
}


/* Progress Bar */

@keyframes decreaseProgressWidth {
    from { width: 100%; }
    to { width: 0%; }
}

/* Spinning */

@keyframes spinning-360-anim {
    100% {
        transform: rotate(360deg);
    }
}

.spinning-360 {
    animation: spinning-360-anim 1s ease-in-out infinite;
    -moz-animation: spinning-360-anim 1s ease-in-out infinite;
    -webkit-animation: spinning-360-anim 1s ease-in-out infinite;  
}

/* Server List */

#serverList .server-item img { 
    transition: border-radius .15s ease-in;
}