:focus-visible {
  outline: 2px solid var(--c-gold);
  outline-offset: 2px;
  border-radius: 2px;
}

.form-row input:focus-visible,
.form-row select:focus-visible,
.form-row textarea:focus-visible,
input.txt:focus-visible,
select.txt:focus-visible,
textarea.txt:focus-visible {
  outline: none;
  border-bottom-color: var(--c-gold);
}


.card {
  box-shadow: 0 1px 2px rgba(15, 15, 15, 0.03);
}


.tbl thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--c-card, #FFFFFF);
}

.tbl thead th::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: var(--c-border);
}


::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #DCDCDC;
  border-radius: 5px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: #C4C4C4; background-clip: padding-box; }
::-webkit-scrollbar-corner { background: transparent; }


::selection {
  background: rgba(201, 123, 63, 0.22);
  color: var(--g1);
}


.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus,
input.txt:focus,
select.txt:focus,
textarea.txt:focus {
  border-bottom-color: var(--c-gold);
}


input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--c-gold);
}


a.btn:hover, a.btn-mini:hover { text-decoration: none; }
.mod-header a:hover, .card a:not(.btn):not(.btn-mini):not(.quick-tile):hover {
  text-decoration: underline;
  text-decoration-color: var(--c-gold);
  text-underline-offset: 3px;
}


.btn svg {
  width: 15px; height: 15px;
  stroke-width: 1.4;
  flex-shrink: 0;
}
.btn-mini svg {
  width: 13px; height: 13px;
  stroke-width: 1.5;
  flex-shrink: 0;
}

.badge svg {
  width: 11px; height: 11px;
  stroke-width: 1.8;
  vertical-align: -1.5px;
  margin-right: 3px;
}

.qi-icon {
  width: 20px; height: 20px;
  stroke-width: 1.4;
  margin-bottom: 2px;
}


.dash-hello .hello-name { font-style: normal; }



.mod-header h2,
.mod-header .mod-title,
.card h3,
.card .card-title,
.modal-header,
.class-card .name,
.empty,
.dash-empty,
.dash-quick-item .qi-text,
.dash-notice-item .n-title,
.sb-group-title,
.sb-foot-left .sb-user-name,
.sb-foot-left .sb-user-meta,
.chat-msg-typing .chat-msg-content,
#login-page .login-title,
#login-page .form-row input,
#login-page .form-row textarea,
#login-page .form-row input::placeholder,
#login-page .form-row textarea::placeholder {
  font-style: normal;
}


.chat-avatar-lg .icon { width: 34px; height: 34px; stroke-width: 1.2; }
.chat-msg-avatar .icon { width: 18px; height: 18px; stroke-width: 1.5; }



.form-row input::placeholder,
input.txt::placeholder,
select.txt::placeholder,
textarea.txt::placeholder { color: var(--g5); }