/* Çek yönetimi · referans görünüm */
#page-checks {
  --check-blue: #2c92ff;
  --check-cyan: #49e5ed;
  --check-green: #2be0b3;
  --check-gold: #f3b62f;
  --check-purple: #9a4cf5;
  --check-red: #ff4f72;
  color: #eaf6ff;
}

#page-checks .checks-command {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 20px;
  min-height: 132px;
  padding: 18px 22px 14px;
}

#page-checks .checks-heading { position: relative; z-index: 2; }
#page-checks .check-hero-icon { color: #61c6ff; }
#page-checks .checks-command .checks-command-meta { flex-direction: row; gap: 7px; }
#page-checks .checks-command .checks-date-tile,
#page-checks .checks-command .checks-user-tile { min-width: 126px; padding: 9px 10px; }
#page-checks .checks-command-actions { padding-top: 8px; }

@media(max-width:1450px) {
  #page-checks .checks-command .checks-command-meta { flex-direction: column; }
  #page-checks .checks-command .checks-date-tile,
  #page-checks .checks-command .checks-user-tile { min-width: 175px; }
}

@media(max-width:900px) {
  #page-checks .checks-command { grid-template-columns: 1fr auto; }
}

@media(max-width:720px) {
  #page-checks .checks-command { grid-template-columns: 1fr; }
  #page-checks .checks-command .checks-command-meta { flex-direction: row; width: 100%; }
}

#app .home-check-alert {
  grid-template-columns: 72px minmax(230px, .85fr) minmax(370px, 1.15fr) auto;
  gap: 17px;
  min-height: 132px;
  padding: 19px 20px;
  border-width: 2px;
  border-color: rgba(242, 180, 55, .48);
  border-radius: 14px;
  background:
    radial-gradient(330px 150px at 0 20%, rgba(239, 172, 43, .17), transparent 72%),
    linear-gradient(120deg, #102d3c 0%, #092335 55%, #071c2c 100%);
  box-shadow: 0 14px 34px rgba(0, 7, 15, .27), inset 0 1px rgba(255, 231, 172, .09), 0 0 24px rgba(231, 170, 49, .05);
}

#app .home-check-alert-icon {
  width: 70px;
  height: 70px;
  border-width: 2px;
  border-color: rgba(255, 205, 99, .58);
  background: radial-gradient(circle at 35% 25%, rgba(255, 220, 130, .25), rgba(194, 126, 23, .12));
  box-shadow: 0 0 26px rgba(231, 170, 49, .18), inset 0 1px rgba(255, 242, 203, .18);
}

#app .home-check-alert-icon svg {
  width: 35px;
  height: 35px;
  stroke-width: 1.8;
}

#app .home-check-live {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  color: #ffd273 !important;
  font-size: 9.5px !important;
  letter-spacing: .18em !important;
}

#app .home-check-live>i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #55f3c5;
  box-shadow: 0 0 10px #55f3c5;
  animation: livePulse 2s ease-out infinite;
}

#app .home-check-alert-copy>b {
  margin-top: 7px;
  color: #f7fbfd;
  font-size: 20px;
  letter-spacing: -.2px;
}

#app .home-check-alert-copy>p {
  margin-top: 6px;
  color: #9ab1be;
  font-size: 11px;
}

#app .home-check-alert-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

#app .home-check-item {
  min-height: 70px;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 4px 9px;
  padding: 10px 11px;
  border-color: rgba(239, 183, 72, .4);
  background: linear-gradient(135deg, rgba(7, 31, 51, .85), rgba(4, 20, 36, .9));
}

#app .home-check-item-icon {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(242, 191, 78, .46);
  border-radius: 9px;
  background: rgba(210, 146, 34, .16);
  color: #ffd16e;
}

#app .home-check-item-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .home-check-name>b {
  font-size: 12px;
  letter-spacing: -.1px;
}

#app .home-check-name {
  grid-row: 1;
}

#app .home-check-stats {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2px;
  min-width: 0;
}

#app .home-check-name>small {
  margin-top: 2px;
  color: #91a9b8;
  font-size: 9px;
}

#app .home-check-stats>strong {
  color: #ffdf92;
  font-size: 11.5px;
  white-space: nowrap;
}

#app .home-check-stats>em {
  color: #e0b85f;
  font-style: normal;
  font-size: 9.5px;
  font-weight: 750;
  white-space: nowrap;
}

#app .home-check-item.overdue .home-check-stats>strong,
#app .home-check-item.overdue .home-check-stats>em {
  color: #ff91a4;
}

#app .home-check-item.overdue {
  border-color: rgba(255, 87, 116, .52);
  background: linear-gradient(135deg, rgba(67, 17, 39, .34), rgba(9, 24, 39, .9));
}

#app .home-check-item.overdue .home-check-item-icon {
  border-color: rgba(255, 97, 124, .56);
  background: rgba(191, 38, 73, .19);
  color: #ff6d88;
}

#app .home-check-alert>.btn {
  min-width: 118px;
  height: 43px;
  border-color: rgba(68, 184, 231, .45);
  border-radius: 9px;
  background: rgba(7, 35, 60, .82);
  color: #d9edf6;
  font-size: 10px;
  font-weight: 750;
}

.checks-command {
  position: relative;
  display: grid;
  grid-template-columns: minmax(250px, 1.25fr) minmax(190px, .8fr) auto;
  gap: 20px 22px;
  align-items: center;
  margin-bottom: 14px;
  padding: 19px 22px 15px;
  overflow: hidden;
  border: 1px solid rgba(49, 151, 255, .35);
  border-radius: 12px;
  background:
    radial-gradient(500px 180px at 75% 0, rgba(20, 119, 255, .16), transparent 72%),
    linear-gradient(105deg, #061b35 0%, #06152a 52%, #07182d 100%);
  box-shadow: 0 10px 35px rgba(0, 0, 0, .24), inset 0 1px rgba(126, 217, 255, .08);
}

.checks-command::after {
  content: "";
  position: absolute;
  top: -35px;
  right: 100px;
  width: 330px;
  height: 190px;
  pointer-events: none;
  opacity: .18;
  background:
    repeating-linear-gradient(0deg, transparent 0 14px, rgba(117, 190, 255, .24) 15px 16px),
    linear-gradient(135deg, transparent 46%, rgba(119, 208, 255, .28) 47% 48%, transparent 49%);
  clip-path: polygon(22% 0, 100% 0, 82% 100%, 0 100%);
}

.checks-command-brand,
.checks-command-title,
.checks-command-meta,
.checks-command-actions {
  position: relative;
  z-index: 2;
}

.checks-command-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.checks-command-brand img {
  width: 76px;
  height: 76px;
  flex: 0 0 auto;
  padding: 3px;
  border-radius: 50%;
  border: 1px solid #e9bd55;
  background: #f5e8bd;
  box-shadow: 0 0 0 3px rgba(243, 191, 64, .12), 0 0 24px rgba(242, 190, 63, .23);
}

.checks-command-brand b {
  display: block;
  color: #f4f8fb;
  font: 700 13px/1.25 "Segoe UI", Arial, sans-serif;
}

.checks-command-brand span {
  display: block;
  margin-top: 5px;
  color: #b9ccda;
  font-size: 8.5px;
  line-height: 1.35;
  letter-spacing: .04em;
}

.checks-command-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-width: 0;
  padding: 0 12px;
  border-left: 1px solid rgba(86, 157, 215, .25);
  border-right: 1px solid rgba(86, 157, 215, .25);
}

.checks-title-icon {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid #31aaff;
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(29, 132, 255, .18), rgba(40, 217, 244, .08));
  color: #45c8ff;
  box-shadow: inset 0 1px rgba(172, 236, 255, .14), 0 0 24px rgba(29, 132, 255, .2);
}

.checks-title-icon svg {
  width: 35px;
  height: 35px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.checks-command-title h2 {
  margin: 0;
  color: #f8fbff;
  font: 800 clamp(27px, 2.25vw, 38px)/1 "Segoe UI", Arial, sans-serif;
  letter-spacing: -.7px;
}

.checks-command-title>div>span {
  display: block;
  margin-top: 5px;
  color: #e4b238;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .03em;
}

.checks-command-meta {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.checks-date-tile,
.checks-user-tile {
  min-width: 116px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 11px;
  border: 1px solid rgba(64, 143, 212, .26);
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(11, 46, 86, .85), rgba(5, 23, 47, .9));
}

.checks-date-tile>svg {
  width: 25px;
  height: 25px;
  flex: 0 0 auto;
  fill: none;
  stroke: #37c8ff;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.checks-date-tile b,
.checks-user-tile b {
  display: block;
  color: #f3f8fc;
  font-size: 10px;
  white-space: nowrap;
}

.checks-date-tile small,
.checks-user-tile small {
  display: block;
  margin-bottom: 3px;
  color: #8caac1;
  font-size: 7.5px;
}

.checks-user-tile>span {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid rgba(70, 198, 255, .55);
  border-radius: 50%;
  background: linear-gradient(145deg, #156abd, #0d3d7d);
  color: #e7f7ff;
  font-size: 12px;
  font-weight: 800;
}

.checks-command-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  gap: 7px;
  padding-top: 10px;
  border-top: 1px solid rgba(69, 140, 203, .17);
}

.checks-tool-btn {
  height: 31px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid rgba(68, 154, 223, .3);
  border-radius: 7px;
  background: rgba(6, 31, 61, .64);
  color: #b9d5e9;
  font-size: 9px;
  font-weight: 700;
  text-decoration: none;
}

.checks-tool-btn svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: #42c7ff;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.checks-tool-btn:hover {
  border-color: #3fcfff;
  background: rgba(18, 79, 133, .58);
  color: #f0fbff;
}

#app .check-kpi-grid.five {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 11px;
}

#app .check-kpi {
  --accent: #288cff;
  --soft: rgba(31, 126, 245, .15);
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 13px;
  grid-template-rows: auto auto auto;
  gap: 2px 11px;
  align-items: center;
  min-height: 105px;
  padding: 14px 13px;
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
  border-radius: 10px;
  background: radial-gradient(160px 95px at 10% 10%, var(--soft), transparent 72%), linear-gradient(120deg, #081f3d, #07162d);
}

#app .check-kpi.total { --accent: #26dcad; --soft: rgba(28, 201, 158, .15); }
#app .check-kpi.collected { --accent: #f2b72d; --soft: rgba(225, 157, 26, .16); }
#app .check-kpi.risk { --accent: #a64cff; --soft: rgba(140, 57, 229, .17); }
#app .check-kpi.waiting { --accent: #378fff; --soft: rgba(29, 116, 235, .15); }

#app .check-kpi-icon {
  grid-row: 1 / 4;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 70%, transparent);
  border-radius: 50%;
  background: color-mix(in srgb, var(--accent) 17%, transparent);
  color: var(--accent);
  box-shadow: 0 0 20px var(--soft);
}

#app .check-kpi-icon svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .check-kpi>span {
  grid-column: 2;
  grid-row: 1;
  color: #c6d5e4;
  font-size: 8.5px;
  font-weight: 800;
  letter-spacing: .08em;
}

#app .check-kpi>b {
  grid-column: 2;
  grid-row: 2;
  margin: 3px 0 0;
  color: #f7fbff;
  font-size: clamp(18px, 1.55vw, 25px);
  letter-spacing: -.7px;
  white-space: nowrap;
}

#app .check-kpi.total>b { color: #61f0d0; }
#app .check-kpi.collected>b { color: #ffd063; }
#app .check-kpi.risk>b { color: #c79cff; }

#app .check-kpi>small {
  grid-column: 2;
  grid-row: 3;
  min-width: 0;
  margin-top: 3px;
  overflow: hidden;
  color: #8da9bd;
  font-size: 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#app .check-kpi>i {
  position: static;
  grid-column: 3;
  grid-row: 1 / 4;
  color: color-mix(in srgb, var(--accent) 82%, white);
  font-size: 22px;
  font-style: normal;
}

.checks-workspace {
  overflow: hidden;
  border: 1px solid rgba(45, 126, 195, .38);
  border-radius: 11px;
  background: linear-gradient(145deg, rgba(5, 28, 55, .96), rgba(3, 16, 34, .98));
}

#app .checks-toolbar {
  padding: 13px 14px;
  border-bottom: 1px solid rgba(58, 137, 199, .24);
  background: rgba(4, 25, 49, .8);
}

#app .check-tabs {
  gap: 4px;
}

#app .check-tabs .dtab {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #c3d2df;
  font-size: 10px;
  font-weight: 650;
}

#app .check-tabs .dtab svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .check-tabs .dtab.active {
  border-color: #248cff;
  background: linear-gradient(180deg, #1769dd, #0e4eae);
  color: #fff;
  box-shadow: 0 0 18px rgba(28, 118, 242, .24), inset 0 1px rgba(186, 226, 255, .24);
}

.checks-new-btn {
  height: 43px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 19px;
  border: 1px solid #56caff;
  border-radius: 8px;
  background: linear-gradient(180deg, #248aff, #1265da);
  color: #f7fcff;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(16, 105, 222, .3), inset 0 1px rgba(213, 241, 255, .28);
}

.checks-new-btn:hover {
  border-color: #a1e9ff;
  filter: brightness(1.1);
}

.checks-new-btn>span {
  font-size: 19px;
  font-weight: 400;
  line-height: 1;
}

#app .checks-filters {
  grid-template-columns: minmax(230px, 1fr) 190px 170px auto 38px;
  gap: 11px;
  padding: 11px 14px;
  background: rgba(3, 19, 38, .7);
}

.checks-search {
  height: 39px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  border: 1px solid rgba(61, 131, 190, .42);
  border-radius: 8px;
  background: rgba(3, 20, 41, .8);
}

.checks-search svg {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  fill: none;
  stroke: #a9c4d9;
  stroke-width: 1.8;
}

.checks-search input {
  min-width: 0;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: #e8f5ff;
  font-size: 10.5px;
}

.checks-select-filter {
  height: 39px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px;
  border: 1px solid rgba(61, 131, 190, .4);
  border-radius: 8px;
  background: rgba(4, 26, 51, .82);
}

.checks-select-filter>svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: none;
  stroke: #8fb7d2;
  stroke-width: 1.6;
}

.checks-select-filter>span {
  min-width: 0;
  flex: 1;
}

.checks-select-filter small {
  display: block;
  color: #87a4ba;
  font-size: 7px;
  line-height: 1;
}

.checks-select-filter select {
  width: 100%;
  margin-top: 2px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #eef8ff;
  font-size: 9.5px;
}

.checks-clear-btn {
  height: 39px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  border: 1px solid rgba(67, 169, 235, .42);
  border-radius: 8px;
  background: rgba(5, 29, 56, .8);
  color: #d4e6f4;
  font-size: 10px;
  font-weight: 700;
  cursor: pointer;
}

.checks-clear-btn>span {
  color: #57ccff;
  font-size: 18px;
}

.checks-refresh-icon {
  width: 38px;
  height: 39px;
  border: 1px solid rgba(67, 169, 235, .42);
  border-radius: 8px;
  background: rgba(5, 29, 56, .8);
  color: #67d8ff;
  font-size: 17px;
  cursor: pointer;
}

#app .checks-table-wrap {
  max-height: 620px;
  overflow: auto;
  background: rgba(2, 14, 30, .66);
}

#app .checks-table {
  min-width: 890px;
}

#app .checks-table th {
  height: 47px;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(55, 127, 187, .28);
  background: #04172e;
  color: #c2d1dd;
  font-size: 8px;
  letter-spacing: .025em;
}

#app .checks-table td {
  height: 72px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(57, 124, 180, .2);
  background: rgba(5, 24, 47, .84);
}

#app .checks-table tbody tr:nth-child(even) td { background: rgba(4, 21, 43, .9); }
#app .checks-table tbody tr:hover td { background: rgba(10, 43, 76, .9); }
#app .checks-table tbody tr.selected td { background: rgba(14, 55, 94, .92); }

.check-select-column,
.check-select-cell {
  width: 39px;
  text-align: center !important;
}

.check-select-cell input,
.check-select-column input {
  width: 16px;
  height: 16px;
  accent-color: #20a8f1;
  cursor: pointer;
}

#app .check-number-cell {
  gap: 11px;
  min-width: 155px;
}

#app .check-mini-icon {
  width: 32px;
  height: 32px;
  border-color: rgba(32, 177, 242, .6);
  border-radius: 50%;
  background: linear-gradient(145deg, #1376e5, #1cbecc);
  color: #fff;
  box-shadow: 0 0 16px rgba(27, 158, 234, .2);
}

#app .check-mini-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .check-number-cell b {
  font-size: 12px;
}

#app .check-number-cell small {
  color: #88a4b9;
  font-size: 8.5px;
}

#app .check-person-cell {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 150px;
}

#app .check-person-cell>i {
  width: 3px;
  height: 35px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: linear-gradient(#3ff09b, #199f63);
}

#app .check-person-cell>i.outgoing {
  background: linear-gradient(#ffdb77, #e79a22);
}

#app .check-person-cell b {
  max-width: 180px;
  font-size: 11.5px;
}

#app .check-person-cell small {
  color: #88a4b9;
  font-size: 8.5px;
}

.bank-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 125px;
  color: #eaf5fc;
  font-size: 10px;
  font-weight: 650;
}

.bank-mark {
  width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 7px;
  background: linear-gradient(145deg, #236db5, #0f3c70);
  color: #eaf8ff;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: -.04em;
  box-shadow: inset 0 1px rgba(255, 255, 255, .2);
}

.bank-brand.vakif .bank-mark { background: linear-gradient(145deg, #f2c63e, #a77408); color: #302100; }
.bank-brand.ziraat .bank-mark { background: linear-gradient(145deg, #ef2634, #931018); }
.bank-brand.isbank .bank-mark { background: linear-gradient(145deg, #1575c9, #0c376d); }
.bank-brand.halk .bank-mark { background: linear-gradient(145deg, #398de2, #164c91); }
.bank-brand.garanti .bank-mark { background: linear-gradient(145deg, #20a580, #0e6e55); }
.bank-brand.akbank .bank-mark { background: linear-gradient(145deg, #f04a46, #9f1517); }
.bank-brand.yapikredi .bank-mark { background: linear-gradient(145deg, #195db0, #d3274b); }
.bank-brand.qnb .bank-mark { background: linear-gradient(145deg, #7440b8, #2e155e); }
.bank-brand.deniz .bank-mark { background: linear-gradient(145deg, #1f7be5, #0d3f93); }
.bank-brand.teb .bank-mark { background: linear-gradient(145deg, #17a694, #075e5a); }
.bank-brand.kuveyt .bank-mark { background: linear-gradient(145deg, #339e67, #b08d2c); }
.bank-brand.enpara .bank-mark { background: linear-gradient(145deg, #29d5bb, #128d91); }
.bank-brand.unknown .bank-mark { background: linear-gradient(145deg, #334e68, #172a3f); color: #8da8bd; }

#app .check-due {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 118px;
}

#app .check-due>span:first-child {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid rgba(62, 163, 235, .4);
  border-radius: 7px;
  background: rgba(25, 91, 151, .25);
  color: #53bfff;
}

#app .check-due>span:first-child svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
}

#app .check-due b {
  font-size: 10.5px;
}

#app .check-due small {
  margin-top: 3px;
  font-size: 8px;
}

#app .check-amount {
  color: #ffe084;
  font-size: 15px;
}

#app .check-status {
  height: 27px;
  gap: 6px;
  padding: 0 10px;
  font-size: 8.5px;
}

#app .check-status>i {
  width: 6px;
  height: 6px;
  display: block;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 8px currentColor;
}

#app .check-status.overdue { border: 1px solid rgba(255, 72, 101, .62); background: rgba(197, 29, 60, .2); color: #ff617b; }
#app .check-status.soon { border: 1px solid rgba(246, 183, 46, .6); background: rgba(184, 116, 22, .18); color: #ffc34e; }
#app .check-status.normal { border: 1px solid rgba(37, 221, 146, .55); background: rgba(22, 160, 93, .14); color: #47e4a1; }

#app .check-icon-action {
  width: 29px;
  height: 29px;
  display: inline-grid;
  place-items: center;
  margin-left: 4px;
  padding: 0;
  border: 1px solid rgba(31, 145, 230, .48);
  border-radius: 7px;
  background: rgba(13, 67, 116, .46);
  color: #61c8ff;
  cursor: pointer;
}

#app .check-icon-action:hover { border-color: #6de0ff; background: rgba(19, 108, 167, .54); color: #fff; }

#app .check-icon-action svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#app .checks-footer {
  align-items: center;
  padding: 10px 14px;
  border-top: 1px solid rgba(55, 127, 187, .24);
  background: #04162d;
}

#app .checks-footer>div:first-child { display: flex; gap: 13px; }
#app .checks-footer>div:first-child>span:first-child { color: #eaf6ff; font-weight: 800; }
#app .checks-footer>div:first-child>span:last-child { color: #6fd3ff; }

.checks-legend {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}

.checks-legend>span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #91a8bb;
}

.checks-legend>span::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 7px currentColor;
}

.checks-legend>.normal { color: #36d98f; }
.checks-legend>.soon { color: #f1b932; }
.checks-legend>.overdue { color: #f05468; }
.checks-legend>.paid { color: #6e8cb2; }

#app .check-import-card.compact {
  padding: 14px 16px;
  border-radius: 10px;
}

#app .check-import-card.compact .check-import-copy b { font-size: 16px; }
#app .check-import-card.compact .check-drop { min-height: 58px; padding: 9px 12px; }
#app .check-import-card.compact .check-drop>span { width: 36px; height: 36px; }

@media(max-width:1450px) {
  .checks-command { grid-template-columns: minmax(215px, 1fr) minmax(165px, .75fr) auto; gap: 15px; }
  .checks-command-brand b { font-size: 11.5px; }
  .checks-command-brand span { font-size: 7.5px; }
  .checks-command-brand img { width: 67px; height: 67px; }
  .checks-command-meta { flex-direction: column; gap: 5px; }
  .checks-date-tile, .checks-user-tile { min-width: 178px; padding: 7px 9px; }
  #app .check-kpi-grid.five { gap: 8px; }
  #app .check-kpi { grid-template-columns: 40px minmax(0,1fr) 10px; gap: 2px 8px; padding: 12px 10px; }
  #app .check-kpi-icon { width: 39px; height: 39px; }
  #app .check-kpi-icon svg { width: 21px; height: 21px; }
  #app .check-kpi>b { font-size: 18px; }
  #app .check-kpi>span { font-size: 7.5px; }
  #app .check-kpi>small { font-size: 7px; }
}

@media(max-width:1120px) {
  .checks-command { grid-template-columns: minmax(190px, 1fr) minmax(150px, .7fr) auto; padding: 16px; }
  .checks-command-brand span { display: none; }
  .checks-command-title { padding: 0 8px; }
  .checks-command-title h2 { font-size: 25px; }
  .checks-command-title>div>span { font-size: 8px; }
  .checks-title-icon { width: 47px; height: 47px; }
  .checks-title-icon svg { width: 29px; height: 29px; }
  #app .check-kpi-grid.five { grid-template-columns: repeat(3, minmax(0,1fr)); }
  #app .checks-filters { grid-template-columns: minmax(210px,1fr) 160px 145px auto 36px; }
}

@media(max-width:900px) {
  .checks-command { grid-template-columns: 1fr auto; gap: 12px; padding: 16px; }
  .checks-command-brand { min-width: 0; }
  .checks-command-brand img { width: 58px; height: 58px; }
  .checks-command-brand b { font-size: 10.5px; }
  .checks-command-title { display: none; }
  .checks-command-meta { flex-direction: row; }
  .checks-date-tile, .checks-user-tile { min-width: 0; }
  .checks-command-actions { grid-column: 1 / -1; }
  #app .checks-filters { grid-template-columns: minmax(190px,1fr) 170px auto 36px; }
  #app .checks-select-filter:nth-of-type(2) { grid-column: 1 / 2; }
}

@media(max-width:720px) {
  .checks-command { grid-template-columns: 1fr; }
  .checks-command-brand img { width: 54px; height: 54px; }
  .checks-command-meta { width: 100%; }
  .checks-date-tile, .checks-user-tile { flex: 1; }
  .checks-command-actions { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
  .checks-tool-btn { justify-content: center; padding: 0 6px; }
  .checks-tool-btn span { font-size: 8px; }
  #app .check-kpi-grid.five { grid-template-columns: repeat(2, minmax(0,1fr)); }
  #app .check-kpi { min-height: 94px; }
  #app .checks-toolbar { flex-direction: column; align-items: stretch; }
  .checks-new-btn { width: 100%; justify-content: center; }
  #app .checks-filters { grid-template-columns: 1fr 1fr; }
  #app .checks-search { grid-column: 1 / -1; }
  #app .checks-select-filter:nth-of-type(2) { grid-column: auto; }
  .checks-clear-btn { grid-column: 1 / 2; }
  .checks-refresh-icon { justify-self: end; }
  #app .checks-table { min-width: 0; }
  #app .checks-table tr { position: relative; padding: 13px 13px 13px 38px; }
  #app .checks-table td.check-select-cell { position: absolute; left: 12px; top: 13px; width: 20px; grid-column: auto; }
  #app .checks-table td.check-select-cell::before { display: none; }
  #app .checks-table td:nth-child(2), #app .checks-table td:nth-child(3) { grid-column: 1 / -1; }
  #app .checks-table td:nth-child(4), #app .checks-table td:nth-child(5), #app .checks-table td:nth-child(6), #app .checks-table td:nth-child(7) { grid-column: auto; }
  #app .checks-table td:nth-child(8) { grid-column: 1 / -1; }
  #app .bank-brand { min-width: 0; }
  #app .checks-footer { align-items: flex-start; }
  .checks-legend { flex-wrap: wrap; justify-content: flex-start; gap: 10px; }
}

@media(max-width:430px) {
  #app .check-kpi-grid.five { grid-template-columns: 1fr; }
  .checks-command-meta { flex-direction: column; }
  .checks-command-actions { grid-template-columns: 1fr; }
  #app .checks-filters { grid-template-columns: 1fr; }
  #app .checks-search, .checks-clear-btn, .checks-refresh-icon { grid-column: 1; }
  .checks-refresh-icon { justify-self: stretch; width: auto; }
  #app .checks-table tr { grid-template-columns: 1fr; padding-left: 38px; }
  #app .checks-table td:nth-child(4), #app .checks-table td:nth-child(5), #app .checks-table td:nth-child(6), #app .checks-table td:nth-child(7), #app .checks-table td:nth-child(8) { grid-column: 1; }
}

@media(max-width:1250px) {
  #app .home-check-alert { grid-template-columns: 64px minmax(200px, .75fr) minmax(0, 1.25fr); }
  #app .home-check-alert-icon { width: 62px; height: 62px; }
  #app .home-check-alert>.btn { grid-column: 2 / -1; justify-self: start; }
}

@media(max-width:900px) {
  #app .home-check-alert { grid-template-columns: 58px minmax(0, 1fr); padding: 16px; }
  #app .home-check-alert-icon { width: 56px; height: 56px; }
  #app .home-check-alert-list { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #app .home-check-alert>.btn { grid-column: 2; }
}

@media(max-width:650px) {
  #app .home-check-alert { grid-template-columns: 1fr; gap: 12px; }
  #app .home-check-alert-icon { display: none; }
  #app .home-check-alert-list { grid-template-columns: 1fr; }
  #app .home-check-alert>.btn { grid-column: 1; width: 100%; }
  #app .home-check-alert-copy>b { font-size: 18px; }
}
