html {
  font-size: 12px;
}

:root {
  --tk-bg: #f5f7fb;
  --tk-surface: #ffffff;
  --tk-surface-muted: #f8fafc;
  --tk-border: #d0d7de;
  --tk-text: #24292f;
  --tk-muted: #57606a;
  --tk-primary: #206bc4;
  --tk-primary-soft: #edf5ff;
  --tk-header-blue: #3277d4;
  --tk-table-head: #f6f8fa;
  --tk-table-head-border: #d0d7de;
  --tk-table-row-border: #d8dee4;
  --tk-table-hover: #f6f8fa;
  --tk-table-danger: #fff1f2;
  --tk-table-warning: #fff7e6;
  --tk-table-success: #ecfdf3;
  --tk-radius: 6px;
  --tk-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.04);
  --tk-report-red: #e91f2d;
  --tk-report-purple: #7463ad;
  --tk-report-teal: #07879e;
  --tk-report-coral: #ff684f;
  --tk-report-gray: #eef1f4;
  --tk-report-border: #cfd5db;
}

@media (max-width: 1024px) {
    .container {
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

body,table{
  padding: 0;
  margin: 0 auto;
  font-family: YakuHanJPs,Hiragino Kaku Gothic ProN,Hiragino Kaku Gothic Pro,Meiryo,sans-serif;
  color: var(--tk-text);
  background-color: var(--tk-bg);
}

a { text-decoration: none; }

.thl { width:25% }

.header_back {
  background: var(--tk-header-blue);
  color: #ffffff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.12);
}

.navbar {
  position: relative;
  z-index: 1030;
  background: var(--tk-surface) !important;
  border-bottom: 1px solid var(--tk-border);
  box-shadow: var(--tk-shadow-sm);
}

.navbar-brand {
  color: var(--tk-text);
  font-weight: 700;
}

.navbar .nav-link {
  color: var(--tk-muted);
  font-weight: 500;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: var(--tk-primary);
}

.navbar .dropdown-menu {
  z-index: 1031;
  border-color: var(--tk-border);
  border-radius: var(--tk-radius);
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
}

.dropdown-item {
  color: var(--tk-text);
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--tk-primary);
  background-color: var(--tk-primary-soft);
}

.table thead.sticky-top {
  z-index: 10;
}

.table {
  --bs-table-bg: var(--tk-surface);
  --bs-table-border-color: var(--tk-border);
  --bs-table-hover-bg: var(--tk-table-hover);
  --bs-table-color: var(--tk-text);
  margin-bottom: 1rem;
  color: var(--tk-text);
  background-color: var(--tk-surface);
  border: 1px solid var(--tk-border);
  border-collapse: separate;
  border-color: var(--tk-border);
  border-radius: var(--tk-radius);
  border-spacing: 0;
  overflow: hidden;
}

.table.shadow-sm {
  box-shadow: none !important;
}

.table > :not(caption) > * > * {
  padding: 0.55rem 0.75rem;
  color: var(--bs-table-color);
  background-color: var(--bs-table-bg);
  border-color: var(--tk-table-row-border);
  border-width: 0 0 1px;
}

.table > tbody > tr:last-child > * {
  border-bottom-width: 0;
}

.table-bordered > :not(caption) > * {
  border-width: 0;
}

.table-bordered > :not(caption) > * > * {
  border-width: 0 0 1px;
}

.table-sm > :not(caption) > * > * {
  padding: 0.4rem 0.6rem;
}

.table > thead:first-of-type > tr:first-child > *:first-child {
  border-top-left-radius: calc(var(--tk-radius) - 1px);
}

.table > thead:first-of-type > tr:first-child > *:last-child {
  border-top-right-radius: calc(var(--tk-radius) - 1px);
}

.table > :last-child > tr:last-child > *:first-child {
  border-bottom-left-radius: calc(var(--tk-radius) - 1px);
}

.table > :last-child > tr:last-child > *:last-child {
  border-bottom-right-radius: calc(var(--tk-radius) - 1px);
}

.table thead th,
.table thead td {
  background-color: var(--tk-table-head);
  color: var(--tk-muted);
  border-color: var(--tk-table-head-border);
  font-weight: 600;
  vertical-align: middle;
}

.table thead.sticky-top th,
.table thead.sticky-top td,
.table thead .sticky-top {
  box-shadow: 0 1px 0 var(--tk-table-head-border);
}

.table-hover > tbody > tr:hover > * {
  --bs-table-color-state: var(--tk-text);
  --bs-table-bg-state: var(--tk-table-hover);
}

.table-primary,
.table-secondary {
  --bs-table-color: var(--tk-muted);
  --bs-table-bg: var(--tk-table-head);
  --bs-table-border-color: var(--tk-table-head-border);
}

.table-light {
  --bs-table-color: var(--tk-text);
  --bs-table-bg: var(--tk-table-head);
  --bs-table-border-color: var(--tk-table-head-border);
}

.table-danger {
  --bs-table-color: #912018;
  --bs-table-bg: var(--tk-table-danger);
  --bs-table-border-color: #ffd5d8;
}

.table-warning {
  --bs-table-color: #8a5a00;
  --bs-table-bg: var(--tk-table-warning);
  --bs-table-border-color: #ffe0a3;
}

.table-success {
  --bs-table-color: #087443;
  --bs-table-bg: var(--tk-table-success);
  --bs-table-border-color: #bdeccf;
}

.form-check-input {
  width: 1.8em;
  height: 1.8em;
}

.form-select-sm{
  font-size:1em;
  border-color: #6c757d;
}

.btn-sm, .btn{
  padding:3px 4px;
  border-radius: var(--tk-radius);
}

.custom-placeholder::placeholder {
  color: #ccc;
}

.ai-note-col {
  width: 30%;
  min-width: 260px;
}

.ai-note-cell {
  width: 30%;
  min-width: 260px;
  max-width: 420px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.45;
  color: #25324d;
  background-color: #fffdf3;
  border-left: 2px solid #ffd666;
}

#rank-standard > tr > td,
#rank-standard > tr > th {
  vertical-align: middle;
}

#rank-standard .rank-cell-main {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
}

#rank-standard .rank-cell-main > .float-start,
#rank-standard .rank-cell-main > .btn-group {
  float: none !important;
  margin-right: 0 !important;
}

#rank-standard .rank-extra-actions {
  padding-top: 6px;
}

.flow-set-col {
  width: 58px;
  min-width: 58px;
  white-space: nowrap;
}

.event-table > :not(caption) > * > * {
  padding: 0.45rem 0.5rem;
}

.event-pc-banner-col {
  width: 70px;
  min-width: 70px;
  max-width: 70px;
}

.event-pc-banner-col .form-select {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.event-setup-shop-filter {
  width: 260px;
  max-width: 100%;
}

.header_back .btn-light,
.header_back .btn-outline-light {
  border-color: rgba(255, 255, 255, 0.75);
  font-weight: 600;
}

.header_back .btn-outline-light {
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.08);
}

.header_back .btn-light {
  color: var(--tk-primary);
  background-color: #ffffff;
  border-color: #ffffff;
}

.header_back .btn-light:hover,
.header_back .btn-outline-light:hover,
.header_back .btn-outline-light:focus {
  color: var(--tk-primary);
  background-color: #ffffff;
  border-color: #ffffff;
}

.header_back .btn-light,
.header_back .btn-group .btn-outline-light.active,
.header_back .btn-group .btn-outline-light.active:hover {
  background-color: #ffffff;
  border-color: #ffffff;
  color: var(--tk-primary);
}

.header_back .btn-group .btn-outline-light:not(.active):hover {
  background-color: #ffffff;
  color: var(--tk-primary);
}

.priority-section-heading {
  padding-left: 8px;
  border-left: 8px solid currentColor;
}

.priority-section-head th {
  color: #ffffff;
  border-color: var(--tk-report-border);
}

.priority-section-urgent {
  color: var(--tk-report-red);
}

.priority-section-urgent th {
  background-color: var(--tk-report-red);
}

.priority-section-wrong {
  color: var(--tk-report-red);
}

.priority-section-wrong th {
  background-color: var(--tk-report-red);
}

.priority-section-high {
  color: var(--tk-report-coral);
}

.priority-section-high th {
  background-color: var(--tk-report-coral);
}

.priority-section-normal {
  color: var(--tk-report-teal);
}

.priority-section-normal th {
  background-color: var(--tk-report-teal);
}

.priority-section-low {
  color: var(--tk-report-purple);
}

.priority-section-low th {
  background-color: var(--tk-report-purple);
}

.pwd-table thead th {
  background-color: #dee2e6;
  border-color: #b8bec5;
}

.pwd-table > :not(caption) > * > * {
  padding: 0.45rem 0.5rem;
}

.pwd-cell {
  white-space: normal;
  overflow-wrap: anywhere;
}
